UI設計

UI 設計
2014-09-19

工作清單：Wireframe

既 Funational Map 和 UI Flow 後，終於到來回修改最多次的 Wireframe 階段了。比起 Funational Map 和 UI Flow，這應該是最多人會接觸到的「規劃」。同時也是最花時間、圖片說明量最大的部份。在這階段修修改改總比都在畫 Mockup 或套程式了才在修改來得輕鬆省力。

UI 設計
2014-09-18

工作清單：Functional Map

自從看過 Burn Your Portfolio: Stuff they don’t teach you in design school, but should 這本書後，就想整理個工作清單出來。工作流程這回事通常是公司訂的很難更改，但自己的工作領域內弄個 SOP 、整理出標準作業流程和待辦清單是被允許的。就從 Functional Map 開始吧。

UI 設計
2014-09-12

iPhone 6 及 Plus 製圖建議

iPhone 6 和 Plus 新機一發表，群裡就有人跑來哀號說老闆叫他準備 iPhone6 的適配，可現在什麼文檔都沒有完整啊！在很多細節不明的情況下，我只能建議這種最保險安全的作法：做 @1x，放大給 @2x 和 @3x 用。以下情境預設為做一套 Mockup 要切出各種尺寸的圖。

UI 設計
2014-04-08

iOS Guideline 怎麼看？(1)

這是給 UI 看的教學。發現太多人不看Guideline…基礎問題問了又問，明明官方文件擺在那。就算英文看不懂，Google 打下去對岸有很多翻譯成簡中版的。最最少留意一下尺寸吧？（這次的 iOS7 官方文件省略很多沒寫到、建議回頭去看看 iOS6 的Guideline，兩份加起來比較紮實。）

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 ）