(譯)Material Design Platform adaptation

其他文章

Material Design支持跨平臺(tái)的設(shè)計(jì)和可用性最佳的實(shí)踐,以幫助創(chuàng)建優(yōu)秀的用戶體驗(yàn)。

1. 什么時(shí)候適配

Material Design建立在傳統(tǒng)和網(wǎng)絡(luò)設(shè)計(jì)的最佳實(shí)踐的基礎(chǔ)上,由用戶體驗(yàn)研究和認(rèn)知科學(xué)提供。 從這些發(fā)現(xiàn)開發(fā)的設(shè)計(jì)指南旨在被廣泛應(yīng)用于所有平臺(tái)和設(shè)備。

設(shè)計(jì)約定可能因平臺(tái)而異。 這些約定的差異可以影響用戶理解UI或完成某些任務(wù)的能力。 在這些情況下,建議適應(yīng)平臺(tái)特定的約定。 在設(shè)計(jì)差異最小化的地區(qū),適應(yīng)平臺(tái)是可選的。

以下準(zhǔn)則指示您何時(shí)應(yīng)該適應(yīng)本機(jī)平臺(tái)約定,以及何時(shí)可以選擇適應(yīng)。 平臺(tái)慣例不斷發(fā)展,材料設(shè)計(jì)正在與他們一起發(fā)展,以提高我們的設(shè)計(jì)模式的質(zhì)量。

image

2. 平臺(tái)建議

工具欄

工具欄通常用于框架屏幕的上下文。

建議對(duì)工具欄標(biāo)題使用平臺(tái)的默認(rèn)文本對(duì)齊方式,除非存在多個(gè)操作按鈕。

image
Android/Web

標(biāo)題總是左對(duì)齊

iamge
iOS

標(biāo)題默認(rèn)居中

image
Android

當(dāng)有多個(gè)操作圖標(biāo)時(shí),甚至沒有操作圖標(biāo)出現(xiàn)在右側(cè)時(shí),工具欄標(biāo)題總是左對(duì)齊。

image
ios

當(dāng)多個(gè)動(dòng)作按鈕位于應(yīng)用程序的右側(cè)或主屏幕時(shí),標(biāo)題可以左對(duì)齊。

圖標(biāo)

系統(tǒng)圖標(biāo)用于表示平臺(tái)最普遍可用的操作。

image
Android/Web

后退按鈕包含帶桿的細(xì)箭頭。

iamge
iOS

在iOS上,后退箭頭更厚,沒有桿。

image
Android/Web

操作溢出菜單圖標(biāo)(由“更多...”符號(hào)指示)包含三個(gè)垂直點(diǎn)。

image
ios

操作溢出菜單圖標(biāo)(由“更多...”符號(hào)指示)包含三個(gè)水平點(diǎn)。

控件

控件應(yīng)清楚地指示用戶應(yīng)如何與它們進(jìn)行交互。

image
Android

使用Materials控件:Switch,checkboxes,radio buttons

image
ios

Native平臺(tái)qaitch可以被使用,因?yàn)樗鼈兙哂信cMaterial switch匹配的功能和外觀。

使用開關(guān)而不是復(fù)選框和復(fù)選標(biāo)記列表,而不是單選按鈕,因?yàn)檫@些是iOS上預(yù)期的圖形。

手勢(shì)
邊緣滑動(dòng)

邊緣滑動(dòng)從屏幕外部開始,以顯示屏幕外部?jī)?nèi)容。

邊緣滑動(dòng)可能與其他滑動(dòng)手勢(shì)發(fā)生沖突,例如通過頁面或表行的水平滑動(dòng)。 為了避免這些類型的沖突,邊緣滑動(dòng)應(yīng)該執(zhí)行與存在于內(nèi)容區(qū)域上的任何其他滑動(dòng)相同的行為。

image
Android

當(dāng)不存在沖突手勢(shì)時(shí),從左邊執(zhí)行邊緣滑動(dòng)顯示內(nèi)容,諸如DrawerLayout。

image
ios

當(dāng)不存在沖突手勢(shì)時(shí),從左側(cè)執(zhí)行邊緣滑動(dòng)可導(dǎo)航回通過應(yīng)用程序的層次結(jié)構(gòu)。

排版

排版同時(shí)傳達(dá)文本內(nèi)容和品牌。 在這兩種情況下,文本必須可訪問和可調(diào)整大小。

如果您的應(yīng)用程序已使用排版的品牌,建議這樣做適度。

image
Android

Android上的默認(rèn)字體是Roboto。 在Android上,應(yīng)以可縮放像素指定文字大小,以允許使用輔助功能來調(diào)整類型大小。

image
ios

iOS上的默認(rèn)字體是舊金山。 使用此字體是實(shí)現(xiàn)輔助功能(如“動(dòng)態(tài)類型”)的最簡(jiǎn)單方法。 使用其他字體可能需要進(jìn)行調(diào)整才能獲得相同的輔助功能。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容