作為一個剛接觸UI設計的新人，下面是我一個多月以來總結的一點小經驗和技巧

剛接觸UI的時候，碰到的最多就是尺寸問題，什么畫布要建多大，文字該用多大的才適合，我要做幾套界面才可以？什么七七八八的也實在讓人有些頭疼。

下面是我自己總結的一些UI設計經驗

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?IOS篇

1.? 尺寸及分辨率

Iphone界面尺寸：320 x 480、640 x 960、640 x 1136 ?ipad界面尺寸：1024 x 768、2048 x 1536（這里的單位都是像素px,分辨率和一般網頁ui一樣基本上只要72ppi）

當然在設計的時候并不是每個尺寸都要做一套，尺寸按自己的手機尺寸來設計，這樣比較方便來瀏覽效果圖（推薦工具PS PLAY ，這個工具可以在線同步photoshop的圖片，讓圖片可以在手機上預覽）大多是我們都是用640 x 960或者 640 x 1136的尺寸來設計。

2.? 界面基本組成元素

iphone的app界面一般由四個元素組成，分別是：狀態欄、導航欄、主菜單欄以及中間的內容區域。

我在這里拿640 x 1136 尺寸的畫布舉例，那么四種元素分別如下：

狀態欄：就是我們常說的信號、運營商、電池等顯示手機狀態的區域，其高度為：40px

導航欄：顯示當前界面的名稱，包含相應的功能或者頁面間的跳轉按鈕，其高度為：88px

主菜單欄：類是于界面的主菜單，提供整個應用頁面直接的跳轉按鈕，其高度為：98px

內容區域：顯示整個應用的內容，是app應用的主體部分，其高度為：734px

在最新的IOS7風格中，app應用的狀態欄與導航欄合在一起了，但是他們的高度沒有發生變化，只是采用了相同的顏色，在設計中我們應該注意這一點

3.? 字體大小

一般iphone的app應用字體大小規范如下：

長文本 短文本 注釋 ios 26px 28px 24px 30px 30px 24px 32-34px 32px 28px

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? Android篇

1.尺寸及分辨率

Android界面尺寸：480 x 800、720 x 1280 、1080 x 1920…（單位：px）

Android界面尺寸比iphone多很多套，一般采用720 x 1280這個尺寸，這個尺寸畫面顯示清晰，切圖也比較方便。

2.界面基本組成元素

Android的app界面與iphone的基本相同，分別為：狀態欄、導航欄、主菜單欄以及中間的內容區域。

我在這里拿720 x 1280 尺寸的畫布舉例，那么四種元素分別如下：

狀態欄：就是我們常說的信號、運營商、電池等顯示手機狀態的區域，其高度為：50px

導航欄：顯示當前界面的名稱，包含相應的功能或者頁面間的跳轉按鈕，其高度為：96px

主菜單欄：類是于界面的主菜單，提供整個應用頁面直接的跳轉按鈕，其高度為：96px

內容區域：顯示整個應用的內容，是app應用的主體部分，其高度為：1038px

其實關于Android的界面尺寸，沒有像ios那樣具體的規范，因為在安卓中這些控件的高度都能用程序自定義，都沒有提到具體的尺寸數值，所以這些Android的的設計規范都是自己在PS中量的。

Android為了在界面上區別于IOS，Android4.0開始提出的一套HOLO的UI風格，一些APP的最新版本都采用這個風格，這個風格最明顯的特征就是將主菜單欄移動到了導航欄下方，這樣可以避免現在手機移除實體鍵后在屏幕中出現雙底欄的尷尬，但是大多數APP還是才用老式風格，為了區別于虛擬按鍵，主菜單欄的背景顏色會做出調整。

3.字體大小

可接受 見小值 舒適值 ?Android (480 x800） 長文本 21px 24px 27px 短文本 21px 24px 27px 注釋 18px 18px 21px Android (320 x480） 長文本 14px 16px 18px-20px 短文本 14px 14px 18px 注釋 12px 12px 14px-16px

PS:這是小弟第一次發的一些經驗之談，有錯誤的地方還請大家能指出來。下面是本人的聯系方式，歡迎大家一起交流學習，共同進步。（交流內容：UI設計，Android開發，web開發。大家談談理想人生的都可以，哈哈）