用户不见了_03 | 为什么你设计的信息用户总是看不见
點擊上方藍字關注?+ 點擊右上方“...”設為星標
大家好,這是十萬個為什么設計的第3篇,還剩99997篇。
很多設計師在進行信息設計的時候,通常靠著感覺和曾經嘗試過的經驗進行信息美化。但是當我們遇到需要對信息設計進行解釋的時候,理由通常很蒼白。你無法說出為什么用戶能夠快速高效的瀏覽信息,只是覺得又大、又粗、又硬哦不是,又鮮艷的信息能夠被識別。所以今天我們就要來聊一聊,為什么。
首先給大家介紹一些經過研究之后的數據結論:
人類視野的空間分辨率從中央向邊緣減少。我們人類每只眼睛具有700萬左右的視錐細胞,它們在人眼中的分布是越靠近中央凹的區域越密集。而另外一個研究證明,邊界視覺的信息在被傳遞到大腦之前是經過壓縮的,而中央凹的視覺則不會。大概就是下2圖這個意思。
然后有同學會問,既然我們的邊界視覺那么差,當用戶在瀏覽界面信息的時候,為什么給用戶3秒鐘時間看界面他還是能夠記住頁面中的一些信息呢或者會說為什么我們在瀏覽的時候它不像下圖那樣只有一小圈是高清而邊上的文字是模糊的呢。
這其實是因為大腦通過一個比較粗獷的方式,基于我們的預期,給視野進行填充,大腦也會命令你的眼睛對邊上的信息進行細節采樣。所以這是一個很快速的過程。
為什么有的人能夠一目十行就是,他的大腦能幫他補充的更多,或者說他的中央凹面積大。
但是有一個實驗是,我們通過眼動測試,當用戶的中央凹停留在一篇文章中的一個地方時,這個文字顯示的是正確的,但是隨著中央凹的移動,他周圍的文字會進行隨機的變化,他雖然能夠成功的完成閱讀,但是速度大幅下降。
比如大家看一下下面這個頁面的區域
當我們掃完這個頁面也就2-3秒,但是如果你沒有把中央凹停留在一個信息上的時候,其實都是靠大腦對我們的預期進行的補充。而真實的情況是,你們并沒有發現頁面中錯誤的地方。
言歸正傳,為什么你的信息用戶總是看不見呢。我們又要講到邊界視覺。我們的設計如果不考慮邊界視覺,那么就會影響到能夠被識別的信息。那么邊界視覺到底有什么用呢?
1.引導中央凹我們剛才說了中央凹的重要性,那么我們在什么時候會把中央凹放到我們要看的信息上呢?其實就是依靠我們的邊界視覺。邊界視覺引導中央凹,它幫助中央凹捕捉關鍵信息。我舉個例子,大家在查看一個食品包裝的生產日期的時候是怎么尋找的呢,大家的眼睛不斷的在搜索,而邊界視覺是提供了低分辨率的線索,幫助大腦,控制眼睛以線索的發現順序進行移動。2.捕捉運動元素邊界視覺可以非常快速的捕捉到運動的物體,所以在界面設計中,無法放置在核心位置的元素但又需要用戶去注意到的時候,通常就會使用動效。那么我們要怎么做才能讓用戶關注到關鍵信息呢?1.將信息盡量放在中央凹或者中央凹邊上能夠被預期的位置在小紅書很早的一個版本中,當用戶進行點贊操作后,反饋消息在頂部顯示,讓用戶無法察覺和關注到。因為邊界視覺都無法捕捉。所以當用戶在進行操作時,如果需要將狀態、文字告知用戶,就需要顯示在用戶能預期以及能被邊界視覺捕捉到的位置。2.使用圖標、圖片的形式標記出關鍵信息比如在一大段的文本中,用戶無法快速的查看內容標題,我們就可以在標題前使用圖標、圖片的形式進行標記,讓邊界視覺獲取到信息之后在大腦中產生預期模型。3.使用動態效果吸引用戶注意動態效果能夠快速被捕捉,甚至引導用戶的視線。比如馬蜂窩在底部進行點贊后通過動效引導用戶,告知用戶該點贊是為用戶而贊,同時讓用戶的視線又回到了頂部,可能增加用戶的停留時間。4.使用高亮的顏色來吸引用戶的邊界視覺進行捕捉由于邊界視覺的搜索是線性的,所以我們必須將重點的信息進行高亮顯示,比如警告的紅色,可點擊的藍色等。在這里再補充一個我總結出來的規律,不一定對,但是我的猜測。大家可以看到,下方的知乎話題界面,一進入界面我們的邊界視覺立馬給我們進行信息捕捉,所以首先被關注到的是呈現藍色的文字、圖片、圖標等。這里大家發現一個問題沒有為什么在這個界面中上方的兩個按鈕不用色塊的形式做呢?例如右邊這樣,很多同學在這里第一反應是這個按鈕太重了!很突兀!為什么很突兀?既然要引導用戶為什么不做的重一點呢?那有同學又會說這樣設計會干擾用戶對其他信息的瀏覽,那么為什么會干擾對其他信息的瀏覽呢?我的猜測來了!我猜測人眼的中央凹視錐細胞會根據界面中信息的重要程度進行調整,也就是說不同程度的強化會讓邊界視覺的捕捉能力下降。像右側的色塊按鈕讓中央凹的視覺細胞更加聚集,而導致邊界視覺的范圍也大幅縮小,所以你們看左邊界面覺得信息優先級很清晰,但是右側的就會覺得我只看到了兩個大按鈕,而其他的信息都沒有被捕捉到。那繼續思考一下,什么時候能用大色塊的按鈕呢?很多電商平臺的購物都是大按鈕,這個難道不會讓用戶的邊界視覺受影響嗎?大家發現一個規律沒有,有大按鈕的頁面基本上圖片、圖標都很多,而一般都是文字的頁面,通常都不會出現大按鈕,因為出現了就會被噴太突兀了!!這就是因為大按鈕在沒有其他更高層級信息的配合下讓邊界視覺捕捉范圍降低了,如果都是高層級的信息,那么邊界視覺的捕捉范圍就會“一視同仁”。?所以,為了讓一個界面的按鈕不突兀,一種方法是用和它相似級別的元素進行輔助展示,另一種方法就是降低該按鈕的視覺引導層級。更多閱讀1.視覺和交互都必須知道的交互設計模式2.2018設計師超詳細面試指南3.產品設計心得-視覺篇4.扁平描邊插畫嘔血教程5.老司機教你3步解析品牌設計6.【只言片語01】設計的邏輯7.【只言片語02】設計中的加載8.【只言片語03】無效的用戶測試9.【只言片語04】體驗設計雜談10.【只言片語05】app中5種形式的地址選擇11.交互輸出文檔12.用戶體驗設計師的8個關鍵問答
總結
以上是生活随笔為你收集整理的用户不见了_03 | 为什么你设计的信息用户总是看不见的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 使用变量_在 Linux 中使用变量 |
- 下一篇: 2vec需要归一化吗_LTSM模型预测数