濮阳杆衣贸易有限公司

主頁 > 快速排名 > 常見問題 > 令用戶費腦的認知設(shè)計,該如何規(guī)避?

令用戶費腦的認知設(shè)計,該如何規(guī)避?

POST TIME:2018-12-03 21:37

 

今天和大家聊聊“認知負荷”。比來看了一些文章深受啟發(fā),我們在我們?nèi)粘TO(shè)計中如何去制止一些讓用戶費腦而抓狂的設(shè)計,本文我將會集合我們?nèi)粘I钪械漠a(chǎn)品和大家聊聊。

認知負荷理論?

認知負荷理論(cognitive load theory)是Sweller等人在20世紀80年代的,主要從認知資源分配的角度考察學(xué)習(xí)和問題解決。Sweller等人認為,問題解決和學(xué)習(xí)過程中的各種認知加工活動均需消耗認知資源,若所有活動所需的資源總量超過個體擁有的資源總量,就會引起資源的分配不足,從而影響個體學(xué)習(xí)或問題解決的效率,這種情況被稱為認知超載。(內(nèi)容來自百科)

是什么造成了認知負荷

想要制止用戶的認知負荷,那么我們就要了解界面設(shè)計中那些因數(shù)會影響用戶的認知,認知負荷分內(nèi)在和外在的,內(nèi)在的當(dāng)然與用戶的文化因素有關(guān),這里我們不做討論,我們來說下外在影響因素:

視覺層次結(jié)構(gòu)混亂導(dǎo)航結(jié)構(gòu)不清晰無規(guī)則的視覺流需要大量思考

下面我將集合實例和大家探討下:

1. 視覺層次結(jié)構(gòu)混亂

下面截圖是愛奇app,這里我將討論愛奇藝一些糟糕的設(shè)計點。

Navgation bar:使用頻率不高的元素過多;消息,播放歷史,添加Label:標簽視覺樣式樣式多Color:顏色過多,是造成用戶無法形成視覺流的關(guān)鍵因素Gird layout:網(wǎng)格布局混亂,縱向?qū)R線過多,且無規(guī)律Focus:圖2焦點元素過多,造成用戶選擇困難

那怎么解決?

強化主要信息,弱化次要信息(好比圖2,更多資訊,換一批等是否可以弱化,去掉顏色?)去掉過多不須要的元素(分割欄上的圖標是否可以去掉,滿屏的標簽是否可以統(tǒng)一弱化)使用網(wǎng)格布局(圖片和文字遵循網(wǎng)格排版)。

堅持一個原則,一個頁面完成一個用戶目標。

好的布局是怎么樣的?

結(jié)構(gòu)簡單,用戶目標清晰,卡片流布局,大家留意到?jīng)],youtube在導(dǎo)航上通過“更多”icon把不常使用的元素收起來,這就減少導(dǎo)航上擺放過多低頻率使用的操作,這樣來減少了視覺上的混亂。

2. 導(dǎo)航結(jié)構(gòu)不清晰

首先我們先了解下Navgation design pattern,界面設(shè)計中一般使用2-3種導(dǎo)航,別離一級導(dǎo)航和二級導(dǎo)航模式(一級導(dǎo)航一般只有一種,如業(yè)務(wù)比較多的,一般都使用組合導(dǎo)航,好比頂部與底部標簽導(dǎo)航,標簽與漢堡組合等等),我們必需在設(shè)計上區(qū)分它們,不能一級導(dǎo)航和二級導(dǎo)航樣式相同,這樣無規(guī)律的設(shè)計會讓用戶難以抉擇。

圖1:愛奇藝app產(chǎn)品內(nèi)容比較多,所以采用了頂部和底部雙標簽導(dǎo)航來組織內(nèi)容圖2,3,4:藍色框部分搜索結(jié)果頁和視屏播放頁還有用戶信息頁,應(yīng)該要使用二級導(dǎo)航區(qū)分,但是目前奇藝依然使用一級導(dǎo)航設(shè)計模式來區(qū)分它們(目前國內(nèi)好多app都這樣沒去區(qū)分),這樣就會導(dǎo)致信息結(jié)構(gòu)混亂,信息層級不清晰。

ios使用Segmented Controller來區(qū)分的,google的materials好像在這方面沒有明確的說明,所以這就導(dǎo)致大量的導(dǎo)航混亂,不過好像大多數(shù)用戶已經(jīng)習(xí)慣了?(二級導(dǎo)航一般無特殊情況是不會允許在一級界面)

清晰的導(dǎo)航架構(gòu)是怎樣的?

一級導(dǎo)航和二級導(dǎo)航區(qū)分明顯,清晰的信息架構(gòu),用戶能知道優(yōu)先級。

這里說下Nike+的導(dǎo)航系統(tǒng),在頂部使用了標簽式作為一級大內(nèi)容區(qū)分,,二級導(dǎo)航采用類似分段內(nèi)容導(dǎo)航來區(qū)分單個模塊下的內(nèi)容。

為何要區(qū)分一級和二級導(dǎo)航?

一級導(dǎo)航一般都是大功能模塊之間的區(qū)分,二級導(dǎo)航一般用于單個功能模塊里面的內(nèi)容作為層級區(qū)分,請謹記。目前國內(nèi)app設(shè)計質(zhì)量不齊,導(dǎo)航規(guī)則混亂,沒有一個完整的Design system來指導(dǎo)整個企業(yè)的產(chǎn)品規(guī)則,所以我們可以從本身產(chǎn)品做起,在產(chǎn)品設(shè)計中把信息架構(gòu)搭建好。

無規(guī)則的視覺流

要做好視覺引導(dǎo)我們就要懂一些設(shè)計心理學(xué),我們要了解人是如何閱讀,如何不雅觀察,如何記憶,如何思考,如何集中注意力,如何快速進入流的狀態(tài)等等。

最常用的閱讀模式是F pattern和Z pattern。

一個頁面一屏出現(xiàn)了這么多耀眼入口,我該如何選擇?沒有主次,看起來所有都很重要?

標簽:烏魯木齊 林芝 鹽城 東營 九江



收縮
  • 微信客服
  • 微信二維碼
  • 電話咨詢

  • 400-1100-266
平阴县| 扬中市| 颍上县| 汉沽区| 馆陶县| 喜德县| 金华市| 沿河| 邢台县| 定结县| 特克斯县| 广西| 沙洋县| 乐清市| 榆社县| 博白县| 宿迁市| 池州市| 河源市| 灯塔市| 永昌县| 罗平县| 通海县| 堆龙德庆县| 宁明县| 合肥市| 苍山县| 房山区| 贵港市| 沁源县| 如东县| 古丈县| 文昌市| 赤城县| 闵行区| 宜川县| 江安县| 高阳县| 遂川县| 师宗县| 湛江市|