為iOS而設(shè)計(jì)
iOS要體現(xiàn)以下幾點(diǎn)原則:
·服從內(nèi)容
UI本身就是為了幫助用戶理解內(nèi)容缨恒、與內(nèi)容互動(dòng)的霹抛,千萬不要喧賓奪主搓逾。
·明確
文本不管任何大小,都要確鄙涎祝可讀性恃逻;Icon要精致并且清晰雏搂;其他修飾要恰到好處。我們要聚焦在基于功能的設(shè)計(jì)上寇损。
·深度
可視化界面和模擬現(xiàn)實(shí)的操作息裸,可以無形中形成產(chǎn)品的生命力胧奔,使產(chǎn)品更有情趣哆姻,并且使用戶對(duì)產(chǎn)品的理解更加深刻优俘。
不管你是在重新設(shè)計(jì)一個(gè)舊版應(yīng)用,或是正在創(chuàng)造一個(gè)全新的應(yīng)用浊吏,如果用以下方式考慮你接下來的工作而昨,將會(huì)對(duì)你有很大幫助:
·首先,確認(rèn)APP的核心功能以及核心功能之間的聯(lián)系找田;
·其次歌憨,用上面提到的原則來覆蓋UI和用戶體驗(yàn)的設(shè)計(jì)。細(xì)節(jié)和輔助功能的使用要十分小心墩衙,千萬不要平白無故地亂加务嫡;
·最后,確保你的UI設(shè)計(jì)能適配不同的設(shè)備漆改、不同的模式心铃。這樣,你的用戶才能在盡可能多的場(chǎng)景下使用你的APP挫剑。
通過這些過程去扣,你要做好無視一切先例、問題和假設(shè)的心理準(zhǔn)備樊破,一定要聚焦在內(nèi)容上愉棱,并且通過功能來驗(yàn)證你的每一個(gè)設(shè)計(jì)決策。
服從內(nèi)容
雖然好看的界面和流暢的交互對(duì)于iOS體驗(yàn)來說捶码,是一個(gè)亮點(diǎn)羽氮,但是用戶的內(nèi)容始終都是設(shè)計(jì)核心或链。
這里有幾種方法惫恼,用來幫助你提升功能的表達(dá),并且更好地服從內(nèi)容澳盐。
合理利用整個(gè)屏幕空間
“天氣”這個(gè)APP是個(gè)很棒的例子:優(yōu)雅地祈纯、全屏地描述當(dāng)?shù)禺?dāng)前的天氣狀況,當(dāng)然這也是需要表達(dá)的最重要的信息叼耙。再加上額外的空間腕窥,來展示每小時(shí)的天氣變化。
重新思考可視化圖標(biāo)的設(shè)計(jì)筛婉,來表達(dá)現(xiàn)實(shí)意義
斜面簇爆、漸變癞松、投影,這些有時(shí)候會(huì)讓UI元素看起來很重入蛆,甚至可能蓋過了內(nèi)容响蓉。因此,我們應(yīng)該關(guān)注內(nèi)容哨毁,并且讓UI作為輔助枫甲。
利用半透明的UI元素,來暗示用戶扼褪,后面還有其他內(nèi)容
半透明元素——例如系統(tǒng)的控制中心——提供了一種場(chǎng)景的表達(dá)方法想幻,可以馬上暗示用戶“喏,你看這背后還有東西呢”话浇。在iOS脏毯,一個(gè)半透明元素,僅在被它遮蓋住的地方幔崖,對(duì)背后的圖像做了模糊(見上圖)——像是透過糯米紙去看東西一樣——但是屏幕中沒有被半透明元素遮蓋的部分抄沮,是不做模糊的。
提供明晰的表達(dá)
要求提供明晰的表達(dá)岖瑰,再一次說明了內(nèi)容才是你APP的核心叛买。這里提供幾種方法,幫助你更清楚蹋订、更簡(jiǎn)單地與重要內(nèi)容互動(dòng)率挣。
充分利用留白(原文是negative space,這里還沒琢磨出來怎么翻譯的好露戒,求賜教)
留白可以使重要內(nèi)容或功能椒功,看起來更引人注目并且容易理解。留白也可以傳達(dá)出一種冷靜智什、安寧的感覺动漾。這可以使你的APP看起來更加聚焦和高效。
讓顏色簡(jiǎn)化你的UI
一個(gè)主色——比如備忘錄中的黃色——著重表達(dá)除了重點(diǎn)信息荠锭,巧妙地隱喻了其中的交互旱眯。這也給APP定義了一個(gè)視覺主題。蘋果內(nèi)置的APP用了一系列純色证九,使之與任何其他顏色删豺、明暗背景色中都協(xié)調(diào)搭配。
利用系統(tǒng)字體來確崩⒘可讀性
San Francisco(iOS系統(tǒng)默認(rèn)字體)配以各種大小呀页,可以自動(dòng)適應(yīng)文字空間以及行高。這樣文本無論是在哪個(gè)尺寸下拥坛,都會(huì)看起來簡(jiǎn)單易讀蓬蝶。無論你正在用的是San Francisco字體或是其他字體尘分,一定要確保它可以適應(yīng)各種大小。只有這樣丸氛,用戶在使用你的APP時(shí)音诫,采用了一種不同的大小的字體時(shí)才不會(huì)出現(xiàn)問題。
推崇無邊框按鈕
默認(rèn)所有Bar上的按鈕都是無邊框的雪位。在內(nèi)容區(qū)域竭钝,一個(gè)無邊框按鈕可以利用文本、色彩雹洗、和一個(gè)引起點(diǎn)擊的文案香罐,可以暗示交互喻意。如果這樣行得通时肿,一個(gè)內(nèi)容區(qū)域的按鈕可以用細(xì)邊框或者有色的背景來使之凸顯庇茫。
利用深度來溝通
iOS通常利用圖層和位置的不同,來表達(dá)不同層級(jí)的內(nèi)容螃成。這樣也有利于用戶更好地理解同一屏幕中不同元素之間的關(guān)系旦签。
在一個(gè)支持3D Touch的設(shè)備上,輕按寸宏、重按宁炫、快速滑動(dòng)可以讓用戶在不退出當(dāng)前場(chǎng)景的前提下,直達(dá)重要功能氮凝。
文件夾通過半透明的背景羔巢,懸浮在主頁之上,來把文件夾里面的內(nèi)容同主頁的其他內(nèi)容區(qū)分開來罩阵。
提醒事項(xiàng)這個(gè)APP通過不同的圖層展示不同的表單竿秆,如圖。當(dāng)你需要操作其中一個(gè)表單的時(shí)候稿壁,其他表單將會(huì)聚集在屏幕底部幽钢。
日歷強(qiáng)化的過渡動(dòng)畫的表現(xiàn)形式,來給予用戶一種強(qiáng)烈的層級(jí)以及深度的感覺傅是,讓他們明確知道當(dāng)前是在年匪燕、月、日之前切換落午。在表達(dá)“年”的界面中谎懦,用戶可以馬上識(shí)別出今天的日期肚豺,并且操作其他根據(jù)日歷的任務(wù)溃斋。
當(dāng)用戶選擇了其中一個(gè)月份,年份的視圖將會(huì)合起吸申,月份的視圖展開梗劫。當(dāng)天的日期用高亮的方式標(biāo)記出來享甸,而年份,在“返回”的位置展示梳侨。這樣蛉威,用戶可以清楚地知道,此時(shí)此刻ta正在瀏覽的是APP的哪個(gè)部分走哺,上一步是什么蚯嫌,以及如何返回上一步。
當(dāng)用戶選擇某一天的時(shí)候丙躏,將會(huì)看到一個(gè)小小的過渡動(dòng)畫择示,月份的視圖將會(huì)裂開,并將本周的日期推到頂部晒旅,下面呈現(xiàn)出選中當(dāng)天的小時(shí)視圖栅盲。利用每一個(gè)過渡動(dòng)畫,日歷這個(gè)APP將年份废恋、月份谈秫、日期的層級(jí)關(guān)系強(qiáng)化了。
原文鏈接:https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/