愛用的 Photoshop Plugins
12 Premium Photoshop Plugins for Designers 這篇文章提到 12 個好用的 Photoshop Plugins，有幾款功能重復，有些非買不可。來介紹一下我已經買了且覺得超好用的 PS 外掛…台灣買 Plugins 的風氣不太盛行，但如果能節省自己的工作時間增加效率，每一筆錢都花得非常有價值。（省下來的時間不要傻傻的跟 PM 說因為我自己掏腰包買了神兵利器所以可以塞給我更多工作，那段空檔是拿來充電用的！）
Grid 的運用：PS外掛
製作的 Responsive Web 最好能先理解 Grid 概念。這概念不只運用在 Mobile Web ，包含 Smart TV 都會派上用場。如果你輕鬆想做出和 Mockup 相同的 Web ，最好把 Grid 學起來。
初學者的 Mockup
在畫好 Wireframe、定版後，就可以依照線框稿內容製作 Mockup 了。Mockup 有很多種說法，我當它是視覺稿，所有跟視覺有關的部份都會在這個階段產出。能夠用來製作 Mockup 的軟體有很多種，最大宗的就是 Photoshop。之前的文章都會說提升 PS 技巧，其實指的就是製作 Mockup 的能力，字體設計、按鈕樣式、扁平化、擬物風等等。
PS 色彩管理與解析度設定
關於螢幕有太多學問，以 UI 的角度來談談給 UI 用的 Photoshop 螢幕設定吧，就「色彩管理」和「解析度」的部份。本文參考 Colour management and UI design 和 Designing for Retina display, part two 所寫。
製作過程：Anna Sui Wallet
Icon Design：My Wallet
真的讓我拿到 Dribbble 帳號了，為了感謝大家的支持（喂）我把創作過程和思路放出來。簡單來說呢就是硬上、沒什麼華麗麗的技巧，不停加圖層加高光加陰影…畢竟這是我第一顆刻這麼細的擬物風 icon，之前都在接案公司工作、哪來 30hr 的時間慢工出細活。（大概是做習慣 iPhone 和 Android 的 App UI，凡是製圖我都優先考慮向量格式，即使這 icon 不可能上架，我還是做成向量格式，至少邊緣乾淨銳利漂亮。）Dribbble：ANNA SUI wallet
Icon Design：My Wallet
總時數超過 30 小時，超過 100 個圖層。逼我換 MACBOOK PRO，還得加滿 RAM。舊 AIR 跑不太動。希望有人可以因為這顆 icon，分我個 Dribbble 的邀請碼。（真的拿到了！感謝 Mike Bronk
）
扁平化設計：斜陰影
常常在扁平化的 icon 上看到斜陰影效果，要製作這個效果有很多種方式。網路上的教學文也很多種，我就挑了比較簡單的作法來實作順便 PO 自己的作法了。可以結合厚度、讓 icon 更潮。（沒辦法、現在就是流行扁平化、厚度、斜陰影。）
扁平化設計：厚度
這張是 512 x 512 px 的 iOS Desktop icon 原始圖檔，可以看到在我放在 photoshop 分類中關於扁平化設計系列文章所製作出來的效果。高光線真的很重要，細細一條就能帶給人「厚度」和「轉折」的視覺效果。
扁平化設計：折頁
翻頁效果也是很常見的扁平化小技巧，簡單幾個步驟就能完成了。請接著扁平化設計：高光、陰影
繼續做喔！
扁平化設計：高光、陰影
有了基本雛型後可以開始添加細節，從放大鏡icon的優化開始。如果有上過素描課、老師會說明高光和陰影的重要性，扁平化設計將視覺元素抽掉很多，高光、漸層、陰影等基本組成因此變得更重要，更需要注意每 1px 的細部處理。
扁平化設計：基本雛型
扁平化設計是現在最流行的設計趨勢，比起擬物風，扁平化設計去除大部份的材質和光影變化，但仔細觀察，仍保有許多細節。無論是陰影、漸層、高光、立體感等，並不因「扁平」而隨意帶過。這個教學不太需要修圖技巧，只要會用「形狀圖層」就好。為了因應各種尺寸的 icon，我習慣盡可能用向量來製圖。
文章分類
