按照國際慣例,先上思維導(dǎo)圖:

1.在每個(gè)頁面建立清楚的視覺層次
讓用戶對(duì)你的產(chǎn)品頁面的設(shè)計(jì)瞬間明白的一個(gè)好辦法就是確保頁面上所有內(nèi)容的外觀——所有的可視線索一一清除,而且能準(zhǔn)確的表述頁面上內(nèi)容的關(guān)系:哪些內(nèi)容相關(guān),哪些內(nèi)容是其他內(nèi)容的組成部分。清楚的視覺層次通常具有三個(gè)特點(diǎn):重要的部分突出;邏輯上相關(guān)的部分在視覺上也相關(guān);邏輯上包含的部分在視覺上嵌套;
接下來以美團(tuán)為例:


美團(tuán)首頁將“勁爆折扣,特價(jià)日,免費(fèi)拍”這些普遍消費(fèi)者最關(guān)注的信息突出在頁面最中間顯眼的位置,使用戶打開APP第一眼,目光被吸引在最突出的部分。然后底部五個(gè)tab鍵:首頁,附近,逛一逛,訂單,我的。五大部分顏色都為淺灰色(只有選中才變?yōu)榫G色),將各大內(nèi)容分類,這樣清楚的邏輯線讓用戶找尋信息也方便。而首頁,頂部輪播圖里面,將美食,貓眼電影,酒店住宿,休閑娛樂等相關(guān)并列的部分列在一塊,進(jìn)行視覺嵌套。
我們每日都會(huì)對(duì)視覺層次進(jìn)行分解,不論從網(wǎng)頁,app,報(bào)紙。但是這種分解發(fā)生得太快,因此我們只有在不能這么做的時(shí)候才能模模糊糊感覺到它,也即這些復(fù)雜的可視信息線索迫使我們思考。好的視覺層次通過了預(yù)處理頁面,用一種用戶能快速理解的方式對(duì)頁面的內(nèi)容進(jìn)行組織并區(qū)分優(yōu)先級(jí)。相反,如果一個(gè)頁面沒有清楚的視覺層次,所有的內(nèi)容都看起來一樣重要,迫使用戶降下速度尋找關(guān)鍵的信息,輕則用戶會(huì)對(duì)你的產(chǎn)品不滿,重則,直接離開你的產(chǎn)品。在設(shè)計(jì)時(shí)應(yīng)該謹(jǐn)記:“別讓用戶思考”這條準(zhǔn)則。
2.習(xí)慣用法是你的好幫手

分別看這兩種確定,取消方式。在android上確定在右,取消在左,而windows上恰好相反。這兩種方式孰優(yōu)孰略,相信每個(gè)人都有自己的見解,可以從人工美學(xué)甚至心理學(xué)等都可以分析的頭頭是道,今天暫不討論哪種方式好一些。從習(xí)慣來說,如果你在android上的app忽然采取了windows的習(xí)慣,確定在右,那么給用戶將帶來毀滅性的災(zāi)難,很容易誤操作。
對(duì)于一款產(chǎn)品來說,用戶習(xí)慣是非常重要的,卻經(jīng)常被設(shè)計(jì)者忽略。通常,習(xí)慣用法因?yàn)橛杏貌艜?huì)成為習(xí)慣用法,適當(dāng)?shù)牧?xí)慣用法會(huì)使用戶在不同產(chǎn)品間使用變得容易,不需要花費(fèi)額外的努力來得到背后的工作原理。但是許多產(chǎn)品經(jīng)理及設(shè)計(jì)師卻喜歡反復(fù)發(fā)明輪子。為了追求一種酷炫的狀態(tài),設(shè)計(jì)一些與眾不同的東西,(當(dāng)然除了快手這款簡單易上手顛覆設(shè)計(jì)行業(yè)的奇葩軟件不說)增加用戶學(xué)習(xí)成本,除非你的產(chǎn)品足夠優(yōu)秀能時(shí)刻吸引用戶,否則只會(huì)被邊緣化甚至淘汰。
3.把頁面劃分成明確定義的區(qū)域
把頁面劃分為明確定義的區(qū)域很重要,因?yàn)檫@可以讓用戶很快決定關(guān)注頁面的哪些區(qū)域,或者放心地跳過哪些區(qū)域,用戶會(huì)很快確定頁面哪些部分包含有用信息,然后立刻忽略掉對(duì)自己無關(guān)的信息。
![_DW62G4((NN534ZU3~D9]KJ.png](http://upload-images.jianshu.io/upload_images/1091297-22fdbf5fd7ce7578.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/400)
針對(duì)360,大部分用戶只關(guān)注快速查殺病毒,并不會(huì)在意是哪種引擎查殺以及引擎是否開啟,因此,360界面,將引擎分類這一功能只是放在左下角,并且要比快速查殺,立即掃描這一主流功能要小得多。
4.明顯標(biāo)識(shí)可以點(diǎn)擊的地方
人們?cè)诰W(wǎng)絡(luò)上所做的大部分事情就是找到下一個(gè)地方點(diǎn)擊,那么明確地標(biāo)識(shí)哪些地方可以點(diǎn)擊,哪些地方不能點(diǎn)擊,是非常重要的。用戶確定點(diǎn)擊哪里并不會(huì)花很長的時(shí)間,但如果你迫使用戶去思考某些下意識(shí)就可以知道的東西,那么完全就是浪費(fèi)每個(gè)用戶對(duì)產(chǎn)品的耐心和好感。百度和谷歌在這點(diǎn)上做的非常好。


通過明顯的Google搜索和百度一下,減少了用戶思考時(shí)間。大大提升效率。
5.降低視覺噪聲
對(duì)于用戶來說讓頁面不易理解的一大原因就是視覺噪聲,即讓用戶眼花繚亂,表面上信息非常全,所有的內(nèi)容希望得到用戶注意,但效果往往會(huì)適得其反,就像淘寶上有的店家頁面,滿眼都是促銷消息,卻沒有突出自己店里面的熱賣物品,讓用戶困惑不解。用戶們對(duì)復(fù)雜性和干擾的容忍度不一樣,但是設(shè)計(jì)頁面時(shí),最好的辦法就是,先假定所有內(nèi)容都是視覺噪聲,然后證明哪些不是,再顯示哪些。