在 UI 設計交付與團隊協作中，統一規范是保證界面質量、提升效率、降低溝通成本的核心基礎。蘭亭妙微設計結合多年項目沉淀，把日常高頻使用的設備尺寸、圖標輸出、字體、單位、命名、設計原則、交互準則完整整理，形成可直接落地的設計規范手冊，方便團隊隨時查閱、復用。
一、iPhone 界面尺寸規范
蘭亭妙微常用主流機型基準（@2x/@3x）
-
iPhone 6/7/8（常用）
分辨率：750×1334px
狀態欄：40px
導航欄：88px
標簽欄：98px
-
iPhone X/XS/11 Pro（常用）
分辨率：1125×2436px
狀態欄：132px
導航欄：132px
標簽欄：147px
-
iPhone 6P/7P/8P
分辨率：1242×2208px
狀態欄：60px
導航欄：132px
標簽欄：147px
-
iPhone 5/5S
分辨率：640×1136px
狀態欄：40px
導航欄：88px
標簽欄：98px
iPhone 應用圖標輸出尺寸
1024×1024px、180×180px、120×120px、87×87px、80×80px、60×60px、58×58px、40×40px、29×29px
二、Android 界面尺寸規范
主流適配基準（蘭亭妙微項目常用）
-
Android 5（1080×1920，常用）
狀態欄：75px
導航欄：144px
標簽欄：144px
-
Android 4（720×1280，常用）
狀態欄：50px
導航欄：96px
標簽欄：96px
-
Android 6（1140×2560）
狀態欄：100px
導航欄：192px
標簽欄：192px
-
Android 3/2/1（低適配機型）
狀態欄統一：40px
導航欄統一：88px
標簽欄統一：98px
Android 應用圖標輸出尺寸
192×192px、144×144px、96×96px、72×72px、48×48px
三、iPad 界面尺寸規范
-
iPad 3/4/Air/mini2（高分）
分辨率：2048×1536px
PPI：264
狀態欄：40px
導航欄：88px
標簽欄：98px
-
iPad Mini / 1/2
分辨率：1024×768px
PPI：163/132
狀態欄：20px
導航欄：44px
標簽欄：49px
iPad 應用圖標輸出尺寸
167×167px、152×152px、76×76px
四、界面字體規范（蘭亭妙微統一標準）
iOS 字體
- 中文：蘋方
- 英文 / 數字：San Francisco Pro
- 導航欄：32–36px
- 標簽欄：20px
- 正文內容：2–6px 階梯遞進（保證層級清晰）
Android 字體
- 5.x 以上：思源黑體 / Noto Sans Han
- 5.0 以下：Droid Sans Fallback
- 英文 / 數字：Roboto
五、單位概念（設計師必須懂）
-
PX（像素）
固定像素，不同設備顯示大小不同，小屏顯大、大屏顯小，設計稿常用單位。
-
PT（點）
蘋果標準長度單位，1pt=1/72 英寸，用于 iOS 開發與印刷。
-
DP/DIP
安卓專用，與屏幕密度無關，保證不同設備顯示效果一致。
-
SP
安卓字體專用，可隨系統字體大小縮放，保證可讀性。
蘭亭妙微交付標準：iOS 用 PT，Android 用 DP/SP。
六、文件與控件命名規范
通用命名（團隊統一）
- 頭部：header
- 登錄：login
- 注冊：register
- 導航欄：nav
- 標簽欄：tab
- 內容：content
- 底部：footer
- 按鈕：button
- 圖標：icon
- 圖片：img
- 標題：title
- 搜索：search
- 返回：back
- 彈窗：pop
- 提示：msg
- 背景：background
- 廣告：banner
- 左 / 中 / 右：left/center/right
控件前綴規范
- 復選框：chk
- 組合框：cbo
- 列表框：lst
- 菜單：mun
- 文本框：txt
- 按鈕：cmd
- 組按鈕：gpd
- 線條：lin
- 水平滾動條：hsb
- 面板：pnl
七、界面設計八大統一原則（蘭亭妙微執行標準）
-
色彩統一
主色、輔助色、點綴色固定，字體色、模塊色、場景色嚴格統一。
-
大小統一
同頁面相同元素大小一致；跨頁面同屬性控件大小一致。
-
字體統一
全產品字族統一，同級文字大小、顏色、字重統一。
-
間距統一
頁面邊距、模塊間距、元素內間距全局統一。
-
-
-
-
格調統一
產品氣質一致：電商熱鬧、工具簡潔、閱讀文藝、金融穩重。
八、三大設計準則
- 依從
界面幫助用戶理解內容、降低操作成本。
- 清晰
文字易讀、圖標表意準確、裝飾適度、功能優先。
- 縱深
視覺分層 + 合理動效，提升活力與理解成本。
九、交互三大準則
1. 可用
- 適時反饋，操作有回應
- 邏輯通順，流程合理
- 可撤銷，強提示，高容錯
2. 易用
- 砍掉非必要交互步驟
- 多用選擇，少用填寫
- 降低學習成本，符合用戶習慣
3. 好用
- 預判用戶操作，主動提供便利
- 適度趣味，提升愉悅感
- 適配多場景，多設備兼容
十、蘭亭妙微設計總結
規范不是限制，而是讓設計更高效、更統一、更專業。
堅持
交互體驗為首，視覺體驗其次，做到界面友好、圖標清晰、體驗一致，才能做出經得起用戶與時間檢驗的優質 UI 作品。
蘭亭妙微（藍藍設計）www.xintaizi.com 是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計，以及相關的軟件開發服務，咨詢電話：01063334945。
