2021-1-11 周周
伴隨技術(shù)的發(fā)展與人們需求層次的變化，新趨勢年年都有，有的新趨勢由于用的人多了，使設(shè)計(jì)作品逐漸飽和，慢慢失去了新意，有的趨勢則會為企業(yè)不斷地帶來靈感，產(chǎn)生更多的“化學(xué)”反應(yīng)。
今天，TCC 情報(bào)局從這篇國外大神的趨勢里總結(jié)了 8 條影響 2021 年的用戶體驗(yàn)設(shè)計(jì)趨勢，以及可能面臨的挑戰(zhàn)。只有充分利用這些趨勢來創(chuàng)造視覺表現(xiàn)力強(qiáng)且具有可用性的產(chǎn)品，我們設(shè)計(jì)的產(chǎn)品才可能被更多用戶接受并喜愛。
2020 年無疑對全世界來說都是面臨挑戰(zhàn)的一年，新冠疫情的爆發(fā)使大多數(shù)人都體驗(yàn)了一把在家辦公的 “樂趣”（作為一名大學(xué)在職教師，我也終于實(shí)現(xiàn)了多年以來睜眼就能上班的愿望）。騰訊會議、騰訊課堂、釘釘幾乎成了每一位 “網(wǎng)紅”，不對，是教師電腦里的必備軟件。對于打工人來說，能夠在家與同事進(jìn)行線上協(xié)同辦公，也成為了剛需。像 Teambition 這樣能夠?qū)崿F(xiàn)多人協(xié)同辦公的工作學(xué)習(xí)套件，使人們不但做到工作進(jìn)度的實(shí)時(shí)同步，還做到了在家也能 996（淚目）。
△ 基于虛擬現(xiàn)實(shí) VR 和增強(qiáng)現(xiàn)實(shí) AR 的會議軟件 Spatial
類似的辦公協(xié)作工具，在國外也廣受歡迎，Zoom 的股價(jià)在一年內(nèi)上漲了 600%，Google 也加快更新了 Workspace 辦公效率套件?？梢娺@些產(chǎn)品在未來將會取得進(jìn)一步發(fā)展，創(chuàng)造出更為成熟的虛擬辦公生態(tài)系統(tǒng)。
△ 遠(yuǎn)程協(xié)作已經(jīng)成為工作中的一部分
△ Divan Raj 設(shè)計(jì)的遠(yuǎn)程會議應(yīng)用
△ Dmitriy Kharaberyush 對遠(yuǎn)程會議系統(tǒng) Zoom 進(jìn)行了 Redesign
在設(shè)計(jì)領(lǐng)域，設(shè)計(jì)工具的協(xié)同性也是設(shè)計(jì)師們比較關(guān)注的話題，Sketch 的使用痛點(diǎn)便是協(xié)作的問題，尤其對于后疫情時(shí)代來說，人們意識到了在線協(xié)同辦公的重要性后，F(xiàn)igma 便以它驚艷的協(xié)同能力成功出圈，備受青睞，也成為了 Facebook 設(shè)計(jì)師們的御用工具。
△ 適合 macOS Big Sur 系統(tǒng)的全新 Sketch
增強(qiáng)現(xiàn)實(shí)（AR）和虛擬現(xiàn)實(shí)（VR）技術(shù)早已悄悄進(jìn)入我們的日常生活，AR 上妝、VR 看房不再新鮮。2020 年，由于新冠疫情的影響，虛擬現(xiàn)實(shí)重新進(jìn)入大眾視野，成為人們關(guān)注的重點(diǎn)。
△ 將 AR 技術(shù)融入線下實(shí)體書店
Facebook 對 VR 和 AR 也越來越重視，公司旗下也會推出 VR 旅行、三維藝術(shù)品創(chuàng)作、AR 室內(nèi)設(shè)計(jì)和博物館等應(yīng)用程序，還有用于教育的 VR 游戲等。
△ 博物館指南程序結(jié)合 AR 技術(shù)
尤其對于教育領(lǐng)域來說，虛擬現(xiàn)實(shí)技術(shù)所具備的仿真性、開放性和安全性的特點(diǎn)，不僅可以使學(xué)生在學(xué)習(xí)過程中身臨其境，還能打破時(shí)空限制進(jìn)行集中教學(xué)，同時(shí)能模擬各種情景，不必?fù)?dān)心有安全隱患。
△ 直播課程 Unacademy Plus 提出應(yīng)用 AR 技術(shù)的概念版
過去，人們一直認(rèn)為虛擬現(xiàn)實(shí)僅是一項(xiàng)娛樂技術(shù)，比如手游 “陰陽師” 的 AR 召喚，使無數(shù)人想起當(dāng)非酋的日子；大多數(shù)人首次接觸 VR 技術(shù)，也是在商場里偶然嘗試了類似 VR 大擺錘這樣的游戲，然后被嚇得連連尖叫（不是我）。如今，這項(xiàng)技術(shù)在各個(gè)領(lǐng)域的廣泛應(yīng)用才是我們要討論的話題，其在醫(yī)療、教育和藝術(shù)領(lǐng)域?qū)崿F(xiàn)的跨越式發(fā)展，成為必然趨勢。
△ 陰陽師 AR 召喚陣圖
相信在未來，將 AR 和 VR 技術(shù)融入更多的數(shù)字產(chǎn)品和服務(wù)，也會給設(shè)計(jì)師們的創(chuàng)作帶來無限可能。
在現(xiàn)代工具和技術(shù)的幫助下，設(shè)計(jì)師的工作流程得到了大大的簡化，智能化與生成式設(shè)計(jì)也成為一大趨勢。各大軟件開發(fā)公司也爭相推出了一系列智能化工具組，以幫助打工人們更快速的完成工作任務(wù)（也有可能是在跟打工人們搶飯碗）。這些智能化工具組可以分析大量現(xiàn)有數(shù)據(jù)，找出其特性，然后根據(jù)所提供的數(shù)據(jù)生產(chǎn)新的特性。這些工具可以幫助我們：自動生成多種布局，選擇視覺風(fēng)格，生成演示模型、優(yōu)化設(shè)計(jì)細(xì)節(jié)。
△ 設(shè)計(jì)團(tuán)隊(duì)關(guān)注效率，使用組件化的協(xié)作方式
Sketch 中添加了顏色變量和組件視圖的新功能，使保持顏色一致性和使用組件變得更加容易。
值得思考的是，在技術(shù)越來越成熟和智能的現(xiàn)代社會，如何平衡所謂人工和智能呢？生成式設(shè)計(jì)不僅僅在幫助我們更的工作，另一方面，在未來也可能奪走本屬于我們的工作，畢竟 “鹿班” 的出現(xiàn)一度使 “美工們” 陷入恐慌。但是作為未來的設(shè)計(jì)師，我們必須相信，機(jī)器可以通過數(shù)據(jù)來相互學(xué)習(xí)，但它們還遠(yuǎn)遠(yuǎn)不能獨(dú)立思考，不能在美學(xué)、情感化等問題上與人類競爭，人類所需處理的問題，遠(yuǎn)比機(jī)器要復(fù)雜。
△ 鹿班智能設(shè)計(jì)平臺
疫情期間，為了避免用手觸碰電梯按鍵，我們看到很多電梯都放置了紙巾、牙簽等物品，哪怕如今國內(nèi)病毒有所控制，我們也已經(jīng)習(xí)慣用鑰匙來戳一戳電梯按鍵。此后，語音聲控電梯在武漢防疫戰(zhàn)線調(diào)試運(yùn)行。
眾所周知，科幻超英電影中，總會為我們展現(xiàn)未來世界的面貌，語音交互技術(shù)在此類電影中早已不是什么先進(jìn)技術(shù)。早在 2014 年《超凡蜘蛛俠 2》上映之時(shí)，電影中就有個(gè)值得注意的小細(xì)節(jié)，女主角格溫（私心：超英系列最愛女主）所在的科技公司奧斯本總部的電梯，就可以通過語音交互來說出自己要去的樓層，同時(shí)還可以和漂亮的人工智能小姐姐對話。
△ 電影《超凡蜘蛛俠 2》奧斯本科技公司總部電梯內(nèi)場景
△ AI 驅(qū)動的智能語音助手
除了語音交互，你們的身邊可能早早的就出現(xiàn)過體感交互的例子。例如微軟為 X-box 360 推出的外設(shè)周邊 Kinect，就采用了體感交互技術(shù)，操作者可以通過自己的肢體去控制系統(tǒng)，實(shí)現(xiàn)與游戲的互動。你只需站在大屏幕前，揮動手臂，即可完成一系列翻閱、確認(rèn)等操作，回想一下，你有沒有在商場里見過對著屏幕過瘋狂切水果的熊孩子，體感交互技術(shù)正在慢慢跟上他們靈活的速度（年輕人不講武德）。去年 8 月，蘋果獲得了一項(xiàng)專利，該專利顯示或許有一天我們可以通過空中手勢來控制 AirPods Pro。
△ X-box 360 推出的外設(shè)周邊 Kinect
△ 體感交互助力 Apple watch，未來可能在表帶中也植入肌電傳感器
△ 硬件設(shè)備結(jié)合應(yīng)用程序進(jìn)行運(yùn)動數(shù)據(jù)記錄
綜上，其實(shí)無論是語音交互還是體感交互，都不是新興的科技了，畢竟我們和 Siri 的罵戰(zhàn)都持續(xù)了好多年。但是相信到了 2021 年，伴隨便捷、安全、無接觸等后疫情時(shí)代的需求，無接觸式交互會得到更多廣泛的應(yīng)用。
隨著 C4D 的大熱，3D 設(shè)計(jì)近幾年一直活躍在大眾視野中，目前大多應(yīng)用在營銷活動、數(shù)據(jù)可視化、游戲等需要表達(dá)空間感和氛圍感的項(xiàng)目里，還沒有大規(guī)模的應(yīng)用在日常的線上產(chǎn)品中。
△ 使用 3D 風(fēng)格設(shè)計(jì)的游戲網(wǎng)站
△ Slava Kornilov 設(shè)計(jì)的車載導(dǎo)航系統(tǒng)
當(dāng) 2020 年蘋果全球開發(fā)者大會發(fā)布了 macOS Big Sur 系統(tǒng)后，趨勢又產(chǎn)生了新的改變，Big Sur 中應(yīng)用了大量新擬態(tài)風(fēng)格的 3D 效果圖標(biāo)。這一波操作必然是引起了大量爭議，期間涌現(xiàn)出一批對這套圖標(biāo)進(jìn)行優(yōu)化的作品，擬物的熱潮就這么被重新點(diǎn)燃，3D 技巧細(xì)膩而自然的表現(xiàn)方式必然會引起大量設(shè)計(jì)師的關(guān)注。
△ 3D 風(fēng)格的蘋果系統(tǒng)圖標(biāo)
△ Flu AR Fluent 儀表盤
△ 3D 空間展示數(shù)據(jù)
伴隨著 VR 和 AR 技術(shù)的發(fā)展，2021 年 3D 風(fēng)格會更加流行，無論是從操作性，還是視覺效果的角度，3D 風(fēng)格都可以產(chǎn)生極大的突破。得物 APP 等線上商城紛紛開通了 AR 虛擬試鞋的功能，幫助用戶在足不出戶的情況下體驗(yàn) “真實(shí)上腳” 的效果。
△ AR 試鞋的功能已經(jīng)普及
△ 基于 AR 導(dǎo)航的線上商店
精彩的動畫故事會吸引所有年齡段的用戶，畢竟誰都年輕過，都喜歡充滿奇幻元素和大膽想象的畫面。在界面設(shè)計(jì)中加入動畫元素，使簡約的界面和有趣的動畫相結(jié)合，不僅能吸引用戶，還能增添互動時(shí)的新奇感。
△ 加載動畫可以充分發(fā)揮創(chuàng)意
奇特好玩的界面動效和微交互已經(jīng)不算 2021 年的新趨勢了，但趣味動畫的其他應(yīng)用方式仍值得我們探討。畢竟任何動態(tài)演示都能比靜態(tài)圖像或純文本更能清晰有效的傳達(dá)你的品牌故事，并讓人輕松的看進(jìn)去（尤其你可能是個(gè)“閱讀障礙患者”）。
微軟的設(shè)計(jì)團(tuán)隊(duì)常常用動畫技術(shù)制作宣傳片來展示公司的新產(chǎn)品，2020 年較為火爆的是關(guān)于 Fluent Design 的系列動畫，下面這條經(jīng)典作品傳達(dá)了如何將 Fluent Design 引入到 Office 移動端軟件中，且共享相同設(shè)計(jì)元素。動畫演示巧妙的展現(xiàn)了新圖標(biāo)元素的構(gòu)成，輕快的配樂配合圖標(biāo)們可愛的變形，可以單片循環(huán)一整天。
△ 將 Fluent Design 應(yīng)用于移動端的動畫宣傳片
△ Fluent Design 宣傳片的劇照，采用 3D 動畫的元素
設(shè)計(jì)中的動畫應(yīng)該是有目的和有意義的，不僅要賞心悅目，也要能夠解決問題或傳達(dá)概念。動畫最重要的目的是解釋、簡化和加速交互過程，讓用戶不經(jīng)意間嘴角上揚(yáng)。
2021 年，趣味的動畫不僅僅是一種純粹的裝飾和娛樂，其在設(shè)計(jì)中的廣泛應(yīng)用將持續(xù)成為設(shè)計(jì)師們熱議的話題，好玩的動畫就在那里，看你怎么用了。
有一種工程量很大的設(shè)計(jì)趨勢，其頁面布局和交互操作都特別復(fù)雜，使用復(fù)雜的動畫、渲染、插畫，用創(chuàng)新的交互吸引用戶進(jìn)行互動，鼓勵(lì)用戶不斷進(jìn)行探索。這種風(fēng)格常常被用在技術(shù)型或創(chuàng)意型產(chǎn)品的網(wǎng)站上，可以表現(xiàn)出科技感和獨(dú)特感，體現(xiàn)出公司或團(tuán)隊(duì)的能力。
△ Nathan Riley 設(shè)計(jì)的概念網(wǎng)站未來反思
△ Berezhnoy Eugene 設(shè)計(jì)的數(shù)據(jù)星球
△ Senko Holographic 設(shè)計(jì)的網(wǎng)站首頁，鼠標(biāo)移動可與頁面進(jìn)行交互
采用這種趨勢設(shè)計(jì)的網(wǎng)站并沒有統(tǒng)一的風(fēng)格，而是各有各的特色，每一個(gè)的交互形式都極其創(chuàng)新，因?yàn)橹谱鞒杀据^高，通常是針對品牌定制化，下面將推薦幾個(gè)優(yōu)質(zhì)的網(wǎng)站，小伙伴們可以自己去試一試。
△ 設(shè)計(jì)師 Louis Ansa 個(gè)人作品網(wǎng)站
△ 3D 風(fēng)格的蘋果系統(tǒng)圖標(biāo)
△ Flu AR Fluent 儀表盤
△ 3D 空間展示數(shù)據(jù)
伴隨著 VR 和 AR 技術(shù)的發(fā)展，2021 年 3D 風(fēng)格會更加流行，無論是從操作性，還是視覺效果的角度，3D 風(fēng)格都可以產(chǎn)生極大的突破。得物 APP 等線上商城紛紛開通了 AR 虛擬試鞋的功能，幫助用戶在足不出戶的情況下體驗(yàn) “真實(shí)上腳” 的效果。
△ AR 試鞋的功能已經(jīng)普及
△ 基于 AR 導(dǎo)航的線上商店
精彩的動畫故事會吸引所有年齡段的用戶，畢竟誰都年輕過，都喜歡充滿奇幻元素和大膽想象的畫面。在界面設(shè)計(jì)中加入動畫元素，使簡約的界面和有趣的動畫相結(jié)合，不僅能吸引用戶，還能增添互動時(shí)的新奇感。
△ 加載動畫可以充分發(fā)揮創(chuàng)意
奇特好玩的界面動效和微交互已經(jīng)不算 2021 年的新趨勢了，但趣味動畫的其他應(yīng)用方式仍值得我們探討。畢竟任何動態(tài)演示都能比靜態(tài)圖像或純文本更能清晰有效的傳達(dá)你的品牌故事，并讓人輕松的看進(jìn)去（尤其你可能是個(gè)“閱讀障礙患者”）。
微軟的設(shè)計(jì)團(tuán)隊(duì)常常用動畫技術(shù)制作宣傳片來展示公司的新產(chǎn)品，2020 年較為火爆的是關(guān)于 Fluent Design 的系列動畫，下面這條經(jīng)典作品傳達(dá)了如何將 Fluent Design 引入到 Office 移動端軟件中，且共享相同設(shè)計(jì)元素。動畫演示巧妙的展現(xiàn)了新圖標(biāo)元素的構(gòu)成，輕快的配樂配合圖標(biāo)們可愛的變形，可以單片循環(huán)一整天。
△ 將 Fluent Design 應(yīng)用于移動端的動畫宣傳片
△ Fluent Design 宣傳片的劇照，采用 3D 動畫的元素
設(shè)計(jì)中的動畫應(yīng)該是有目的和有意義的，不僅要賞心悅目，也要能夠解決問題或傳達(dá)概念。動畫最重要的目的是解釋、簡化和加速交互過程，讓用戶不經(jīng)意間嘴角上揚(yáng)。
2021 年，趣味的動畫不僅僅是一種純粹的裝飾和娛樂，其在設(shè)計(jì)中的廣泛應(yīng)用將持續(xù)成為設(shè)計(jì)師們熱議的話題，好玩的動畫就在那里，看你怎么用了。
有一種工程量很大的設(shè)計(jì)趨勢，其頁面布局和交互操作都特別復(fù)雜，使用復(fù)雜的動畫、渲染、插畫，用創(chuàng)新的交互吸引用戶進(jìn)行互動，鼓勵(lì)用戶不斷進(jìn)行探索。這種風(fēng)格常常被用在技術(shù)型或創(chuàng)意型產(chǎn)品的網(wǎng)站上，可以表現(xiàn)出科技感和獨(dú)特感，體現(xiàn)出公司或團(tuán)隊(duì)的能力。
△ Nathan Riley 設(shè)計(jì)的概念網(wǎng)站未來反思
△ Berezhnoy Eugene 設(shè)計(jì)的數(shù)據(jù)星球
△ Senko Holographic 設(shè)計(jì)的網(wǎng)站首頁，鼠標(biāo)移動可與頁面進(jìn)行交互
采用這種趨勢設(shè)計(jì)的網(wǎng)站并沒有統(tǒng)一的風(fēng)格，而是各有各的特色，每一個(gè)的交互形式都極其創(chuàng)新，因?yàn)橹谱鞒杀据^高，通常是針對品牌定制化，下面將推薦幾個(gè)優(yōu)質(zhì)的網(wǎng)站，小伙伴們可以自己去試一試。
△ 設(shè)計(jì)師 Louis Ansa 個(gè)人作品網(wǎng)站
△ 注重設(shè)計(jì)與科技結(jié)合的團(tuán)隊(duì) Letters
△ 科技公司官網(wǎng) Farm
體驗(yàn)后你會發(fā)現(xiàn)這類網(wǎng)站的視覺效果大多很驚人，交互方式充滿想象力。為了實(shí)現(xiàn)效果，團(tuán)隊(duì)會產(chǎn)出高質(zhì)量高標(biāo)準(zhǔn)的設(shè)計(jì)、投入大量的研發(fā)成本。當(dāng)然，成也蕭何，敗也蕭何，特別的交互使頁面邏輯與我們常用的網(wǎng)站大相徑庭，吸引眼球的視覺使頁面繁瑣花哨，會導(dǎo)致信息難以順利傳遞至用戶。這違背了可用性原則和無障礙設(shè)計(jì)理念，如果想要使用這樣的方式設(shè)計(jì)產(chǎn)品，一定要在創(chuàng)新和可用性中找到平衡點(diǎn)。
在這個(gè)新時(shí)代，社會發(fā)展十分迅速，整體節(jié)奏都很快，互聯(lián)網(wǎng)產(chǎn)品的操作效率需要隨之加快，用戶體驗(yàn)的每一步流程都要仔細(xì)斟酌，是否還能再精簡一些、再快捷一些，我們的目的是幫助用戶更的完成目標(biāo)，因此輕量化體驗(yàn)必然是永恒的課題。最明顯的例子就是登陸功能的簡化，從早期的賬號密碼，到后來的驗(yàn)證碼登陸、第三方賬號登陸、人臉識別登陸，用戶已經(jīng)不需要記住密碼，也不需要一步一步的輸入信息，一切都變得更加快速、更注重實(shí)用性。試想會不會有一天，人們一出生就得到一個(gè)永久賬號呢。
△ Surja Sen Das Raj 設(shè)計(jì)的極簡風(fēng) APP
不光是交互操作，界面的視覺風(fēng)格也正朝著輕量化設(shè)計(jì)的方向前進(jìn)，如果你一直在留意 Dribbble 熱門作品，會發(fā)現(xiàn)大部分都具備簡潔清爽的特點(diǎn)。極簡的配色和核心功能的突出，可以幫助用戶聚焦于重點(diǎn)信息；同時(shí)，我們可以結(jié)合信息層級的整合來降低用戶的外在認(rèn)知負(fù)荷，進(jìn)一步減少用戶的學(xué)習(xí)成本，使用戶更容易集中注意力；不僅如此，我們還可以適當(dāng)為核心元素添加一些微動效，使界面更具有溫度感的傳遞操作反饋。
△ Akshay Devazya 設(shè)計(jì)的求職 APP，注重頁面 Z 軸的空間感
△ Dmitriy Kazarov 設(shè)計(jì)的極簡風(fēng)官網(wǎng)
△ Choirul Syafril 設(shè)計(jì)的云存儲后臺界面
△ 可愛的微動效交互
隨著科技的飛速發(fā)展，輕量化可能是未來各個(gè)行業(yè)產(chǎn)品設(shè)計(jì)的趨勢。以游戲行業(yè)為例，從早期風(fēng)靡的單機(jī)游戲到現(xiàn)在隨時(shí)可以面對面開黑的手游，主流玩家漸漸將自己的游戲陣地轉(zhuǎn)移到手機(jī)上，無論是畫面精致度還是游戲流暢感，手游都可以提供優(yōu)質(zhì)的體驗(yàn)，今年火遍全球的游戲英雄聯(lián)盟也發(fā)布了手游版本。還有一個(gè)輕量化的案例，就是我們的小程序，微信、支付寶、百度紛紛發(fā)布了自家的小程序，我們已經(jīng)可以在一個(gè) APP 里使用多家公司的產(chǎn)品功能了。
設(shè)計(jì)趨勢是循環(huán)的。用戶體驗(yàn)設(shè)計(jì)的新趨勢每年都會推陳出新，但也有很多趨勢，幾年后又會卷土重來，這也是為什么復(fù)古總會成為一種潮流。設(shè)計(jì)是手段，不是目的。 比起緊隨潮流，更重要的是理解趨勢背后的價(jià)值和意義， 創(chuàng)造有價(jià)值的設(shè)計(jì)作品，趨勢就會成為你的那陣東風(fēng)。
文章來源：優(yōu)設(shè)網(wǎng) 作者：TCC設(shè)計(jì)情報(bào)局
藍(lán)藍(lán)設(shè)計(jì)( m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.sillybuy.com