移動(dòng)APP的開發(fā)變得越來越主流,APP能為用戶提供更直接的內(nèi)容和服務(wù)。所以很多公司都想開發(fā)自己的APP獲取用戶。
但是,根據(jù)“財(cái)富”雜志的報(bào)道,超過75%的用戶第一次打開APP后就再也不打開了。用戶希望從APP獲得更好快速的內(nèi)容,更好的操作和更好的體驗(yàn)。所以,我們開發(fā)的APP應(yīng)該適應(yīng)使用的環(huán)境,做到盡可能的易用,讓用戶有更好的體驗(yàn)。
那么,如何才能成為良好的用戶體驗(yàn)?zāi)兀?5學(xué)堂跟大家一起來探討移動(dòng)端app設(shè)計(jì)的六個(gè)指南。
一、最小化認(rèn)知負(fù)荷
讓用戶第一次接觸到app時(shí)的交互(例如認(rèn)知負(fù)荷)困擾越小,app能夠保留在用戶手機(jī)里的機(jī)會(huì)就越大。
1、優(yōu)化用戶流程
優(yōu)化流程首先要了解用戶是如何與app進(jìn)行交互的。作為設(shè)計(jì)人員和開發(fā)人員,我們應(yīng)該在整個(gè)用戶流程的背景下理解用戶的目標(biāo)。這些知識(shí)將幫助我們確定任務(wù)完成期間最常見的摩擦點(diǎn)。
這里有幾個(gè)實(shí)用的優(yōu)化用戶流程的方法:
a、將大任務(wù)分成若干個(gè)子任務(wù)。如果任務(wù)包含用戶方所需的大量步驟和操作,則最好將此任務(wù)劃分為多個(gè)子任務(wù)。電子商務(wù)APP中的漸進(jìn)式結(jié)帳流程就是一個(gè)很好的例子。您可以將結(jié)帳過程分為多個(gè)步驟,每個(gè)步驟都需要用戶操作。
b、使用可以獲取到的用戶信息。您可能已經(jīng)有很多關(guān)于用戶的信息 - 那請(qǐng)正確使用此信息。我們來舉打車軟件“優(yōu)步”的例子。優(yōu)步不會(huì)詢問用戶的位置,優(yōu)步會(huì)根據(jù)地理位置數(shù)據(jù)自動(dòng)讀取當(dāng)前用戶的位置。此時(shí),用戶只需要選擇目的地就可以了。
c、自然的展示下一個(gè)操作內(nèi)容。當(dāng)任務(wù)需要用戶完成若干步驟時(shí),通過清楚地顯示下一步的情況,可以讓用戶操作時(shí)心中有數(shù),不會(huì)厭煩,然后順利完成剩下的任務(wù)。
d、標(biāo)示每個(gè)頁面的最主要操作按鈕。按照這個(gè)簡(jiǎn)單的原則,您可以讓界面更易于學(xué)習(xí)和使用。使用視覺上的突出展示來優(yōu)先考慮重要元素(例如主要號(hào)召性用語按鈕的高對(duì)比顏色)。
2、去掉干擾
良好的用戶界面設(shè)計(jì)主要是能夠提供相關(guān)信息并避免不相關(guān)的干擾信息。
頁面上每增加一個(gè)按鈕,圖像,圖標(biāo)都會(huì)使頁面變得更加復(fù)雜和難以理解。電腦上的干擾已經(jīng)夠煩人了,而在移動(dòng)設(shè)備上,因?yàn)槠聊桓?,所以沒有足夠的空間放置很多信息,一切從簡(jiǎn)。
提示:如果要減少某一用戶流程頁面上的干擾 - 那么只需要顯示流程當(dāng)前步驟中需要的內(nèi)容。例如,當(dāng)用戶做出選擇時(shí),顯示足夠的信息幫助他們進(jìn)行選擇,然后在下一個(gè)頁面上顯示更多選擇內(nèi)容。
3、讓導(dǎo)航出現(xiàn)在顯眼的地方
所有酷炫的功能和引人入勝的內(nèi)容如果不被人找到,那么這些功能或內(nèi)容是沒有意義的。
以下是一些關(guān)于導(dǎo)航的規(guī)則:
a,不要隱藏導(dǎo)航。避免隱藏導(dǎo)航,如手勢(shì)驅(qū)動(dòng),因?yàn)榇蠖鄶?shù)用戶很難找到它。
b,一致的導(dǎo)航。開發(fā)人員經(jīng)常在單個(gè)頁面上隱藏菜單,不要這樣設(shè)計(jì),因?yàn)樗赡茏屇愕挠脩艋煜兔允А?
c,標(biāo)示當(dāng)前位置。未能指出當(dāng)前位置是許多APP的常見問題?;卮鹩脩簟拔以谀睦铮俊笔呛玫膶?dǎo)航最基本的內(nèi)容之一。
提示:最好使用標(biāo)準(zhǔn)規(guī)范的導(dǎo)航模式 - 比如標(biāo)簽欄(適用于iOS)和導(dǎo)航抽屜(適用于Android)。大多數(shù)用戶都熟悉這兩種導(dǎo)航模式。
二、優(yōu)化媒介的交互
手機(jī)不是臺(tái)式機(jī)的小版本 - 它們有自己的細(xì)微差別和限制。
1、元素應(yīng)該設(shè)計(jì)的顯而易見
移動(dòng)用戶界面的設(shè)計(jì)需要清楚地表達(dá)哪些元素是可互動(dòng)的,哪些元素是靜態(tài)的。
與桌面不同的是,用戶可以使用懸停效果來了解某些內(nèi)容是否具有互動(dòng)性,但移動(dòng)用戶只能通過點(diǎn)擊某個(gè)元素來檢查交互性。用戶應(yīng)該只要看到某個(gè)元素就能夠正確預(yù)測(cè)界面元素的行為方式。
2、為手指操作的友好設(shè)計(jì)
當(dāng)您在移動(dòng)界面中設(shè)計(jì)可操作的元素時(shí),制定足夠大的目標(biāo)非常重要,以便用戶輕松點(diǎn)按。作為一個(gè)經(jīng)驗(yàn)法則,控件的觸摸面積至少為7-10毫米時(shí),用戶才可以用手指準(zhǔn)確敲擊。這種尺寸的控件使用戶觸摸它時(shí),邊緣仍然可見,用戶將能夠了解他們是否準(zhǔn)確地?fù)糁心繕?biāo)。
此外,請(qǐng)確保兩個(gè)元素之間的位置不要太接近 - 控件之間應(yīng)有適當(dāng)?shù)拈g距以防止錯(cuò)誤輸入。
3、考慮拇指的操作區(qū)域
為操作的大拇指設(shè)計(jì)不僅考慮被點(diǎn)擊的目標(biāo)足夠大,還要考慮我們握設(shè)備時(shí)的方式。
盡管拇指可以操作大部分屏幕,但只有三分之一的屏幕是真正毫不費(fèi)力的可操作區(qū)域。這個(gè)區(qū)域被稱為自然拇指區(qū)。其他區(qū)域需要伸展手指,甚至需要改變握移動(dòng)設(shè)備的方式才能夠著。根據(jù)手部位置(左側(cè),右側(cè)或重疊部分),我們可以看到移動(dòng)設(shè)備的安全區(qū)如下圖中的綠色區(qū)域。
屏幕越大,越難操作。
在為手機(jī)設(shè)計(jì)時(shí)考慮所有不同的區(qū)域:
綠色區(qū)域是導(dǎo)航選項(xiàng)或頻繁交互操作的最佳區(qū)域(如CTA(號(hào)召性用語按鈕))。
紅色區(qū)域是潛在危險(xiǎn)選項(xiàng)的最佳位置(如刪除或擦除)。用戶不太可能意外觸發(fā)此選項(xiàng)。
4、中斷設(shè)計(jì)
我們生活在一個(gè)經(jīng)常被打斷的世界。有些東西總是試圖分散我們的注意力,并將我們的注意力引向別處。
例如,用戶可能在等待火車時(shí)使用您的app。設(shè)計(jì)移動(dòng)思維至關(guān)重要。讓用戶在中斷后返回時(shí)更容易重新與應(yīng)用進(jìn)行互動(dòng)。
Twitter是中斷設(shè)計(jì)的一個(gè)很好的例子。APP的通知屏幕顯示所有最近的通知。只要用戶停留在此屏幕上,應(yīng)用程序不會(huì)自動(dòng)更新列表 - 它只是在列表頂部顯示狀態(tài)“X條新通知”。這允許用戶在一段時(shí)間后重新與應(yīng)用程序互動(dòng)時(shí)不會(huì)失去目前的位置。
4、多屏幕體驗(yàn)
移動(dòng)應(yīng)用不是只存在移動(dòng)互聯(lián)網(wǎng)中。
例如,移動(dòng)用戶通常在移動(dòng)設(shè)備上瀏覽電子商務(wù)網(wǎng)站,然后切換到桌面進(jìn)行購(gòu)買。這種操作需要無縫切換。
Spotify是一個(gè)不錯(cuò)的案例。您可以在Mac上設(shè)置播放列表,并立即在iPhone上使用。當(dāng)您在設(shè)備之間切換時(shí),Spotify會(huì)記住您停止的位置。
5、直觀的手勢(shì)操作
使用您的應(yīng)用所在類別中最適合該應(yīng)用的手勢(shì)操作。
為什么?因?yàn)槭謩?shì)是隱藏的控件。
正如Thomas Joos 在他的文章“超越按鈕:擁抱手勢(shì)驅(qū)動(dòng)界面”中指出的那樣,在用戶界面中使用手勢(shì)的最大缺點(diǎn)是學(xué)習(xí)曲線。每次用手勢(shì)替換可見控件時(shí),應(yīng)用程序的學(xué)習(xí)曲線都會(huì)上升。發(fā)生這種情況是因?yàn)槭謩?shì)具有較低的可發(fā)現(xiàn)性 - 它們總是隱藏起來的,人們需要先能夠識(shí)別這些選項(xiàng)。這就是為什么使用已被廣泛接受的手勢(shì)至關(guān)重要。例如:用于Feed媒體流的應(yīng)用程序的下拉刷新。
6、使用加載占位圖
您的應(yīng)用程序本應(yīng)該并且快速響應(yīng) - 但是用戶的網(wǎng)絡(luò)情況并不總是穩(wěn)定快速。
互聯(lián)網(wǎng)連接可能太慢,如果你不能縮減等待的時(shí)間,至少應(yīng)該盡量讓等待的時(shí)間變得更加友好愉悅。這時(shí)候可以采用占位圖加載。
占位圖是逐漸加載信息的頁面的空白方式。與關(guān)注數(shù)據(jù)加載進(jìn)度的動(dòng)畫加載旋鈕不同,加載占位圖將用戶注意力集中在真實(shí)進(jìn)度而不是旋轉(zhuǎn)等待時(shí)間。
三、專注于第一次體驗(yàn)
就像人一樣,你的移動(dòng)應(yīng)用沒有第二次機(jī)會(huì)給別人第一印象。
1、良好的用戶引導(dǎo)頁很重要
也許創(chuàng)建用戶引導(dǎo)頁的規(guī)則是:它不應(yīng)該是通用的,它應(yīng)該是有利于使用者使用的原則。
設(shè)計(jì)師應(yīng)將用戶引導(dǎo)頁當(dāng)作為首次使用的用戶創(chuàng)造繼續(xù)使用的機(jī)會(huì)。同時(shí),用戶引導(dǎo)頁應(yīng)該真正只為第一次使用的人展示。而不應(yīng)該多次出現(xiàn)。
2、設(shè)計(jì)錯(cuò)誤頁
空狀態(tài)(或零狀態(tài))是尚未發(fā)生任何狀態(tài)的狀態(tài)。這個(gè)狀態(tài)不應(yīng)該是一個(gè)空白的頁面,它應(yīng)該為啟動(dòng)和運(yùn)行應(yīng)用程序提供方向和指導(dǎo)。
以Spotify的錯(cuò)誤狀態(tài)屏幕為例。它不能幫助用戶理解上下文,并且不會(huì)幫助他們找到問題的答案:“我能做些什么呢?”
現(xiàn)在將它與NFL Fantasy的空白狀態(tài)進(jìn)行比較。這個(gè)零狀態(tài)使錯(cuò)誤消息可讀并且有用。簡(jiǎn)明,有禮貌,有教育意義的文字或插畫告訴用戶:出了什么問題,可能是為什么。用戶應(yīng)該采取什么措施來糾正錯(cuò)誤。
四、使用功能性動(dòng)畫來改善互動(dòng)
動(dòng)畫解決了界面中的許多功能問題,同時(shí)讓人們感受到活力和真正的互動(dòng)。
1、顯示系統(tǒng)狀態(tài)
當(dāng)應(yīng)用程序忙于做某事時(shí),您應(yīng)該通過顯示系統(tǒng)狀態(tài)讓用戶知道該應(yīng)用程序未被凍結(jié)。進(jìn)度的視覺標(biāo)志讓用戶對(duì)應(yīng)用程序有一種控制感。
這個(gè)應(yīng)用程序使用動(dòng)畫來通知用戶現(xiàn)在正在加載內(nèi)容
2、導(dǎo)航轉(zhuǎn)換
動(dòng)畫是描述狀態(tài)轉(zhuǎn)換的最佳工具。 它有助于用戶理解頁面布局的變化,引發(fā)變化的內(nèi)容,以及如何在需要時(shí)再次發(fā)起切換。
3、視覺反饋
在物理世界中,物體對(duì)我們的相互作用做出反應(yīng)。人們希望數(shù)字用戶界面控件具有類似的響應(yīng)。
良好的視覺反饋?zhàn)層脩舻慕换ジ邮孢m。所有的交互元素(如按鈕)應(yīng)該提供完美的視覺反饋。
五、人性化數(shù)字體驗(yàn)
1、個(gè)性化
個(gè)性化是當(dāng)今移動(dòng)應(yīng)用最關(guān)鍵的要素之一。這是一個(gè)與用戶聯(lián)系并以真實(shí)感覺的方式,提供他們所需信息的機(jī)會(huì)。
星巴克就是一個(gè)很好的例子。該應(yīng)用程序使用用戶提供的信息(例如,他們通常訂購(gòu)的咖啡類型)來制作特別優(yōu)惠。
2、令人愉快的動(dòng)畫
與用于提高用戶界面清晰度的功能性動(dòng)畫不同,令人愉快的動(dòng)畫用于使界面變得人性化。這種類型的動(dòng)畫清楚表明制作應(yīng)用的人關(guān)心用戶。使用令人愉快的細(xì)節(jié)能夠與您的用戶建立情感上的聯(lián)系。
六、推送的價(jià)值
71%的受訪者認(rèn)為,令人討厭的通知是卸載移動(dòng)應(yīng)用的首要原因。
不要僅僅因?yàn)榭梢园l(fā)送推送而推送通知 - 每個(gè)通知都應(yīng)該是有價(jià)值且適時(shí)的。設(shè)計(jì)推送通知時(shí)需要考慮以下幾點(diǎn):
1、避免在短時(shí)間內(nèi)發(fā)送太多通知
在很短的時(shí)間內(nèi)發(fā)送太多通知可能會(huì)導(dǎo)致用戶無法處理信息并簡(jiǎn)單地忽略它。嘗試將不同的消息合并在一起發(fā)送,限制通知總數(shù)。
2、推送通知的時(shí)間
不僅你想推送的話很重要,什么推送同時(shí)也很重要。不要在奇怪的時(shí)間發(fā)送推送通知(例如在深夜)。推送通知的最佳時(shí)間是移動(dòng)使用高峰時(shí)段 - 從晚上6點(diǎn)到晚上10點(diǎn)。
3、使用其它渠道來傳遞你的信息
推送通知不是向用戶發(fā)送消息的唯一方式。使用電子郵件,應(yīng)用內(nèi)通知和新聞源消息等都可以,根據(jù)您想要共享的緊急程度和內(nèi)容類型通知用戶有關(guān)重要事件。
總結(jié)
設(shè)計(jì)人員經(jīng)常說,偉大的設(shè)計(jì)是不可見的,使用它的人關(guān)注他們自己的目標(biāo),而不是界面。作為一名設(shè)計(jì)師,您應(yīng)該努力創(chuàng)造無形的界面,因?yàn)檫@樣的界面能夠滿足用戶的需求并提供出色的用戶體驗(yàn)。
就像任何其他指南一樣,上面提到的提示只是一個(gè)開始。確保將它們與您自己的想法混合并匹配,從而做出最佳的設(shè)計(jì)方案。
全站高品質(zhì)素材免費(fèi)下載!