fbpx
6個你應該知道的ux-ui-設計趨勢

6個你應該知道的UX/UI 設計趨勢 

6個你應該知道的UX/UI 設計趨勢 

設計風格日新月異,同時是一個循環,十年前的設計風格,可能十年後又成另一個熱潮。UX及UI當然也屬於設計的一種,它們都會有不同的風格,每年也會有不同趨勢。而UX/UI的設計風格比平面設計多一樣決定性的因素,就是科技的進步會令我們設計的領域擴展,增加了更多可能性。以下便是一些近年的UX/UI設計趨勢。 

玻璃擬態Glassmorphism  

基於簡約的大方向上,玻璃擬態的設計風格利用背景模糊的磨砂玻璃效果製造透明度,在視覺上出現漂浮在空間中的感覺,藉此增強屏幕中的層次感。如果你正在用iPhone,不妨看看屏幕內最下的4個程式,它們都被一個圓角的半透明框包著,代表它們是固定的程式,與其他於上面的程式有所不同。在設計上,不少玻璃擬態的設計都配合鮮豔色彩,如下圖中iPhone的展示圖,你會看到不同的漸層有不同的漸變色彩,層次分明,就像虛擬的玻璃一樣,使用者可以看清哪層是最上層正在使用,又不會因太多層次而感到複雜。 

(Source: https://apple.com) 

語音用家介面 Voice User Interface 

其實這並不是新技術,iPhone一直都有VoiceOver的功能,讓有視障的用家能利用聲音控制電話,或Siri都是一個以聲控為主的功能。而於UX的設計上,近年設計師都比之前更著重內容與數據合成的研究,希望創建出語音友善的界面,改善用家的體驗。現在你想打一大篇文章,都不再需要逐個字打,只需對著電話或電腦說出內容,便可化為文字出現於屏幕中。 

3D  圖案/動畫 

近年來,3D 圖形與介界面的集成呈爆炸式增長。 以前創作 3D 動畫需要比其他動畫效果更多的時間技巧和協作,但以現今的軟件,製作時間已大大減少。而3D 動畫的好處是不少, 3D 動畫比 2D 圖形更加逼真,從而提供更具吸引力和互動性的用戶體驗。例如下圖中卡通化的3D圖案,比一將普通的2D圖片來得更有趣,令網頁增添活力。 它們不僅透過更逼真的照片來提高網頁或應用程序的質素,而且也利用展示動態來突顯品牌個性,增強使用者的記憶點。

Source: https://dribbble.com/shots/6596459-Web-Illustrations) 

懸停效果 Hover Effects 

相信有製作過網頁的各位都有見過,或已在網頁中使用。互動效果能改善用戶使用體驗,為網頁或程式增加活力。最簡單的應用如當滑鼠指到某一部分時那部分會變色,已可達成向用戶提供有關已完成操作的即時和相關的反饋效果。或者可以進入這個網頁作參考 https://jyou.media/ ,這個日本的網站用的不是複雜的技術,但當你一路向下瀏覽,會發現更多微小的設定,令你覺得這個網頁像是有生命一樣跟你在互動。 

大膽的字體編排 

現今人類正趨向利用圖片來說話,特別是於網絡上文字的受歡迎程度比不上圖片,但圖片不能表達每一個訊息的全部,UI設計師都趨向利用大膽的文字編排,配合碟同配色來表達最重要的訊息。我們不妨看看https://www.awwwards.com/,它不斷與十家分享出色的網站,當中你不難看到不少網站的首頁都利用搶眼的大型字體去吸引注意。 

Web XR (Extended Reality) 

AR 與VR都是近十年科技界的大熱題目,現在已進化到XR了,WebXR 將網絡上的 AR 和 VR 結合在一起,使它們更加方便和廣泛應用。Google 都已經開設了平台分享一些技術的可能性。現在對於XR的應用可能較易理解的是Pokemon的手機程式遊戲,或是你在電視看足球賽開賽時一些仿似出現在草地上的比數。但這是一項將會掀起熱潮並廣泛應用的技術,十家要密切留意。 

除了留意最流行的趨勢外,還有一些已由最新趨勢變為必需的設計,例如對應iPhone黑暗模式的程式功能,以及響應式設計的網頁,我想現在如你在電話瀏覽網站時,如果那網頁不是響應式設計,你應該會立即離開吧。 

於疫情下大眾對網頁及手機程式的需求更大,我們的UX/UI需要緊貼最新趨勢之餘,亦要有自己的風格。了解過以上的流行設計後,下一步便是思考哪些元素能為自己網頁/品牌增加價值,及如何應用,不要為趕潮流而把自己的網頁/程式改為一個沒有品牌識別度的接觸點。 

Tech on Fire 的 UI UX Bootcamp 可以令你快速掌握UI UX 設計的專業技能。在課程中會學習到成為UI UX 設計師的重要技巧:繪圖及UI UX 思考方法。導師會教授學員如何利用Figma軟件,把創新的數碼產品概念有系統地向不同的持份者展現出來。 同時,學員也可會學習到以 UI UX 為本的思考方法,加速產目開發進度。

你的意見

Your email address will not be published. Required fields are marked *