網頁設計 ? 用戶體驗 ? 用戶體驗一直在提升著人們的生活質量

用戶體驗一直在提升著人們的生活質量

發表于: 用戶體驗. 評論
Sponsor

WCAG 提出:顏色不應作為傳達信息、指示操作、提示響應或區分視覺元素的唯一手段。

注解:Web內容無障礙指南(WCAG),涵蓋范圍廣泛,涉及了一些建議,這些建議可使網站內容更容易訪問。遵循這些原則,Web內容更易為廣大殘疾人士所接受,這些包括盲人和低視患者、聾人和重聽人、學習障礙、認知障礙、行動不便、言語殘疾、光過敏患者和這些病癥的復合患者。遵循這些原則也可讓普通用戶更容易訪問您的網站。

——

最近在做一個項目,內容涉及到顏色與色盲用戶群體的關系,同時,讓我更深刻理解了這句話的意義。

WCAG 中提到,大約每 20 個人中就有 1 個人存在某種視覺缺陷。

對于這些人來說,世界看起來與眾不同,他們常常很難區分紅色和綠色,或其它情況。這通常意味著他們有時看不到「普通人」可以看到的東西。

而我在做的項目的品牌色是紅色,企業給到的數據顯示,用戶群體中存在不少紅綠色盲用戶。通過模擬紅綠色盲插件發現紅綠色盲看到的界面,和我們正常視力看到的界面確實差異挺大。

圖一:左(正常視力看到的界面)右(紅綠色盲看到的界面)

用戶體驗一直在提升著人們的生活質量

WCAG 提出:顏色不應作為傳達信息、指示操作、提示響應或區分視覺元素的唯一視覺手段。

這個標準的目的是讓設計師通過各種手段,確保所有用戶都可以理解各類信息所傳達的意思,但如果信息只是通過圖像中的色差區分傳遞,視力存在缺陷的用戶可能看不到該顏色。在這種情況下,通過另一種手段提供被傳達的信息,可以確保看不見色彩的用戶仍能感知到該信息。

為了強化有視力障礙的人群所看到的按鈕操作狀態,在做頁面改版的時候,我除了對按鈕選中狀態做了顏色區分之外,還加了圖形來表示被選中的狀態。

圖二:左(正常視力看到的界面)右(紅綠色盲看到的界面)

用戶體驗一直在提升著人們的生活質量

通過紅綠色盲模擬器,可以看到,紅綠色盲用戶對按鈕選中狀態的圖形感知,看起來并沒有很強。于是又有了圖三的方案。強化按鈕選中狀態的顏色。

圖三:左(正常視力看到的界面)右(紅綠色盲看到的界面)

用戶體驗一直在提升著人們的生活質量

圖三的按鈕選中狀態,可以看到,不管是正常視力還是紅綠色盲視力看到的頁面,按鈕的顏色對比都很強烈。

不過如果產品的受眾中,有視力障礙的人占比高的話,還可以把兩種方法結合起來。即:通過色彩變化結合其他方式,來強化產品想要傳達的信息。

圖四:左(正常視力看到的界面)右(紅綠色盲看到的界面)

用戶體驗一直在提升著人們的生活質量

這里除了顏色變化,還加了 icon 的狀態變化,以便于讓用戶更易察覺按鈕的變化。類似于一些紅綠燈,除了顏色,還有圖形。

——

雖然只是一個按鈕選擇的變化,但里面的含義很多。

之前住的公寓,它的電梯很有意思。公寓樓層一共 11 層,電梯在沒人的時候總是會自動將兩個電梯分別停在 1 樓和 6 樓,幾乎每次我要坐電梯,都能看到這樣的現象。

有一次在電梯里碰到物業,就隨口問了句,這電梯是自動停在 6 層的么?他說是的,專門負責電梯運維的公司說是有相關數據,這樣能最大化提升用戶坐電梯的效率。

我想的是,為什么不是分別停在 3 樓和 8 樓效率更高呢?無從得知,可能人家有可以驗證這個結論的數據吧。

不知道是現在的電梯都是這樣還是如何。看到這樣的事情,感受到生活中各類事物的體驗都在不斷提升。挺好。

——

類似的還包括前陣子看到的一個視頻。

視頻中的男主叫瓊斯,與該校的校長一樣,患有嚴重的色盲癥,之后校長把自己的特殊眼鏡給瓊斯帶上,當 12 歲的瓊斯第一次看到了帶有各種色彩的世界,這位大男孩在課堂上流下了淚水。

用戶體驗一直在提升著人們的生活質量

視頻很短,只有十幾秒,但是看完后很感動。

我們都知道科技改變了人們的生活,而恰恰是設計師,利用設計的手段發揮了部分技術的作用,讓它們得以服務于人。想到我們作為互聯網的從業者,能夠通過產品功能的設計來解決人們的難題,這常常能讓我收獲一點淺薄的成就感(雖然對于社會的發展來說不值一提)。

前田約翰在 2009 年的一次 TED 演講中談到:當前的問題不是如何讓世界更加科技化,而是如何使世界重新變得更加人性化。

作為設計師,我們不能僅滿足于表象,還應該學會在生活中去體察設計的語言,思考這些產品、功能、界面背后的邏輯。

按鈕的顏色變化?圖形的選擇?電梯自動停靠的樓層?紅綠燈為什么要有圖形?等等。

埃默·托爾斯問過讀者一個問題:

坐火車出行的時候,你有沒有看著一路的風景從窗外接連不斷地掠過呢?你有沒有和同行的旅客交談,有沒有在車輪的滾動聲中昏昏入睡呢?

接著,你有沒有,哪怕很短的時間,想過那些煤是怎么到火車的內燃機里去的?當火車穿過森林,或者是爬上陡坡的時候,你有沒有想過那里的鐵軌是從何而來的呢?

希望讀完這篇文章,能讓你有所收獲。

謝謝閱讀:)

WCAG 資料:https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html

作者:呆呆U理,微信號:UDai-bl

推薦:查看最受歡迎的 301 個設計網站 → http://hao.shejidaren.com
交流:結交更多有才華的設計師?請加入UI設計QQ群,與50000名設計師交流設計。
贊助商鏈接
贊助商鏈接
設計達人微信交流社區:shejidaren888
喜歡這篇文章嗎?歡迎分享到你的微博、QQ群,并關注我們的微博,謝謝支持。
版權:除非注明,本站文章均為原創文章,轉載請聯系我們授權,否則禁止轉載。

{ 發表評論 }