UI設(shè)計中IOS和安卓的設(shè)計差異

　　設(shè)計師在做app的時候很少考慮兩個平臺的差異，在設(shè)計上用一套設(shè)計稿去做，其實有很多不一樣的地方。今天AAA教育郭老師就針對UI設(shè)計中IOS和安卓的設(shè)計差異進(jìn)行簡單的說明。
 

　　iOS與安卓設(shè)計上的差異主要從系統(tǒng)差異、成本考慮、用戶習(xí)慣3個方面來闡述。

 

　　一. 系統(tǒng)差異
 

　　1. 物理按鍵對返回的影響
 

　　安卓的物理按鍵以及屏幕導(dǎo)航按鍵的差異是安卓的返回鍵更加方便，
 

　　iOS只有home鍵，隨著全屏的出現(xiàn)，可能會打破這種差異。
 

　　因此在設(shè)計返回操作的時候需要考慮平臺的差異性。

 

　　安卓比iOS增加了物理返回鍵、底部導(dǎo)航，有些設(shè)備可以隱藏底部導(dǎo)航。
 

　　全面屏的普及會慢慢打破這種因為物理按鍵造成的交互及設(shè)計差別，全面屏設(shè)計適配是要考慮底部按鍵的差異。
 

　　華為全面屏的幾種手勢：
 

　　安卓全面屏出現(xiàn)后，并沒有完全舍棄內(nèi)置導(dǎo)航按鍵，還有純手勢、懸浮按鈕、內(nèi)置導(dǎo)航條3種方式。隨著硬件的發(fā)展，安卓和iOS的交互操作會更加趨同，改變這種差異。
 

　　返回浮窗的UI表現(xiàn)：
 

　　iOS 手機只有一個“Home ”鍵，為方便用戶退出浮層需要增加了“取消”入口。

 

　　而 Android 手機本來就有“返回”虛擬鍵，所以多做一個“取消”的意義性不大。
 

　　2. 屏幕分辨率造成的色調(diào)選擇
 

　　Material Design作為谷歌推出的全新的設(shè)計語言，和iOS對比，Material Design更加沉穩(wěn)，iOS更加鮮艷。原因是因為iOS的屏幕分辨率更高，對鮮艷顏色的還原度更好，安卓適應(yīng)的機型比較多，顏色還原度沒有那么好。
 

　　深色模式下考慮到用戶長期使用的體驗，因iOS的還原度高，背景使用#000000，安卓分辨率的限制，文字顏色較淺，谷歌推薦背景色為#121212。有些平臺護(hù)眼模式和深色模式用兩套，比如網(wǎng)易云音樂。

 

　　3. 軟件更新方式的不同
 

　　Android ：由于安卓的開源特性，當(dāng)有新版本時都會提示用戶更新，且每個產(chǎn)品內(nèi)部都帶有“版本更新”入口。
 

　　更新的方式可分2種：
 

　　引導(dǎo)更新：彈出提示讓用戶更新 APP ，用戶點擊「更新」按鈕前往應(yīng)用商店更新、或者在當(dāng)前頁面更新并顯示下載進(jìn)度。
 

　　強制更新：也是先提示用戶更新，只不過用戶點擊「更新」按鈕，即調(diào)起軟件安裝頁面。

 

　　iOS ：而 iOS 端出于對用戶體驗的考慮，是禁止向用戶提示版本更新信息的。這也是為什么絕大部分的 iOS 產(chǎn)品，都是沒有“版本更新”入口的原因，即使有，點擊了也直接跳轉(zhuǎn)到 App Store 查看版本情況。

 

　　4. 切圖標(biāo)注
 

　　XHDPI對應(yīng)的是安卓2倍圖，XXHDPI對應(yīng)的是安卓3倍圖，iOS的3倍圖和安卓的XXHDPI是一樣的。

 

　　iOS用375*667px做設(shè)計，有些也用750*1334px，原因有3點：
 

　?、匍_發(fā)同學(xué)不用換算，直接采用1倍圖就可以
 

　?、趕ketch切圖時導(dǎo)出更加方便
 

　　③極大提高了視覺還原和其他機型的適配
 

　　安卓用1080*1920px做設(shè)計，原因有3點：
 

　　①從中間尺寸向上和向下適配的時，調(diào)整幅度最小，最方便適配
 

　?、诖笃聊粫r代依然以小尺寸作為設(shè)計尺寸，會限制設(shè)計師的設(shè)計視角
 

　　③用主流尺寸做設(shè)計，極大提高視覺還原和機型適配
 

　　5. 鍵盤差異引發(fā)的搜索框樣式
 

　　安卓鍵盤有些是系統(tǒng)自帶的，也有第三方的，例如搜狗輸入法，iOS更多是系統(tǒng)自帶的鍵盤。

 

　　很多輸入法在鍵盤的右側(cè)加入了更加明顯的搜索按鍵，但為了照顧一些用戶的操作習(xí)慣，安卓還是把搜索放在了搜索框后面。

 

　　二. 成本考慮
 

　　1. 開發(fā)成本
 

　　loading
 

　　iOS的loading自定義更加常見、個性化強，安卓很多都是用系統(tǒng)自帶的(轉(zhuǎn)圈的那種)，主要是考慮開發(fā)成本。
 

　　TAB樣式
 

　　2個平臺會有特有的控件樣式。
 

　　安卓系統(tǒng)本身全局actionbar，若去實現(xiàn)其他的樣式，會破壞整體的封裝，開發(fā)成本更高。
 

　　iOS系統(tǒng)有自定義的tab切換樣式，開發(fā)人員只需要更改顏色、圓角，更加方便。

 

　　高斯模糊
 

　　毛玻璃在iOS比較常見，安卓開發(fā)成本高，建議不做這種效果。
 

　　2. 商業(yè)成本
 

　　一般iOS會讓用戶承擔(dān)30%的抽成，例如優(yōu)酷、騰訊的VIP會員價格。
 

　　三. 用戶習(xí)慣
 

　　1. 長按側(cè)滑刪除
 

　　信息列表的側(cè)滑，在iOS中是很常見的操作，但是在安卓更習(xí)慣長按，如果改成側(cè)滑刪除，會增加用戶的理解成本。

 

　　2. 圖標(biāo)設(shè)計
 

　　返回按鈕：一般iOS返回不帶橫線“<”，安卓喜歡帶有橫線，例如下圖，不過有些app會統(tǒng)一用一種。
 

　　分享按鈕：一把iOS會采用蘋果自帶的向上的形式，安卓喜歡用三個圈圈(看下圖)。

 

　　彈窗按鈕：有些安卓彈窗上的按鈕會遵循系統(tǒng)規(guī)則，在右側(cè)這種形式，iOS更喜歡居中。
 

　　bar標(biāo)題位置：安卓上的標(biāo)題跟隨著“返回”，在bar的左側(cè)，iOS會喜歡放在中間。

 

　　總結(jié)
 

　　兩個平臺新版本發(fā)布的時候也會更新新的設(shè)計規(guī)范，我們應(yīng)該實時關(guān)注兩者的優(yōu)劣勢，取其優(yōu)勢，結(jié)合項目本身，設(shè)計出更加符合用戶習(xí)慣或者節(jié)約成本的設(shè)計。因此，您現(xiàn)在已經(jīng)了解了與UI設(shè)計師的工作相關(guān)的主要技能。如果您想了解更多信息，請訪問AAA教育，包含有關(guān)在該領(lǐng)域工作的更多相關(guān)文章。