2018最新iOS端介面UI設計規範整理

轉自：http://www.shui-mai.com/2018zuixiniosduanjiemianuishejiguifanzhengli/

在iPhone 6還沒出的時候，都是用640×1136 px來做設計稿的，自從6的發布，所有的設計稿尺寸以750×1334 px來做設計稿尺寸

以750x1334px作為設計稿標準尺寸的原由： 從中間尺寸向上和向下適配的時候介面調整的幅度最小，最方便適配。 大螢幕時代依然以小尺寸作為設計尺寸，會限制設計師的設計視角。 設計安卓版本時只需做最小的設計調整，提升設計效率。

所以做設計稿事請以750x1334px來做設計稿

 

iPhone介面設計規範：

iPhone 介面尺寸：

 

左右我習慣設定24 px的距離，我通過對國內外很多APP就行了對比，總結是24 px更合理，這個是我的個人習慣，所以也不要當做是明文規則，你設定為30 px，也是可以的。

然後就可以開始你的設計了、

  關於設計字型

先來看一下字型的曆史演變過程 iOS 9：英文字型為Helvetica Neue iOS 9：中文字型由為冬青黑 iOS 10：英文字型為San Francisco iOS 10：中文字型為蘋方

 

設計稿標準文字

文字選用“蘋方（PingFang SC Light) ”標題可加粗選用“蘋方粗體”

文字搭配

一般用4和6的梯度搭配，例如：一般文字30px標題搭配26px詳情, 帶頭列表30px標題搭配22px輔助資訊
詳情網頁標題文字與詳情文字間距
間距為8的倍數，例如：24px、32px、40px等

 

行間距設定
行間距與字型大小比例為1.5倍

 

對齊原則
段落文字採用“左右對齊靠左對齊”，避頭尾為“嚴格”，首行嚴禁放5標點

 

關於字型大小的問題： 頂部操作欄文字大小：34-38px 標題文字大小：28-34px 本文文字大小：26-30px 輔助性文字大小：0-24px Tab bar文字大小：20px