ANDROID篇

一、尺寸及解析度

Android介面尺寸：480*800、720*1280、1080*1920

Android比iPhone的寸尺多了很多套，建議取用720*1280這個尺寸，這個尺寸720*1280中顯示完美，在1080*1920中看起來比較清晰，切圖後的圖片檔案大小也適中，應用的記憶體消耗也不會過高。

二、介面基本組成元素

Android的APP介面一般由四個元素組成：狀態列、導航欄、主選單、內容區域。

720*1280尺寸的各個區域高度。

狀態列高度為：50px

導航欄高度為：96px

主選單欄高度為：96px

內容區域高度為：1038px(1280-50-96-96=1038)

三、字型大小

Android 上的字型為：Droid sans fallback，是谷歌自己的字型，與微軟雅黑很像。

字型大小也可以找自己喜歡的app介面，手機截圖後放進PS自己對比調節字型大小。

四，顏色值問題

Android顏色值取值為十六進位制的值 比如一紅色的值， 給開發的值為 #ff3c3c

IOS篇

一、尺寸及解析度

iPhone介面尺寸：320*480、640*960、640*1136

iPhone6：4.7英寸(1334×750)，iPhone6 Plus：5.5英寸(1920×1080)

現在主要使用640×1136，對plus做單獨的修改適配，因為plus的螢幕實在是大了，遵循屏大顯示更多內容的原則這裡本應該是需要修的了。

二、介面基本組成元素

iPhone的app介面一般由四個元素組成，分別是：狀態列(status bar)、導航欄(navigation)、主選單欄(submenu)、內容區域(content)。

這裡取用640*960的尺寸設計，那我們就說說在這個尺寸下這些元素的尺寸。

狀態列(status bar)：高度為：40px

導航欄(navigation)：高度為：88px

主選單欄(submenu，tab)：高度為：98px

內容區域(content)：高度為：734px

至於我們經常說的iPhone5/5s的640*1136的尺寸，其實就是中間的內容區域高度增加到910px。

三、字型大小

iPhone上的字型英文為：HelveticaNeue 。至於中文Mac下用的是黑體，Win下則為華文黑體(最新字型稱為黑體-簡)。

四，切圖

切圖是APP設計中的一個重要過程，關係到APP的介面實現，及各種適配性還有各種效能

以640×1136（640×960是一樣的）做的設計圖的話就會好辦一點。直接出設計圖上的原大小圖示，比如我們命名一個圖片叫 img-line.png，我們給開發的圖就要改變這個名字叫 [email protected] 就是在後綴名前加上@2x表示視網膜屏的圖，iPhone6的圖在規範裡是與5s使用的是一樣的，也是@2x圖。有些UI則需要做適當的適配，比如拉長，拉高，這個開發會去做。

對於IPhone6 plus的話範裡給出的是@3x相信大家也知道是怎麼回事，但如果要使用PS放大的話，大家做圖的時候就需要使用形狀工具來做，放大後還需要仔細微調，這裡就不多做講解

溫馨提示：有時圖示很小，實際切出來的放在上面，用手指是按不到的，我們可以使圖片四周拓寬多餘的透明區域 ，從而改變可按大小。

五，顏色值問題

IOS顏色值取 RGB各顏色的值比如某個色值，給予IOS開發的色值為 R:12 G:34 B:56 給出的值就是 12,34,56