為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

擬態設計(Neumorphism UI)是 2020 年 UI 設計的主要趨勢之一,你可以在 dribbble 上看到很多作品,新擬態是基於New+Skeuomorphism 英文單詞的拼寫。它是一種使用對象陰影的模糊、角度和強度來突顯出對象的樣式。由於其柔和的陰影和整體的外觀,使該設計看起來更加的逼真、未來、現代、真實、有吸引力。

但是老實說,這不是最實用的設計。嘗試設計和上線以「新擬態」給整體調性的產品,很有可能讓所有人失望,包括你們的同事、用戶和可訪問性用戶(目前有 5700 萬美國人患有某種程度的殘疾。在上網的用戶中,有 54% 的成年人是殘障人士,來源於:W3.org)。

根據 W3 的說法,web 和移動端的可訪問性包括影響訪問的所有障礙,包含:

  • 聽覺的
  • 認知的
  • 神經學
  • 物理的
  • 語言/說話能力
  • 視覺的

僅新擬態而言並不支持:視覺、認知、物理方面設計。

讓我們深入地討論為什麼新擬態 UI 和 可訪問性是無法共存的。

免責聲明:我不是可訪問性和新擬態方面的設計專家,本文旨在分享一些有關新擬態的一些想法。下面使用的 dribbble 作品僅供參考,以突出我在此問題上的觀點。沒有一絲評價、嘲笑、不尊重以下設計師的意思,如果你的設計在下面展示了,並且你希望我儘快刪除,請及時聯繫我。

視覺

新擬態對視力低下、失明、色盲的用戶來說,可辨識性較差。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/10006635-Neumorphic-Rebound-of-Nomad-iOS-UI-Kit


當設計中帶有重要 CTA 按鈕時,你經常考慮並注意使它重點突出,並且在頁面上容易被識別閱讀。但是,當使用新擬態的設計風格時,沒有諸如對比度之類的東西,因為按鈕的材質與背景是相同的,唯一將它們分開的是角度和各種柔和的陰影。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/9393020-Mi-Remote-Control-Mobile-app


根據 W3.org 關於移動端可訪問性的描述:

與臺式機/筆記本電腦設備相比,移動設備更可能用於各種環境中,包括戶外。在戶外,陽光或其他強光源下更可能產生眩光,這種情況提高了對所有用戶使用良好對比度的重要性,並可能加劇視力低下的用戶在移動設備上訪問對比度差的內容的挑戰性。

與對比度問題相關的 WCAG 2.0 成功標準是(原文地址:https://w3c.github.io/WCAG21-zh/#contrast-minimum):

  • 1.4.3條:對比度(最小值)(AA級),要求對比度至少為 4.5:1(大號文本以及大文本圖像至少保持 3:1)。
  • 1.4.6條:對比度(增強)(AAA級),要求對比度至少為 7:1(大號文本以及大文本圖像至少保持 4.5:1)。

認知

新擬態讓用戶思考。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/9592062-Neumorphism-Smart-Home


一般來說,帶有陰影的元素通常比沒有陰影的視覺上更加突出。但是,使用新擬態設計時,大多數元素都會漂浮並脫穎而出,在一個屏幕上互相競爭,用戶很難輕易理解頁面中的視覺層次和信息層級關係,這會導致界面缺少適當的焦點,從而在眼動追蹤中造成混亂。

界面上缺少信息層級關係的結果,會對用戶的決策過程以及他們的思考過程產生重大的影響。因此,如存在多個可操作的內容,但是信息層級,重點不突出,這會讓用戶在當前的流程或頁面上產生困惑,很難理解正在發生的事情。從而可能導致錯誤的判斷和誤操作,好的 UI/UX 不需要讓用戶思考。

認知和學習障礙影響人們處理信息的方式。例如,它們可以影響人們的感知、記憶、語言、注意力、解決問題和理解力。類別和條件的術語各不相同,包括智力殘疾、發育障礙、注意缺陷多動障礙(ADHD)、自閉症、痴呆症、誦讀障礙等。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/9916835-Neumorphism-Smart-Home-app


物理

新擬態會造成混亂:

我可以點擊嗎?選擇了什麼?不是什麼?這是可點擊的嗎?還是不是?

對象的階段由內部/外部陰影決定和標識。由於新擬態圍繞著各種陰影色調和角度變化,因此用戶不禁要問,可點擊與不可點擊之間的界限在哪裡。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/9938821-Smart-home-app


每個使用新擬態的產品都可以根據其功能和要求有自己的 UI 設計規範,但是由於陰影、角度和浮動水平的不同,由於缺乏一致性,迷失了方向的可操作性,「新擬態」可能會給用戶帶來麻煩,最終為殘疾用戶造成身體障礙。

觸發可操作性的元素應該足夠清晰,以便與不可操作的元素(內容、狀態信息等)明確區分。提供元素可操作的明確指示與具有可操作元素(如按鈕或鏈接)的 web 和本機移動應用程序相關,尤其是在交互模式中,可操作元素通常以視覺方式檢測(觸摸和鼠標使用)。交互元素還必須由依賴於編程確定的可訪問名稱的用戶(例如屏幕閱讀器用戶)檢測到。

為什麼2020年初爆火的新擬物化設計,完全無法落地使用?

https://dribbble.com/shots/9838619-Music-Player-Neumorphism-Rebound-shot


從 dribbble 開始的新擬態的設計趨勢,應該要在追隨前認真地思考,是否適用?這是一個問題。

鏈接:https://www.uisdc.com/neumorphism-ui

今天就分享到這裡啦~~

如果有任何問題

都可以私聊站長喲

站長微頭條 不定時更新好東西喲!


分享到:


相關文章: