<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          首頁

          如何做好空狀態設計?來看資深設計師的總結!

          周周

          今天為大家帶來的文章是「空狀態」設計,良好的空狀態設計能提升產品體驗,有效留存用戶。在這里把這篇文章分享給大家!

          UX TRENDS | 注重隱私的用戶體驗設計

          ui設計分享達人

          用戶隱私安全在產品設計中是很重要的一個環節,本文從用戶體驗角度切入,從匿名模式、減少永久性和減少公開性三個方面展開分析。



          我們先看?組來??優的2019年6?的調研數據:70%的美國?認為,與5年前相?個?信息變得更不安全。尤其是?學歷?收?群體。由此可??戶對個?信息數據的隱私擔憂?以往更甚。



          ?戶隱私安全很重要,涉及的范圍和?度也很多。本次的分析從?戶體驗?度切?,涉及如下三個??:

          1. Incognito Mode匿名模式;

          2. Reducing Permanence減少永久性;

          3. Reducing Publicity減少公開性。



          01 匿名模式


          下圖是Google系App(Google AppChromeYouTubeandGoogle Map)匿名模式切換,從交互體驗上來說有如下?個特點:

          1. 統?在右上?;

          2. 可以便捷切換?匿名模式,反過來也很容易切回登陸狀態;

          3. 匿名模式的狀態提示,例如YouTube 在匿名模式下在界?底部有?字提示“您 當前處于匿名模式”。


          匿名模式不是最近才流?的功能,最早提供隱匿模式的是蘋果safari瀏覽器,早在 2005年就?持了匿名模式。Chrome瀏覽器在2008年就開始?持此模式。雖然由來已久,為什么到了2020年,匿名模式依然是國外互聯???趨勢呢?


          我們看?組數據:

          這是來?DuckDuckGo 2019年9?的調研(DuckDuckGo是美國的?款不記錄?戶?為保護?戶隱私的搜索引擎)。樣本來?美國、英國、德國和澳?利亞的成年??戶,共計3,411?的調研得出。各國?戶對使?搜索引擎的個?隱私安全?常在意(是否搜集個?的數據和記錄搜索?為)。

          2020年5?DuckDuckGo?均搜索次數為6200萬。對?看2019年11?底?均搜索次數4900萬,2018年10?是2900萬。

          最近?年的持續活躍度?幅增?證明了不記錄個?隱私的搜素引擎越來越受到?戶的?睞。

          國內,頭條、UC瀏覽器在搜索框輸?狀態也提供了“?痕瀏覽”??。

          不僅是搜索引擎領域,保護?戶隱私也成為Facebook最重要的戰略?向之?。Facebook CEO Mark Zuckerberg在2019年 F8開發者?會上喊出“THE FUTURE IS PRIVATE”。2019年3?Mark Zuckerberg發?,主題就是《聚焦于保護隱私的社交?絡》。



          02 減少永久性


          我們先看國外社交媒體Stories(?故事)產品形態的流?。

          ?們總是對于所分享的內容永遠記錄在?上感到擔憂。Stories24?時消失緩解了?們的隱私顧慮,這讓?戶更安?地?然分享。

          Stories由Snapchat?創,由 Facebook發揚光?。早在2019年4?,Facebook+Messenger Stories, Instagram Stories?活?戶數就突破5億。 2020年2-3?LinkedIn,Twitter也先后宣布將上線類似功能。



          03 減少公開性


          來??優的調研報告:41%的美國?經歷過?絡騷擾,最常?的就是在社交媒體上。23%的?戶最近經歷的?絡騷擾來?評論區的評論內容。27%的?戶經歷?絡騷擾后決定不再發布任何內容。

          我們以限定評論互動的公開性為例:

          2020年5?Twitter上線了新的評論功能,可以限定誰可以回復帖?的功能,提供了三種選項:誰都可以評論,只有被關注者可以評論,只有被提及者可以評論三種公開度的限定。

          Instagram也在測試“評論限制”新功能,批量屏蔽/限制評論。?前已經上線的?個例?:?戶(評論發布者)如果發布的評論含有攻擊性敏感詞,發布前伴有提示,提醒評論含有攻擊性敏感詞是否真的要發布。


          注重隱私提供僅好友可?/僅??可?/僅作者可?/等多重維度的隱私設定有助于?戶更安?地參與互動。

          另外?個例?是付費頻道會員:付費頻道會員-限定頻道的公開性讓內容創作者減輕隱私顧慮不僅能獲得?告收?,也能得到來?會員、會費的收?,形成“忠實粉絲”社區,有助于內容?態的社區化建設。

          我們主要看YouTube的頻道會員案例:

          YouTube有兩種會員模式。?種是YouTube整個平臺的付費會員,去?告,看原創美劇影視,消費?樂,可下載內容的模式。第?種模式是Youtuber個?頻道付費會員,吸引忠實粉絲加?。我想說的就是第?種。


          為什么?V?紅有意愿開通頻道會員?


          除了獲得忠實粉絲收?變現的商業價值以及付費頻道會員可以為忠實粉絲提供各種專屬功能,背后也和?紅?V對個?隱私顧慮有關。

          ?紅?V在完全公開的社交?絡上需要始終保持?夠克制謹慎,避免引起爭議。但在忠實粉絲付費頻道專屬會員群中,?紅?V會減輕隱私顧慮,更加回歸?我。

          ?如在頻道會員中發布更多與個??活相關的內容,表達更多不便在完全公開的社交?絡中的想法和感受等,因為忠實粉絲通常更具包容度,更不容易引起爭議。


          YouTube頻道會員費?可以從三種會費(按?)區間選擇,?持多選:

          1. 低階 Low Levels $0.99~3.99;

          2. 中階 Medium Levels $4.99~14.99;

          3. ?階 High Levels $19.99~49.99;

          頻道會員功能在2018年開始測試,?向粉絲數過10萬的YouTuber開放。



          以上綜述,我們可以說:


          1.匿名模式:

          雖然匿名模式由來已久,但仍然是當前的??基本?戶體驗設計趨勢,尤其是匿名模式的切換便捷性?常重要。


          2.減少永久性:

          Stories?故事24?時消失緩解了?們的隱私顧慮,這讓?戶更安?地?然分享,已經成為國外社交媒體平臺的必備功能,Facebook, Instagram平臺的最主要、最具影響?的功能之?。


          3.減少公開性:

          ?戶總是對在社交媒體平臺發表評論有所顧忌,限定評論的公開性能夠有助于促進?戶發帖表達,其他?戶也可以更安?地參與互動。


          付費頻道會員可以限定頻道的公開性,讓內容創作者減輕隱私顧慮不僅能獲得?告收?,也能得到來?會員會費的收?,形成“忠實粉絲”社區,有助于內容?態的社區化建設。


          從UE?度,我們可以為頻道會員提供專屬身份設計例如專屬徽章,專屬表情等。

          THE FUTURE IS PRIVATE, 注重?戶隱私的體驗設計越來越重要!

          文章來源:站酷    作者:百度MEUX

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務



          汽車交互手勢,這樣設計才有趣

          資深UI設計者

          隨著車內屏幕越來越多,越來越大,駕駛者在開車過程中因操作屏幕而分心機率逐漸升高。眾多汽車制造商均希望探索出一種降低或避免「駕駛員分心」的安全性技術。

          手勢,是指人手、手和手臂結合產生的動作,作為解決「駕駛者分神」這個痛點的解決方案之一,正在全世界的汽車制造商中掀起「熱浪」。

          你只需要隨意的揮一揮手,就能掛斷電話;將手指向順時針或者逆時針方向移動,就能調整音量大小。

          互聯網基因:屏內手勢交互

          汽車手勢的出現,源于對車內屏幕的操作。而這些操作均來自于移動端的設計標準,比如蘋果IOS設計規范中的標準手勢或者谷歌Mertiral Design中的標準手勢。

          汽車交互手勢,這樣設計才有趣

          △ 移動端常見交互手勢

          常見的手勢如上圖,分別為

          • 點擊:激活控件或選擇一個項目
          • 滑動:上下滑動,或者左右滑動來連續移動需要查看的內容
          • 按住并拖動:在屏幕上左右或者上下移動某個元素
          • 雙擊:放大或縮小內容或圖像,并使之居中
          • 捏:外捏時放大,內捏時縮小
          • 長按:進入文本或內容編輯狀態

          為了滿足手機屏幕外觀改變,屏內顯示內容越來越多元化的需求,設計師們也在探索屏內手勢的新玩法。

          汽車交互手勢,這樣設計才有趣

          △ android底部導航欄按鍵從左至右分別為:返回上一級、返回主頁、多任務

          2017年iPhoneX的發布,正式開啟了全面屏時代。為了替代Home鍵及android底部導航欄,各大手機廠商相繼開始擁抱「全面屏手勢交互」。

          在車機系統中,部分汽車制造商也在積極迎接變化,比如理想one采用「三指下滑」的手勢交互替代「返回主頁」的圖標按鍵。

          汽車交互手勢,這樣設計才有趣

          △ 「 三指下滑」表示返回主頁

          2019年的Google I/O大會上,新版本Android Q選擇與IOS采用一樣的手勢操作邏輯,即在屏幕下方提供一個指示條,用戶在左側頁面邊緣右滑代表「返回上一級」、提示條區域上滑代表「返回主頁」、提示條區域上滑并懸停代表「多任務」。

          汽車交互手勢,這樣設計才有趣

          △ android系統中的三種全面屏手勢

          隨著全面屏手勢在手機端的操作交互上達成一致,相信在不久的將來,也將越來越頻繁的在車機端看到全面屏手勢的「身影」。

          車機新玩法:多屏聯動交互

          當汽車與數字屏幕相遇,如何讓屏幕與內飾結合的更加完美,又能突顯品牌特性,似乎給內飾設計師帶來了許多挑戰與機遇,「一字屏」、「T字屏」、「7字屏」、「旋轉屏」應運而生。

          汽車交互手勢,這樣設計才有趣

          △ 拜騰M-Byte 一字屏

          汽車交互手勢,這樣設計才有趣

          △ 理想one的T字屏

          汽車交互手勢,這樣設計才有趣

          △ 合創007的7字屏

          汽車交互手勢,這樣設計才有趣

          △ 比亞迪王朝系列的旋轉屏

          與此同時,因為成本及技術的限制,汽車制造商的量產車型不得不在屏幕上做出妥協。理想one的妥協方案是利用3塊屏幕組合,在視覺上形成「大長屏」的既視感。

          汽車交互手勢,這樣設計才有趣

          要讓3塊屏幕「變」成一塊屏幕,僅僅在視覺上做足功夫顯然還不夠,多屏聯動手勢交互也不能「缺席」。

          事實上,多屏聯動手勢交互依舊來源于IOS及android系統中的標準手勢,它將不同的手勢進行組合,并與頁面聯動顯示,形成了多屏聯動手勢。

          理想one在停車模式下,用戶長按并向左滑動,即可將副駕娛樂屏上的信息「甩動」至中控屏。

          汽車交互手勢,這樣設計才有趣

          天際ME7不僅有3塊屏幕組合而成的前排「一字屏」,還有2塊后排乘客娛樂屏,5屏聯動的手勢交互,天際采用「手勢+屏幕顯示」來解決。

          汽車交互手勢,這樣設計才有趣

          在中控屏、副駕娛樂屏和后排娛樂屏上采用五指抓取手勢進入多屏互動頁面,比如想把中控屏上的內容分享給副駕娛樂屏,第一步是單擊選中副駕娛樂屏,第二步按住并拖動中控屏至副駕娛樂屏位置,第三步在副駕娛樂屏中點擊確認。

          視頻版交互演示:https://v.qq.com/x/page/w08791lhqus.html

          未來已來:隔空手勢交互

          通過隔空手勢接聽或者掛斷電話,這似乎是科幻電影中才有的情節。但正如開篇所說,車內屏幕數量增多,尺寸加大的同時「駕駛者分心」的機率也增加了,盲操手勢與隔空手勢的出現,是解決這個痛點的一種嘗試。

          目前量產的汽車中,盲操手勢主要是通過標準手勢與聲音反饋的組合來實現。

          比如在理想one中,用戶在空調屏上左右滑動可以調節風量,上下滑動調節溫度,且系統通過聲音反饋告知用戶操作成功與否。

          與盲操手勢相比,隔空手勢似乎科技感十足,備受汽車制造商的青睞,我們不僅可以在各種概念車上窺見它的蹤影,在君馬SEEK上,也可以實際操作一番。

          君馬SEEK提供8種隔空手勢。

          汽車交互手勢,這樣設計才有趣

          △ 左圖:接聽電話 右圖:掛斷電話

          汽車交互手勢,這樣設計才有趣

          △ 左圖:上一曲 右圖:下一曲

          汽車交互手勢,這樣設計才有趣

          △ 左圖:音量升高 右圖:音量降低

          汽車交互手勢,這樣設計才有趣

          △ 左圖:音樂播放/暫停 右圖:玫瑰花

          與君馬SEEK相同,寶馬提供「向左」手勢代表上一曲、「向右」手勢代表下一曲,「yeah」手勢代表播放或暫停。

          但在許多其他操作上,寶馬與君馬的手勢操作則各有特色。

          君馬SEEK使用手掌的正面與反面來區分不同的操作,正面表示接聽電話·/音量增加,反面表示拒聽/音量降低。

          寶馬則選擇向屏幕方向點擊代表接聽電話,手掌向右揮動代表拒聽電話,手指順時針畫圈代表音量增加,手指逆時針畫圈代表音量降低。

          在倒車影像中,手指向右揮動代表調整視角。

          汽車交互手勢,這樣設計才有趣

          △ 圖片來源于「汽車界的扛把子」的短視頻《寶馬手勢控制詳細演示》

          在手勢交互上,拜騰也交出了自己的「成績單」。

          拜騰的手勢識別共五種,手掌向下激活手勢識別,手掌向上啟動主頁面,手指移動代表移動光標,ok手勢代表確定,五指捏合可拖拽內容。

          汽車交互手勢,這樣設計才有趣

          △ 圖片來源于太平洋汽車網《拜騰Concept手勢感應系統操作演示》

          這些高大上的技術看起來令人興奮,但在實際使用的過程中,依舊存在識別范圍有限、識別精度不靈敏、識別后的響應速度慢等等問題,而各個廠家的手勢識別沒有形成統一的標準,且沒有大規模在在用戶中進行推廣,必然會增加用戶的學習成本。

          手勢識別對用戶來說是「真香」還是「雞肋」,相信時間會給出答案。

          參考文獻:

          寫在最后

          汽車內手勢的交互設計,是一個有趣又好玩的課題,但如何讓這個課題在好玩但同時易用、好用,恐怕只有設計師不斷思考,并不斷采用一些用戶測試的方法進行驗證才能獲得答案。

          文章來源:優設    作者:點滴DESIGN

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

          2020-2021 設計趨勢報告:用戶體驗篇

          資深UI設計者

          前言

          身為用戶體驗設計師,無時無刻不被世界上的新事物沖刷著認知——互聯網紅利下降帶來變化莫測的商業動向、循著摩爾定律野蠻生長日新月異的新技術、各類亞文化群體催生出多元復雜的圈層文化、腦洞口味越來越獨特的年輕人,甚至眼下席卷全球的黑天鵝事件……

          任何一個新事物的悄悄冒頭,都有可能在未知的將來影響著用戶體驗設計師。我們能做的是,在起初感受到微微震幅時,便沿著震感逐步尋找源頭,并思考未來的發展走向。趕在變化降臨前先擁抱變化。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          本文通過研究近一兩年科技、社會文化以及自身用戶體驗領域的變化,從用戶體驗領域關鍵的用戶、媒介(設備與應用)、交互行為、信息與場景的五個角度出發,探索用戶體驗設計未來的趨勢,希望能帶來啟發。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          更智能的服務提供方式

          隨著人工時代到來,過去機械的單向交互方式逐漸被打破,機器漸漸演化成了會主動「觀察」真實場景,「感受」用戶情感,預判用戶意圖并自動完成任務的貼心小棉襖。機器如何為人們提供更智能便捷的服務,未來還有非常大的想象空間。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          1. 基于真實場景推理用戶意圖

          隨著AI技術的發展,智能設備可以越來越無縫地將數字世界和物理世界嫁接起來,主動感知用戶所處情境并智能提供相應服務。

          在2019的 Google I/O 大會上,Google Lens 展示的AR點菜功能可以智能識別用戶掃描的菜單并將美食網站上的相關推薦直接呈現在屏幕上。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          當用 Google Lens 識別到小票信息時,可快速提取小票上的金額,且可自動彈起計算器快速幫助用戶計算人均消費,節省人工計算的時間成本。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          隨著信息入口從數字空間延伸到周圍的物理空間中,未來萬物皆可為用戶體驗的媒介,設計師未來在設計的時候需要注意:

          尋找適合的打通真實世界的切入點:在陌生語言、信息復雜或者難以處理等苛刻的環境下,充分發揮智能設備對信息智能讀取、批量識別與翻譯等強大能力,幫助用戶完成任務;

          將用戶旅程的上下游串聯:根據生活常識和經驗預判用戶行為目的,前置推薦服務;

          更加系統細心地考量干擾因素:真實場景是動態變化的,需要更全方位考慮光線的強弱、多源的噪音、實體的可視性、人員和事件的打斷等因素。

          2. 任務自動化,簡化用戶旅程

          為了完成一項任務,用戶往往需要借助多個應用來回切換配合,使用起來瑣碎麻煩。如今應用越做越強大也越復雜,過去僅僅解決單一場景的解決方案不再適應于用戶對于完成任務的訴求。

          Google Assistant 的新能力 Duplex on the web 可以通過自動跨應用任務處理來簡化用戶旅程。只需要用戶發出語音指令「預定一輛去某地的車」,助手便可自動跨郵件、日歷、付款等應用調取信息、自動根據使用習慣做選擇,并自動填寫信息,而用戶全程需要的只是在關鍵節點輕敲「確認」即可。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2019年隨著 iOS 13 的更新,「快捷指令」推出了「自動化」能力,用戶通過「if…then…」語法便可為自己的App設計一套程序,實現如:「當我回到公司時提醒我打卡」、「每天早上10點給我的女朋友發送一條表白短信」等能力,將不相關的場景動作串聯字一起自動化執行,大大節省人工操作成本。

          提升使用效率是用戶體驗設計孜孜不倦努力的方向之一。在利用新技術進一步簡化用戶旅程時,設計師可以充分利用以下因素:

          借助語音輸入:比起界面觸控操作,語音交互的直達性可以「穿透」復雜界面,讓設備第一時間明確用戶目標;

          基于用戶行為形成習慣記憶:對用戶長期重復的行為做分析處理,構建用戶習慣模型并主動提供服務;

          適當考慮專家級用戶:隨著部分用戶的智能設備使用水平越來越高,可以考慮為專家用戶提供自定義操作腳本,滿足其自身的獨特需求。

          3. 基于情感感知,主動理解用戶需求

          隨著人臉識別、表情識別、肢體跟蹤等技術的提升,機器逐漸學會感性語言,主動感知用戶內在情感和心理需求。

          2019年1月的CES展上起亞亮相的互動式「情感駕駛空間」技術,可通過傳感器讀取用戶的面部表情、心率等反應,調整駕駛空間內的燈光、影片類型、音樂風格等,舒緩艙內乘客心情,由此提供更人性化的出行體驗。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          用戶總是會期待更貼心的服務,設計師未來對同理心的情感嗅覺更加敏銳:

          利用感性線索定位用戶情緒:需要通過面部表情、特殊時間節點或者識別到的關鍵詞,對用戶情緒進行理解和定位,判斷用戶情感理解用戶內心訴求是自由探索、趣味娛樂、或者靜謐修行并提供符合用戶當下心境的服務。

          綜合使用感性元素進行設計:通過使用線條、色彩、聲音和動作等傳達并喚起相對應的情感,提供更加人性化的體驗。

          4. 小結

          更智能的服務提供方式會讓人們生活擁有更多可能性,但一旦火候把握不得當,可能就會造成對人們生活的野蠻入侵。關于如何讓科技更好造福于人們,早在上個世紀,施樂帕克研究中心提出了寧靜技術(Calm Technology)的愿景,認為影響最深遠的技術應該是隱匿不見的,它們如纖維般融入日常生活,絲絲入扣,直至不可分辨。

          隨著科技的發展,設計師對新技術不應是不加克制地應用,而應該潤物細無聲般地提供服務,幫助人們從繁雜喧囂的數字世界中解脫出來,將寶貴的注意力資源投放在讓生活更美好的事物上。

          更自然豐富的交互方式

          回顧人類和機器的交流語言,從命令行界面、圖形用戶界面到自然用戶界面,人機交互方式越來越貼合人與人之間更自然的交流方式,其背后是心智模型與實現模型的高度擬合的趨勢。

          在自然用戶界面中,為滿足新形態智能硬件對新接口的需求,以及人們對更豐富強大的交互方式的自然訴求,越來越多的自然用戶界面被開發出來。語音交互和隔空手勢交互便是近幾年迅速發展并落地的兩種交互方式。

          1. 隔空手勢交互:更自由、更靈動

          為了讓機器更好地讀懂用戶的身體語言,能夠感知深度信息的攝像頭走進了日常手機。2019年國內外手機廠商的發布大會上,LG 手機 G8 ThinQ 以及華為發布 Mate 30 系列推出的隔空手勢,可實現一些簡單的諸如滑動、切歌、截屏等效果。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          除此以外,隔空手勢支持更加細微的手勢,如旋轉、揉搓等,可以更直觀、更靈活的方式操控界面,讓用戶獲得一種像魔術師用意念控制事物運作的快感。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          對于隔空手勢操作網上的言論褒貶不一,其中爭議性最大的就是隔空手勢宛如「殺雞用牛刀」,明明可以用更加精準的手勢觸控,為什么還要用看似很酷炫其實精準度更低的隔空手勢操作?

          隔空手勢并不是要替代觸控手勢成為主流的人機交互方式,更多是對情境式障礙場景的補充。在某些場景下,用戶使用設備的條件可能是充滿干擾的。想想看當你邊看手機食譜邊炒菜的時候、邊煲劇邊剝小龍蝦的時候、疫情期間出門佩戴橡膠手套無法正常觸控手機屏幕時…..隔空手勢是不是特別好用?

          每個人在特殊的場景下都有可能面臨感官障礙,未來的設計也應該更多地考慮情境式障礙的場景,讓用戶無論身處何時何地依舊能一如既往無障礙地使用設備。

          2. 語音交互:更精準、更好玩

          語音交互作為更趨近于人與人之間最自然的交流方式,近些年有許多發展的突破點。

          在發展主線上,語音交互趨向更自然、更人性化、更個性化。過去反人類的一些溝通方式慢慢被「調教」。此外,多人會話場景下的技術方案日漸增多。

          2019的 Google I/O 大會展示了一個視頻片段,視頻中的兩位嘉賓相繼吐槽,經常出現針鋒相對難以聽清的時候,這時用戶可以調節音源音量選擇性增強自己關注的人物聲音,讓另一個人「靜音」。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          △ 滑動選擇音源

          此外,語音交互除了在智能音箱領域廣泛應用以外,也逐漸應用在廣告等更多的傳播媒介中,刷新人們日常使用體驗。2020年2月索尼提交了一項廣告播放新專利。當用戶在觀看電視節目時,如果出現廣告,只要站起來大喊廣告中對應品牌的名字,便可直接跳過這個廣告。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          設計師在語音交互場景下,需要留意以下幾個比較容易被忽視的因素:

          用戶語音交互習慣培養:如今還處于培養用戶語音交互使用習慣階段,設計師需要更多地考慮應用的語音交互規則如何才能更趨近于人們日常的溝通習慣,并進一步為人們的社會習俗所接納。

          真實場景下的多人音源:在現實情境中, 在多人對話場景下將面臨音源不清、穿插停頓、噪音過多等影響體驗的情況,由于計算機聽覺分析能力開始從單人音源拓寬到了多人音源,多人對話解決方案上還有很大想象空間。

          改變傳統的視聽體驗:在使用場景上,語音交互接口也將逐漸運用到更多的媒介上,更全面地刷新用戶體驗。

          3. 小結

          人類擁有雙手、眼睛、耳朵和發聲的嘴巴,但是并不總是在每個使用場景下都能自如地使用:在安靜的自習室下聲音收到限制,在駕駛場景下注意力受到限制,在雙手拎著東西場景下雙手受到限制……但目前許多產品設計都建立在用戶能完整使用感官功能這一理想化的基礎上。

          未來的發展趨勢傾向于將視、聽、觸、嗅等多通道信息完美整合起來,綜合使用多種輸入通道和輸出通道,根據用戶使用場景用最恰當的方式傳遞服務,滿足用戶多方位的需求。

          硬件形態帶來新的挑戰

          盡管喬布斯曾斷言3.5英寸是手機的黃金尺寸,但作為人們日常內容消費與娛樂的窗口,手機屏幕毫無疑問地變得越來越大,甚至超出傳統物理限制。人們對大屏享受的追求與設備攜帶便捷性之間的矛盾由來已久,硬件形態的變化對舊有的用戶體驗設計思路帶來的新的挑戰。

          1. 大屏幕:單手持握新挑戰

          屏幕橫縱比越來越大,而人類的手部具有先天限制,曾經慣用的界面布局方式在高橫縱比的屏幕上可能無法被大拇指無障礙全覆蓋,使得越來越多的設計更加重視利用移動屏幕下半部分。

          操作與信息進一步下移:

          高德地圖、蘋果地圖的搜索框下移,方便單手操作用戶快速激活輸入框;

          影視資訊平臺IMDB強化底部標簽欄功能,雙擊「搜索」tab即可激活輸入框,無須艱難地觸摸頂部。

          即時戰斗類手游皇室戰爭的說明卡片主要展示在下半部分,方便用戶進行卡片上的相關操作。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          底部導航被賦予更多能力:

          Pocket的底部標簽欄現在兼任漢堡菜單功能,在激活狀態下再次點擊主頁icon可選擇主頁上須展示的內容。

          利用下滑手勢代替點擊:

          Snapchat的許多表示前后進退關系的頁面都不是」返回「按鈕,而是向下箭頭,用戶可下滑退出當前頁面。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2. 折疊屏:新形態的交互方式

          為了解決設備形態和人類手部先天限制之間的矛盾,折疊屏誕生瀏覽并顛覆舊有的界面設計方式。

          更靈活的信息布局

          過去在單屏設計下,考慮到用戶注意力由上到下縱向衰減,因此信息布局更多是按照優先級從上往下排序。而折疊屏中,屏幕展開后便可以開辟出更大的可利用空間,將次級頁面或者較為重要的內容曝光在第二屏,對信息的布局將帶來全新的變化。設計師為保證大小屏下順暢的閱讀體驗,需要對信息模塊在不同空間布局下的流動性有更強的把控能力。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          更便捷的多任務操作

          在過去的單屏體驗中,用戶只能將注意力完全集中在當前的界面中,一次只做一件事。但在實際生活中,用戶面臨的情景往往是主線任務和支線任務的頻繁交錯,并且根據會任務不同的性質自由調動自己的注意力重心,如邊看視頻邊聊天、邊看直播邊逛街等等。在折疊屏中,設計師可以探索更多主線和支線交錯進行的場景,利用折疊屏帶來的更大的屏幕空間,可以讓用戶在不離開主線場景的基礎上進行支線任務的處理,大大節約了在不同App上來回切換的操作成本。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          更直觀的拖拽交互

          此外,隨著多任務處理越來越廣泛使用,拖拽交互將成為重要的交互模式之一。文本、表情包、圖片、視頻等交互對象,不再需要經過復雜的分享轉發流程才能在不同App中流轉,通過拖拽的方式可以更直觀地進行交互。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          雙面屏互動玩法

          外折疊屏在折疊狀態下可轉為雙面屏,等于是給用戶增加多一個觀看視角。例如華為 Mate X 的鏡像拍攝可以讓被拍攝者即時獲知自己的鏡頭影像是否滿意,這一拍女友神器有望成為直男拍攝終結者。在未來更多的多人觀看和互動玩法將被開拓出來。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          △ 華為Mate X 的鏡像拍攝

          未來隨著5G通訊技術的成長,越來越多的設備可以同時加入物聯網,人們的生活將被各種智能設備圍繞,設計師需要參與更多屏幕外的設計,讓不同設備串聯在一起協同合作,讓用戶能更加自在地享受科技的便利。

          疫情催生新的線上體驗

          席卷全球的新冠疫情讓數十億用戶乖乖待在家里。過去需要花費大量精力去教育的用戶使用習慣因為疫情紛紛轉變。云購物、云蹦迪、云賞櫻、云監工……人們足不出戶便可還原許多線下場景。隨著用戶線上和線下生活的界限進一步模糊,用戶對于應用的效率和情感訴求也發生了變化。

          1. 更關注效率導向

          疫情讓遠程辦公學習需求劇增,多人協作場景越來越頻繁,許多企業隨之升級了電話、視頻會議、文檔制作等多人協作效率軟件。過去僅僅考慮少人場景協作的方式不適用,設計師需要比以往更多地考慮多人協作場景下,如何對海量密集的信息進行分析處理和展示。

          在學習方式上,由于線下學習轉移至線上,學生群體對于娛樂向軟件也有了效率訴求。為了順應用戶訴求變化,2020年5月QQ推出學習模式,屏蔽娛樂性的內容推送,讓學生更專注在學習上。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2. 更注重緩解社交疏離感

          除了效率訴求急劇提升以外,隨著長時間的線上學習與辦公所產生社交疏離感和缺失感,人們對于線上學習工作的情感化訴求也進一步增強。

          2020年推出的plagi遠程辦公軟件支持設置每個人的avartar形象,讓大家在遠程辦公時依舊能時刻感受到彼此的存在。在完成任務時還可以放鞭炮慶祝,讓員工能感受到親密無間的線上辦公體驗。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          設計師需要更加關注如何讓線上生活進一步與現實生活圈和時間線接軌,通過拓展真實社交下的更多伴生行為讓線上也能還原線下的真實場景細節和互動體驗,以彌補用戶對真實社交的缺失感。

          3. 加速人和信息的強連接

          疫情的發生加速了人與信息之間的連接。人們越來越習慣將自身的身體資料、心情狀態等信息沉淀在智能設備上。

          為了做好廣大市民群眾的健康監測服務,輔助疫情防控工作,微信和支付寶在2020年年初都上線了健康碼服務,不同顏色的健康碼代表人們不同的健康情況,市民出入特定場所都需初始健康碼。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          隨著人的數據化越來越深入,個人身份信息的線上化在各平臺上將成為更加通用的能力。設計師需要考慮如何更自然更低成本地將線下動態變化的資料信息線上化,更有效地對用戶信息進行加工處理,以及記憶用戶的使用習慣和行為,以便幫助用戶更地完成任務。

          疫情的出現加速了線下生活線上化,短短時間內我們看到日常習以為常的應用為響應疫情下的特殊需求紛紛出現改造,釘釘、QQ群被改造成上網課、批改作業的地方,醫療衛生公眾號開辟了實時疫情播報與辟謠通道,無接觸設計和服務需求異常突出……這也啟發了設計師需要保持對突發事件的敏感力以及應急能力,在日常生活中留心思考,為日后突發事件提供充足的場景支撐。

          關注以人為本

          在洶涌的資本語境下,互聯網設計師裹挾在商業驅動的結果導向中狂奔,對設計的倫理和責任鮮有發聲,但伴隨著互聯網紅利退潮,發展放緩,狂奔之下的人本問題也逐漸浮出水面。在大趨勢下,UX設計師需要培養自身設計對倫理和責任的敏感度,在滿足商業目的外,重拾節操,為多群體,為大社會設計,更加注重「以人為本」。

          1. 更包容性的設計

          包容性設計師指在做設計產品的時候,考慮到各類用戶的訴求,輸出具有包容性的設計方案。包容性設計依舊是2020年設計主題之一,伴隨著互聯網產品全球化,在通用性和包容性上也提出了新的要求。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          為身障人士設計

          三星在2019年針對東南亞市場推出了一款讓聾盲人士和健全人實時交流的app:Good Vibes,盲聾人輕擊屏幕輸入摩斯電碼,預先連線好的另一臺手機就會顯示從盲聾人發來的短信。健全人用普通的文字輸入回復,在盲聾人這一端就會翻譯成摩斯電碼、以手機振動的方式讀出短信內容。

          GOOD VIBES宣傳視頻:https://v.qq.com/x/page/g3108sr8qc9.html

          餓了么:在餓了么送貨騎手中,約8%受色盲色弱的困擾(全國男性群體中紅綠色盲色弱占比達8%-9%,餓了么騎手男性占比90%),為此餓了么設計團隊在2019年對app的進行了重新設計,包括使用WCAG無障礙色彩對比度,以及無障礙色盤,以及調整字階,使用輔助圖形等設計手段來解決部分騎手在送貨途中使用APP的痛點問題。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          △ 餓了么UED:《為騎士創造平等 — 配送 App 的包容性設計》

          跨年齡段設計

          谷歌助手禮貌功能 ( Google Pretty Please ) :開啟谷歌助手禮貌功能后,如果使用者在下達指令的語句中包括「Please」,谷歌助手會對禮貌的請求表示感謝,以此培養孩子的禮貌言行。

          Google Pretty Please功能宣傳:https://v.qq.com/x/page/e3108ue3e2t.html

          Swift Playground:當10后小學生VITA君的編程課被「可敬的發量」刷滿彈幕時,Swift playgrounds功不可沒,這款為兒童新手學習編程的軟件,用趣味的游戲方式為4歲以上低齡用戶提供了一個學習編程的低門檻平臺。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          為性別平等而設計

          蘋果emoji:回看歷年蘋果emoji的更新,從膚色平等,到性別、性向平等,再到為殘疾人設計,2020年再為跨性別者增加新表情,性別平等依舊是包容性設計中重要一環。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          Airbnb插畫:愛彼迎在插畫系統中,也為不同膚色,不同職業,不同性別,以及身障人士進行了人物的繪制。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2. 關注用戶隱私

          2019是互聯網科技隱私問題沉浮的一年,國外有Facebook因泄露隱私收到史上最大罰單,國內則打響了「人臉識別第一案」?;\罩在隱私信任危機下,個人信息和數據立法突飛猛進,美國推動《加州消費者隱私法案》,國內也將在2020年出臺《個人信息保護法》和《數據安全法》。

          MIUI12推出隱匿面具功能

          Android開放生態導致的權限隱私問題一直被用戶所詬病,某些APP存在用戶不授權就無法使用情況,針對這一情況,MIUI12推出了隱匿面具功能。當用戶在開啟某些APP要求授權權限時,可以選擇空白通行證進行授權,從而保護用戶真實信息。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          在MIUI12的更新中,還推出了照明彈、攔截網兩項隱私保護功能

          iOS 14剪貼板提醒

          在iOS 14的更新中,保護用戶隱私方面進一步升級。

          其中剪貼板提醒設計很貼心,當用戶打開應用,如果該應用讀取了你剪貼板的內容,會在系統頂部彈出提示,用戶能在第一時間意識到剪貼板內容被讀取,幫助用戶更好的保護自己的隱私內容。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          3. 健康的數碼生活方式

          科技的發展是一把雙刃劍,互聯網產品的發展給用戶帶來便捷和沉浸體驗的同時,也使得用戶沉溺于科技所帶來的惰性和投食之下,逐漸喪失了對真實生活的把控權,被科技綁架。

          數字福祉(digital wellbeing)近年被頻頻提起,指科技產品需要權衡好數碼產品和真實生活之間的平衡,防止數碼產品過渡分散用戶的注意力而影響生活質量。

          Android Q 專注模式 Google Android Q Focus Mode

          Android Q的更新加入了專注模式,用戶在專注模式下,可以在系統層面快捷地關閉使你分心的應用,讓你聚焦于更重要的事情。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          防沉迷系統升級

          推薦技術的進步,產品體驗的升級,給用戶帶來了更合胃口的菜式和沉浸體驗,但同時也被冠上了「電子海洛因」的稱號。游戲或者內容產品的防沉迷系統依舊會是數字福祉下不可避免的趨勢。

          王者榮耀在2020年升級防沉迷系統,對青少年的娛樂時間和點券充值的限制進行了進一步升級。承接話。B站在2019年推出青少年模式,在該模式下,使用時長和內容推薦等做了定制化處理。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2020年的UI設計趨勢,一方面是對往年風格的衍變和細化,另一方面,在扁平克制的界面風格盛行后,設計師們向往更自由、更突破的視覺表達。

          UI的繼承和創新

          1. 深色模式

          2019年iOS 13深色模式姍姍來遲,緊接著大廠APP相繼推出此功能。在2020年,深色模式會繼續普及外,也會在可視性和實現成本方面有更多細節打磨和研究。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          2. 新擬態

          設計趨勢的發展是螺旋式上升的,在扁平化設計流行之后,對物體的擬真再一次回歸設計圈,新擬態以一種對舊擬物風格的再創新,重新流行起來。

          新擬物風格(Neumorphism)緣起于設計師Alexander Plyuto發布在dribbble的一組作品,以投影重新對扁平界面進行了塑造,模仿出類似浮雕的視覺效果,感受耳目一新,引起大量設計師相盡模仿。

          新擬態的實用性和可落地性有待商榷,但是作為一種新的風格受到設計師擁躉,也不失為下一波風潮到來前的靈感繆斯。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          WWDC2020對mac OS的更新也重新定義了新擬態設計語言,在mac OS新系統Big Sur中,圖標的設計增添了輕微的漸變、投影、高光,以此來營造圖標內元素之間的縱深關系。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          3. 多彩配色

          在扁平簡潔UI風格盛行之后,豐富的色彩依舊是設計趨勢之一,大面積色塊,碰撞配色,帶來更具沖擊感的視覺體驗。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          4. 字體裝飾化

          UI界面逐漸扁平,色塊圖標弱化,為突出頁面重心和內容,iOS 11在界面標題上使用更大的字號,更粗的字重。近年在大標題的風格衍變下,文字在傳達信息外,也開始有了裝飾性作用,采用超大字體,成為頁面排版美化的一部分。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          5. 更大圓角

          大圓角的風格會繼續延續,相較以往,卡片的處理圓角會更大,隨之帶來的是多的留白處理,結合大字號,帶來更透氣通透的視覺感受。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          Mac OS Big Sur的界面相對舊版本采用了更大的圓角;系統圖標的設計統一成圓角矩形。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          6. 更豐富的插圖

          UI插圖的豐富體現在樣式和內容上,樣式上開始3D化,內容上更注重插圖敘事的表達。

          7. 3D插圖

          3D圖形往年更多運用在動態影像或運營類設計中,隨著3D的普及運用,UI插圖也會迎來3D化,給用戶帶來更立體,更新鮮的視覺感受。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          8. 講求敘事表意

          相較于往年追求形式的UI插圖,新趨勢下的插圖更講求功能性,每一副插圖都承載一定的作用——傳達功能信息或透傳品牌情感;同時插圖更講求畫面表意和情節,給用戶敘事性的視覺體驗,增進用戶和產品之間的情感聯系。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          9. 插圖組件化

          插畫的流行,隨之而來的是成本的水漲船高——一套系列插圖為保持風格統一,往往由唯一設計師繪制,同時為兼容各類場景,設計師往往要繪制多張。

          為解決插圖的成本和效率,插圖開始以組件化的方式進行繪制——插圖設計師將插畫進行拆分繪制——不同人物,不同場景,不同物件等,再通過組件化的拼接合成,使用組件的設計師可以根據需求場景自由組合,也避免了風格不統一問題。

          設計師Pablo Stanley將日常繪制的插畫制成一套矢量插圖組件庫,將人物分為:半身、全身和坐姿3大類。通過不同表情、發型和服裝可自由搭配出近60萬種組合。

          Pablo Stanley人物插畫系統:https://v.qq.com/x/page/s3108yeyhmt.html

          10. 多維度動畫表現

          新趨勢下,動畫一方面回溯復古線描手繪風格,另一方面追求更三維的體驗,同時幀率進一步提升,追求更流暢的視覺感受。

          11. 手繪動畫

          手繪插圖是往年的熱門,其隨性自然的筆觸,能給用戶帶來親切的感受,在新的趨勢下,動畫的加入賦予手繪插圖一份靈性和趣味。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          12. 3D運動

          Google Material Design通過卡片投影層級和二維動畫規律,賦予扁平界面Z軸的縱深感。隨著3D的普及流行,新趨勢下的界面,界面的運動從二維走向三維,表現出3D場景下透視感。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          13. 高幀率動畫

          高幀率影視從線下電影院移步到線上流媒體,手機高幀率屏幕從90Hz到120Hz逐步升級,用戶對畫面流暢的定義一再刷新,UI動畫的幀率升級也會是新的一輪趨勢。

          Telegram的表情采用了高幀率動畫,給用戶更流暢的視覺感受。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          更的涉及協作方式

          體驗的持續升級,產品的高速迭代,對UX設計師的設計師效率提出了更高的要求。的設計方式是一個永恒的趨勢。

          1. 從本地文件到云端協作

          傳統的文件交接方式效率低下,導致設計師之間信息不對稱,最終影響產品的一致性體驗。近些年在線設計協同工具發展迅速,從UI設計、 設計交付以及組件協同等環節上給設計師提供更加實時的協作體驗,獲得大量UX設計師的簇擁。在2019 uxtool的設計工具調研中,在線設計協同工具佼佼者figma以其協作和性能優勢,大有追趕sketch之勢。

          隨著團隊對設計效率要求的提高,設計文檔從本地走向云端協作是不可逆趨勢。不過設計工具的迭代是需要成本的,尤其在大型設計團隊,設計工具需要渡過陣痛期來完成迭代,進而提升設計效率和體驗一致性。

          2. 科學有效的設計系統

          UX的發展,從早期的靜態規范到當下的動態設計系統,是為解決產品迭代增速后帶來的設計效率和產品體驗問題。商業驅動下的產品迭代速度有增無減,設計系統依舊會是未來幾年的設計趨勢之一。

          這里說的設計系統不是廣義上的設計系統,而是在互聯網設計的發展中,對組件化設計逐步迭代升華的一套設計協作方法:

          「設計系統(Design systems)是一組為了共同目標而服務的內在相互聯系的設計模式和多人協同執行的方法?!梗ㄒ浴禗esign systems》,Alla Kholmatova,C7210翻譯)。

          3. 設計系統歷程衍變

          組件化的發展歷經規范文檔到UI組件,再到設計系統,形態從最初對設計一致性的指導規范,到對產品研發流程的規范,以及產品設計價值觀的輸出,當下的設計系統以集大成者形式影響整個產品的設計形態。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          設計系統的結構見下圖:

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          4. 設計系統的求同存異

          設計系統并非一成不變的,他是一個動態進化的系統,會根據團隊性質、產品特性在內容上有所區分——比如大團隊更應該大而全,小團隊更傾向小而精;成熟產品的設計系統更傾向于打造完整閉環的合作流程機制,新產品的設計系統應該以小為始,快速迭代……

          隨著產品的垂直化,細分化,設計系統的趨勢會是在趨勢大同之下找到適合產品和團隊自身的形態和節奏。

          Material Design是一個包含了指導規范、組件,以及設計開發工具的自適應性設計系統。

          它作為平臺型性設計系統,更為大而全的規范了整個生態系統的設計風格,以及提供工具讓研發者能快速產出符合規范的產品。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          △ Google生態龐大繁雜,Material Design更為全面

          Ant Design作為一個為to B產品提供解決方案的平臺,更多從設計可用性和完整性考慮設計系統的搭建。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          △ Ant Design通過模塊化解決方案,降低冗余的生產成本,讓設計者專注于更好的用戶體驗

          QQ作為一款面向95后的2C社交產品,其設計系統Q語言從風格調性上對設計進行規范,同時給予設計師一定的自由度;也考慮到QQ內兼顧多個產品,以及界面主題樣式,對基礎組件的使用場景和代碼進行了規范,方便設計和開發敏捷開發。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          Q語言,給予產品的自由調性之外,也針對主題和基礎組件進行了規范。

          每個產品和團隊都有自身的特征,設計系統的建設也應該有的放矢,沒有可照搬的標準答案,在大方向下找到適合自身的解決方案才是的可行之道,將效率最大化。

          5. 科學有效的優化迭代

          組件是設計系統中的重要組成部分,但是以往靜態的、孤立的協作方式使得組件的更新迭代滯后和阻塞。隨著設計系統的發展,設計師組件化思維的普及,組件的更新需要更科學的方式進行管理。

          Figma在2019年推出的Design System Analytics功能,組件設計師可以借此查看組件的使用情況,包括引用次數,解組次數等,并可以生成組件使用情況的曲線趨勢圖,以數據的形式,科學地推動組件的優化迭代。

          騰訊萬字干貨!2020-2021 設計趨勢報告:用戶體驗篇

          選擇分析的時間段;組件使用的次數曲線圖;團隊使用情況;所有組件使用情況

          后記

          未來的用戶體驗會出現什么新趨勢?人工智能等算法的發展、5G技術普及、新的智能設備形態、新的信息處理技術、新一代用戶的喜好和口味……這些往后或將影響用戶體驗發展的走向。未來用戶對體驗的要求只會越來越高。

          用戶體驗設計師需要了解更多的技術動向,但安身立命之本還是讓用戶真正受益:立足于用戶真實使用場景,在理性價值層面上,打造可用、易用、的設計;在感性需求層上賦予情感上的愉悅性,在反思層面賦予意義價值。

          文章來源:優設    作者:騰訊ISUX

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          資深UI設計者

          近年來暗黑模式的設計趨勢開始一點點明顯,Ant Design 在這次 4.0 的升級中也對這類暗黑場景化的設計開始進行初步的探索,接下來就讓我們一起來看下 Ant Design 這一針對企業級的設計體系是如何設計暗黑模式的。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          什么是暗黑模式

          暗黑模式是指把所有 UI 換成黑色或者深色的一個模式。

          需要說明的是,暗黑模式不只夜間模式:

          暗黑模式更多的目的是希望使用者更加專注自己的操作任務,所以對于信息內容的表達會更注重視覺性;

          而夜間模式則更多是出于在夜間或暗光環境使用下的健康角度考慮,避免在黑暗環境中長時間注視高亮光源帶來的視覺刺激,所以在保證可讀性的前提下,會采用更弱的對比來減少屏幕光對眼睛的刺激。

          同時,從使用場景上來說,暗黑模式既可以在黑暗環境,也可以在亮光環境下使用,可以理解為是對淺色主題的一種場景化補充,而夜間模式只建議在黑暗環境下使用,在亮光環境使用時很可能并不保證信息可讀性。

          為什么 Ant Design 要做暗黑模式

          1. 更加專注內容

          試想一下,我們在電影院看電影時,為什么要全場關燈?甚至有些 APP,在影片的下方也會又一個模擬關燈效果的操作,來讓整個手機屏幕變黑,只剩下視屏畫面的部分,這都幫助我們可以更專注、更沉浸在當前的內容下。

          色彩具有層級關系,深色會在視覺感官上自動后退,淺色部分則會向前延展,這樣對比強烈的層次關系可以讓用戶更注重被凸顯出來的內容和交互操作;尤其在信息負責界面內層級關系的合理拉開對操作效率都有明顯的促進作用。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          2. 在暗光環境下更加適用

          如今社會我們身處黑夜使用手機、電腦、iPad等設備的次數越來越多,環境光與屏幕亮度的明暗差距在夜間會被放大 ,亮度對比帶來視覺刺激也更加明顯,使用暗色模式可以縮小屏幕顯示內容與環境光強度的差距,同時也可以為設備的續航帶來積極影響,可以保證使用者在暗光環境下使用 OLED 設備的舒適度。

          3. 大眾喜愛

          黑色一直以來就可以給人以高級、神秘的語義象征,相比于淺色模式,暗色模式藏著更多可能性。

          設計原則

          在這次暗黑模式的設計中主要遵循以下兩大設計原則

          1. 內容的舒適性

          不論是顏色還是文字或是組件本身,在暗色環境下的使用感受應當是舒適的,而不是十分費力的,如果一個顏色在淺色下使用正常,在暗色下卻亮的刺眼或根本看不見,那必然不夠舒適也不可讀;所以在顏色的處理上不建議直接使用,這樣會讓界面變得到處都是「亮點」,讓眼睛不適的同時,也會帶來許多誤操作。

          2. 信息的一致性

          暗黑模式下的信息內容需要和淺色模式保持一致性,不應該打破原有的層級關系。舉個例子,在淺色模式下越深的顏色,與界面背景色對比度越大,也就越容易被人注意,視覺層級越高,比如 tooltip;在暗黑模式下我們同樣需要遵循這一規律,所以對應所使用的顏色也就越淺,反之則會越深。

          如何設計

          1. 界面層級

          在大量的企業級產品界面中,我們通常用只用一個白色背景結合分割線就可以搞定所有界面的板塊層級,因為在淺色模式下有投影可以借助,然而暗黑模式中投影將不足以起到如此功效,我們需要通過顏色來區分層級關系。

          在經過對螞蟻企業級頁面的典型布局結構評估后,我們在中性色中增加了三個梯度,將中性色擴展至 13 個

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          并定義出通用情況下頁面中的框架層次,主要分為三大塊:

          • 應用框架:也就是我們平時定義的導航欄,也是在大結構中最上層的一部分
          • 內容組件:指頁面中的具體內容,通常情況下以區塊的形式存在,作為第二層級
          • 頁面容器:顧名思義,指頁面級別的容器盒子,可容納頁面中的所有內容,可以理解為是一個背景板,也就是最末層

          在目前的暗黑體系下,我們分別為這三大塊從淺到深定義了#1F1F1F、#141414、#000000 三個顏色,在實際應用中,你也可以根據自身業務的需求,從中性色板中直接選用或是依據透明度的思路自定義出合適的中性色彩。當定義出較為明確的框架層次和顏色后,也對后續系統中組件的顏色配置有著重要的指導意義。我們需要考慮組件出現在不同顏色背景下的可能性及其表現,盡量保持一致性。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          2. 色彩

          眾所周知,暗黑模式與淺色模式最大的不同就在色彩的處理上,在暗黑模式中,我們并不想打破淺色模式下基礎色板的配置規律及色值,當一個應用或站點深淺模式并存時,希望在色彩上有一定延續和關聯,而不是毫不相關的兩套色板,這樣一是避免開發及后續的維護成本,二是實際切換和使用時,可以保證一致性,這意味著需要借助一定規則。

          這里分享一下我們的處理思路:

          基于 Ant Design 自然的設計價值觀,我們先從自然界中尋找靈感,如果說淺色模式如同初升時的朝陽,那暗黑模式就是落日下的晚霞,各有各的韻味,同一片天,唯一不同的是,受光線亮度的影響,晚霞整體會暗一些。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          所以我們大體的設計思路也是基于淺色的基礎色板,通過結合透明度的轉換,去得到一套暗黑模式下的色彩。這樣的好處是,深淺模式下的色彩根基是同一個,在這樣的基礎上經過透明度的變換得到的結果也會相對和諧,同時也符合我們一致性的原則。

          這里我們借助下面這兩個概念對透明度進行轉換:

          對比度極性

          對比度極性分為正極性和負極性。

          • 對比度正極性:指在電子文本中文本為深色,背景色為淺色
          • 對比度負極性:指在電子文本中文本為淺色,背景色為深色

          這里可以給大家分享對比度查閱的一個工具:WebAIM,只要輸入色值就可以看到具體的值,十分方便。

          正負極性差值

          顧名思義便是正負兩者的差值,這里取的是絕對值。

          根據一致性原則,我們嘗試通過對比一套顏色的正負極性變化趨勢來找到轉換規律。

          首先可以看下,如果一個顏色在不做任何修改的前提下直接使用,它的正負極性趨勢以及差值趨勢的走勢和關系是怎么樣的,我們嘗試描繪出這樣的曲線,他們的變化規律也將作為我們規則轉換的參考標準。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          經過對比,可以發現一些變化規律:

          首先來說下「差值趨勢」,橫向對比可以發現,不同顏色的正負極性走勢是很不一樣的,可以看到在黃綠色段差值曲線達到一個變化峰值,這是由于黃綠色本身由于明度、飽和度值相比其他顏色偏高,所以總是有種刺眼的感覺,生活中也會用它來作為警示、提醒的作用,所以在深淺背景下的對比度有一個比較大的差異,可以說這個變化是正常的。

          這點也可以從「正負對比度極性趨勢」兩者間的相對關系反應出來,從紅色到洋紅,綠線一開始從逐漸在藍線的上方一點,開始逐漸上移,最后在峰值處開始慢慢下移,在「極客藍」這個色相中接近重疊,在洋紅處又慢慢下移,說明淺色下越深的顏色,在深色中越亮,反之則越暗。

          縱向比對單個色板,可以發現,其斜率變化主要受顏色的明度、飽和度影響,可以反應一個顏色的不同梯度在黑白背景下的變化規律。

          有了這個大的變化規律,我們便可做到心中有數。首先以 Ant Design 的品牌色「破曉藍」為例,經過在多個業務、場景中不斷嘗試與調整,我們得到一個透明度轉換規則:

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          并將這個規則應用在其他 11 套色板中,驗證其可用性。這個過程確實沒有什么快捷通道,唯一的辦法就是不斷嘗試。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          最后,我們將經過規則轉換的實色與常規顏色的變化趨勢做對比:

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          可以看到在大趨勢走向上左右兩側圖基本一致,這代表兩個色板在變化規律接近一致,基本可以證明規則的合理性。區別在于,對比度負極性和差值相對于右側未經處理的值明顯有所下降。這是由于透明度的處理讓暗色下的顏色在明度、飽和度上有所下降導致。

          再仔細觀察可以發現,在左側的常規顏色中,從破曉藍-洋紅這段偏冷色系幾個顏色中,差值趨勢變化最平緩的是「極客藍」這顏色,這說明該顏色在深淺背景下的表現較為穩定,起伏不大,當基于一個統一的透明度規則前提下,會讓它在暗色下的對比度減弱,所以反而會導致差值趨勢變大,所以我們會發現差值趨勢變化較小的顏色轉移到了「破曉藍」、「洋紅」中,也是一個正常現象。

          最后可以看到顏色在調整過后實際應用的效果

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          在官網中點擊「切換」即可預覽:

          如果上述 12 個色板不滿足你的業務需求,你也可以在官網上自己選擇顏色,我們會根據規則幫你生成一個暗色色板。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          另外,如果在實際應用過程中,你選了色相在 225~325 間的深冷色系作為主色或強調色使用,建議適當提高透明度的值,避免在暗色界面上引起閱讀障礙。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          3. 文字

          暗黑模式中,文字的使用與淺色模式基本一致,依舊從 85%-65%-45%,唯一不同的地方在 disable 的狀態,其透明度值提升為 30%,避免顏色過淡真的「不可見」。另外,對于 #FFFFFF 的純白色文字,盡量避免大面積使用,尤其對于表格、列表這類偏閱讀瀏覽的場景,如有需要,做小范圍強調即可。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          4. 陰影

          暗黑模式中的陰影規則與淺色模式基本保持一致,但由于本身的界面背景較深,在陰影色值上也有所加深,幫助層次更好的體現,整體將色值擴大到原先的 4 倍,但在陰影的位移、擴展上均保持不變。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          5. 分割線

          分割線在暗黑模式中建議根據界面中常用的背景色,通過透明度換算成實色使用,Ant Design 中分割線主要有 #434343 和 #303030 兩種顏色,分別對應淺色模式下的 #D9D9D 和 #F0F0F0,這樣做的目的主要是為了避免帶來額外的交錯疊加,尤其對于表格類以及很多帶有 border 屬性的組件,實色會更為穩妥便于記憶。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          適應性

          適應性方面,Ant Design 的暗黑模式可以與海兔及可視化資產進行無縫銜接,使用時可以任意組合拖拽,你可以下載 Kitchen 插件,獲取海量資產。

          大廠如何做好暗黑模式設計?來看 Ant Design 的規范文檔

          結語

          暗黑模式最近越來越受到人們的關注,與某一特定產品的暗黑設計不同,Ant Design 的暗黑模式更多以設計體系的角度考慮企業級這個大場景下的內容,在易用性、擴展度、復用度等方面還有許多需要完善和繼續研究探索的地方,我們會在未來的迭代中逐步進行,先完成再完善。希望上述內容能對大家在暗黑模式的設計上有所幫助。

          文章來源:優設    作者:AlibabaDesign

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

          看似簡單的線框圖設計,這7個要點必須知道!

          資深UI設計者

          在這里,我們將研究設計中最簡單、因而常常被低估的活動之一,即線框圖的設計。了解什么是線框圖,為什么需要設計它們以及如何充分利用線框圖。

          什么是線框圖?

          線框圖,也稱為頁面示意圖或屏幕藍圖,是展示網站或產品框架的視覺指南:

          • 設計:線框圖常用在考慮用戶需求的情況下在頁面上布置內容和功能。
          • 開發:添加視覺設計和內容之前,在開發過程早期使用線框來建立頁面的基本結構。

          線框圖的主要目標是向團隊和利益相關者展示產品將包含的頁面和組件,以及這些元素之間的相互作用。

          為什么需要設計線框圖?

          1. 幫助團隊評估和完善工作范圍

          線框圖允許設計師快速創建產品的視覺表現,方便后期修改;

          幫助設計師向團隊展示應用程序具有的頁面元素和控件,以及所有元素如何進行交互。

          2. 讓團隊所有成員參與產品設計

          線框圖的使用允許設計師和開發人員在早期階段共同參與討論設計,在開始進行視覺設計之前就提供反饋和更改建議。

          這樣有助于使設計過程快速迭代,避免不必要的浪費。

          3. 方便快速演示

          從客戶和利益相關者那里獲得快速反饋是設計過程的重要組成部分。

          設計過程中,經常會遇到需求的來回變化。有了線框圖,可以使這個過程更有效,修改原型比修改線框圖需要更多的時間和精力。

          4. 進行用戶測試

          線框圖可以幫助設計師從潛在用戶那里獲得有用價值的反饋。同時瀏覽線框比讀取規范要快得多,還有助于減小與預期效果的差異。

          線框圖實際應用

          為了獲得最好的結果,為下一步的 UI 打下堅實的基礎,需要遵循幾個簡單的規則:

          1. 顏色的使用

          如果在線框圖中使用豐富的配色,可能會分散觀者的注意力,并使更新變得更困難。

          但在某些情況下,使用顏色突出顯示特定組件是合理的。例如,可以將紅色用于錯誤狀態,將藍色用于注釋等。

          2. 使用簡單的組件

          線框圖并不包含全面設計和詳細說明的組件。相反它們應該設計的相對簡單,讓團隊成員更容易識別。

          為組件添加細致的陰影、粗細描邊將花費大量的時間和精力,卻不是很實用。

          3. 保持一致性

          在所有線框圖中,類似的組件必須看起來相同。如果相同的組件看起來不同,開發人員可能會質疑它們的功能是否相同,甚至會因為設計不同而增加估算時間。

          在處理線框圖時,記住一個簡單的規則:保持一致,避免造成混淆。

          4. 使用真實內容

          我們會常看到UI/UX設計師沒有在線框圖上添加真正的內容,而是重復使用同一些文本。這是很少有設計師意識到的普遍錯誤。

          內容真實與否會影響接下來的設計。如果使用不真實的內容,UI設計中文本的數量多少和排布方式都要再調整。

          真實內容能給線框圖增加價值,更好地解釋上下文。

          5. 使用注釋

          設計中可能會遇到某些解決方案無法直觀地加以說明的情況,例如某些控件背后的邏輯,因此開發人員可能會對它們有疑問。

          在這種情況下,可以提供注釋來解釋其背后的邏輯。這樣,你的團隊就會理解你的解決方案,你就不需要花時間再討論它們。

          6. 線框圖程度

          線框圖應該選擇低保真還是高保真,沒有嚴格的規定,取決于項目的具體要求。

          硅谷知名作家埃里克·萊斯認為,如果不能帶來價值就不需要做額外的工作,從基礎做起,然后根據需要添加細節。

          7. 將線框圖延伸到交互原型中

          在使用不同產品時,有一些簡單而通用的交互,也有一些交互相當復雜。

          在線框圖不足以說明復雜性的情況下,可以將線框圖擴展到交互原型中,而不必寫冗長的注釋并花大量時間進行解釋。

          總結

          將線框圖結合到設計過程中,為我們所用:

          • 幫助團隊獲得更的項目估算;
          • 讓所有團隊成員參與設計流程,避免影響開發過程的錯誤;
          • 提前向客戶、利益相關者進行演示,以盡快獲得反饋,節省開發不良解決方案的時間。

               文章來源:優設    作者:Clip設計夾

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


          2020年越來越火的車載交互該怎么設計?來看前輩的經驗總結!

          資深UI設計者

          這次我們不聊視覺,也不暢想未來,只說說當下 HMI 產品設計與交互體驗。

          本文內容會涉及一些專業的汽車知識名詞,因為篇幅有限,如有些知識名詞不太明白可以百度一下。

          別看錯了,不是HDMI!

          說到 HMI 大多數設計師應該是既熟悉又陌生,HMI 是 Human Machine Interface 的縮寫,「人機接口」,也叫人機界面,人機界面(又稱用戶界面或使用者界面)是系統和用戶之間進行交互和信息交換的媒介, 它實現信息的內部形式與人類可以接受形式之間的轉換,凡參與人機信息交流的領域都存在著人機界面。

          聽起來是不是覺得這不就是 UI 嗎?有什么區別嗎?似乎差不多,幾乎是沒有區別的,只不過是在某些場合和設備上管他叫 UI,比如移動端設備,而在另外某些場所和設備上管他就叫 HMI,比如汽車車機和數控機床。所以這個概念也不用去特別較真,HMI 就權當作是汽車上的 UI 界面吧。畢竟汽車是高科技與工業結合的完美產物,「HMI」念出這個詞時候就感覺是蠻專業的!很般配!

          HMI前世與今生?

          剛才說 HMI 最早更應用于工業上,比如常見的各種機床、制造裝備。

          或者說讓時間再向前推進一點!

          而這里通常意義的 HMI 則更加聚焦點,基本特指汽車車機或者車載多媒體設備。

          說到這里還是要從車載儀表盤說起,從德國人卡爾·本茨發明世界第一輛汽車,距今已經 100 多年的時間了,在那些還沒有 HMI 這個名詞的年代,那么他是以什么形態出現的?那就不得不提「儀表盤」了。

          當然寫這篇文章并不是去評測誰家 HMI 更優秀,而是希望通過一些假設、實驗和推斷,和大家一起來探討一下如何更有效地設計 HMI。

          屏幕越大越好?車內到底需要幾塊屏幕?

          我們先從屏幕開始。

          說到屏幕,設計師都是比較敏感的,因為我們最終的設計交互創意都是需要都是在屏幕上顯示展示出來的,HMI 當然也不例外。現在在車載屏幕上你能看到最大尺寸多大?

          拿特斯拉為例,Model S 和 Model X 車型都是 17英寸,Model 3 為 15 英尺。

          當然他肯定不是最大的,熟悉汽車朋友你應該知道我想說誰了,沒錯就是他!擁有 48 寸可多段升降屏幕的 BYTON 新能源概念車 M-Byte!48 寸的確很夸張,難道屏幕越來越大就是未來 HMI 的方向嗎?

          當然這個問題肯定是否定的,為什么?那就要從車載屏幕的作用來說起。

          首先我是作為一個曾經就職于汽車公司的設計師,并且是一名地道的汽車發燒友,憑借對汽車還算熟悉和熱愛做出一些產品交互分析,以下如有不妥之處還望海涵。

          汽車內屏幕的作用

          按照功能場景總體可分為三類:主行駛狀態信息、附設備狀態信息、多媒體 & 外設

          不可缺少還需要與使用者、場景結合,我們先來做一個大概的用戶畫像。

          對應這些需求,汽車需要有儀表臺(屏)控制和顯示的區域有五個。

          五個區域分別是:

          • 主駕駛儀表屏
          • 中控臺控制(屏)
          • 后排娛樂屏
          • 副駕駛信息屏
          • 扶手控制臺(屏)

          其中前三個是主流配置,后兩個比較少見。

          關于汽車設備這塊我們不做深入展開了,畢竟這篇文章主要討論的還是設計,直接看結果!

          題外音:屏幕安全性的考量

          汽車是比較特殊的設備,基于安全性考慮,汽車內屏幕尺寸不宜太大與太多。

          屏幕總體為玻璃材質,但與車窗擋風玻璃的材質不同,當汽車遭遇碰撞的時候,車內屏幕極易破損并形成尖銳物,極大可能會乘坐人員造成二次傷害,所以車內屏幕不易太多,更不易太大。雖然車載屏幕變大變多已不可逆轉,而且隨著屏幕技術的提升,柔性 OLED 的應用也將會在一定范圍解決安全問題。但也需要汽車相關設計者多在安全方面進行考慮,任何產品體驗應該建立在安全基礎之上的,特別是交通工具。

          物理實體按鈕過時了?

          為什么大屏幕操控成為了當前的 HMI 主流了呢?那不得不去提一下另外一個我們熟悉的設備——手機!

          同樣一個有限的區域,如果用物理按鍵那么這個區域只能是固定的功能,而屏幕就可以無限擴展。特別是在汽車中控屏上集成內容會很多,體現就更加突出。

          但是在汽車上的全部使用屏幕真的是最佳選擇嗎?顯然這是有待商榷的。

          不可否認屏幕的確有很強的擴展性,但是缺點也是明顯的:1.觸控反饋缺乏 2.交互效率不高

          對于這樣的判斷,我們可以通過兩個實驗來進行驗證。

          將類似于 Surface Dial 這種智能按鈕交互裝置引入汽車的屏幕控制中,每個按鈕可以根據情景進行自定義,并且吸附到汽車屏幕的任何位置進行交互操作,相信這一定是一種全新的使用體驗。當然這一定是需要解決比如吸附力、安全性等一系列問題。

          屏幕觸控反饋

          雖然目前的屏幕還無法做到完美觸控反饋,但已經出現了一些新的硬件技術來試圖解決這些問題,比如 Tanvas Touch,其定義為 「手指與觸摸界面之間的電子壓力控制」。簡單來說他們的產品就 「皮膚的磁鐵」 一樣,能夠更加精準地感應手指的動作,最后結果就是比 Apple 的 3D Touch 更加具有壓感的觸摸操作表現。

          原理是利用手指尖觸摸顯示屏時產生的靜電引力來模擬觸感,通過電磁脈沖把更的反饋發送到用戶的指尖。

          Tanvas 也正在與汽車制造商們合作把這項技術嵌入到汽車或屏幕上,讓人們更容易感觸受到不同物體的表面。

          也許在未來我們真的會遇到他。

          文章來源:優設    作者:殘酷de樂章

          交互設計師常用的設計理論與心理學

          ui設計分享達人

          掌握好常用的設計理論與心理學知識,能幫助我們對用戶的人性特征的拿捏,幫助我們較大的影響用戶底層決策,以產品實現業務目標。

          一、尼爾森10大可用性原則


          1、狀態可見原則

          不局限于:用戶的當前狀態、知道當前任務要做什么、任務進度等。

          2、環境貼切原則

          設計要復合目標用戶的認知,符合用戶的心智模型,于是熟悉的事物越容易被用戶所接受。

          3、撤銷重做原則

          操作前可預知,操作中有反饋、操作后可撤銷。

          4、一致性原則

          不局限于:業內產品的一致性、產品內的一致性、版本迭代間的一致性

          5、防錯原則

          錯誤行動發生前,引導用戶向正確的方向前進;用戶觸碰到危險操作時給予提示;危險操作發生之后,提供撤回的入口。

          6、易取原則

          通過使用對象、動作和選項的可視化表達,最大限度地減輕用戶的記憶負擔。

          記住用戶的操作記錄、一個流程對應一個操作目標、提供適量的信息、選擇而不是輸入。

          7、靈活原則

          好的產品需要同時兼顧新用戶和資深用戶的需求。對新用戶來說,需要功能明確、清晰,對于老用戶需要快捷使用高頻功能。不可迎合某一種用戶,把不必要的信息占據重要部分。

          8、易掃(讀)原則

          不要包含不相關或低頻次的信息/操作。頁面中的每個額外信息都會降低主要內容的相對可見性。

          產品設計的四大基本原則:親密性、對齊、重復、對比。

          9、容錯原則

          錯誤信息應該用通俗易懂的語言表達,較準確地指出問題,并且提出解決方案。避免通過代碼等用戶難以理解的形式

          即:提供解決方案、幫助用戶從錯誤中恢復

          10、人性化幫助

          如果系統能讓用戶不需要閱讀文檔就會使用那是最好的,但通常情況下還是需要幫助文檔的。任何信息應該容易被搜索,且專注于用戶的目標任務,并列出具體的步驟來告知用戶。


          二、費茨定律

          翻譯成人話就是:

          1. 按鈕做大點(W大點)更易于點擊

          2. 將按鈕放置在離開始點較近的地方

          3. 相關按鈕之間距離近點(D小點)更易于點擊

          4. 屏幕的四角與四邊是「無限可選中」位置(非移動端)

          5. 通過費茨定律的反向使用,可以降低按鈕被點擊的可能


          三、米勒定律


          米勒定律預測人的工作記憶能夠記住的項為7(±2)個。1956年認知心理學家喬治·米勒發表了一篇論文,他討論了短期記憶和記憶跨度的極限。

          不要亂用 “神奇的7” 為設計進行不必要的限制;

          將內容整理為較小的單元,以便用戶輕松地處理、理解和記憶。


          比如電話號碼的顯示方式、銀行卡的顯示方式等


          四、接近法則


          觀察者看到彼此鄰近(空間或時間)的物體時,會將它們視為一個整體。

          在界面設計中,對信息的組織已經離不開這個法則了,他在界面中所體現的就是把相關的信息塊組合在一起,不太相關的分離開,增強與區分元素之間的關聯性,所強調的是空間和位置。

          接近法則產生于群組,它可以減少信息設計的復雜性,對引導用戶的視覺流、便于用戶對界面的解讀起到至關重要的作用。


          五、席克定律


          ??硕墒且环N心理物理學定律。用戶所面臨的選擇數量越多,做出選擇所花費的時間就越長,在人機交互的界面中選項越多,意味著用戶做出決策的時間越長。


          六、泰斯勒定律(復雜性守恒定律)


          泰斯勒定律又稱復雜性守恒定律,該定律認為每一個過程都有其固有的復雜性,這個復雜性存在一個臨界點,超過了這個點就不能再簡化了,你只能將固有的復雜性從一個地方移動到另外一個地方。


          七、奧卡姆剃刀原理


          奧卡姆剃刀原理的核心思想為:“切勿浪費較多東西去做用較少東西同樣可以做好的事——如無必要,勿增實體,即簡單有效原理”。


          八、防錯原則


          操作前有提示,操作中有反饋、操作后可撤銷。


          九、損失厭惡


          損失厭惡是指人們面對同樣數量的收益和損失時,認為損失更加令他們難以忍受。同量的損失帶來的負效用為同量收益的正效用的2.5倍。損失厭惡反映了人們的風險偏好并不是一致的,當涉及的是收益時,人們表現為風險厭惡;當涉及的是損失時,人們則表現為風險尋求。


          十、安慰劑效應


          “安慰劑效應”指的是,對于某種無效的療法或干預手段,僅僅是“相信它有效”,就能改善健康,并能改變認知


          十一、多爾蒂門檻


          研究結果表明,計算機的響應速度直接影響了使用者做出下一個決定所要花費的時間(這個時間被稱為用戶響應時間),換句話說,計算機相應的時間越長,用戶就要花費越多的時間來思考和決定下一步的操作。


          合理的操作響應時長、方式有助于用戶保持專注和提率。

          軟件操作的過度動畫時間不宜太短或太長,最常見于 400ms 左右。

          如果無法避免操作中較長讀取、等待時間,那么就用其他更有趣的動畫、頁面來減少用戶的焦慮感。


          十二、馬斯洛需求層次理論


          馬斯洛需求層次理論是人本主義科學的理論之一,由美國心理學家亞伯拉罕?馬斯洛在1943年在《人類動機理論》論文中所提出。書中將人類需求像階梯一樣從低到高按層次分為五種,從低到高依次是:生理需求、安全需求、社交需求、尊重需求和自我實現需求。

          但最終馬斯洛添加求知需求和審美需求,自此馬斯洛需求層次理論最終定型為8層。

          十三、格式塔心理學


          格式塔原則描述了當某些條款和條件被應用時,人類大腦如何感知視覺成分。它幫助大腦創造視覺的意象。因此,格式塔原則基于六個主要類別:

          位置和位置;

          接近;

          對稱與秩序;

          類似;

          關閉;

          連續性。


          十四、自我參照效應


          第一種是精細加工說:在記憶過程中,這些事物在頭腦中被進行了精細加工,與頭腦中的已有知識之間建立了更多的聯系,因此回憶時的提示線索更多,回憶效果更好。

          第二種是組織加工說:于自我的知識是頭腦中存在的一種結構良好的組織體系,它對與自己相關的事物有更好的固著作用;同時,由于自我知識常常被激活,因此與之相關的信息也更容易被相應地激活起來,這樣回憶起來也就更容易。

          第三種是雙過程說:即自我參照任務能提高記憶的機制既包括精細加工因素,也有組織作用的參與

          廣告商會挖空心思的建立商品和你的關聯,告知我們如果你購買了我的商品,你就會獲得怎樣的好處。而自媒體人則在標題上盡量簡明扼要的說明,我要說的事情和你密切相關,不看就虧了。所以,稍微有深度的文章在快餐式的自媒體平臺中反而閱讀量不高,這是因為文章標題所涵蓋的內容可能只和少部分人有關。


          十五、上癮模型


          1、觸發:提醒人們采取下一步行動


          觸發分為外部觸發與內部觸發

          外部觸發又分為:

          付費型觸發、回饋型觸發、人際型觸發、自主型觸發。

          內部觸發

          內部觸發通過用戶記憶存儲中的各種關聯來提醒他們采取下一步行動。

          比如餓了的時候想起餓了么,想健身的時候想起keep


          2、行動:人們在期待酬賞時的直接反應


          福格行為模型可以用公式來呈現,即B=MAT。B代表行為,M代表動機,A代表能力,T代表觸發。要想使人們完成特定的行為,動機、能力、觸發這三樣缺一不可。 否則,人們將無法跨過“行動線”,也就是說,不會實施某種行為。

          比如說中午十一點你餓了想到餓了么訂餐但是由于你的手機沒電了定不了餐,中午要吃飯是動機,訂餐想到叫餓了么外賣是觸發,能夠用手機訂餐是能力,但是因為手機沒有電 你就缺乏了相應的能力所以這個行為就沒法完成。(當然你也能用朋友的手機訂餐,這里只是舉個例子)


          福格總結了簡潔性所包含的6個元素 ,即影響任務難易程度的6個要素,它們是:


          • 時間——完成這項活動所需的時間。

          • 金錢——從事這項活動所需的經濟投入。

          • 體力——完成這項活動所需消耗的體力。

          • 腦力——從事這項活動所需消耗的腦力。

          • 社會偏差——他人對該項活動的接受度。

          • 非常規性——按照福格的定義,“該項活動與常規活動之間的匹配程度或矛盾程度”。


          四種非常規的效應刺激動機:


          • 稀缺效應:(限量1000件)

          • 環境效應:(同一款啤酒在便利店和高檔就把價格不一,但人們愿意為價格買單)

          • 錨定效應:(瑞幸咖啡定價24元的拿鐵對標星巴克的32元拿鐵)

          • 贈券效應:(利益進度吸引用戶動機)


          3多變的酬賞:滿足用戶的需求,激發使用欲


          多變性會使大腦中的伏隔核更加活躍,并且會提升神經傳遞素多巴胺的含量,促使我們對酬賞產生迫切的渴望。 研究測試表明,當賭博者贏了錢,或是異性戀男性看到美女的圖片時,大腦伏隔核中的多巴胺含量會上升。

          多變的酬賞主要表現為三種形式:社交酬賞、獵物酬賞、自我酬賞。那些讓我們欲罷不能的習慣養成類產品或多或少都利用了這幾類酬賞。


          社交酬賞

          所謂社交酬賞,是指人們從產品中通過與他人的互動而獲取的人際獎勵。比如微信的點贊評論、站酷的推薦,用戶能夠獲得社交的認同。


          獵物酬賞

          獵物酬賞,是指人們從產品中獲得的具體資源或信息。


          自我酬賞

          所謂自我酬賞,是指人們從產品中體驗到的操控感、成就感和終結感。


          4、投入:通過用戶對產品的投入,培養忠實用戶


          要想讓用戶產生心理聯想并自動采取行動,首先必須讓他們對產品有所投入。


          用戶對某件產品或某項服務投入的時間和精力越多,對該產品或服務就越重視。事實上,有充分證據表明,用戶投入的多寡與其熱愛某項事物的程度成正比。


          1、文飾效應心理


          (1)我們總是高估自己的勞動成果。

          (2)我們總是盡力和過去保持行為一致。

          (3)我們總是避免認知失調。


          2、點滴投入


          (1)儲存價值

          (2)內容

          (3)數據資料

          (4)關注者

          (5)信譽

          (6)技能


          3、加載下一個觸發


          用戶投入的同時也可以通過加載下一個觸發的令自己重新開始上癮循環,從而增加了進入上癮循環的可能性。


          十六、雅各布定律


          雅各布定律(簡稱雅各布互聯網用戶體驗法則),它指出如果用戶已將大部分時間花費在某個網站上,那么他們會希望你的網站可以與那些他們已熟悉的網站一樣擁有相似的使用模式。


          我們在與新事物互動的過程中,用戶使用的是以往的經驗


          對設計師來說,我們可以匹配用戶的心智模型來改善體驗。因此,用戶可以輕松地將已有經驗從一種產品或體驗轉移到另一種上,無需額外了解新系統的工作原理。

          當設計師與用戶的心智模型一致時,良好的用戶體驗就得以實現。


          十七、KANO模型


          KANO模型大家可以看看這個童鞋的總結很詳細

          https://www.zcool.com.cn/article/ZMTAyMjQ3Mg==.html


          十八、古藤堡表圖表法


          人們在瀏覽頁面或布局時視線趨于從左上角移動到右下角

          古騰堡圖表法說明我們觀看頁面的視線并不是鏡面對稱的,我們需要在設計中避免出現此類錯誤但絕不是墨守成規,將頁面的 Logo放置在左上角而主體向右下角延伸,左下和右上作為視覺的盲點可以添加輔助元素


          十九、尼爾森F型視覺模型


          尼爾森F型視覺模型由 Jakob Nielsen于2006年提出

          他指出,我們在第一次觀看頁面時,視線會呈 F的形狀關注頁面。
          1.先從頂部開始從左到右水平移動。
          2.目光再下移開始從左到右觀察但是長度會相對短些。
          3.以較短的長度向下掃視,形成一個 F形狀,此時我們的閱讀速度較慢,更為系統和條理性。


          二十、序列效應


          1.在列舉信息時,排在最前和最后的元素,比排在中間的更容易讓人記住。

          2.對排在開頭的信息產生加強的回想效果,稱為:初始效應,人們有時候會把最前面的信息儲存在長期記憶中。排在結尾的信息產生加強的回想效果,稱為:時近效應。時近效應適用于聽覺刺激。初始效應適用于視覺刺激。

          3.在列舉信息元素時,如果列舉信息屬于視覺性,那么把重要的信息放在最前面;如果是聽覺性,就放在最后面。如果是用戶必須做決定,并且是最后一項出現后馬上做決定,那么就將想要用戶做決定的信息放置最后,以便增加獲選概率,否則放在最前面。

          4. 應用例子:比如在很多app產品設計時,個人賬戶與設置基本放在頁面的最前面和最后面,這體現著產品信息的序列關系,重要次序,所以在進行設計時,可以在信息排序上遵循序列效應。 當然還有一些產品想對用戶進行引導操作,也可以利用這個法則,將信息放置最前或最后。

          轉自:站酷-YELLOW_J 

          用戶不信任你做的產品/界面?不如試試這5招

          ui設計分享達人




          前言:


          什么是產品的信任感??


          指:基于產品為用戶提供‘可靠服務、價值依賴’的一種情感體驗。


          這種體驗不僅影響著用戶黏性的強弱、業務目標的實現,也影響著不同生命周期下給產品給來的價值。如圖:



          而在產品與用戶間建立信任感的過程中,我驚奇地發現有3個因素貫穿始終:理念 > 內容 > 表現。


          ‘基于什么樣的理念,向用戶傳遞什么內容,并且怎么表現?!?/strong>



          所以,未來3篇文章主要圍繞‘信任感的打造’,希望能系統性地認識它,挖掘更多工作上可實用的小技巧。


          今天先分享第一篇:信任感的理念層



          信任的本質:是讓人覺得真誠、可靠、放心等。換句話說,它就是一種‘為用戶著想,建立產品溫度’的理念/方向,從而引導后續的內容都圍繞該理念而進行。


          那么,如何才能為用戶著想,慢慢建立起對產品的信任感呢??


          既然為用戶著想,那么可以試著從‘減少用戶的投入成本’切入。



          Part1:減少健康投入


          健康投入,指用戶使用我們的產品,可能會對身體上帶來直接或潛在的負擔/影響。比如視頻看久了,眼睛就會感到酸痛。


          針對這些負擔與影響進行的一些關懷提示,可以用戶提前消除、減輕這些痛苦,拉進與用戶間的距離。


          不同產品類型擁有專有的關懷點,所以比較通用的主要有5個:使用時長、使用姿勢、夜間休息、夜間護眼、音量大小。



          a.使用時長提示:


          除純工具類產品之外,大部分用戶在產品上都有一定的使用時長(尤其是內容消費類產品),對于‘連續使用N分鐘、或者滿足特定時長’的用戶,可針對該時長進行休息提示。


          如有道精品課,在用戶觀看課程滿40分鐘 時有個時長提醒:




          b.夜深關懷提示:


          深夜本身是一個休息的時間,但還是有大量的‘夜貓子’根本停不下來。不管是主動性的娛樂消費,還是被動性的信息/工作處理,都將手機‘進行到底’。


          此時對于‘深夜忙碌’中的用戶,夜間的關懷就是一個切入點:比如企業微信,會在深夜啟動頁上展示 ‘夜深了,xxx’的文案提示。



          雖然只是簡單的一句話,但還是能感受到鵝廠對員工的關懷。


          而且不管是C端還是B端,只要有用戶在深夜使用產品的可能,都可針對性地給予關懷設計,體現產品的‘人性’。




          c.夜間護眼提示:


          夜晚周圍的光線會變得幽暗,部分手機屏幕會自動變亮。時間一長會嚴重刺激用戶雙眼,并造成視覺疲勞(尤其是小學生群體)。


          此時對用戶進行護眼提示,不失為一個用戶關懷點。


          再如有道精品課:




          d.使用姿勢提示:


          我們日常都會將手機橫過來看視頻、看八卦。而且相信各位都有過這樣的經歷:



          當手機長期處于某個屏幕狀態+重力傾向時,用戶難免會出現手酸脖痛的情況。


          此時進行使用姿勢的糾正提醒,亦能起到關心用戶的效果,從而建立良好的產品印象。


          還是以有道精品課為例:



          e.音量提示:


          這個大伙都知道,過大的音量會影響耳朵聽力。一般出現在各種音頻、視頻的產品與功能中。





          Part2:減少金錢投入


          沒有人不會在意自己的錢包(除非你是對錢不感興趣...),金錢上的收入與支出很大程度上會影響 人們對某事物的看法。


          產品也是如此,若能幫用戶減少金錢上的支出,或者帶來真實收入。不僅能極大提升用戶對你的信任度與黏性,還能增加產品的競爭力。


          比如高德地圖的打車功能,能顯示所有車型的價格預覽,幫助用戶選擇所需價格的車型。



          無論是商品優惠券,還是返利。



          只要能幫助用戶錢包上的‘節源’或‘開流’,都能引發用戶的信任感,從而信賴產品。




          Part3:減少情感投入


          情感投入,是指用戶基于內心活動和情緒感受,對某事物所表現出來的一種想法。


          這種想法制約著 用戶是否接受我們的產品服務。一般體現在:安全性、性價比、真實性 3個方面。


          a.安全性 - 放不放心:


          人們面對某事物 可能會帶來的傷害/損失時,都會有一種本能的“警惕感”


          就拿此次疫情來說,對于有‘出差住房’訴求的用戶來說,‘住的安全’是重中之重。因此尋找一家‘無感染、每日消毒、衛生干凈’的安全酒店,可以減低用戶選擇我們的警惕感。



          而在酒店列表中,帶有‘嚴格消毒’、‘健康守護’等安全標簽的酒店,會給人帶來一種安全、放心、信賴的心理效應,從而提升該酒店的轉化率。




          b.性價比 - 值不值得


          性價比是人們衡量‘付出成本與回報價值’間的一種決策依據,沒有誰會喜歡付出小于回報的事物。


          而為了讓用戶降低這種決策依據,除了自我服務/實力的展示外,往往需要一種“參照物”來凸顯性價比。


          如美團上的‘滿減神器’,通過不同的食物/價錢間的對比,讓用戶買到最具性價比的食物。



          而“參照物” 的形式多種多樣,不管是競品數據。



          老版本也屬于一種競品


          還是是各種優惠信息、額外禮物/禮包、售后服務等等。



          目的都是通過該參照物,向用戶傳遞一種‘劃算’、‘值得’的心理效應。



          c.真實性 - 真不真實:


          光是性價比高還只是片面依據,至于內容是否屬實,成為了我們與用戶建立信任感 中最重要的影響因素。因為沒有人喜歡被騙、喜歡虛假事物。


          而真實性的建立,在‘電商領域’應該被運用得最多。如大牌背書、證書授權、專家介紹、明星代言、官方保證、銷量成績、用戶反饋...等等。




          展示自己的真實、最具實力的一面即可,別過度吹噓與包裝,用戶又不傻。




          Part4:減少腦力投入


          人們一向不喜歡復雜的東西,除了不易理解外,更擔心因為自己的理解錯誤,會給帶來意外的損失。


          幫助用戶減少記憶負荷、順暢完成操作目標,是每個產品必不可少的設計點。


          如微信轉賬,輸入數字時會檢測對應的數額,減去用戶邊輸入 邊計算“這是多少錢”的腦力投入。



          而且對比支付寶的轉賬,微信這點確實做到了‘洞察用戶需求’。



          再如賬號注冊,提供‘剩余步驟’能讓用戶了解 當前處于哪一步、預測完成整個操作還需多久。





          Part5:減少體力投入


          除了記憶負荷,‘操作負荷’的減少也是一種‘為用戶著想‘的方式。我們身邊也存在太多這方面的例子:


          如手機上,如淘寶的快鏈彈窗、支付寶的轉賬提示,都是前置用戶的目標,縮短操作流程



          如電腦上,如Mac會保存耳機音量。


          下次插入耳機時,會將揚聲時的音量,自動調整至上次耳機插入時 所記錄的音量。這樣就免去了重新調整音量的操作。


          以網易云音樂為例:注意 揚聲時和耳機插入后 的音量變化.



          這些都是幫助用戶快速使用,從而減少體力操作的方式。除了前置用戶目標、保存記錄 外,常見的還有:給予默認值、自動選擇/處理、多選與批量等等。



          總結:


          以上就是關于理念篇的內容,讓今后的內容設計有了明確的方向。下面是走查表,平時設計功能、制作界面的時候可以看看,增加產品的溫度。領取方式:公眾號回復【信任1】


          轉自:ui中國-

          語音交互中的“等待體驗”研究

          ui設計分享達人

          語音交互是最自然的人機交互方式,它極大地降低了人們與機器交互時的學習成本,已成為非常重要的人機交互方式。


          回顧人機交互發展史,人類先后經歷了基于命令行的CLI 時代,基于鼠標鍵盤的GUI時代,基于觸摸的初級NUI時代。后面每一個階段比前一個階段更自然,學習成本更低,綜合效率更高。

           


          進入AI時代,人工智能給機器帶來三種能力:感知能力、認知能力、自然語言輸出能力。感知能力使機器能聽得懂人類語言,認知能力使機器能思考如何回答人類問題,自然語言輸出能力使機器可以像人類一樣表達——三種能力的綜合運用將人機交互帶入語音交互階段。語音交互是最自然的人機交互方式,它極大地降低了人們與機器交互時的學習成本,將人機交互綜合效率帶上新的臺階,已成為非常重要的人機交互方式。

          “等待體驗”——語音交互體驗的三分之一

          生活中人與人的對話場景,對話是由“向對方說出一句話”、“等待對方回復”、“對方給出回復”三個階段不斷循環構成。其中“等待對方回復”是對話體驗的“三分之一”,會對回復的滿意度造成直接影響。在等待回復階段,如果對方處于認真思考的狀態,會讓我們覺得被重視;然而,如果在等待過程中對方的注意力不在對話本身,即便對方給出的回復再好,我們也會心存疑慮。



          對應到人機語音交互中的三個部分——“輸入體驗”、“等待體驗”、“回復體驗”,“等待體驗”同樣處于整個體驗循環鏈的中間環節,在語音交互體驗中起到了承上啟下的重要作用。但是,關于語音交互中的“等待體驗”在行業尚未被系統的研究,依舊處于模糊狀態。

           

          1. 響應時間一定是越短越好嗎?

          數字性能管理平臺Dynatrace對用戶瀏覽網頁的行為進行了研究,發現當網頁加載速度提升0.5秒,可促進用戶在網站的行為轉化核心數據提升10%。因此,在網頁設計和App設計中,盡量縮短等待時間是產品設計的不懈追求。

           

          不同于基于視覺的交互,語音交互天然附帶情感屬性。然而,情感的體驗是復雜的,它不只受效率這個單一變量的控制。大多數情況下,在生活中人與人對話時,一個過快的回答會給用戶帶來輕浮感和搶話感,而一個過慢的回答會給用戶帶來遲緩感和愚鈍感。


          那么,在語音交互中,究竟什么樣的響應時間能有最佳的體驗呢?響應時間的體驗趨勢是怎樣的呢?

           

          2. 等待體驗受哪些變量的影響?
          在視覺設計領域,當設計頁面的loading態時,為降低用戶的跳出率,設計師時常會通過給出進度條,或采用趣味性的情感化設計來消除用戶的不安情緒。

           

          但是在語音交互領域,語音的承載體是無形的,或不確定形態的,我們甚至沒有承載loading態的界面。在這種情況下等待體驗又受哪些變量影響呢?影響的程度怎樣呢?

           

          綜上,可以說在語音交互領域,等待體驗雖然重要,但目前仍是“一團迷霧”。鑒于此,我們以目前語音交互的主要載體——智能音箱產品為例,對AI產品中的等待體驗問題進行專題研究。

           

          二、智能音箱的等待體驗研究

          目前的智能音箱,主要采用先語音喚醒后輸入指令的語音交互流程。鑒于此,我們可以將智能音箱的使用過程分為兩個主要階段:

          1)喚醒階段:用戶通過指定的喚醒詞將音箱從等待態轉換為就緒態,音箱被喚醒后才可以接收用戶的語音指令。

          2)用戶請求及反饋階段:用戶給出語音指令內容以及智能音箱反饋結果滿足用戶的需求。

           


          針對這兩個階段,我們先后通過以下三個實驗進行研究。

          實驗一:喚醒階段的響應時間對等待體驗的影響;

          實驗二:用戶請求及反饋階段的響應時間對等待體驗的影響;

          實驗三:視覺、聲音等不同反饋方式對等待體驗的影響。

          下面我們對每個實驗的結論進行逐一詳述:

          實驗一:喚醒階段的響應時間對等待體驗的影響

          為了全面考察喚醒階段各種因素對等待體驗的影響,在實驗中,我們為用戶提供了不同喚醒響應時間和不同喚醒反饋方式的智能音箱。用戶完成實驗任務后,需要對音箱的喚醒響應速度進行評價(5點量表:太快了,接受不了;有點快,能夠接受;剛剛好;有點慢,能夠接受;太慢了,接受不了)。



          實驗一的結果表明最佳的喚醒響應時間與喚醒反饋方式有關,不同喚醒反饋方式下,最佳響應時間不同:

          1)當喚醒反饋為"燈光"反饋時,喚醒響應速度越快越好,在200ms時,用戶響應舒適度最高(對響應時間評價為剛剛好的用戶比例),73%的用戶對速度滿意。

          2)當喚醒反饋為"燈光+音效"時,喚醒響應速度的舒適時間為300ms左右,76%的用戶對速度滿意。

          3)當喚醒反饋為"燈光+人聲"時,喚醒響應速度的舒適時間為500ms左右,74%的用戶對速度滿意。

          (注意:本次實驗設置了市面上主流的三種喚醒反饋方式:燈光、燈光+音效、燈光+人聲,以給不同反饋情況的響應時間感受作參考,但對最優反饋方式,除了響應時間還受其他因素影響,將另著篇章探討。)



          實驗二:用戶請求及反饋階段響應時間對等待體驗的影響

           

          由于用戶請求及反饋階段的響應在技術實現和用戶預期上,與喚醒階段的響應存在差異,因此我們通過第二個實驗對用戶請求及反饋階段的最佳響應時間范圍進行研究。在實驗中,我們為用戶提供了不同響應時間設置的智能音箱。



          實驗二的主要研究發現:

          1)1250ms以內是用戶認為響應速度較優的區間,其中650ms為最佳體驗值。在450ms時,少量用戶覺得響應速度太快了,用戶會感覺到緊迫感和壓力,難以接受。

          2)在1450ms時,有53%的用戶開始感覺響應有延時,但仍能夠接受。

          3)從2150ms開始,有20%的用戶認為音箱響應太慢,不能夠接受。我們認為20%的用戶不滿意,已經不足以被稱為一個優秀的產品。



          實驗三:視覺、聲音等不同反饋方式對等待體驗的影響

          由于目前市場上的智能音箱在請求反饋階段的響應時間普遍在1.5秒以上,并沒有達到實驗二研究的理想響應區間。因此,我們通過實驗三進一步研究反饋方式設計對用戶響應速度感知的影響,我們為用戶提供了五組具有不同反饋方式設計的方案。



          在實驗三的五組方案中,每組方案分別進行了不同響應時間設置。



          實驗三的主要研究發現,不同反饋方式設計會影響人們對音箱響應速度的感知



          1)1250ms以內,方案D感受較差,人聲反饋會產生搶話的感受,部分用戶認為音箱響應太快。



          2)1350ms到2150ms,方案D、E感知舒適的用戶比例較高,加入人聲/音效后,如方案D的語音應答“好的”,有助于緩解用戶延遲感受,提升速度感知體驗。



          3)在3150ms及以上的響應時間,響應方式設計對緩解延時的作用已經不明顯,應該盡量避免此類情況發生。


          此外,實驗三還發現響應速度預期與用戶性別、任務類型有關。與男性相比,女性用戶對響應時間容忍度更低,她們最長在音箱無反饋時可以容忍的平均響應時間長度低于男性,即她們希望在更短的時間內得到音箱的響應反饋。



          與音樂類、問答類等任務相比,用戶對控制類任務的響應時間容忍度更低,用戶希望在控制類任務中有更加及時的響應反饋。



          三、小結

          本文針對語音交互中的等待體驗進行了討論,并以智能音箱為例,重點對喚醒階段和請求反饋階段的響應時間和反饋方式進行了人類工效學實驗研究。由于實驗設定的條件和樣本數量等限制因素,實驗研究結論可能不能代表所有智能音箱用戶在家居環境的全部感受,但希望通過我們的研究和探索,可以指導人工智能語音對話產品響應時間和反饋方式的設計,幫助打造自然和的語音對話體驗。

           轉自:站酷-DUBEST

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合