自製 Facebook 大頭貼特效框 — 「不再恐同當機彩球限時動態」
5月17日，是個讓台灣成為亞洲第一個通過同婚專法國家的日子。同時也是「國際不再恐同日」（International Day against Homophobia, Transphobia, and Biphobia，簡稱IDAHOT）以及將同志從「精神疾病」中除名的日子。一、故事背景
昨晚半夜回到家後，又敲著電腦不小心睡著了；中午醒來後關了燈，還有點想睡但還是喚醒了 剛買的 MacBook Air 螢幕，看到許多設計圈等同溫層的朋友，在青島東路上群集打卡，也有不少人分享了議場的現場直播。
我想起了中學時期遭到同學霸凌的回憶，以及女友生病後受到歧視的體驗，我雖然是異性戀，但仍在想能做點什麼，曾經閱讀過面對納粹，表以沈默代價的故事：
二次世界大戰以後，德國宗教領袖牧師馬丁．尼莫拉（Martin Niemoller 1892–1984）為了讓世人記住納粹屠殺猶太人這一血腥恥辱，在波士頓樹起了一塊紀念碑，碑上銘刻這樣一段話——
當納粹黨來抓共產黨的時候，我沒有站出來為他們說話，因為我不是共產黨；
當納粹黨來抓猶太人的時候，我沒有站出來為他們說話，因為我不是猶太人；
當納粹黨來抓工會的人的時候，我沒有站出來為他們說話，因為我不是工會的人；
當納粹黨來抓天主教徒的時候，我沒有站出來為他們說話，因為我是基督徒，不是天主教徒；
當納粹黨來抓我的時候，已經沒有人站出來為我說話，因為他們都被抓走了。二、設計概念
在 UI (User Interface)設計裡頭，只要有會員中心、平台功能，大多都有需要使用者登入的情境，其中 Avatars (大頭貼、頭像)代表的是每一位使用者，通常會是需自行上傳喜歡的照片並進行裁切。
我們每天用的 Facebook 與 Instagram 也是，然後發展到現在，Story (限時動態)也成為注目的焦點，使用者可以更輕鬆地上傳生活當下的情境，像是美食或旅遊照，我們可以更即時地在網路上分享個人的生活。
同時，限時動態也意味著 24 小時候就會自動刪除的系統設定，我想運用這點，來紀念 5/17 這個充滿意義的日子；於是想將常見的特效框彩虹旗 (LGBT) 融入。
但目前大多數的特效框都含有濾鏡，這其實會破壞不少人修好的照片，有一些些可惜。於是我結合了限時動態的外框，把這個精神貫注進去。
再來看一下 Facebook 與 Instagram 的限時動態會長的像是這樣子的：
在這個配色部分，我想再加入一些巧思，我想以 MacOS 的系統彩球來傳達經過遊行、抗議與公投等行動之後，相關法律以及觀念終於得到疏通，不再卡頓當機。
三、製作教學
我們可以在 Adobe Xd 上用鋼筆工具與布林繪圖功能，來製作仿 MacOS 當機時會彈出來的彩球，然後用剪裁遮色片功能將中間挖空，然後再用圓形工具加上白色外框。
因為 Facebook 特效框的機制是疊加圖層在原本的照片上，因是我們這邊要再把 Artboard 背景改成透明的。
然後，輸出 (Export)成 .png 的圖片。
四、上傳 Facebook 特效框
然後，我們到開啟以下連結，開始製作：
https://www.facebook.com/frames
五、使用情境
後記
以上就是這次做 Facebook 特效框的流程囉，現在直接選擇更換也可以找到我的這組「不再恐同當機彩球限時動態」！
如果這篇文章對你有幫助，可以幫忙拍一下手👏🏻👏🏻 並發摟我的 Medium 林育正 Riven。
相關合作聯繫或有任何想法，都可以透過我的 Facebook 聯繫，如果不介意看一些廢文的話，也歡迎追蹤 😃
Adobe Xd 學習型社群與資源
如果在軟體操作或有其他 UI/UX 相關問題，可以加入我們的社團「Adobe Xd Taiwan User Group 台灣交流社群」發文討論交流🥳
若是對 UI 設計有發展興趣的朋友，也可以參考我與 YOTTA 合作的線上課程 《Adobe Xd設計實務｜成為UI設計師的8項核心技能》完整學習。
