研發與設計專欄
2021 設計雜談 過去、現在、未來
突破的方法便是試圖在現有之手法上另求創意與融合。本文除了介紹目前依然熱門的設計風格外,也包含舊元素上的創新融合,及探討未來的發展性等面向。

CURRENT TRENDS 熱門設計風格

Glassmorphism- 玻璃擬態效果

透過玻璃外觀的半透明元素在介面上提供了分明的層次結構,或搭配陰影模仿深度來幫助使用者區分前後的內容,抑或是在視覺美感上創作各式各樣吸睛的排版。毛玻璃的應用已在這幾年發光發熱,仍可見許多設計師們繼續發揮創意,至今除了Dribbble上,也看到了此效果在許多產品上的實踐。

Darkmode- 深色模式

近年深色模式的崛起仍然熱度不減,除了優雅、時尚、現代的外觀優勢,隨著我們在智慧手機與電腦上花費更多時間,深色模式在閱讀體驗上發揮了至關重要的作用,例如可讀性較佳、節省OLED或AMOLED的螢幕電池電量、減少夜間閱讀的眼睛疲勞、減少螢幕眩光、藍光……等,都是可讓使用者長時間注視螢幕下的實用選擇。

Storytelling withs croll-triggered animation- 捲動式敘事

作為UI中重要的元素,排版本身可建立強大的視覺層次結構。故事型的文案則可透過往下捲動的過程,一步步引導使用者身歷其境一步步深入了解產品,強烈的互動為使用者帶來更沈浸式的體驗,讓他們覺得自己是故事的一部分。美中不足的則是較無法讓使用者簡單的瀏覽網頁內容。

Multiple material- 多媒材融合

複合媒材是許多藝術型態的常見手法,但在UI上則是近幾年才開始風行。以往照片歸照

片風格,插畫歸插畫,除了兩者的融合,也開始更多創意注入,如多了紋理感的材質貼皮效果、抽象的圖、照片內容、3D、甚至加入動態視覺,把各種看似彼此毫無關係的風格,巧妙地融合在一起,創造獨一無二的綜效。

6 1

OLD & NEW 舊元素新應用

如果將在過去極其流行的扁平與擬物化設計結合,會變成面貌呢?Neumorphism-新擬物設計就是一個成功的例子,它是一種集結了背景、形狀、漸變、陰影等多方講究的視覺樣式。呈現的界面優雅舒適,因此受到Dribbble許多設計師的歡迎,但在大多數UX專家眼中恰恰相反,新擬物設計與基本的實用性原則並不相容,它的直觀性與可讀性較差,所以並沒有很多真正實踐此風格的產品,但就設計而言,它是優美和未來主義的。

而同樣熱門的設計手法—「漸層色」也是近來力求突破的範例,以往的漸層色多半只用2~3種顏色來搭配單純的線性過渡,流行至今已過於泛用且色彩重複性太高。

如今,越來越多的設計師,開始嘗試使用多達10種不同顏色來設計漸層色,利用不規則的漸變方式創作出更獨特的背景,或搭配模糊效果營造深度、利用光影打造更豐富的情境…等。無庸置疑的是,未來的漸層色彩將開始走向更具個性化的設計方式。

6 2

FUTURE 未來發展性

科技日新月異,考量到目前的全球形勢,虛擬通訊工具不斷突破,從設計的角度來看,這可能是會持續深入探索的領域。尤其在複雜的通訊產品下製造了不少改善的機會,例如在更簡潔、輕便的版本中,如何能夠避免網速限制、更流暢的多人會議體驗、突破傳統無聊的視訊聊天界面、隱私功能的完善,甚至音效的設計等等,都還存有許多進步的空間,當然AI與Robot也是發展重點之一。

而說到AI,也許常有人懷疑是否會取代設計師的工作,實際上似乎不需要過度擔心,UI領域目前還是有足夠的創意能量等著設計師開發。反之,AI的發展將有益於減輕設計師的工作,AI的數據收集能力,能夠讓設計師專注於更多個性化的需求、延伸豐富的應用,替不同客群量身打造產品。尤其在表單、步驟等枯燥冗長或重複性高的的流程作業,透過AI人工智慧的學習,產品將根據使用者的行為蒐集、分析更多訊息,有助於創造更好的個性化使用者體驗,從而達到更高的轉換率。

除了AI,科技技術方面也不得不提到AR與VR!相較於VR,AR與UI更息息相關,一直也是未來設計趨勢之一,網頁設計範疇遲早會跳出框架思考,不再僅限於螢幕上的UI;相反的,AR更強調的是與真實世界環境的互動。Google跟Apple皆已推出自家的AR開發平台ARCore和AEKit,身為設計師,即將要做好準備學習新工具。

在未來幾年,創作擴增實境介面和3D元素的能力或許會成為非常有用的技能,這也是為什麼3D相關的創作層出不窮,在未來更是大放異彩的時機。在這硬體快速改進與軟體優化的時代,即使是低端設備也足以處理複雜的視覺效果,3D的實現門檻變得越來越低。同時,3D也將從圖形、插畫從而延伸到立體空間中,未來在設計網頁時可能不再局限於X軸和Y軸,創建傾斜、旋轉、畫面深度乃至於3D元件的互動……等,都是可能發展的新趨勢,也為AR或VR的設計打開大門。

綜上所述,仍要強調一個永遠不會過時的UI/UX設計觀念:批判思維與發展視角。某些設計手法之所以成為趨勢,必有其邏輯與意涵,是一種手段,終究不是目的,背後一定有隱藏的東西,設計是一種視覺語言,可以用它來傳達產品的價值,這也是我們最常需要思考的。今後,我們會持續追蹤相關趨勢,轉化為豐富的資源,為產品注入更強大的創新能量及專業的設計服務。

 

6 3


文章參考資料來源:

https://medium.com/fireart-studio/10-leading-ui-ux-design-trends-to-dominate-in-2021-351f82635a26
https://99designs.com/blog/trends/ux-design-trends/
https://www.lollypop.design/blog/2020/december/ui-trends-2021/
https://www.zenesys.com/blog/top-10-ui-ux-design-trends-to-watch-in-2021
https://www.codica.com/blog/12-leading-ui-ux-design-trends-to-dominate-in-2020-2021/
https://uxplanet.org/2021-ui-ux-design-trends-and-how-to-make-them-work-for-you-49d8a04fb09b
https://trydesignlab.com/blog/2021-ux-ui-design-trends/
https://userguiding.com/blog/ux-ui-trends/
圖片來源:https://dribbble.com/