編輯導讀:每一年,用户的需求和技術的發展都有所不同,導致每年都會出現不一樣的新趨勢。而有些趨勢已經過時,有些則會激發設計師的靈感,創造更多視覺表現力強且具有可用性的產品。本文作者總結了八個可能會影響2021年的用户體驗設計趨勢,與你分享。
伴隨技術的發展與人們需求層次的變化,新趨勢年年都有,有的新趨勢由於用的人多了,使設計作品逐漸飽和,慢慢失去了新意,有的趨勢則會為企業不斷地帶來靈感,產生更多的“化學”反應。
今天,TCC 情報局總結了 8 條影響 2021 年的用户體驗設計趨勢,以及可能面臨的挑戰。只有充分利用這些趨勢來創造視覺表現力強且具有可用性的產品,我們設計的產品才可能被更多用户接受並喜愛。
一、在線辦公與遠程協作2020 年無疑對全世界來説都是面臨挑戰的一年,新冠疫情的爆發使大多數人都體驗了一把在家辦公的 “樂趣”(作為一名大學在職教師,我也終於實現了多年以來睜眼就能上班的願望)。騰訊會議、騰訊課堂、釘釘幾乎成了每一位 “網紅”,不對,是教師電腦裏的必備軟件。對於打工人來説,能夠在家與同事進行線上協同辦公,也成為了剛需。像 Teambition 這樣能夠實現多人協同辦公的工作學習套件,使人們不但做到工作進度的實時同步,還做到了在家也能 996(淚目)。
類似的辦公協作工具,在國外也廣受歡迎,Zoom 的股價在一年內上漲了 600%,Google 也加快更新了 Workspace 辦公效率套件。可見這些產品在未來將會取得進一步發展,創造出更為成熟的虛擬辦公生態系統。
遠程協作已經成為工作中的一部分
DivanRaj 設計的遠程會議應用
DmitriyKharaberyush 對遠程會議系統 Zoom 進行了 Redesign
在設計領域,設計工具的協同性也是設計師們比較關注的話題,在 TCC 翻譯情報局 11月發佈的《Figma vs Adobe XD:下一代設計工具,何必是 Sketch》一文中,也提到了 Sketch 的使用痛點便是協作的問題,尤其對於後疫情時代來説,人們意識到了在線協同辦公的重要性後,Figma 便以它驚豔的協同能力成功出圈,備受青睞,也成為了 Facebook 設計師們的御用工具。
適合 macOS Big Sur系統的全新 Sketch
二、虛擬現實的應用增強現實(AR)和虛擬現實(VR)技術早已悄悄進入我們的日常生活,AR 上妝、VR 看房不再新鮮。2020 年,由於新冠疫情的影響,虛擬現實重新進入大眾視野,成為人們關注的重點。
將 AR 技術融入線下實體書店
Facebook 對 VR 和 AR 也越來越重視,公司旗下也會推出 VR 旅行、三維藝術品創作、AR 室內設計和博物館等應用程序,還有用於教育的 VR 遊戲等。
博物館指南程序結合 AR 技術
尤其對於教育領域來説,虛擬現實技術所具備的仿真性、開放性和安全性的特點,不僅可以使學生在學習過程中身臨其境,還能打破時空限制進行集中教學,同時能模擬各種情景,不必擔心有安全隱患。
直播課程 UnacademyPlus 提出應用 AR 技術的概念版
過去,人們一直認為虛擬現實僅是一項娛樂技術,比如手遊 “陰陽師” 的 AR 召喚,使無數人想起當非酋的日子;大多數人首次接觸 VR 技術,也是在商場裏偶然嘗試了類似 VR 大擺錘這樣的遊戲,然後被嚇得連連尖叫(不是我)。如今,這項技術在各個領域的廣泛應用才是我們要討論的話題,其在醫療、教育和藝術領域實現的跨越式發展,成為必然趨勢。
陰陽師 AR 召喚陣圖
相信在未來,將 AR 和 VR 技術融入更多的數字產品和服務,也會給設計師們的創作帶來無限可能。
三、智能化與生成式設計在現代工具和技術的幫助下,設計師的工作流程得到了大大的簡化,智能化與生成式設計也成為一大趨勢。各大軟件開發公司也爭相推出了一系列智能化工具組,以幫助打工人們更快速的完成工作任務(也有可能是在跟打工人們搶飯碗)。這些智能化工具組可以分析大量現有數據,找出其特性,然後根據所提供的數據生產新的特性。這些工具可以幫助我們:自動生成多種佈局,選擇視覺風格,生成演示模型、優化設計細節。
設計團隊關注效率,使用組件化的協作方式
Sketch 中添加了顏色變量和組件視圖的新功能,使保持顏色一致性和使用組件變得更加容易。Canva 發佈的扁平風人像組件插圖庫,分為彩色色塊和單色描邊兩個系列,設計師的自由度很高,可以隨意拼接、改色,搭配出各種你想要的人物和場景。
值得思考的是,在技術越來越成熟和智能的現代社會,如何平衡所謂人工和智能呢?生成式設計不僅僅在幫助我們更高效的工作,另一方面,在未來也可能奪走本屬於我們的工作,畢竟 “鹿班” 的出現一度使 “美工們” 陷入恐慌。但是作為未來的設計師,我們必須相信,機器可以通過數據來相互學習,但它們還遠遠不能獨立思考,不能在美學、情感化等問題上與人類競爭,人類所需處理的問題,遠比機器要複雜。
鹿班智能設計平台
四、無接觸式交互疫情期間,為了避免用手觸碰電梯按鍵,我們看到很多電梯都放置了紙巾、牙籤等物品,哪怕如今國內病毒有所控制,我們也已經習慣用鑰匙來戳一戳電梯按鍵。此後,語音聲控電梯在武漢防疫戰線調試運行。
眾所周知,科幻超英電影中,總會為我們展現未來世界的面貌,語音交互技術在此類電影中早已不是什麼先進技術。早在 2014 年《超凡蜘蛛俠2》上映之時,電影中就有個值得注意的小細節,女主角格温(私心:超英系列最愛女主)所在的科技公司奧斯本總部的電梯,就可以通過語音交互來説出自己要去的樓層,同時還可以和漂亮的人工智能小姐姐對話。
電影《超凡蜘蛛俠2》奧斯本科技公司總部電梯內場景
AI 驅動的智能語音助手
除了語音交互,你們的身邊可能早早的就出現過體感交互的例子。例如微軟為 X-box 360 推出的外設周邊 Kinect,就採用了體感交互技術,操作者可以通過自己的肢體去控制系統,實現與遊戲的互動。你只需站在大屏幕前,揮動手臂,即可完成一系列翻閲、確認等操作,回想一下,你有沒有在商場裏見過對着屏幕過瘋狂切水果的熊孩子,體感交互技術正在慢慢跟上他們靈活的速度(年輕人不講武德)。去年 8 月,蘋果獲得了一項專利,該專利顯示或許有一天我們可以通過空中手勢來控制 AirPods Pro。
X-box 360 推出的外設周邊 Kinect
體感交互助力 Applewatch,未來可能在錶帶中也植入肌電傳感器
硬件設備結合應用程序進行運動數據記錄
綜上,其實無論是語音交互還是體感交互,都不是新興的科技了,畢竟我們和 Siri 的罵戰都持續了好多年。但是相信到了 2021 年,伴隨便捷、安全、無接觸等後疫情時代的需求,無接觸式交互會得到更多廣泛的應用。
五、3D 和沉浸式體驗隨着 C4D 的大熱,3D 設計近幾年一直活躍在大眾視野中,目前大多應用在營銷活動、數據可視化、遊戲等需要表達空間感和氛圍感的項目裏,還沒有大規模的應用在日常的線上產品中。
使用 3D 風格設計的遊戲網站
Slava Kornilov 設計的車載導航系統
當 2020 年蘋果全球開發者大會發布了 macOS Big Sur 系統後,趨勢又產生了新的改變,Big Sur 中應用了大量新擬態風格的 3D 效果圖標,TCC情報局11月發表的《蘋果 macOS Big Sur 系統對於新擬態風格的探索》一文中對此做了詳細的分析。這一波操作必然是引起了大量爭議,期間湧現出一批對這套圖標進行優化的作品,擬物的熱潮就這麼被重新點燃,3D 技巧細膩而自然的表現方式必然會引起大量設計師的關注。
3D 風格的蘋果系統圖標
FluARFluent 儀表盤
3D 空間展示數據
伴隨着 VR 和 AR 技術的發展,2021 年 3D 風格會更加流行,無論是從操作性,還是視覺效果的角度,3D 風格都可以產生極大的突破。得物 APP 等線上商城紛紛開通了 AR 虛擬試鞋的功能,幫助用户在足不出户的情況下體驗 “真實上腳” 的效果。
AR 試鞋的功能已經普及
基於 AR 導航的線上商店
六、趣味動畫精彩的動畫故事會吸引所有年齡段的用户,畢竟誰都年輕過,都喜歡充滿奇幻元素和大膽想象的畫面。在界面設計中加入動畫元素,使簡約的界面和有趣的動畫相結合,不僅能吸引用户,還能增添互動時的新奇感。
加載動畫可以充分發揮創意
奇特好玩的界面動效和微交互已經不算 2021年的新趨勢了,但趣味動畫的其他應用方式仍值得我們探討。畢竟任何動態演示都能比靜態圖像或純文本更能清晰有效的傳達你的品牌故事,並讓人輕鬆的看進去(尤其你可能是個“閲讀障礙患者”)。
微軟的設計團隊常常用動畫技術製作宣傳片來展示公司的新產品,2020 年較為火爆的是關於 Fluent Design 的系列動畫,下面這條經典作品傳達瞭如何將 Fluent Design 引入到 Office 移動端軟件中,且共享相同設計元素。動畫演示巧妙的展現了新圖標元素的構成,輕快的配樂配合圖標們可愛的變形,可以單片循環一整天。
Fluent Design 宣傳片的劇照,採用3D 動畫的元素
設計中的動畫應該是有目的和有意義的,不僅要賞心悦目,也要能夠解決問題或傳達概念。動畫最重要的目的是解釋、簡化和加速交互過程,讓用户不經意間嘴角上揚。
2021 年,趣味的動畫不僅僅是一種純粹的裝飾和娛樂,其在設計中的廣泛應用將持續成為設計師們熱議的話題,好玩的動畫就在那裏,看你怎麼用了。
七、充滿科技感的創新交互有一種工程量很大的設計趨勢,其頁面佈局和交互操作都特別複雜,使用複雜的動畫、渲染、插畫,用創新的交互吸引用户進行互動,鼓勵用户不斷進行探索。這種風格常常被用在技術型或創意型產品的網站上,可以表現出科技感和獨特感,體現出公司或團隊的能力。
Nathan Riley 設計的概念網站未來反思
BerezhnoyEugene 設計的數據星球
Senko Holographic 設計的網站首頁,鼠標移動可與頁面進行交互
採用這種趨勢設計的網站並沒有統一的風格,而是各有各的特色,每一個的交互形式都極其創新,因為製作成本較高,通常是針對品牌定製化,下面將推薦幾個優質的網站,小夥伴們可以自己去試一試。
設計師 Louis Ansa 個人作品網站(https://louisansa.com)
注重設計與科技結合的團隊 Letters(https://www.letters-inc.jp/)
科技公司官網 Farm(https://mav.farm/)
體驗後你會發現這類網站的視覺效果大多很驚人,交互方式充滿想象力。為了實現效果,團隊會產出高質量高標準的設計、投入大量的研發成本。當然,成也蕭何,敗也蕭何,特別的交互使頁面邏輯與我們常用的網站大相徑庭,吸引眼球的視覺使頁面繁瑣花哨,會導致信息難以順利傳遞至用户。這違背了可用性原則和無障礙設計理念,如果想要使用這樣的方式設計產品,一定要在創新和可用性中找到平衡點。
八、輕量化體驗在這個新時代,社會發展十分迅速,整體節奏都很快,互聯網產品的操作效率需要隨之加快,用户體驗的每一步流程都要仔細斟酌,是否還能再精簡一些、再快捷一些,我們的目的是幫助用户更高效的完成目標,因此輕量化體驗必然是永恆的課題。最明顯的例子就是登陸功能的簡化,從早期的賬號密碼,到後來的驗證碼登陸、第三方賬號登陸、人臉識別登陸,用户已經不需要記住密碼,也不需要一步一步的輸入信息,一切都變得更加快速、更注重實用性。試想會不會有一天,人們一出生就得到一個永久賬號呢。
Surja SenDasRaj 設計的極簡風APP
不光是交互操作,界面的視覺風格也正朝着輕量化設計的方向前進,如果你一直在留意 Dribbble 熱門作品,會發現大部分都具備簡潔清爽的特點。極簡的配色和核心功能的突出,可以幫助用户聚焦於重點信息;同時,我們可以結合信息層級的整合來降低用户的外在認知負荷,進一步減少用户的學習成本,使用户更容易集中注意力;不僅如此,我們還可以適當為核心元素添加一些微動效,使界面更具有温度感的傳遞操作反饋。
Akshay Devazya 設計的求職 APP,注重頁面 Z 軸的空間感
DmitriyKazarov設計的極簡風官網
ChoirulSyafril設計的雲存儲後台界面
可愛的微動效交互
隨着科技的飛速發展,輕量化可能是未來各個行業產品設計的趨勢。以遊戲行業為例,從早期風靡的單機遊戲到現在隨時可以面對面開黑的手遊,主流玩家漸漸將自己的遊戲陣地轉移到手機上,無論是畫面精緻度還是遊戲流暢感,手遊都可以提供優質的體驗,今年火遍全球的遊戲英雄聯盟也發佈了手遊版本。還有一個輕量化的案例,就是我們的小程序,微信、支付寶、百度紛紛發佈了自家的小程序,我們已經可以在一個 APP 裏使用多家公司的產品功能了。
設計趨勢是循環的。用户體驗設計的新趨勢每年都會推陳出新,但也有很多趨勢,幾年後又會捲土重來,這也是為什麼復古總會成為一種潮流。設計是手段,不是目的。比起緊隨潮流,更重要的是理解趨勢背後的價值和意義, 創造有價值的設計作品,趨勢就會成為你的那陣東風。
作者:李澤慧,微信公眾號:三分設
本文由 @三分設 原創發佈於人人都是產品經理,未經許可,禁止轉載。
題圖來自 Pexels,基於 CC0 協議