android與ios規范

A. iOS和Android的app界面設計規范(750×1334)

目前，很多UI設計師的UI設計稿是先做iPhone6(750×1334)的，目的是向上適配iPhone6Plus，同時向下適配iPhone5和iPhone4的尺寸。這一節課也算是25學堂為大家精心整理的iPhone6界面設計尺寸規范大全。

iOS篇
————————————————————————————————————
界面尺寸

☆ 狀態欄(status bar)：就是電量條，其高度為：40px；
☆ 導航欄(navigation)：就是頂部條，其高度為：88px；
☆ 主菜單欄(submenu，tab)：就是標簽欄，底部條，其高度為：98px；
☆ 內容區域(content)：就是屏幕中間的區域，其高度為：1334px-40px-88px-98px=1108px

| 設備|App Store|程序應用|主屏幕|spotlight搜索|標簽欄|工具欄和導航欄|
| :-------------:|:-------------:| :-----:|:-----:|:-----:|
|iPhone6 plus（@3x）|1024 1024px|180 180px|144×144px|87×87 px|75 75px|66 66px|
|iPhone6（@2x）|1024 1024px|120 120px|144×144px|58 58px|75 75px|44 44px|
|iPhone5 - 5s - 5c（@2x） |1024 1024px|120 120px|144×144px|58 58px|75 75px |44 44px|
|iPhone4 - 4s（@2x）|1024 1024px|120 120px|144×144px|58 58px|75 75px|44 44px|
|iPad3 - 4 - Air - Air2 - mini2|1024 1024px|180 180px|144×144px|100 100px|50 50px|44 44px|
|iPad1 - 2|1024 1024px|90 90px|72 72px|50 50px|25 25px|22 22px|
|iPad mini |1024 1024px|90 90px|72 72px|50 50px|25 25px|22 22px|
字體
iPhone 上的字體英文為： HelveticaNeue 至於中文，Mac下用的是黑體-簡，Win下則為華文黑體，所有字體要用雙數字型大小。
網路用戶體驗部做過一個小調查， 對於app字體大小的調查結論如下：

B. ios和android設計規范區別

Android 整體視覺設計規范

App 界面的整體視覺組成大致可以分為四個部分：

StatusBar（狀態欄）、TopBar（頭部欄）、Body Content（內容區域）、FootBar（底部欄）。

StatusBar 的樣式由系統 UI 決定，除背景配色外，不需要做其他的設計。

TopBar 兩個系統平台規范上的顯示高度與內容布局有明顯的差異，按各自的規范進行設計。

Body Content 除控制項外，採用相同的布局與視覺設計。

FootBar 除控制項外，採用相同的布局與視覺設計。

 

二、Android差異化設計案例解讀

 

1. StatusBar/TopBar 差異化設計

 

2. 常用的三個系統圖標/控制項差異化

 

3. 搜索/輸入控制項差異化

4. 彈窗樣式差異化

 

 

三、Android系統交互與iOS系統交互的差異化設計

1. 交互方式：

除了上面提到了彈窗樣式與交互差異化之外，對於一些系統交互行為，推薦盡量使用 iOS 與 Android 各自平台的系統控制項與交互方式，降低開發與用戶學習成本。系統交互行為主要包含以：返回上級/關閉當前頁面的方式、通知開啟或者關閉設置、發送/提交內容（鍵盤自帶或者新增按鈕點擊）、Item 列表排序/刪除、提示窗顯隱、時間選擇控制項、手勢操作等等。

2. 交互動效：

交互動效也推薦盡量使用 iOS 與 Android 各自平台的系統提供的動效。比如 iOS 的鏡頭切近與高斯模糊，Android 的紙墨磁吸等等。

單條 item 的交互差異示例

 

總體來說，就是以 iOS 版為參照，底部欄與中間內容區域盡量保持相同的設計，通過對狀態欄、頭部樣式、控制項（開關、選框、搜索、輸入）、系統圖標（返回、分享、更多）、彈窗樣式、系統交互進行 Android 規范化差異，以保證該 App 的設計在兩個不同的系統平台即能符合中國用戶的使用習慣，又能適當體現系統的不同風格與特性。