Mockup

技術試玩
2014-04-25

愛用的 Photoshop Plugins

12 Premium Photoshop Plugins for Designers 這篇文章提到 12 個好用的 Photoshop Plugins，有幾款功能重復，有些非買不可。來介紹一下我已經買了且覺得超好用的 PS 外掛…台灣買 Plugins 的風氣不太盛行，但如果能節省自己的工作時間增加效率，每一筆錢都花得非常有價值。（省下來的時間不要傻傻的跟 PM 說因為我自己掏腰包買了神兵利器所以可以塞給我更多工作，那段空檔是拿來充電用的！）

UI 設計
2014-04-10

色盲者使用的配色檢測法

Contrast-A: Find Accessible Color Combinations 是個很不錯的配色網站，我主要是用它測試在色盲者眼中的顏色會是什麼樣子，是否通過 WCAG 2.0。

UI 設計
2014-03-29

初學者的 Mockup

在畫好 Wireframe、定版後，就可以依照線框稿內容製作 Mockup 了。Mockup 有很多種說法，我當它是視覺稿，所有跟視覺有關的部份都會在這個階段產出。能夠用來製作 Mockup 的軟體有很多種，最大宗的就是 Photoshop。之前的文章都會說提升 PS 技巧，其實指的就是製作 Mockup 的能力，字體設計、按鈕樣式、扁平化、擬物風等等。

技術試玩
2014-02-22

PS 色彩管理與解析度設定

關於螢幕有太多學問，以 UI 的角度來談談給 UI 用的 Photoshop 螢幕設定吧，就「色彩管理」和「解析度」的部份。本文參考 Colour management and UI design 和 Designing for Retina display, part two 所寫。

UI 設計
2014-02-21

8px 後續，模糊

8px那篇引起很多回應，我想這要從幾個角度來解釋。UI 口中的「糊」和 RD 眼裡的「糊」是有差的。圖片會糊的原因分成幾種：

小圖放大會糊。< 這是廢話，BJ4。
大圖縮小會糊。< 一定有人想問為什麼。
就算是向量檔，只要像素沒有對齊一樣會糊。
PX 非整數。< Pixel 沒有0.x 這種數值。

UI 設計
2014-02-19

關於 8px

淘寶網的官方Blog有篇「一张图解释手机端8px原理」，簡單來說就是把 iOS 和 Android 放在一起比較。同時探討 1x、2x、ldpi、mdpi、hdpi、Xhdpi、xxhdpi 的尺寸與解析度。本文就以我個人角度提出看法。（圖片取自 Android - Devices and Displays ）

UI 設計
2013-12-19

我的選色技巧

Pochade 我愛用的截色 App

最近在工作上遇到關於配色的大難題…公司 LOGO 是深藍＋亮橘，但要做的專案和股市看盤有關，所以要加入紅色和綠色，要求官網、網頁版系統、Desktop App、Mobile App 都要一致性、能讓人一眼就看出來這是該公司的產品，要有企業形象，一定要用上企業色。偏偏扯到「股市看盤」就不會只有兩條線在畫面上跑這麼簡單…

技術試玩
2013-12-11

製作過程：Anna Sui Wallet

Icon Design：My Wallet 真的讓我拿到 Dribbble 帳號了，為了感謝大家的支持（喂）我把創作過程和思路放出來。簡單來說呢就是硬上、沒什麼華麗麗的技巧，不停加圖層加高光加陰影…畢竟這是我第一顆刻這麼細的擬物風 icon，之前都在接案公司工作、哪來 30hr 的時間慢工出細活。（大概是做習慣 iPhone 和 Android 的 App UI，凡是製圖我都優先考慮向量格式，即使這 icon 不可能上架，我還是做成向量格式，至少邊緣乾淨銳利漂亮。）Dribbble：ANNA SUI wallet