UI設計師一定要做的事

如果你是設計移動UI界面又是Photoshop新手，那麼今天分享的技巧教程很適合你，雖然說是移動界面設計，但同樣適用於其它設計工作，比如網頁設計、平面設計等等，下面直接進入正題：

Photoshop新建文檔設置

操作：菜單 文件 新建

寬度：640像素

高度：1136像素（4英寸iPhone設備）

解析度：72像素/英寸（ppi）

顏色模式：RGB顏色

背景內容：白色（可選）

顏色配置文件：不要色彩管理此文件（更多顏色設置後）

像素長寬比：方形像素

配置如下圖：

對齊設置

這個處就是當你使用圖層、形狀等操作時自動對齊網格，畫矢量圖不怕模糊邊緣，確保每個像素保持清晰。

設置：

菜單 視圖 對齊

菜單 視圖 對齊到 全部

首選項設置

操作：菜單 編輯 首選項 常規，建議按下圖設置

啟用輕擊平移

僅僅是一個滑移效果，占內存又不能提高操作效率，建議關掉。

根據HUD垂直移動來改變圓形畫筆硬度

功能挺好用的，按Alt+右鍵左右/上下移動可以分別改變畫筆的大小和硬度。

將矢量工具與變換與像素網格對齊

這個強烈建議ui設計開啟這個功能，這個讓你來矢量力不會產生半像素虛邊，十分好用。但在需要微調整時可暫時關閉它。

文本設置

字體我一般把字體設置為犀利，如果你是Photoshop CC版本，它有一個Windows LCD/Mac LCD抗鋸齒功能，文字可以為網頁一樣效果了，所以建議升級到Photoshop CC吧。

操作：首先選定文本 字元工具（AA）選擇Windows LCD/Mac LCD

全局光

繼蘋果iOS人機界面指南，你應該把燈光設置為90°。

操作：圖層 圖層樣式 全局光 90°

網格設置

現在設計iOS界面都要兼容視網膜（Retina）,所以我把每個網格設置為2像素，這樣我就不怕圖像在視網膜設備下變得模糊了。

操作：菜單 編輯 首選項 參考線、網格和切片，網格線間隔：4像素；子網格2。或者網格線間隔：2像素；子網格1。我喜歡前者^_^

導出設置

不管我們是做網頁不審設計iOS APP應用程序時，導出圖像最好是使用」存儲為Web所用格式」來導出。

這裡通過」存儲為Web格式…」導出PNG-24為例，其中默認設置比較重要，如下圖：

操作：菜單 文件 存儲為Web格式所用格式

預設：PNG-24

透明：勾選

交錯：未勾選

嵌入顏色配置文件：未勾選 （Photoshop CC版本才有）

轉換為 sRGB：未勾選

質量：兩次立方

Retina顯示器設置

如果你是使用帶Retina視網膜的MacBook Pro，你應該確保你是使用2800×1800像素（1440×900點）

操作：Apple菜單 系統偏好設置 顯示 最適合顯示器

顏色配置

顏色配置是極為複雜的一個操作，如果你不是這領域的大神，那麼還是老老實實的用推薦的配置吧，這裡我選擇了Marc Edwards(http://bjango.com/articles/photoshop)的顏色配置選項。

總結

本指南針是針對UI設計的Phtoshop基本設置介紹，除了以上這些，大多數設計師都會有自己使用的自定義設置，所以如果你有一些技巧設置，歡迎在下方留言處留言

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！