App設(shè)計(jì)者需要注意的21條禁忌
我們通常在做APP設(shè)計(jì)的過程中,遇到很多看似很小,且很容易被忽略的問題,正是這些小問題,一次次的撩撥用戶的耐心,讓用戶對你的APP心生怨念?,F(xiàn)在WeX5君嘔血為大家整理出APP設(shè)計(jì)的21條禁忌,希望與APP設(shè)計(jì)者的您共勉。
1. 不要在沒有流程圖之就前開始設(shè)計(jì)或者畫線框圖
即便一個(gè)簡單的 APP 也要有一個(gè)思慮周全的流程圖,以確保在 APP 有合乎邏輯的、合理的導(dǎo)航結(jié)構(gòu)。另一點(diǎn)值得關(guān)注的是確保核心功能所在的屏幕位于上層而不是被埋沒在多層導(dǎo)航元素之下。
跳過流程圖直接進(jìn)進(jìn)入開發(fā)會讓開發(fā)變得復(fù)雜、不可控,很容易讓用戶迷茫,最后選擇關(guān)掉或者卸載你的 App。
2. 分工要明確不要忽略開發(fā)預(yù)算
設(shè)計(jì)師創(chuàng)建的每一個(gè)細(xì)節(jié)都要經(jīng)過開發(fā)者才能變得活靈活現(xiàn)。花幾個(gè)小時(shí)和幾天時(shí)間做出的簡單設(shè)計(jì)更改對 App 功能的影響是截然不同的。還有,設(shè)計(jì)不能命令功能。比如,一個(gè)計(jì)劃好的 App 可能有一個(gè)搜索框,設(shè)計(jì)師預(yù)想的是一個(gè)產(chǎn)生實(shí)時(shí)結(jié)果的鍵入搜索,但設(shè)計(jì)師不能是做這個(gè)重大決定的唯一決策人。
3. 不要隨意使用介紹動畫
在用戶首次打開 App 的時(shí)候,給用戶一個(gè)動畫的介紹是個(gè)不錯(cuò)的想法,但不能太過火了。事實(shí)上,這些介紹動畫也延遲了用戶接觸 App 的時(shí)間。如果你打算使用介紹動畫,那要讓動畫時(shí)間盡可能短,設(shè)計(jì)盡可能精細(xì)以及足夠吸引人,值得用戶花費(fèi)時(shí)間等待。
App 加載過程中會先展現(xiàn)圖片,再過渡至動畫。要確保這個(gè)過度是平滑的,貼切自然的。有的 App 從加載圖片過渡至介紹動畫設(shè)計(jì)的非常蹩腳,這就很無趣了。
4. 別讓用戶空等
App 加載時(shí)間過長很容易讓用戶以為出現(xiàn)了什么故障,也會帶來糟糕的用戶體驗(yàn)。App 加載的時(shí)候不要讓用戶看到空白的屏幕,使用加載指示條或者小動畫讓用戶知道 App 處于正常運(yùn)行當(dāng)中。如果能加入一個(gè)加載進(jìn)度指示條就更好了。
5、沒有不可點(diǎn)擊的效果
一般按鈕會有四態(tài),不可點(diǎn)擊效果、可點(diǎn)擊效果、聚焦?fàn)顟B(tài)、按下狀態(tài)。
如果你的按鈕此時(shí)處于不可用狀態(tài),那么一定要灰掉,或者拿掉按鈕,否則會給用戶誤導(dǎo)。
6、菜單層次太深
菜單項(xiàng)以5~7個(gè)為宜,如果有二級菜單,就要注意合理的菜單分類,不能有太多層級的菜單,否則很難預(yù)期,也很難找到,尋找和返回都會變得很麻煩。
7、文字長度不加以限制
APP界面很小,寸土寸金,一頁只能顯示下6~10個(gè)列表,一行只能顯示下10~16個(gè)字,標(biāo)題欄的字?jǐn)?shù)以5個(gè)以內(nèi)為宜,標(biāo)簽欄也以2~3個(gè)為宜,那么這時(shí) 候出現(xiàn)文字過長的情況,一定要定義一下處理方式,如果是選擇型的,一般是截?cái)嗷蛘叽螯c(diǎn)縮略;如果是內(nèi)容閱讀型的,可以折行。但最合理的方式還是精簡文字內(nèi)容,縮短文字長度。
8、文字表意不明
由于APP是碎片時(shí)間、片段式閱讀,所以APP界面上的文字表意性要求的更高,更苛刻,一定要在用戶瞟到的瞬間,準(zhǔn)確的傳達(dá)信息。除了表意清晰之外,還要求語言精簡,避免啰嗦;使用用戶的語言而不是程序的語言;產(chǎn)品文案體現(xiàn)產(chǎn)品性格。
9、交互流程分支太多
做交互的時(shí)候一定要有一個(gè)任務(wù)流程的概念貫穿始終,用戶是為了完成某個(gè)任務(wù)而使用軟件的,交互設(shè)計(jì)師除了關(guān)注界面元素、跳轉(zhuǎn)邏輯和交互反饋之外,還要關(guān)注用戶任務(wù),分得清主要任務(wù)和次要人物,給主要任務(wù)一個(gè)暢通無阻的清晰流程,不要給予太多可能的分支,干擾主要流程。
10、相關(guān)的選項(xiàng)離的很遠(yuǎn)
相關(guān)選項(xiàng)一定要具有操作上的延續(xù)性,雖然APP屏幕看起來比電腦屏幕要小的多,但是APP在屏幕上移動的代價(jià),卻要比鼠標(biāo)在電腦上移動的代價(jià)大的多,如果手機(jī)上相關(guān)選選離得很遠(yuǎn)的話,用戶一是容易迷失,找不到下一步操作,二是需要移動手指,到屏幕另一端觸發(fā)操作。
11、一次載入太多的數(shù)據(jù)
流量、電量、速度和穩(wěn)定性是APP產(chǎn)品的四個(gè)硬指標(biāo),如果你的應(yīng)用不能合理的幫助用戶節(jié)約流量、電量,提升瀏覽速度和瀏覽體驗(yàn),保證應(yīng)用的穩(wěn)定性能,就不要談什么用戶體驗(yàn)。你可以利用預(yù)加載緩存、批量載入、動態(tài)刷新、服務(wù)端數(shù)據(jù)壓縮等方式來保證省、快、穩(wěn)基礎(chǔ)體驗(yàn)。
12、按鈕可點(diǎn)擊范圍比看起來小
我們都知道移動端有個(gè)神奇的數(shù)字“44”,根據(jù)食指最小點(diǎn)觸距離7mm、拇指最小點(diǎn)觸距離9mm,可以推導(dǎo)出做設(shè)計(jì)的時(shí)候,最小的點(diǎn)觸距離是44*32 px。你可以設(shè)計(jì)一個(gè)精美的小圖標(biāo),但是在定義它的點(diǎn)觸大小的時(shí)候,卻可以做放大處理,但你千萬不要設(shè)計(jì)一個(gè)傻大的圖標(biāo),點(diǎn)觸范圍卻比圖標(biāo)要小,這樣會給用戶帶來明顯的誤操作挫敗感。
13、標(biāo)簽頁跟內(nèi)容沒有從屬關(guān)系
標(biāo)簽頁跟內(nèi)容需要有很好的聯(lián)動關(guān)系,一般一個(gè)界面內(nèi)有二級標(biāo)簽就足夠復(fù)雜了,千萬不要再有三級標(biāo)簽、四級標(biāo)簽。每個(gè)標(biāo)簽頁都有自己特有的內(nèi)容,當(dāng)切換標(biāo)簽的時(shí)候,內(nèi)容跟著切換。標(biāo)簽頁如果是點(diǎn)擊切換,內(nèi)容部分可以整體刷新,標(biāo)簽頁如果是滑動切換,內(nèi)容頁也要跟著滑動切換,千萬不要一個(gè)點(diǎn)、一個(gè)滑。
14、把所有的操作都暴露出來
APP產(chǎn)品交互設(shè)計(jì)要經(jīng)歷縮減、隱藏、附加、組織的過程,千萬不要妄圖把什么功能、什么操作都暴露出來,以彰顯強(qiáng)大。你需要把自己應(yīng)用的所有功能所有操作做個(gè)優(yōu)先級設(shè)定,那些常用的20%的功能,放在界面的主要位置上,其他80%的操作,放在次要位置或合理歸類組織后,隱藏起來就可以了。
15、沒有空數(shù)據(jù)界面設(shè)計(jì)
我們在做設(shè)計(jì)的時(shí)候,往往是提供理想化的場景,用戶都已經(jīng)進(jìn)來了,我們怎么玩。但是,往往應(yīng)用剛推出的時(shí)候,是沒有用戶的,甚至當(dāng)應(yīng)用有了一定用戶基礎(chǔ)的時(shí)候,新進(jìn)來的用戶打開應(yīng)用的時(shí)候,應(yīng)用仍然可能是一種沒有數(shù)據(jù)的狀態(tài),再或者當(dāng)用戶清楚了全部數(shù)據(jù),這三種情況下,用戶都可能遇到空數(shù)據(jù)的界面。新手設(shè)計(jì)師往往不加設(shè)計(jì),這時(shí)候用戶就會看到一個(gè)空白界面,茫然失措。有經(jīng)驗(yàn)的做法就是,提供一個(gè)情感化的界面,告訴用戶當(dāng)前沒有內(nèi)容;更具引導(dǎo)性的做法,就是引導(dǎo)用戶去執(zhí)行操作。
16、用戶引導(dǎo)的濫用
去年就預(yù)言用戶引導(dǎo)將要泛濫,很明顯設(shè)計(jì)部門都喜歡用漂亮的引導(dǎo)界面告訴用戶新增的功能或隱藏的應(yīng)用,但不是所有的應(yīng)用、所有的功能都需要花哨的引導(dǎo)的。 如果是通用的功能、非重點(diǎn)的模塊,根本就不需要引導(dǎo);如果是功能告知,只需呀輕量級的引導(dǎo);如果是版本更新說明,說明書式的引導(dǎo)可以采用,但是要言簡意賅。
17、無加載中狀態(tài)
APP產(chǎn)品只要是需要聯(lián)網(wǎng),需要交換數(shù)據(jù),都需要提供一個(gè)加載中狀態(tài)的,無論是菊花轉(zhuǎn)還是Toast還是對話框,你需要給開發(fā)人員一個(gè)全局的定義,并且要告知加載中是模態(tài)(前臺加載)的還是非模態(tài)的(后臺加載)。且要考慮到加載時(shí)間過長、網(wǎng)絡(luò)開關(guān)沒有打開、網(wǎng)絡(luò)不通等情況分別怎么去處理。
18、未定義Back的邏輯
在為Android做設(shè)計(jì)的時(shí)候,會涉及到硬件交互,其中Back鍵的使用,是一門學(xué)問,Android官方有一些指導(dǎo)原則可以借鑒,但是具體開發(fā)的時(shí)候,還是會有很多特殊情況,比如單一實(shí)例的替換、鍵盤及一些中間狀態(tài),這種情況下,Back可能需要被定義一下,該回到前一個(gè)實(shí)例(那就需要變成多實(shí)例 了)還是該回到初始狀態(tài)(清空輸入內(nèi)容或恢復(fù)初始狀態(tài))。
19、無橫屏模式的設(shè)計(jì)
由于橫屏模式下,縱向空間變得格外寶貴,導(dǎo)航欄、標(biāo)簽欄、鍵盤都需要被壓扁,橫盤模式一定要考慮是簡單拉伸適配還是重新設(shè)計(jì),如果你的應(yīng)用不適合在橫屏模式下使用,就屏蔽橫盤,如果你的應(yīng)用包括應(yīng)用widget都需要支持橫盤模式(甚至是帶側(cè)滑鍵盤的橫屏機(jī)器),就需要提供設(shè)計(jì)方案。
20. 不要忘記手勢但不要濫用
不是每個(gè)元素都是可視化的,比如 iPhone Mail app 的刪除進(jìn)程。在收件箱內(nèi),用戶可以猛擊屏幕顯示刪除按鈕,用戶就不用點(diǎn)擊“編輯”,選擇信息然后再刪除信息。不過,也不能說“編輯”菜單一點(diǎn)用處都沒有,不知道快捷操作的用戶還是需要的,而用戶還可以通過“編輯”菜單一次性標(biāo)注多條信息/郵件。
21. 不要覺得每個(gè)用戶有著跟你一樣的 App 使用方式
可用性測試是必須的,不管你的 App 看起來多么好。找值得信任的人(或者有經(jīng)驗(yàn)的設(shè)計(jì)師)進(jìn)行小范圍封閉測試,在公開發(fā)布之前更新下界面。另一個(gè)簡單易行的獲得用戶反饋的方法是在分類網(wǎng)站張貼廣告招募合適的人進(jìn)行焦點(diǎn)小組測試。
22.怎么才21條?
App江湖上傳言多年的關(guān)于多屏、多分辨率、多端、多操作系統(tǒng)支持的若干注意呢?
在WeX5君的世界觀里,移動開發(fā)者不需要、不應(yīng)該操心這個(gè)問題。
作者:WeX5君
微信公眾號:起步軟件
好虛的東西..
很不錯(cuò)