想做好移動APP的用戶體驗,需要重點考慮的9個核心原則

在設計一個移動端的應用程序時改淑,我們應該牢記在心的最重要的一件事情就是務必要確保你的程序是有用且直觀的宠互。如果這個程序沒有用處,那么對用戶來講就沒有任何的實際價值静盅,自然地也就沒有人有任何理由去使用它良价。而如果這個程序有用但需要用戶付出大量的學習成本,用戶自然也是不會愿意去投入學習的蒿叠。

優(yōu)秀的界面設計都能夠克服以上兩個問題:

為了達到可用性目的明垢,應用程序應該是以用戶為中心的。用戶之所以安裝你的程序是因為他們需要解決某個緊迫的問題市咽,也就是說痊银,你的程序一定是要有實際用途的。你要仔細考慮用戶會是如何按著它們的方式嘗試去完成自己的目標需求的施绎。

賦予界面足夠的清晰度溯革。為了有效使用他們面對的用戶界面,人們首先必須意識到這個界面是干嗎用的又該怎么使用它谷醉。因此致稀,在考慮界面是否還要清晰時絕不要猶豫。

以下是我認為在創(chuàng)建一個優(yōu)秀的用戶體驗設計時需要重點考慮的9個核心原則:

1. 減少混亂

對于用戶體驗來說俱尼,用戶的注意力無疑是一種非常寶貴的資源抖单,而你的設計應該合理地分配這一資源。如果你的用戶界面承載了諸如按鈕号显、圖片臭猜、文本等諸多雜亂的信息,勢必導致信息過載給用戶帶來壓力押蚤。


有一句出自 Antoine de Saint-Exupéry 得著名的短語蔑歌,即”達到完美,并不是好得不能再好揽碘,而是好得一點都不多余次屠。” 類似的雳刺,在移動設計中劫灶,擺脫掉一切并非絕對必要的信息是非常重要的,因為其減少了混亂掖桦,而提升了用戶的理解本昏。

有一條簡單的經(jīng)驗法則:每一個屏幕應該僅保存一個重要的動作。對于你的程序而言枪汪,其每一屏都應該向那些使用它的用戶提供一個有實際價值的獨立動作涌穆。這使的它易于學習怔昨,易于使用,易于在必要的時候加入或創(chuàng)建宿稀。相比于一個凌亂的屏幕趁舀,100個清晰的屏幕才是更可取的。

拿 Uber 來說祝沸,Uber清楚地知道用戶使用他們應用程序的目的是叫到一輛車矮烹,所以程序中并沒有覆蓋太多信息:

它能夠基于地理數(shù)據(jù)自動定位用戶的所在位置,唯一需要用戶去做的事情就只是選擇上車位置罩锐。


2. 使導航不言自明

對任何應用程序來說奉狈,幫助用戶導航前往正確的地方都是相當重要的一件事情。優(yōu)秀的導航設計就好比指導用戶旅程的一只無形的手唯欣。畢竟嘹吨,如果用戶都發(fā)現(xiàn)不了,那么再酷的功能特性或最最吸引人的內(nèi)容也是沒用的境氢。優(yōu)秀的移動導航遵循以下基本原則:

(1)導航必須是連貫的。首先碰纬,你應該使用恰當?shù)臉俗R物(正確的視覺隱喻)萍聊,這樣導航元素就不需要額外的解釋說明用戶就能理解,其次悦析,要確保每個導航元素(如圖表)指向了正確的目的地寿桨。


(2)導航必須保持一致性。在不同頁面中强戴,千萬不要把導航控件移動到不同的位置或者隱藏起來亭螟。這樣會很容易使用戶迷失掉的。

(3)導航應該傳達出用戶當前的位置骑歹。無法表明當前位置可能是我們在應用程序菜單中最吃だ樱看到的一個問題〉烂模“我在哪里扁掸?” 是用戶要成功的導航前必須回答的基本問題之一。

3. 創(chuàng)建一個跨平臺的無縫體驗

你不應該將移動設計視作是孤立的最域。對用戶來講谴分,創(chuàng)建一個在移動端、桌面端和平板端無縫結合的體驗是非常重要的镀脂。


以 Apple Music 為例牺蹄,你在 Mac 端設置一個播放列表后會很快在 iPhone 上也看到該列表。 Apple 意識到在跨平臺間保持這種數(shù)據(jù)的同步薄翅,創(chuàng)建出良好的無縫結合的體驗是非常重要的沙兰。

4. 設計對手指操作友好的控件

相比于大的觸控控件虑省,小的自然更難于操作。當你在設計移動端的用戶界面時僧凰,最好是讓你的控件的可觸摸面積足夠大探颈,這樣用戶才容易觸及到。

控件的大最好要控制在7 – 10毫米训措,這樣用戶方能夠準確地使用手指觸及到伪节。;另一方面绩鸣,用戶在跟控件產(chǎn)生交互時怀大,控件的邊緣應該是可見的,能夠以清晰的視覺反饋向用戶傳達他們確實觸及到控件本身了呀闻。


另外化借,要確保不同的控件間有合適的留白區(qū)域。

5. 文本內(nèi)容應足夠清晰

相比于臺式電腦捡多,智能手機的屏幕要相對小的多蓖康,這就意味著如何把大量的信息裝到這個小屏中不得不說是移動設計的一大挑戰(zhàn)。您可能有一個挺吸引人的想法垒手,即把所有信息都進行尺寸上的壓縮也照樣能顯示很多的內(nèi)容蒜焊。但無論如何,你應該杜絕這種想法科贬。

針對移動端的一條經(jīng)驗法則:文本大小應該至少在11pt左右泳梆,好讓用戶在不用放大的情況也能夠清晰的瀏覽。


通過增加行高或字符間距都能夠提高易讀性榜掌,合適的大量的留白可以使一些最亂的界面也能夠看上去簡潔不少优妙。


6. 保持界面元素清晰可見

應該使用顏色和對比度來幫助用戶查看和解讀你的內(nèi)容。選擇出能夠支撐你的程序可用性的主色調憎账、次要色和強調色套硼,確保不同的界面元素間有足夠的色彩對比度以使那些視力不佳的用戶也能瀏覽使用你的程序。

對于使用有背景的文本來說鼠哥,要保證文本的顏色和其背景色間有足夠的對比度熟菲,好讓文本部分清晰易讀。W3C 中針對正文文本和圖像文本的對比度給出以下的推薦比值:

小號文本跟其背景色的對比度應至少為4.5:1朴恳。

大號文本(14 pt bold/18 pt regular及以上)跟其背景色的對比度至少為3:1抄罕。


使用足夠的對比度在手機上顯得尤其重要:因為用戶可能在戶外使用是,陽光的照耀會降低其對比效果于颖。


圖標和其他關鍵的元素同樣應該遵循上述的對比度推薦值呆贿。


7. 基于手指的觸控點設計控件的布局和位置

Steven Hoover 在他的“用戶究竟如何使用移動設備”的研究中發(fā)現(xiàn),49%的人習慣于使用單個拇指來完成所有操作。在下圖中做入,屏幕中不同顏色的區(qū)域表明用戶拇指能夠觸及的難度等級冒晰,其中,綠色區(qū)域表示很容易觸及的范圍竟块,黃色則表示拇指要伸展開來才能夠到壶运,而要觸達紅色區(qū)域則要求用戶改變設備的手持方式。


將頂級菜單浪秘,高頻使用的控件和公有的動作放在綠色區(qū)域是非常重要的蒋情,因為單拇指能夠很舒適的跟它們產(chǎn)生交互。


另一方面耸携,把那些具有否定意義的動作(比如刪除或清除)放在手指不容易觸及到的紅色區(qū)域棵癣,因為我們不希望用戶意外的跟它們產(chǎn)生作用。

8. 減少對打字輸入的需要

在手機上打字輸入是一個緩慢而易于出錯的過程夺衍,因此最好要盡量減少移動應用程序中所需的輸入狈谊。

盡量移除那些不必要的輸入域,保持表單簡短沟沙。


在合適的地方河劝,使用自動補全的功能或填入用戶個性化數(shù)據(jù),這樣用戶就只需要輸入最少的信息尝胆。


9. 測試你的設計效果

若把你的設計方在一個大屏的電腦屏幕上看丧裁,其效果往往非常不錯,然而含衔,一旦放在一個實際的手機屏幕上測試,其效果甚至不及前者的一半二庵。 即使是那些設計最為用心的用戶界面贪染,放在真實世界中也難免會包含一些不可見的缺陷,這就是為何我們要讓真實用戶在多樣的移動設備上測試我們程序的原因催享。要把你的應用程序當做一個不斷進化的實體杭隙,使用分析得來的數(shù)據(jù)結果及用戶的反饋信息不斷的提升你的用戶體驗設計。

結論

就如同任何其他設計元素一樣因妙,本文提到的諸多準則可能只是我們在開始可以參考的一部分痰憎。你要嘗試將這些準則跟自己的想法融合過濾,找出那些最好的最適合自己的設計思路攀涵。一定要記住铣耘,設計不僅僅是面向設計人員——設計是面向用戶,是為用戶而設計的以故。


原文:https://uxplanet.org/mobile-ux-design-key-principles-dee1a632f9e6#.sn26p06x1

譯者:@惜可若己

文章轉自:優(yōu)秀網(wǎng)頁設計

本文發(fā)布于設計夾蜗细。未經(jīng)許可,禁止轉載。轉載請聯(lián)系微信sezign01炉媒,得到允許保留出處和作者信息踪区。

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市吊骤,隨后出現(xiàn)的幾起案子缎岗,更是在濱河造成了極大的恐慌,老刑警劉巖白粉,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件传泊,死亡現(xiàn)場離奇詭異,居然都是意外死亡蜗元,警方通過查閱死者的電腦和手機或渤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來奕扣,“玉大人薪鹦,你說我怎么就攤上這事」叨梗” “怎么了池磁?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵,是天一觀的道長楷兽。 經(jīng)常有香客問我地熄,道長,這世上最難降的妖魔是什么芯杀? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任端考,我火速辦了婚禮,結果婚禮上揭厚,老公的妹妹穿的比我還像新娘却特。我一直安慰自己,他們只是感情好筛圆,可當我...
    茶點故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布裂明。 她就那樣靜靜地躺著,像睡著了一般太援。 火紅的嫁衣襯著肌膚如雪闽晦。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天提岔,我揣著相機與錄音仙蛉,去河邊找鬼。 笑死唧垦,一個胖子當著我的面吹牛捅儒,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼巧还,長吁一口氣:“原來是場噩夢啊……” “哼鞭莽!你這毒婦竟也來了?” 一聲冷哼從身側響起麸祷,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤澎怒,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后阶牍,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體喷面,經(jīng)...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年走孽,在試婚紗的時候發(fā)現(xiàn)自己被綠了惧辈。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,039評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡磕瓷,死狀恐怖盒齿,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情困食,我是刑警寧澤边翁,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站硕盹,受9級特大地震影響符匾,放射性物質發(fā)生泄漏。R本人自食惡果不足惜瘩例,卻給世界環(huán)境...
    茶點故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一啊胶、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧垛贤,春花似錦创淡、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽誊酌。三九已至部凑,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間碧浊,已是汗流浹背涂邀。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留箱锐,地道東北人比勉。 一個月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親浩聋。 傳聞我的和親對象是個殘疾皇子观蜗,可洞房花燭夜當晚...
    茶點故事閱讀 42,786評論 2 345

推薦閱讀更多精彩內(nèi)容