2020-5-8 資深UI設計者
最近正火的新擬物化風格（Neumorphism）在 2019 年底，設計師 Alexander Plyuto 所提出的「Skeuomorph Mobile Banking」作品中亮相。之后不僅被選為 2020 年界面趨勢，又稱為 soft UI。但這種風格在真實世界落地時，可視性上受到許多爭議。
確實，新擬物化風格它算是一種風格，但又不是只有視覺上的風格這么簡單，它延伸出來的議題，其實是扁平化跟擬物化之間的戰爭。
擬物化是 Apple 在早期設計中大量使用在界面上呈現對象屬性、材質的方式。然而在 2013 年 ios7 發布時，Apple 開始為了畫面簡潔大量將界面元素扁平化，緊接著 Google 在 2015 年發布了 Material Design，宣示扁平化在 UI 設計中扮演著主導趨勢的角色。2020 年真是百家爭鳴的一年，首先是 BMW 發表的扁平化新 logo，接著是這一波新擬物化的反擊。究竟代表新擬物化可能奪回界面風格主導權？或僅是 2020 年曇花一現的視覺風格呢？
我認為新擬物化的概念其實是融合扁平化與擬物化的集大成，它建立在扁平化風格之上，又將組件帶入了擬物化的元素，提高用戶的判斷力。不過在糾結于扁平化與擬物化哪個比較好時，有五個議題是可以讓 UI、UX 設計師去思考的。
大家身邊一定都有那種已經把 Line 操作得滾瓜爛熟，但是每次要用 Line 加好友時，還是不知道怎么操作的長輩。最早期當人類還沒進入屏幕時代前，我們所使用的界面大多是實體產品上的控制界面，而這些界面上的每個開關、按鈕，都只有一個輸入源，對應到一個功能（一對一），我們因此就這樣與產品進行簡單的交互動作。然而在屏幕上這個簡單的交互模式被改變了，像是用鍵盤跟鼠標可以輔助我們，在系統中進行抽象與復雜的無限多任務（一對多）。
△ 你偏好用哪個微波爐加熱咖啡呢？Image credit:Bence Mózer
讓我們再來看看對長輩最重要的 Line 加好友功能，我們先不論這個功能在整個 APP 中被埋得多深，因為找到加好友的入口真的對長輩來說是看緣分～
在我引導長輩找出二維碼畫面的經驗中，發現他們都是用死記的方式，把下一步要按哪個鍵、在畫面的哪一個角落，記下來。但由于加好友功能并不是每天都會操作的，因此在學習上的效果，就像是高中時沒有把課文理解、吸收就硬死背下來一樣困難。
我們來看看「顯示行動條碼」在掃描二維碼畫面中，是否真的具有可以被點選的暗示。在掃描畫面背景單純的時候（如下圖情況 1），「顯示行動條碼」的 button 底色是有透明度的黑、扁平化后沒有陰影提供可以按的暗示，不過因為有大圓角的造型，勉強還是可以誘使人點點看；但一般情況下，掃面畫面背景不會那么理想的無其他干擾（如下圖情況2），button 原本的透明黑完全融入了后面的背景，這時候只剩下「顯示行動條碼」的文字，已經不具備可以被點選的提示。
△ 情況 2 中，顯示行動條碼的 button 看起來可以按嗎？
掃描畫面中的外框有一定的透明度，在可操作暗示（affordance）上已經不具有實體的特征，如果又放上有透明度的 button 在上面，讓人充滿不確定性，年長者無法將這樣的情況與現實生活中的經驗聯想在一起。
你知道同一個顏色，每個人看起來會不一樣嗎？而不同顏色在不同環境下，卻又能看起來像同一個顏色嗎？
不同意新擬物化設計的人中，有人主張運用顏色的引導用戶操作界面的色彩元素不能從界面設計中抽離。但事實上，不同年齡、性別，視覺錐細胞中的活躍程度不一樣。同一個顏色，不同人看，明度跟彩度會有差異。基于種種現實，由色彩的引導是好還是壞呢？
例子1：關于人類的視覺錐細胞
同一個顏色，不同人居然會看成不同顏色？
為什么阿嬤喜歡買大紅大紫的衣服？這個偏好除了受到個人喜好影響外，也關系到阿嬤視覺錐細胞的活躍度。老年人在上了年紀后，部分視覺錐細胞開始退化，因此對于藍色、綠色這類冷色系的顏色，老年人會開始接受不到這個區段的光帶來的刺激。因為視覺錐細胞對冷色系的刺激降低，導致阿嬤在菜市場逛街時會被偏暖色系的物品吸引。所以會買熱情系服飾不是阿嬤本人的意圖，而是老化的錐細胞在作祟。
例子2：關于學習觀察顏色這件事
不同顏色居然看成同一個顏色？
不同顏色卻看起來很像，有可能是光線造成，也有可能是使用者必須學習去觀察才知道的。日本的 JR 跟 Metro 系統，有著完整且細膩的視覺辨識系統。設計師理想中的情況是，我們將每條路線定義成不同顏色，可以讓使用者更容易學習辨識路線。
但實地走訪過東京的地下鐵跟 JR，常常會發現跟錯指示，才發現是潛意識辨認錯文字或是顏色。我自己遇到過的經驗是，在新宿站想要找都營大江戶線時，因為在改札口看到了同樣粉紅色的標志，原本已經要嗶卡進去，才發現那是京王新線的 IC 入口標志。
△ 新宿駛的改札口前，有兩個同為粉紅色的引導指標
所以說，高齡者或是天生視覺錐細胞有缺陷的人對于顏色無法清楚辨認外；大部分人可以借由學習來增強色彩辨識，除了可以對相似顏色進行更細節的判別外，也可以學著辨認不同光線（暖光、冷光）下造成的色彩差異。
但是，當我們在設計中，迫使用戶學習、習慣我們制定顏色的意義。可能會在新手 onboarding 時造成適應上的負擔，也有可能讓他們在使用別的系統造成錯亂。
在不同文化之下，對于色彩的觀察與運用也不一樣，舉個大家可能都有發現的例子，當你在不同城市旅游的時候，有沒有發現不同城市的優先座顏色不一樣？你能猜得出來，哪一個是臺北捷運上優先座的顏色嗎？
△ Image credit:wikipedia.org
當顏色在不同約定成俗下，有不一樣的意義，又剛好缺乏文字或圖像引導的時候，可能會讓使用者解讀成不同的意義。例如：紅色具有熱情、喜氣、帶來財運的意涵，但同時又具有危險的警示意義。
當設計師覺得紅色可以引起使用者的注意，而把 button 設計為紅色時，卻可能讓沒看清楚文字的用戶，認為按下這個 button 是危險的舉動。
△ Image credit:photoAC
新擬物化設計中假設了人在使用界面時，會運用與生俱來能判斷光影效果的能力。這是真的嗎？讓我們來做個小實驗：
為什么在臺北車大廳席地而坐的人，會選擇坐在黑色的棋盤格上呢？如果根據人類從大自然中所得到的可操作暗示來說，有陰影的地方可以提供人類休憩的功能，例如樹陰下的陰影處。
△ Image credit:中央社、wikipedia.org
如果這樣說得通的話，代表光亮的區域對人來說是可以行走、活動的地方；而陰影處則是休息與暫停處。
根據以上的推測，我們做個小實驗，把車站中的 2 個不同區域的地面上分別涂上白色與黑色，來讓受測者選出哪些區域可以暫停，哪些區域可以走動：
問題Ａ：假設你要在車站的大廳等朋友，你會選擇站在哪里等他呢？
假設：受測者會選 2，因黑色區域（影子）讓人覺得可以暫停、休憩。
結果：符合假設
1：白色柱子前的白地面 32.5％； 2：白色柱子前的黑地面 67.5％
問題Ｂ：哪一邊的樓梯是往上的方向呢？
假設：大家會選 1，因為黑色區域（影子）讓人覺得可以踩上去。
結果：符合假設
1：白色立面＋黑色地面 61.3％；2：黑色立面＋白色地面 37.8％
由實驗Ａ、Ｂ可得證，雖然實驗結果符合先前假設，大多數的受測者可從陰影判斷要走哪條路，但還是有不少（30%以上）的受測者不認同。所以在用使用光亮陰影的設計暗示時，還是會遇到使用者感知的不同的問題。
新擬物化設計中，將界面組件以類 3D 的方式呈現，使用戶在操作界面時必須去感知界面組件的遠近以判斷重要性，而在深度認知上有障礙的用戶此時就會受到挑戰。用戶可能會遇到，不知道哪個組件才是浮在最上面、最重要的；若界面中的組件有三種以上的陰影深淺，會讓用戶在判斷時要更花腦力判定物件在立體空間中的深淺。
新擬物化風格中的光影表現提供了使用者人類最原始的操作意圖：可操作暗示，是一個好的出發點，然而必須針對 APP 性質的不同而有所改良。在設計較走生活風格理念，而操作界面不復雜的 APP 時，非常適合用新擬物化風格來詮釋：例如電子書服務、音樂軟件；但在設計功能導向，且有大量信息化圖表的界面，例如：移動網銀，還是需要以扁平化的界面為主要信息架構，新擬物風格可能會是極少量界面元素中，拿來呈現生活中真實物的質感（例如：用戶的信用卡）、或是作為亮點（例如：優惠卡片）的呈現方式，此類型 APP 中最重要的卡片與圖表對于此種風格，一定要謹慎使用，必定三思三思再三思。
文章來源：優設 作者：Muse Chang