寫在前面
在平時的設計過程當中，你可能會有這樣的疑惑，為什么在大部分APP中，當單個按鈕和多個按鈕同時存在時，最重要的按鈕一般都會放置在頁面的右側呢？如果最重要的按鈕放在左側又有什么問題呢？按鈕放在右側的原因是什么呢？它又有什么理論依據呢？接下來帶著這些疑問，開始我們今天所要介紹的內容：交互心理學之古騰堡原則
古騰堡原則的起源
古騰堡原則是由14世紀西方活字印刷術的發明人約翰·古騰堡提出，早在20世紀50年代，他在設計報紙的過程中，提出了一項原則，認為人的閱讀方式應該是遵循某種習慣進行的，就像讀書一樣，由左到右，從上到下。這其中蘊含著什么信息呢？經過研究最終得出被后人所熟知的結論：古騰堡原則，并附上了一張圖，名為「古騰堡圖」。古騰堡圖將畫面所呈現的內容分成四個象限：
1、第一視覺區(POA)：左上方，用戶首先注意到的地方
2、強休息區(SFA)：右上方，較少被注意到
3、弱休息區(WFA)：左下方，最少被注意到
4、終端視覺區(TA)：右下方，視覺流終點
從圖中可以看出，用戶視線很自然的會從第一視覺區開始，逐漸移動到終端休息區。整個閱讀過程視線都會沿著一條方向軸開始從左到右瀏覽。用戶會更容易關注到頁面的開始與結束區域，而中間的段落則很少被關注到。古騰堡揭示了一個實用的視覺軌跡規律：閱讀引力是從上到下，從左到右。
遵循古騰堡原則把關鍵信息放在左上角、中間和右下角，能夠更好的體現元素的重要性。例如：我們平時所看到的頁面彈窗、各種證明文件和合同文件等等。
古騰堡圖通過對設計元素的重量與元素布局和組成方式進行調和，指導眼睛的運動軌跡。讓用戶迅速獲取有價值的信息，同時用戶對信息的熟悉程度也是影響眼睛運動軌跡的因素之一。
而隨著互聯網的興起，古騰堡原則也逐漸被應用到APP設計和網頁設計當中。接下來讓我們來看看他在界面中的實際應用。
在設計中的應用
1.1 底部單個按鈕
這種形式在引導用戶操作的頁面中最為常見，為了能夠保證用戶對內容進行閱讀，所以將按鈕擺放在頁面底部，內容放在頂部，這樣的擺放即符合用戶由上到下的閱讀習慣又達到了產品預期的目標。
1.2 底部垂直雙按鈕
上面我們提到了單個按鈕的擺放思路，接下來看一下垂直雙按鈕的擺放思路是怎么樣的。如果一個界面上同時存在兩個優先級不同的按鈕，并且產品希望用戶對每一個按鈕都有足夠的關注度，那么垂直擺放是最佳選擇，雖然垂直雙按鈕在樣式上做了區分，但用戶同樣會停留一段時間將按鈕的內容進行對比思考。
那么，按照古騰堡原則，重要的按鈕應該放在頁面最底部，原則上它應該是這樣的：
仔細觀察上圖，有沒有發現淺色按鈕很容易被忽略掉，這樣就違背了產品要保證每一個按鈕都要有足夠關注度的初衷，所以我們要違背古騰堡原則來滿足業務需求，正如我們所看到的微信授權頁面一樣，
為了保證「同意」與「拒絕」這兩個獨立的按鈕能夠被用戶足夠的重視，并且其中的任意一個按鈕不會被輕易的忽略掉，這里將「同意」按鈕顏色加重，并且放在「拒絕」按鈕之上，讓眼睛原本垂直向下的運動軌跡產生回流的變化。
小結
原則是設計的基礎，并非一成不變，要合理權衡設計原則與產品目標之間的關系。
2、頂部按鈕分析
由于頂部導航欄空間有限，導致按鈕相對較小，并且不便于點擊操作，所以這類頂部按鈕適用于修改內容的編輯頁面，即可以避免誤觸，又可以讓用戶關注內容本身。關鍵按鈕至于頂部，還可以縮短用戶眼睛的運動路徑，讓用戶更容易注意到其狀態的變化狀態。
小結
頂部按鈕更關注可編輯的內容區域，并非按鈕。而底部按鈕則更關注按鈕本身。并非內容。
3、水平按鈕分析
除了上面提到的頂部按鈕和底部按鈕，還有水平擺放的按鈕，比如淘寶詳情頁、京東詳情頁、網易嚴選詳情頁的「加入購物車」和「立即購買」按鈕，界面中的「立即購買」按鈕都放在了右下角，結合古騰堡原則的視覺終點說明，右下角為視覺終端區域，即視覺最終停留的位置，所以他們都將與轉化率密切相關的「立即購買」按鈕放在了界面的右下角，讓用戶更容易關注到。
再比如比較常見的「取消」和「確認」彈窗樣式，通常是在需要讓用戶確認某種操作行為時出現，有可能是提交表單、協議授權、獲取用戶信息等等，為了防止用戶誤操作，這也是提升產品體驗的小細節。
平常我們所看到的彈窗，推薦按鈕都是在右側，那么將推薦按鈕放在左側會怎么樣？如下圖所示：
不難看出推薦按鈕放在右側后，視覺在水平方向軸上產生了回流。
彈窗的目的是想讓用戶點擊「確認」按鈕，如果將「確認」放在左側，根據古騰堡原則，用戶的視線會不由自主的向右側移動，也就是「取消」按鈕的位置，想要回到左側「確認」按鈕位置就需要移動視線，并且眼睛的運動軌跡會在水平方向軸上來回的往復運動，無形中增加了用戶選擇時長。如果將「確認」放在右側，「取消」放在左側則可以為用戶提高操作效率。
在實際產品中的應用案例：
小結
當產品想要讓用戶進行某種操作時，主要按鈕放在右邊
總結
1、古騰堡圖第一視覺區，強休息區，弱休息區，終端視覺區
2、原則是設計的基礎，并非一成不變，要合理權衡設計原則與產品目標之間的關系
3、頂部按鈕更關注可編輯的內容區域，并非按鈕。而底部按鈕則更關注按鈕本身。并非內容
4、當產品想要讓用戶進行某種操作時，主要按鈕放在右邊
文章來源：UI中國 作者：Coldrain1
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
在經典的尼爾森十大啟發式當中，「系統狀態可見性」可以說是如今交互設計領域當中，最為重要的原則之一。通過向用戶展現當前的狀態，讓用戶擁有對系統的控制權，建立用戶對于產品的信任感，這也是這種設計啟發式的最重要的價值之一。
但是，想要做到可靠、易用，系統狀態展現的技巧是很講究的。這里梳理了4種最為常用的方法，結合了不少實用的案例，希望對你有所幫助。
1.1、讓用戶知道自己在哪
沒有人會喜歡迷失方向，但是無論在現實生活還是在數字領域當中，這種情況都會發生。讓用戶知道他們在哪里是創建良好導航體驗的關鍵。應用程序和網站都應該凸顯當前的導航選項，幫助用戶了解他們所在的位置。
Google 的底部導航欄設計
1.2、要經過多少步驟來完成任務
這也是一個非常基本的操作，通過展現步驟數量，幫助用戶來預估完成這個過程所需要的時間。
Selecto 的調查問卷的設計
數字界面畢竟不是現實世界中的真實硬件機構，用戶更多只能借助交互過程中的即時視覺反饋來確定是否完成了操作，即時的視覺反饋因此顯得非常重要。
即時的視覺反饋讓用戶的操作得到了視覺上的「認可」，從而強化了「確信感」，這樣一來一回的確認可以避免錯誤的發生，比如可以避免用戶因為「感覺沒有點下去」而反復點擊。
這種視覺反饋的設計，最常見的范例就是點擊按鈕按下的微交互動畫，它告知用戶「系統已經捕捉到點擊交互了」。
AliAli 所設計的懸停點擊動畫
但是在某些狀況下，按鈕的視覺反饋還有很多不同的呈現形式，有更多可見的、可理解的新形態，可以在原有的基礎上探索更多可能性，比如下面的
2.1、單擊點贊按鈕
Spread love, not viruses ，作者 Charles Patterson
2.2、開關按鈕
這個開關按鈕不僅有點擊動效，而且色彩和按鈕標識也隨之改變，更為清晰地表明狀態，甚至兼顧到了視覺障礙用戶
Switcher XLIV , 作者 Oleg Frolov
2.3、書簽按鈕微交互
這個書簽按鈕通過色彩的虛實變化來呈現書簽已添加的狀態，頗為巧妙。
Bookmark interaction，作者 Oleg Frolov
2.4、添加購物車微交互
在這種情況下，視覺反饋非常明確且優雅地告知用戶已經添加到購物車里面了。
咖啡下單動效，作者 Nhat M. Tran
3.1、系統正忙于什么事情
當系統正在加載，正在執行，正在運行的過程中，通過動效來告知用戶系統并沒有停止，而是正忙于執行某件事情，是避免用戶誤解的手段。在用戶等待的過程中，通常會實用無限加載的動效（一般使用在低于10s的操作中）：
對于超過10s的更長的執行過程，無限加載的動效會顯得令人沮喪，這個時候實用進度條會更好：
這些視覺反饋很大程度上降低了系統給人的不確定感。
對于移動端應用，在初始加載階段所使用的啟動動畫界面，是否精心設計，決定了用戶對于整個產品的第一印象，優秀的初始加載動畫能夠將用戶的注意力從焦躁的等待中解放出來。
Logo 閃屏 ，作者 Gleb Kuznetsov?
3.2、內容加載
當用戶需要時間來加載內容的時候，建議使用一種特殊的的容器「界面骨架」來展現。這種臨時的內容容器不僅能夠幫助用戶快速地了解界面的整體框架，構建用戶預期，并且能夠在后臺快速地加載數據，漸進式地幫用戶獲得信息。
內容加載，作者 Ginny Wood
這種設計方式對于移動端和桌面端的設計同樣適用：
界面骨架加載動效，作者 Shane Doyle
4.1、通知和提醒
有效的通知和提醒，能幫用戶意識到有新的事情正在發生。在多數時候，我們建議設計師使用微妙的動畫來進行通知，因為動畫效果會自然地吸引用戶的注意力，人類的雙眼的動態視覺其實是非常強的。
Aleksei Kipin 設計的通知動效
4.2、提示用戶采取行動
在很多情況下，用戶界面中會有很多地方會需要用戶提交信息。比如，需要用戶提交表單，或者用戶創建了一個密碼，但是在復雜度上不足需要修正，或者填寫郵箱來訂閱信息的時候，郵箱格式出錯，等等。使用適當的視覺反饋總能夠更加有效地將問題告知用戶。
內聯郵箱驗證機制，作者 Derek Reynolds
讓用戶有掌控感，就是為用戶創造更好的體驗。在很多設計方案中，視覺反饋會因為種種原因被削弱了，甚至被忽略了。但是當用戶在和 UI 進行交互的時候，期望度和可動性其實是高度依賴于這些動效和微交互，而這正是設計師需要設計出優秀視覺反饋效果的原因所在。
文章來源：優設 作者：Nick Babich
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
用戶隱私安全在產品設計中是很重要的一個環節，本文從用戶體驗角度切入，從匿名模式、減少永久性和減少公開性三個方面展開分析。
我們先看?組來??優的2019年6?的調研數據：70%的美國?認為，與5年前相?個?信息變得更不安全。尤其是?學歷?收?群體。由此可??戶對個?信息數據的隱私擔憂?以往更甚。
?戶隱私安全很重要，涉及的范圍和?度也很多。本次的分析從?戶體驗?度切?，涉及如下三個??：
Incognito Mode匿名模式；
Reducing Permanence減少永久性；
Reducing Publicity減少公開性。
下圖是Google系App(Google AppChromeYouTubeandGoogle Map)匿名模式切換，從交互體驗上來說有如下?個特點：
統?在右上?；
可以便捷切換?匿名模式，反過來也很容易切回登陸狀態；
匿名模式的狀態提示，例如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發?，主題就是《聚焦于保護隱私的社交?絡》。
我們先看國外社交媒體Stories（?故事）產品形態的流?。
?們總是對于所分享的內容永遠記錄在?上感到擔憂。Stories24?時消失緩解了?們的隱私顧慮，這讓?戶更安?地?然分享。
Stories由Snapchat?創，由 Facebook發揚光?。早在2019年4?，Facebook+Messenger Stories, Instagram Stories?活?戶數就突破5億。 2020年2-3?LinkedIn，Twitter也先后宣布將上線類似功能。
來??優的調研報告：41%的美國?經歷過?絡騷擾，最常?的就是在社交媒體上。23%的?戶最近經歷的?絡騷擾來?評論區的評論內容。27%的?戶經歷?絡騷擾后決定不再發布任何內容。
我們以限定評論互動的公開性為例：
2020年5?Twitter上線了新的評論功能，可以限定誰可以回復帖?的功能，提供了三種選項：誰都可以評論，只有被關注者可以評論，只有被提及者可以評論三種公開度的限定。
Instagram也在測試“評論限制”新功能，批量屏蔽/限制評論。?前已經上線的?個例?：?戶（評論發布者）如果發布的評論含有攻擊性敏感詞，發布前伴有提示，提醒評論含有攻擊性敏感詞是否真的要發布。
注重隱私提供僅好友可?/僅??可?/僅作者可?/等多重維度的隱私設定有助于?戶更安?地參與互動。
另外?個例?是付費頻道會員：付費頻道會員-限定頻道的公開性讓內容創作者減輕隱私顧慮不僅能獲得?告收?，也能得到來?會員、會費的收?，形成“忠實粉絲”社區，有助于內容?態的社區化建設。
我們主要看YouTube的頻道會員案例：
YouTube有兩種會員模式。?種是YouTube整個平臺的付費會員，去?告，看原創美劇影視，消費?樂，可下載內容的模式。第?種模式是Youtuber個?頻道付費會員，吸引忠實粉絲加?。我想說的就是第?種。
為什么?V?紅有意愿開通頻道會員？
除了獲得忠實粉絲收?變現的商業價值以及付費頻道會員可以為忠實粉絲提供各種專屬功能，背后也和?紅?V對個?隱私顧慮有關。
?紅?V在完全公開的社交?絡上需要始終保持?夠克制謹慎，避免引起爭議。但在忠實粉絲付費頻道專屬會員群中，?紅?V會減輕隱私顧慮，更加回歸?我。
?如在頻道會員中發布更多與個??活相關的內容，表達更多不便在完全公開的社交?絡中的想法和感受等，因為忠實粉絲通常更具包容度，更不容易引起爭議。
YouTube頻道會員費?可以從三種會費（按?）區間選擇，?持多選：
低階 Low Levels $0.99~3.99;
中階 Medium Levels $4.99~14.99;
?階 High Levels $19.99~49.99;
頻道會員功能在2018年開始測試，?向粉絲數過10萬的YouTuber開放。
以上綜述，我們可以說：
1.匿名模式：
雖然匿名模式由來已久，但仍然是當前的??基本?戶體驗設計趨勢，尤其是匿名模式的切換便捷性?常重要。
2.減少永久性：
Stories?故事24?時消失緩解了?們的隱私顧慮，這讓?戶更安?地?然分享,已經成為國外社交媒體平臺的必備功能，Facebook， Instagram平臺的最主要、最具影響?的功能之?。
3.減少公開性：
?戶總是對在社交媒體平臺發表評論有所顧忌，限定評論的公開性能夠有助于促進?戶發帖表達，其他?戶也可以更安?地參與互動。
付費頻道會員可以限定頻道的公開性，讓內容創作者減輕隱私顧慮不僅能獲得?告收?，也能得到來?會員會費的收?，形成“忠實粉絲”社區，有助于內容?態的社區化建設。
從UE?度，我們可以為頻道會員提供專屬身份設計例如專屬徽章，專屬表情等。
THE FUTURE IS PRIVATE， 注重?戶隱私的體驗設計越來越重要！
文章來源：站酷 作者：百度MEUX
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
隨著車內屏幕越來越多，越來越大，駕駛者在開車過程中因操作屏幕而分心機率逐漸升高。眾多汽車制造商均希望探索出一種降低或避免「駕駛員分心」的安全性技術。
手勢，是指人手、手和手臂結合產生的動作，作為解決「駕駛者分神」這個痛點的解決方案之一，正在全世界的汽車制造商中掀起「熱浪」。
你只需要隨意的揮一揮手，就能掛斷電話；將手指向順時針或者逆時針方向移動，就能調整音量大小。
汽車手勢的出現，源于對車內屏幕的操作。而這些操作均來自于移動端的設計標準，比如蘋果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
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
身為用戶體驗設計師，無時無刻不被世界上的新事物沖刷著認知——互聯網紅利下降帶來變化莫測的商業動向、循著摩爾定律野蠻生長日新月異的新技術、各類亞文化群體催生出多元復雜的圈層文化、腦洞口味越來越獨特的年輕人，甚至眼下席卷全球的黑天鵝事件……
任何一個新事物的悄悄冒頭，都有可能在未知的將來影響著用戶體驗設計師。我們能做的是，在起初感受到微微震幅時，便沿著震感逐步尋找源頭，并思考未來的發展走向。趕在變化降臨前先擁抱變化。
本文通過研究近一兩年科技、社會文化以及自身用戶體驗領域的變化，從用戶體驗領域關鍵的用戶、媒介(設備與應用）、交互行為、信息與場景的五個角度出發，探索用戶體驗設計未來的趨勢，希望能帶來啟發。
隨著人工時代到來，過去機械的單向交互方式逐漸被打破，機器漸漸演化成了會主動「觀察」真實場景，「感受」用戶情感，預判用戶意圖并自動完成任務的貼心小棉襖。機器如何為人們提供更智能便捷的服務，未來還有非常大的想象空間。
1. 基于真實場景推理用戶意圖
隨著AI技術的發展，智能設備可以越來越無縫地將數字世界和物理世界嫁接起來，主動感知用戶所處情境并智能提供相應服務。
在2019的 Google I/O 大會上，Google Lens 展示的AR點菜功能可以智能識別用戶掃描的菜單并將美食網站上的相關推薦直接呈現在屏幕上。
當用 Google Lens 識別到小票信息時，可快速提取小票上的金額，且可自動彈起計算器快速幫助用戶計算人均消費，節省人工計算的時間成本。
隨著信息入口從數字空間延伸到周圍的物理空間中，未來萬物皆可為用戶體驗的媒介，設計師未來在設計的時候需要注意：
尋找適合的打通真實世界的切入點：在陌生語言、信息復雜或者難以處理等苛刻的環境下，充分發揮智能設備對信息智能讀取、批量識別與翻譯等強大能力，幫助用戶完成任務；
將用戶旅程的上下游串聯：根據生活常識和經驗預判用戶行為目的，前置推薦服務；
更加系統細心地考量干擾因素：真實場景是動態變化的，需要更全方位考慮光線的強弱、多源的噪音、實體的可視性、人員和事件的打斷等因素。
2. 任務自動化，簡化用戶旅程
為了完成一項任務，用戶往往需要借助多個應用來回切換配合，使用起來瑣碎麻煩。如今應用越做越強大也越復雜，過去僅僅解決單一場景的解決方案不再適應于用戶對于完成任務的訴求。
Google Assistant 的新能力 Duplex on the web 可以通過自動跨應用任務處理來簡化用戶旅程。只需要用戶發出語音指令「預定一輛去某地的車」，助手便可自動跨郵件、日歷、付款等應用調取信息、自動根據使用習慣做選擇，并自動填寫信息，而用戶全程需要的只是在關鍵節點輕敲「確認」即可。
2019年隨著 iOS 13 的更新，「快捷指令」推出了「自動化」能力，用戶通過「if…then…」語法便可為自己的App設計一套程序，實現如：「當我回到公司時提醒我打卡」、「每天早上10點給我的女朋友發送一條表白短信」等能力，將不相關的場景動作串聯字一起自動化執行，大大節省人工操作成本。
提升使用效率是用戶體驗設計孜孜不倦努力的方向之一。在利用新技術進一步簡化用戶旅程時，設計師可以充分利用以下因素：
借助語音輸入：比起界面觸控操作，語音交互的直達性可以「穿透」復雜界面，讓設備第一時間明確用戶目標；
基于用戶行為形成習慣記憶：對用戶長期重復的行為做分析處理，構建用戶習慣模型并主動提供服務；
適當考慮專家級用戶：隨著部分用戶的智能設備使用水平越來越高，可以考慮為專家用戶提供自定義操作腳本，滿足其自身的獨特需求。
3. 基于情感感知，主動理解用戶需求
隨著人臉識別、表情識別、肢體跟蹤等技術的提升，機器逐漸學會感性語言，主動感知用戶內在情感和心理需求。
2019年1月的CES展上起亞亮相的互動式「情感駕駛空間」技術，可通過傳感器讀取用戶的面部表情、心率等反應，調整駕駛空間內的燈光、影片類型、音樂風格等，舒緩艙內乘客心情，由此提供更人性化的出行體驗。
用戶總是會期待更貼心的服務，設計師未來對同理心的情感嗅覺更加敏銳：
利用感性線索定位用戶情緒：需要通過面部表情、特殊時間節點或者識別到的關鍵詞，對用戶情緒進行理解和定位，判斷用戶情感理解用戶內心訴求是自由探索、趣味娛樂、或者靜謐修行并提供符合用戶當下心境的服務。
綜合使用感性元素進行設計：通過使用線條、色彩、聲音和動作等傳達并喚起相對應的情感，提供更加人性化的體驗。
4. 小結
更智能的服務提供方式會讓人們生活擁有更多可能性，但一旦火候把握不得當，可能就會造成對人們生活的野蠻入侵。關于如何讓科技更好造福于人們，早在上個世紀，施樂帕克研究中心提出了寧靜技術（Calm Technology）的愿景，認為影響最深遠的技術應該是隱匿不見的，它們如纖維般融入日常生活，絲絲入扣，直至不可分辨。
隨著科技的發展，設計師對新技術不應是不加克制地應用，而應該潤物細無聲般地提供服務，幫助人們從繁雜喧囂的數字世界中解脫出來，將寶貴的注意力資源投放在讓生活更美好的事物上。
回顧人類和機器的交流語言，從命令行界面、圖形用戶界面到自然用戶界面，人機交互方式越來越貼合人與人之間更自然的交流方式，其背后是心智模型與實現模型的高度擬合的趨勢。
在自然用戶界面中，為滿足新形態智能硬件對新接口的需求，以及人們對更豐富強大的交互方式的自然訴求，越來越多的自然用戶界面被開發出來。語音交互和隔空手勢交互便是近幾年迅速發展并落地的兩種交互方式。
1. 隔空手勢交互：更自由、更靈動
為了讓機器更好地讀懂用戶的身體語言，能夠感知深度信息的攝像頭走進了日常手機。2019年國內外手機廠商的發布大會上，LG 手機 G8 ThinQ 以及華為發布 Mate 30 系列推出的隔空手勢，可實現一些簡單的諸如滑動、切歌、截屏等效果。
除此以外，隔空手勢支持更加細微的手勢，如旋轉、揉搓等，可以更直觀、更靈活的方式操控界面，讓用戶獲得一種像魔術師用意念控制事物運作的快感。
對于隔空手勢操作網上的言論褒貶不一，其中爭議性最大的就是隔空手勢宛如「殺雞用牛刀」，明明可以用更加精準的手勢觸控，為什么還要用看似很酷炫其實精準度更低的隔空手勢操作？
隔空手勢并不是要替代觸控手勢成為主流的人機交互方式，更多是對情境式障礙場景的補充。在某些場景下，用戶使用設備的條件可能是充滿干擾的。想想看當你邊看手機食譜邊炒菜的時候、邊煲劇邊剝小龍蝦的時候、疫情期間出門佩戴橡膠手套無法正常觸控手機屏幕時…..隔空手勢是不是特別好用？
每個人在特殊的場景下都有可能面臨感官障礙，未來的設計也應該更多地考慮情境式障礙的場景，讓用戶無論身處何時何地依舊能一如既往無障礙地使用設備。
2. 語音交互：更精準、更好玩
語音交互作為更趨近于人與人之間最自然的交流方式，近些年有許多發展的突破點。
在發展主線上，語音交互趨向更自然、更人性化、更個性化。過去反人類的一些溝通方式慢慢被「調教」。此外，多人會話場景下的技術方案日漸增多。
2019的 Google I/O 大會展示了一個視頻片段，視頻中的兩位嘉賓相繼吐槽，經常出現針鋒相對難以聽清的時候，這時用戶可以調節音源音量選擇性增強自己關注的人物聲音，讓另一個人「靜音」。
△ 滑動選擇音源
此外，語音交互除了在智能音箱領域廣泛應用以外，也逐漸應用在廣告等更多的傳播媒介中，刷新人們日常使用體驗。2020年2月索尼提交了一項廣告播放新專利。當用戶在觀看電視節目時，如果出現廣告，只要站起來大喊廣告中對應品牌的名字，便可直接跳過這個廣告。
設計師在語音交互場景下，需要留意以下幾個比較容易被忽視的因素：
用戶語音交互習慣培養：如今還處于培養用戶語音交互使用習慣階段，設計師需要更多地考慮應用的語音交互規則如何才能更趨近于人們日常的溝通習慣，并進一步為人們的社會習俗所接納。
真實場景下的多人音源：在現實情境中， 在多人對話場景下將面臨音源不清、穿插停頓、噪音過多等影響體驗的情況，由于計算機聽覺分析能力開始從單人音源拓寬到了多人音源，多人對話解決方案上還有很大想象空間。
改變傳統的視聽體驗：在使用場景上，語音交互接口也將逐漸運用到更多的媒介上，更全面地刷新用戶體驗。
3. 小結
人類擁有雙手、眼睛、耳朵和發聲的嘴巴，但是并不總是在每個使用場景下都能自如地使用：在安靜的自習室下聲音收到限制，在駕駛場景下注意力受到限制，在雙手拎著東西場景下雙手受到限制……但目前許多產品設計都建立在用戶能完整使用感官功能這一理想化的基礎上。
未來的發展趨勢傾向于將視、聽、觸、嗅等多通道信息完美整合起來，綜合使用多種輸入通道和輸出通道，根據用戶使用場景用最恰當的方式傳遞服務，滿足用戶多方位的需求。
盡管喬布斯曾斷言3.5英寸是手機的黃金尺寸，但作為人們日常內容消費與娛樂的窗口，手機屏幕毫無疑問地變得越來越大，甚至超出傳統物理限制。人們對大屏享受的追求與設備攜帶便捷性之間的矛盾由來已久，硬件形態的變化對舊有的用戶體驗設計思路帶來的新的挑戰。
屏幕橫縱比越來越大，而人類的手部具有先天限制，曾經慣用的界面布局方式在高橫縱比的屏幕上可能無法被大拇指無障礙全覆蓋，使得越來越多的設計更加重視利用移動屏幕下半部分。
操作與信息進一步下移：
高德地圖、蘋果地圖的搜索框下移，方便單手操作用戶快速激活輸入框；
影視資訊平臺IMDB強化底部標簽欄功能，雙擊「搜索」tab即可激活輸入框，無須艱難地觸摸頂部。
即時戰斗類手游皇室戰爭的說明卡片主要展示在下半部分，方便用戶進行卡片上的相關操作。
底部導航被賦予更多能力：
Pocket的底部標簽欄現在兼任漢堡菜單功能，在激活狀態下再次點擊主頁icon可選擇主頁上須展示的內容。
利用下滑手勢代替點擊：
Snapchat的許多表示前后進退關系的頁面都不是」返回「按鈕，而是向下箭頭，用戶可下滑退出當前頁面。
為了解決設備形態和人類手部先天限制之間的矛盾，折疊屏誕生瀏覽并顛覆舊有的界面設計方式。
更靈活的信息布局
過去在單屏設計下，考慮到用戶注意力由上到下縱向衰減，因此信息布局更多是按照優先級從上往下排序。而折疊屏中，屏幕展開后便可以開辟出更大的可利用空間，將次級頁面或者較為重要的內容曝光在第二屏，對信息的布局將帶來全新的變化。設計師為保證大小屏下順暢的閱讀體驗，需要對信息模塊在不同空間布局下的流動性有更強的把控能力。
更便捷的多任務操作
在過去的單屏體驗中，用戶只能將注意力完全集中在當前的界面中，一次只做一件事。但在實際生活中，用戶面臨的情景往往是主線任務和支線任務的頻繁交錯，并且根據會任務不同的性質自由調動自己的注意力重心，如邊看視頻邊聊天、邊看直播邊逛街等等。在折疊屏中，設計師可以探索更多主線和支線交錯進行的場景，利用折疊屏帶來的更大的屏幕空間，可以讓用戶在不離開主線場景的基礎上進行支線任務的處理，大大節約了在不同App上來回切換的操作成本。
更直觀的拖拽交互
此外，隨著多任務處理越來越廣泛使用，拖拽交互將成為重要的交互模式之一。文本、表情包、圖片、視頻等交互對象，不再需要經過復雜的分享轉發流程才能在不同App中流轉，通過拖拽的方式可以更直觀地進行交互。
雙面屏互動玩法
外折疊屏在折疊狀態下可轉為雙面屏，等于是給用戶增加多一個觀看視角。例如華為 Mate X 的鏡像拍攝可以讓被拍攝者即時獲知自己的鏡頭影像是否滿意，這一拍女友神器有望成為直男拍攝終結者。在未來更多的多人觀看和互動玩法將被開拓出來。
△ 華為Mate X 的鏡像拍攝
未來隨著5G通訊技術的成長，越來越多的設備可以同時加入物聯網，人們的生活將被各種智能設備圍繞，設計師需要參與更多屏幕外的設計，讓不同設備串聯在一起協同合作，讓用戶能更加自在地享受科技的便利。
席卷全球的新冠疫情讓數十億用戶乖乖待在家里。過去需要花費大量精力去教育的用戶使用習慣因為疫情紛紛轉變。云購物、云蹦迪、云賞櫻、云監工……人們足不出戶便可還原許多線下場景。隨著用戶線上和線下生活的界限進一步模糊，用戶對于應用的效率和情感訴求也發生了變化。
疫情讓遠程辦公學習需求劇增，多人協作場景越來越頻繁，許多企業隨之升級了電話、視頻會議、文檔制作等多人協作效率軟件。過去僅僅考慮少人場景協作的方式不適用，設計師需要比以往更多地考慮多人協作場景下，如何對海量密集的信息進行分析處理和展示。
在學習方式上，由于線下學習轉移至線上，學生群體對于娛樂向軟件也有了效率訴求。為了順應用戶訴求變化，2020年5月QQ推出學習模式，屏蔽娛樂性的內容推送，讓學生更專注在學習上。
除了效率訴求急劇提升以外，隨著長時間的線上學習與辦公所產生社交疏離感和缺失感，人們對于線上學習工作的情感化訴求也進一步增強。
2020年推出的plagi遠程辦公軟件支持設置每個人的avartar形象，讓大家在遠程辦公時依舊能時刻感受到彼此的存在。在完成任務時還可以放鞭炮慶祝，讓員工能感受到親密無間的線上辦公體驗。
設計師需要更加關注如何讓線上生活進一步與現實生活圈和時間線接軌，通過拓展真實社交下的更多伴生行為讓線上也能還原線下的真實場景細節和互動體驗，以彌補用戶對真實社交的缺失感。
疫情的發生加速了人與信息之間的連接。人們越來越習慣將自身的身體資料、心情狀態等信息沉淀在智能設備上。
為了做好廣大市民群眾的健康監測服務，輔助疫情防控工作，微信和支付寶在2020年年初都上線了健康碼服務，不同顏色的健康碼代表人們不同的健康情況，市民出入特定場所都需初始健康碼。
隨著人的數據化越來越深入，個人身份信息的線上化在各平臺上將成為更加通用的能力。設計師需要考慮如何更自然更低成本地將線下動態變化的資料信息線上化，更有效地對用戶信息進行加工處理，以及記憶用戶的使用習慣和行為，以便幫助用戶更地完成任務。
疫情的出現加速了線下生活線上化，短短時間內我們看到日常習以為常的應用為響應疫情下的特殊需求紛紛出現改造，釘釘、QQ群被改造成上網課、批改作業的地方，醫療衛生公眾號開辟了實時疫情播報與辟謠通道，無接觸設計和服務需求異常突出……這也啟發了設計師需要保持對突發事件的敏感力以及應急能力，在日常生活中留心思考，為日后突發事件提供充足的場景支撐。
在洶涌的資本語境下，互聯網設計師裹挾在商業驅動的結果導向中狂奔，對設計的倫理和責任鮮有發聲，但伴隨著互聯網紅利退潮，發展放緩，狂奔之下的人本問題也逐漸浮出水面。在大趨勢下，UX設計師需要培養自身設計對倫理和責任的敏感度，在滿足商業目的外，重拾節操，為多群體，為大社會設計，更加注重「以人為本」。
包容性設計師指在做設計產品的時候，考慮到各類用戶的訴求，輸出具有包容性的設計方案。包容性設計依舊是2020年設計主題之一，伴隨著互聯網產品全球化，在通用性和包容性上也提出了新的要求。
為身障人士設計
三星在2019年針對東南亞市場推出了一款讓聾盲人士和健全人實時交流的app：Good Vibes，盲聾人輕擊屏幕輸入摩斯電碼，預先連線好的另一臺手機就會顯示從盲聾人發來的短信。健全人用普通的文字輸入回復，在盲聾人這一端就會翻譯成摩斯電碼、以手機振動的方式讀出短信內容。
GOOD VIBES宣傳視頻：https://v.qq.com/x/page/g3108sr8qc9.html
餓了么：在餓了么送貨騎手中，約8%受色盲色弱的困擾（全國男性群體中紅綠色盲色弱占比達8%-9%，餓了么騎手男性占比90%），為此餓了么設計團隊在2019年對app的進行了重新設計，包括使用WCAG無障礙色彩對比度，以及無障礙色盤，以及調整字階，使用輔助圖形等設計手段來解決部分騎手在送貨途中使用APP的痛點問題。
△ 餓了么UED：《為騎士創造平等 — 配送 App 的包容性設計》
跨年齡段設計
谷歌助手禮貌功能 ( Google Pretty Please ) ：開啟谷歌助手禮貌功能后，如果使用者在下達指令的語句中包括「Please」，谷歌助手會對禮貌的請求表示感謝，以此培養孩子的禮貌言行。
Google Pretty Please功能宣傳：https://v.qq.com/x/page/e3108ue3e2t.html
Swift Playground：當10后小學生VITA君的編程課被「可敬的發量」刷滿彈幕時，Swift playgrounds功不可沒，這款為兒童新手學習編程的軟件，用趣味的游戲方式為4歲以上低齡用戶提供了一個學習編程的低門檻平臺。
為性別平等而設計
蘋果emoji：回看歷年蘋果emoji的更新，從膚色平等，到性別、性向平等，再到為殘疾人設計，2020年再為跨性別者增加新表情，性別平等依舊是包容性設計中重要一環。
Airbnb插畫：愛彼迎在插畫系統中，也為不同膚色，不同職業，不同性別，以及身障人士進行了人物的繪制。
2019是互聯網科技隱私問題沉浮的一年，國外有Facebook因泄露隱私收到史上最大罰單，國內則打響了「人臉識別第一案」?；\罩在隱私信任危機下，個人信息和數據立法突飛猛進，美國推動《加州消費者隱私法案》，國內也將在2020年出臺《個人信息保護法》和《數據安全法》。
MIUI12推出隱匿面具功能
Android開放生態導致的權限隱私問題一直被用戶所詬病，某些APP存在用戶不授權就無法使用情況，針對這一情況，MIUI12推出了隱匿面具功能。當用戶在開啟某些APP要求授權權限時，可以選擇空白通行證進行授權，從而保護用戶真實信息。
在MIUI12的更新中，還推出了照明彈、攔截網兩項隱私保護功能
iOS 14剪貼板提醒
在iOS 14的更新中，保護用戶隱私方面進一步升級。
其中剪貼板提醒設計很貼心，當用戶打開應用，如果該應用讀取了你剪貼板的內容，會在系統頂部彈出提示，用戶能在第一時間意識到剪貼板內容被讀取，幫助用戶更好的保護自己的隱私內容。
科技的發展是一把雙刃劍，互聯網產品的發展給用戶帶來便捷和沉浸體驗的同時，也使得用戶沉溺于科技所帶來的惰性和投食之下，逐漸喪失了對真實生活的把控權，被科技綁架。
數字福祉（digital wellbeing）近年被頻頻提起，指科技產品需要權衡好數碼產品和真實生活之間的平衡，防止數碼產品過渡分散用戶的注意力而影響生活質量。
Android Q 專注模式 Google Android Q Focus Mode
Android Q的更新加入了專注模式，用戶在專注模式下，可以在系統層面快捷地關閉使你分心的應用，讓你聚焦于更重要的事情。
防沉迷系統升級
推薦技術的進步，產品體驗的升級，給用戶帶來了更合胃口的菜式和沉浸體驗，但同時也被冠上了「電子海洛因」的稱號。游戲或者內容產品的防沉迷系統依舊會是數字福祉下不可避免的趨勢。
王者榮耀在2020年升級防沉迷系統，對青少年的娛樂時間和點券充值的限制進行了進一步升級。承接話。B站在2019年推出青少年模式，在該模式下，使用時長和內容推薦等做了定制化處理。
2020年的UI設計趨勢，一方面是對往年風格的衍變和細化，另一方面，在扁平克制的界面風格盛行后，設計師們向往更自由、更突破的視覺表達。
1. 深色模式
2019年iOS 13深色模式姍姍來遲，緊接著大廠APP相繼推出此功能。在2020年，深色模式會繼續普及外，也會在可視性和實現成本方面有更多細節打磨和研究。
2. 新擬態
設計趨勢的發展是螺旋式上升的，在扁平化設計流行之后，對物體的擬真再一次回歸設計圈，新擬態以一種對舊擬物風格的再創新，重新流行起來。
新擬物風格（Neumorphism）緣起于設計師Alexander Plyuto發布在dribbble的一組作品，以投影重新對扁平界面進行了塑造，模仿出類似浮雕的視覺效果，感受耳目一新，引起大量設計師相盡模仿。
新擬態的實用性和可落地性有待商榷，但是作為一種新的風格受到設計師擁躉，也不失為下一波風潮到來前的靈感繆斯。
WWDC2020對mac OS的更新也重新定義了新擬態設計語言，在mac OS新系統Big Sur中，圖標的設計增添了輕微的漸變、投影、高光，以此來營造圖標內元素之間的縱深關系。
3. 多彩配色
在扁平簡潔UI風格盛行之后，豐富的色彩依舊是設計趨勢之一，大面積色塊，碰撞配色，帶來更具沖擊感的視覺體驗。
4. 字體裝飾化
UI界面逐漸扁平，色塊圖標弱化，為突出頁面重心和內容，iOS 11在界面標題上使用更大的字號，更粗的字重。近年在大標題的風格衍變下，文字在傳達信息外，也開始有了裝飾性作用，采用超大字體，成為頁面排版美化的一部分。
5. 更大圓角
大圓角的風格會繼續延續，相較以往，卡片的處理圓角會更大，隨之帶來的是多的留白處理，結合大字號，帶來更透氣通透的視覺感受。
Mac OS Big Sur的界面相對舊版本采用了更大的圓角；系統圖標的設計統一成圓角矩形。
6. 更豐富的插圖
UI插圖的豐富體現在樣式和內容上，樣式上開始3D化，內容上更注重插圖敘事的表達。
7. 3D插圖
3D圖形往年更多運用在動態影像或運營類設計中，隨著3D的普及運用，UI插圖也會迎來3D化，給用戶帶來更立體，更新鮮的視覺感受。
8. 講求敘事表意
相較于往年追求形式的UI插圖，新趨勢下的插圖更講求功能性，每一副插圖都承載一定的作用——傳達功能信息或透傳品牌情感；同時插圖更講求畫面表意和情節，給用戶敘事性的視覺體驗，增進用戶和產品之間的情感聯系。
9. 插圖組件化
插畫的流行，隨之而來的是成本的水漲船高——一套系列插圖為保持風格統一，往往由唯一設計師繪制，同時為兼容各類場景，設計師往往要繪制多張。
為解決插圖的成本和效率，插圖開始以組件化的方式進行繪制——插圖設計師將插畫進行拆分繪制——不同人物，不同場景，不同物件等，再通過組件化的拼接合成，使用組件的設計師可以根據需求場景自由組合，也避免了風格不統一問題。
設計師Pablo Stanley將日常繪制的插畫制成一套矢量插圖組件庫，將人物分為：半身、全身和坐姿3大類。通過不同表情、發型和服裝可自由搭配出近60萬種組合。
Pablo Stanley人物插畫系統：https://v.qq.com/x/page/s3108yeyhmt.html
10. 多維度動畫表現
新趨勢下，動畫一方面回溯復古線描手繪風格，另一方面追求更三維的體驗，同時幀率進一步提升，追求更流暢的視覺感受。
11. 手繪動畫
手繪插圖是往年的熱門，其隨性自然的筆觸，能給用戶帶來親切的感受，在新的趨勢下，動畫的加入賦予手繪插圖一份靈性和趣味。
12. 3D運動
Google Material Design通過卡片投影層級和二維動畫規律，賦予扁平界面Z軸的縱深感。隨著3D的普及流行，新趨勢下的界面，界面的運動從二維走向三維，表現出3D場景下透視感。
13. 高幀率動畫
高幀率影視從線下電影院移步到線上流媒體，手機高幀率屏幕從90Hz到120Hz逐步升級，用戶對畫面流暢的定義一再刷新，UI動畫的幀率升級也會是新的一輪趨勢。
Telegram的表情采用了高幀率動畫，給用戶更流暢的視覺感受。
體驗的持續升級，產品的高速迭代，對UX設計師的設計師效率提出了更高的要求。的設計方式是一個永恒的趨勢。
1. 從本地文件到云端協作
傳統的文件交接方式效率低下，導致設計師之間信息不對稱，最終影響產品的一致性體驗。近些年在線設計協同工具發展迅速，從UI設計、 設計交付以及組件協同等環節上給設計師提供更加實時的協作體驗，獲得大量UX設計師的簇擁。在2019 uxtool的設計工具調研中，在線設計協同工具佼佼者figma以其協作和性能優勢，大有追趕sketch之勢。
隨著團隊對設計效率要求的提高，設計文檔從本地走向云端協作是不可逆趨勢。不過設計工具的迭代是需要成本的，尤其在大型設計團隊，設計工具需要渡過陣痛期來完成迭代，進而提升設計效率和體驗一致性。
2. 科學有效的設計系統
UX的發展，從早期的靜態規范到當下的動態設計系統，是為解決產品迭代增速后帶來的設計效率和產品體驗問題。商業驅動下的產品迭代速度有增無減，設計系統依舊會是未來幾年的設計趨勢之一。
這里說的設計系統不是廣義上的設計系統，而是在互聯網設計的發展中，對組件化設計逐步迭代升華的一套設計協作方法：
「設計系統（Design systems）是一組為了共同目標而服務的內在相互聯系的設計模式和多人協同執行的方法?！梗ㄒ浴禗esign systems》，Alla Kholmatova，C7210翻譯）。
3. 設計系統歷程衍變
組件化的發展歷經規范文檔到UI組件，再到設計系統，形態從最初對設計一致性的指導規范，到對產品研發流程的規范，以及產品設計價值觀的輸出，當下的設計系統以集大成者形式影響整個產品的設計形態。
設計系統的結構見下圖：
4. 設計系統的求同存異
設計系統并非一成不變的，他是一個動態進化的系統，會根據團隊性質、產品特性在內容上有所區分——比如大團隊更應該大而全，小團隊更傾向小而精；成熟產品的設計系統更傾向于打造完整閉環的合作流程機制，新產品的設計系統應該以小為始，快速迭代……
隨著產品的垂直化，細分化，設計系統的趨勢會是在趨勢大同之下找到適合產品和團隊自身的形態和節奏。
Material Design是一個包含了指導規范、組件，以及設計開發工具的自適應性設計系統。
它作為平臺型性設計系統，更為大而全的規范了整個生態系統的設計風格，以及提供工具讓研發者能快速產出符合規范的產品。
△ Google生態龐大繁雜，Material Design更為全面
Ant Design作為一個為to B產品提供解決方案的平臺，更多從設計可用性和完整性考慮設計系統的搭建。
△ Ant Design通過模塊化解決方案，降低冗余的生產成本，讓設計者專注于更好的用戶體驗
QQ作為一款面向95后的2C社交產品，其設計系統Q語言從風格調性上對設計進行規范，同時給予設計師一定的自由度；也考慮到QQ內兼顧多個產品，以及界面主題樣式，對基礎組件的使用場景和代碼進行了規范，方便設計和開發敏捷開發。
Q語言，給予產品的自由調性之外，也針對主題和基礎組件進行了規范。
每個產品和團隊都有自身的特征，設計系統的建設也應該有的放矢，沒有可照搬的標準答案，在大方向下找到適合自身的解決方案才是的可行之道，將效率最大化。
5. 科學有效的優化迭代
組件是設計系統中的重要組成部分，但是以往靜態的、孤立的協作方式使得組件的更新迭代滯后和阻塞。隨著設計系統的發展，設計師組件化思維的普及，組件的更新需要更科學的方式進行管理。
Figma在2019年推出的Design System Analytics功能，組件設計師可以借此查看組件的使用情況，包括引用次數，解組次數等，并可以生成組件使用情況的曲線趨勢圖，以數據的形式，科學地推動組件的優化迭代。
選擇分析的時間段；組件使用的次數曲線圖；團隊使用情況；所有組件使用情況
未來的用戶體驗會出現什么新趨勢？人工智能等算法的發展、5G技術普及、新的智能設備形態、新的信息處理技術、新一代用戶的喜好和口味……這些往后或將影響用戶體驗發展的走向。未來用戶對體驗的要求只會越來越高。
用戶體驗設計師需要了解更多的技術動向，但安身立命之本還是讓用戶真正受益：立足于用戶真實使用場景，在理性價值層面上，打造可用、易用、的設計；在感性需求層上賦予情感上的愉悅性，在反思層面賦予意義價值。
文章來源：優設 作者：騰訊ISUX
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
近年來暗黑模式的設計趨勢開始一點點明顯，Ant Design 在這次 4.0 的升級中也對這類暗黑場景化的設計開始進行初步的探索，接下來就讓我們一起來看下 Ant Design 這一針對企業級的設計體系是如何設計暗黑模式的。
暗黑模式是指把所有 UI 換成黑色或者深色的一個模式。
需要說明的是，暗黑模式不只夜間模式：
暗黑模式更多的目的是希望使用者更加專注自己的操作任務，所以對于信息內容的表達會更注重視覺性；
而夜間模式則更多是出于在夜間或暗光環境使用下的健康角度考慮，避免在黑暗環境中長時間注視高亮光源帶來的視覺刺激，所以在保證可讀性的前提下，會采用更弱的對比來減少屏幕光對眼睛的刺激。
同時，從使用場景上來說，暗黑模式既可以在黑暗環境，也可以在亮光環境下使用，可以理解為是對淺色主題的一種場景化補充，而夜間模式只建議在黑暗環境下使用，在亮光環境使用時很可能并不保證信息可讀性。
1. 更加專注內容
試想一下，我們在電影院看電影時，為什么要全場關燈？甚至有些 APP，在影片的下方也會又一個模擬關燈效果的操作，來讓整個手機屏幕變黑，只剩下視屏畫面的部分，這都幫助我們可以更專注、更沉浸在當前的內容下。
色彩具有層級關系，深色會在視覺感官上自動后退，淺色部分則會向前延展，這樣對比強烈的層次關系可以讓用戶更注重被凸顯出來的內容和交互操作；尤其在信息負責界面內層級關系的合理拉開對操作效率都有明顯的促進作用。
2. 在暗光環境下更加適用
如今社會我們身處黑夜使用手機、電腦、iPad等設備的次數越來越多，環境光與屏幕亮度的明暗差距在夜間會被放大 ，亮度對比帶來視覺刺激也更加明顯，使用暗色模式可以縮小屏幕顯示內容與環境光強度的差距，同時也可以為設備的續航帶來積極影響，可以保證使用者在暗光環境下使用 OLED 設備的舒適度。
3. 大眾喜愛
黑色一直以來就可以給人以高級、神秘的語義象征，相比于淺色模式，暗色模式藏著更多可能性。
在這次暗黑模式的設計中主要遵循以下兩大設計原則：
1. 內容的舒適性
不論是顏色還是文字或是組件本身，在暗色環境下的使用感受應當是舒適的，而不是十分費力的，如果一個顏色在淺色下使用正常，在暗色下卻亮的刺眼或根本看不見，那必然不夠舒適也不可讀；所以在顏色的處理上不建議直接使用，這樣會讓界面變得到處都是「亮點」，讓眼睛不適的同時，也會帶來許多誤操作。
2. 信息的一致性
暗黑模式下的信息內容需要和淺色模式保持一致性，不應該打破原有的層級關系。舉個例子，在淺色模式下越深的顏色，與界面背景色對比度越大，也就越容易被人注意，視覺層級越高，比如 tooltip；在暗黑模式下我們同樣需要遵循這一規律，所以對應所使用的顏色也就越淺，反之則會越深。
在大量的企業級產品界面中，我們通常用只用一個白色背景結合分割線就可以搞定所有界面的板塊層級，因為在淺色模式下有投影可以借助，然而暗黑模式中投影將不足以起到如此功效，我們需要通過顏色來區分層級關系。
在經過對螞蟻企業級頁面的典型布局結構評估后，我們在中性色中增加了三個梯度，將中性色擴展至 13 個
并定義出通用情況下頁面中的框架層次，主要分為三大塊：
在目前的暗黑體系下，我們分別為這三大塊從淺到深定義了#1F1F1F、#141414、#000000 三個顏色，在實際應用中，你也可以根據自身業務的需求，從中性色板中直接選用或是依據透明度的思路自定義出合適的中性色彩。當定義出較為明確的框架層次和顏色后，也對后續系統中組件的顏色配置有著重要的指導意義。我們需要考慮組件出現在不同顏色背景下的可能性及其表現，盡量保持一致性。
眾所周知，暗黑模式與淺色模式最大的不同就在色彩的處理上，在暗黑模式中，我們并不想打破淺色模式下基礎色板的配置規律及色值，當一個應用或站點深淺模式并存時，希望在色彩上有一定延續和關聯，而不是毫不相關的兩套色板，這樣一是避免開發及后續的維護成本，二是實際切換和使用時，可以保證一致性，這意味著需要借助一定規則。
這里分享一下我們的處理思路：
基于 Ant Design 自然的設計價值觀，我們先從自然界中尋找靈感，如果說淺色模式如同初升時的朝陽，那暗黑模式就是落日下的晚霞，各有各的韻味，同一片天，唯一不同的是，受光線亮度的影響，晚霞整體會暗一些。
所以我們大體的設計思路也是基于淺色的基礎色板，通過結合透明度的轉換，去得到一套暗黑模式下的色彩。這樣的好處是，深淺模式下的色彩根基是同一個，在這樣的基礎上經過透明度的變換得到的結果也會相對和諧，同時也符合我們一致性的原則。
這里我們借助下面這兩個概念對透明度進行轉換：
對比度極性
對比度極性分為正極性和負極性。
這里可以給大家分享對比度查閱的一個工具：WebAIM，只要輸入色值就可以看到具體的值，十分方便。
正負極性差值
顧名思義便是正負兩者的差值，這里取的是絕對值。
根據一致性原則，我們嘗試通過對比一套顏色的正負極性變化趨勢來找到轉換規律。
首先可以看下，如果一個顏色在不做任何修改的前提下直接使用，它的正負極性趨勢以及差值趨勢的走勢和關系是怎么樣的，我們嘗試描繪出這樣的曲線，他們的變化規律也將作為我們規則轉換的參考標準。
經過對比，可以發現一些變化規律：
首先來說下「差值趨勢」，橫向對比可以發現，不同顏色的正負極性走勢是很不一樣的，可以看到在黃綠色段差值曲線達到一個變化峰值，這是由于黃綠色本身由于明度、飽和度值相比其他顏色偏高，所以總是有種刺眼的感覺，生活中也會用它來作為警示、提醒的作用，所以在深淺背景下的對比度有一個比較大的差異，可以說這個變化是正常的。
這點也可以從「正負對比度極性趨勢」兩者間的相對關系反應出來，從紅色到洋紅，綠線一開始從逐漸在藍線的上方一點，開始逐漸上移，最后在峰值處開始慢慢下移，在「極客藍」這個色相中接近重疊，在洋紅處又慢慢下移，說明淺色下越深的顏色，在深色中越亮，反之則越暗。
縱向比對單個色板，可以發現，其斜率變化主要受顏色的明度、飽和度影響，可以反應一個顏色的不同梯度在黑白背景下的變化規律。
有了這個大的變化規律，我們便可做到心中有數。首先以 Ant Design 的品牌色「破曉藍」為例，經過在多個業務、場景中不斷嘗試與調整，我們得到一個透明度轉換規則：
并將這個規則應用在其他 11 套色板中，驗證其可用性。這個過程確實沒有什么快捷通道，唯一的辦法就是不斷嘗試。
最后，我們將經過規則轉換的實色與常規顏色的變化趨勢做對比：
可以看到在大趨勢走向上左右兩側圖基本一致，這代表兩個色板在變化規律接近一致，基本可以證明規則的合理性。區別在于，對比度負極性和差值相對于右側未經處理的值明顯有所下降。這是由于透明度的處理讓暗色下的顏色在明度、飽和度上有所下降導致。
再仔細觀察可以發現，在左側的常規顏色中，從破曉藍-洋紅這段偏冷色系幾個顏色中，差值趨勢變化最平緩的是「極客藍」這顏色，這說明該顏色在深淺背景下的表現較為穩定，起伏不大，當基于一個統一的透明度規則前提下，會讓它在暗色下的對比度減弱，所以反而會導致差值趨勢變大，所以我們會發現差值趨勢變化較小的顏色轉移到了「破曉藍」、「洋紅」中，也是一個正?，F象。
最后可以看到顏色在調整過后實際應用的效果
在官網中點擊「切換」即可預覽：
如果上述 12 個色板不滿足你的業務需求，你也可以在官網上自己選擇顏色，我們會根據規則幫你生成一個暗色色板。
另外，如果在實際應用過程中，你選了色相在 225～325 間的深冷色系作為主色或強調色使用，建議適當提高透明度的值，避免在暗色界面上引起閱讀障礙。
暗黑模式中，文字的使用與淺色模式基本一致，依舊從 85%-65%-45%，唯一不同的地方在 disable 的狀態，其透明度值提升為 30%，避免顏色過淡真的「不可見」。另外，對于 #FFFFFF 的純白色文字，盡量避免大面積使用，尤其對于表格、列表這類偏閱讀瀏覽的場景，如有需要，做小范圍強調即可。
暗黑模式中的陰影規則與淺色模式基本保持一致，但由于本身的界面背景較深，在陰影色值上也有所加深，幫助層次更好的體現，整體將色值擴大到原先的 4 倍，但在陰影的位移、擴展上均保持不變。
分割線在暗黑模式中建議根據界面中常用的背景色，通過透明度換算成實色使用，Ant Design 中分割線主要有 #434343 和 #303030 兩種顏色，分別對應淺色模式下的 #D9D9D 和 #F0F0F0，這樣做的目的主要是為了避免帶來額外的交錯疊加，尤其對于表格類以及很多帶有 border 屬性的組件，實色會更為穩妥便于記憶。
適應性方面，Ant Design 的暗黑模式可以與海兔及可視化資產進行無縫銜接，使用時可以任意組合拖拽，你可以下載 Kitchen 插件，獲取海量資產。
暗黑模式最近越來越受到人們的關注，與某一特定產品的暗黑設計不同，Ant Design 的暗黑模式更多以設計體系的角度考慮企業級這個大場景下的內容，在易用性、擴展度、復用度等方面還有許多需要完善和繼續研究探索的地方，我們會在未來的迭代中逐步進行，先完成再完善。希望上述內容能對大家在暗黑模式的設計上有所幫助。
文章來源：優設 作者：AlibabaDesign
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
在這里，我們將研究設計中最簡單、因而常常被低估的活動之一，即線框圖的設計。了解什么是線框圖，為什么需要設計它們以及如何充分利用線框圖。
線框圖，也稱為頁面示意圖或屏幕藍圖，是展示網站或產品框架的視覺指南：
線框圖的主要目標是向團隊和利益相關者展示產品將包含的頁面和組件，以及這些元素之間的相互作用。
1. 幫助團隊評估和完善工作范圍
線框圖允許設計師快速創建產品的視覺表現，方便后期修改；
幫助設計師向團隊展示應用程序具有的頁面元素和控件，以及所有元素如何進行交互。
2. 讓團隊所有成員參與產品設計
線框圖的使用允許設計師和開發人員在早期階段共同參與討論設計，在開始進行視覺設計之前就提供反饋和更改建議。
這樣有助于使設計過程快速迭代，避免不必要的浪費。
3. 方便快速演示
從客戶和利益相關者那里獲得快速反饋是設計過程的重要組成部分。
設計過程中，經常會遇到需求的來回變化。有了線框圖，可以使這個過程更有效，修改原型比修改線框圖需要更多的時間和精力。
4. 進行用戶測試
線框圖可以幫助設計師從潛在用戶那里獲得有用價值的反饋。同時瀏覽線框比讀取規范要快得多，還有助于減小與預期效果的差異。
為了獲得最好的結果，為下一步的 UI 打下堅實的基礎，需要遵循幾個簡單的規則：
1. 顏色的使用
如果在線框圖中使用豐富的配色，可能會分散觀者的注意力，并使更新變得更困難。
但在某些情況下，使用顏色突出顯示特定組件是合理的。例如，可以將紅色用于錯誤狀態，將藍色用于注釋等。
2. 使用簡單的組件
線框圖并不包含全面設計和詳細說明的組件。相反它們應該設計的相對簡單，讓團隊成員更容易識別。
為組件添加細致的陰影、粗細描邊將花費大量的時間和精力，卻不是很實用。
3. 保持一致性
在所有線框圖中，類似的組件必須看起來相同。如果相同的組件看起來不同，開發人員可能會質疑它們的功能是否相同，甚至會因為設計不同而增加估算時間。
在處理線框圖時，記住一個簡單的規則：保持一致，避免造成混淆。
4. 使用真實內容
我們會?？吹経I/UX設計師沒有在線框圖上添加真正的內容，而是重復使用同一些文本。這是很少有設計師意識到的普遍錯誤。
內容真實與否會影響接下來的設計。如果使用不真實的內容，UI設計中文本的數量多少和排布方式都要再調整。
真實內容能給線框圖增加價值，更好地解釋上下文。
5. 使用注釋
設計中可能會遇到某些解決方案無法直觀地加以說明的情況，例如某些控件背后的邏輯，因此開發人員可能會對它們有疑問。
在這種情況下，可以提供注釋來解釋其背后的邏輯。這樣，你的團隊就會理解你的解決方案，你就不需要花時間再討論它們。
6. 線框圖程度
線框圖應該選擇低保真還是高保真，沒有嚴格的規定，取決于項目的具體要求。
硅谷知名作家埃里克·萊斯認為，如果不能帶來價值就不需要做額外的工作，從基礎做起，然后根據需要添加細節。
7. 將線框圖延伸到交互原型中
在使用不同產品時，有一些簡單而通用的交互，也有一些交互相當復雜。
在線框圖不足以說明復雜性的情況下，可以將線框圖擴展到交互原型中，而不必寫冗長的注釋并花大量時間進行解釋。
將線框圖結合到設計過程中，為我們所用：
文章來源：優設 作者：Clip設計夾
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
這次我們不聊視覺，也不暢想未來，只說說當下 HMI 產品設計與交互體驗。
本文內容會涉及一些專業的汽車知識名詞，因為篇幅有限，如有些知識名詞不太明白可以百度一下。
說到 HMI 大多數設計師應該是既熟悉又陌生，HMI 是 Human Machine Interface 的縮寫，「人機接口」，也叫人機界面，人機界面（又稱用戶界面或使用者界面）是系統和用戶之間進行交互和信息交換的媒介， 它實現信息的內部形式與人類可以接受形式之間的轉換，凡參與人機信息交流的領域都存在著人機界面。
聽起來是不是覺得這不就是 UI 嗎？有什么區別嗎？似乎差不多，幾乎是沒有區別的，只不過是在某些場合和設備上管他叫 UI，比如移動端設備，而在另外某些場所和設備上管他就叫 HMI，比如汽車車機和數控機床。所以這個概念也不用去特別較真，HMI 就權當作是汽車上的 UI 界面吧。畢竟汽車是高科技與工業結合的完美產物，「HMI」念出這個詞時候就感覺是蠻專業的！很般配！
剛才說 HMI 最早更應用于工業上，比如常見的各種機床、制造裝備。
或者說讓時間再向前推進一點！
而這里通常意義的 HMI 則更加聚焦點，基本特指汽車車機或者車載多媒體設備。
說到這里還是要從車載儀表盤說起，從德國人卡爾·本茨發明世界第一輛汽車，距今已經 100 多年的時間了，在那些還沒有 HMI 這個名詞的年代，那么他是以什么形態出現的？那就不得不提「儀表盤」了。
當然寫這篇文章并不是去評測誰家 HMI 更優秀，而是希望通過一些假設、實驗和推斷，和大家一起來探討一下如何更有效地設計 HMI。
屏幕越大越好？車內到底需要幾塊屏幕？
我們先從屏幕開始。
說到屏幕，設計師都是比較敏感的，因為我們最終的設計交互創意都是需要都是在屏幕上顯示展示出來的，HMI 當然也不例外?，F在在車載屏幕上你能看到最大尺寸多大？
拿特斯拉為例，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樂章
掌握好常用的設計理論與心理學知識，能幫助我們對用戶的人性特征的拿捏，幫助我們較大的影響用戶底層決策，以產品實現業務目標。
一、尼爾森10大可用性原則
1、狀態可見原則
不局限于：用戶的當前狀態、知道當前任務要做什么、任務進度等。
2、環境貼切原則
設計要復合目標用戶的認知，符合用戶的心智模型，于是熟悉的事物越容易被用戶所接受。
3、撤銷重做原則
操作前可預知，操作中有反饋、操作后可撤銷。
4、一致性原則
不局限于：業內產品的一致性、產品內的一致性、版本迭代間的一致性
5、防錯原則
錯誤行動發生前，引導用戶向正確的方向前進；用戶觸碰到危險操作時給予提示；危險操作發生之后，提供撤回的入口。
6、易取原則
通過使用對象、動作和選項的可視化表達，最大限度地減輕用戶的記憶負擔。
記住用戶的操作記錄、一個流程對應一個操作目標、提供適量的信息、選擇而不是輸入。
7、靈活原則
好的產品需要同時兼顧新用戶和資深用戶的需求。對新用戶來說，需要功能明確、清晰，對于老用戶需要快捷使用高頻功能。不可迎合某一種用戶，把不必要的信息占據重要部分。
8、易掃（讀）原則
不要包含不相關或低頻次的信息/操作。頁面中的每個額外信息都會降低主要內容的相對可見性。
產品設計的四大基本原則：親密性、對齊、重復、對比。
9、容錯原則
錯誤信息應該用通俗易懂的語言表達，較準確地指出問題，并且提出解決方案。避免通過代碼等用戶難以理解的形式
即：提供解決方案、幫助用戶從錯誤中恢復
10、人性化幫助
如果系統能讓用戶不需要閱讀文檔就會使用那是最好的，但通常情況下還是需要幫助文檔的。任何信息應該容易被搜索，且專注于用戶的目標任務，并列出具體的步驟來告知用戶。
二、費茨定律
翻譯成人話就是：
1. 按鈕做大點（W大點）更易于點擊
2. 將按鈕放置在離開始點較近的地方
3. 相關按鈕之間距離近點（D小點）更易于點擊
4. 屏幕的四角與四邊是「無限可選中」位置（非移動端）
5. 通過費茨定律的反向使用，可以降低按鈕被點擊的可能
三、米勒定律
米勒定律預測人的工作記憶能夠記住的項為7(±2)個。1956年認知心理學家喬治·米勒發表了一篇論文，他討論了短期記憶和記憶跨度的極限。
不要亂用 “神奇的7” 為設計進行不必要的限制；
將內容整理為較小的單元，以便用戶輕松地處理、理解和記憶。
比如電話號碼的顯示方式、銀行卡的顯示方式等
四、接近法則
觀察者看到彼此鄰近（空間或時間）的物體時，會將它們視為一個整體。
在界面設計中，對信息的組織已經離不開這個法則了，他在界面中所體現的就是把相關的信息塊組合在一起，不太相關的分離開，增強與區分元素之間的關聯性，所強調的是空間和位置。
接近法則產生于群組，它可以減少信息設計的復雜性，對引導用戶的視覺流、便于用戶對界面的解讀起到至關重要的作用。
五、席克定律
希克定律是一種心理物理學定律。用戶所面臨的選擇數量越多，做出選擇所花費的時間就越長，在人機交互的界面中選項越多，意味著用戶做出決策的時間越長。
六、泰斯勒定律（復雜性守恒定律）
泰斯勒定律又稱復雜性守恒定律，該定律認為每一個過程都有其固有的復雜性，這個復雜性存在一個臨界點，超過了這個點就不能再簡化了，你只能將固有的復雜性從一個地方移動到另外一個地方。
七、奧卡姆剃刀原理
奧卡姆剃刀原理的核心思想為：“切勿浪費較多東西去做用較少東西同樣可以做好的事——如無必要，勿增實體，即簡單有效原理”。
八、防錯原則
操作前有提示，操作中有反饋、操作后可撤銷。
九、損失厭惡
損失厭惡是指人們面對同樣數量的收益和損失時，認為損失更加令他們難以忍受。同量的損失帶來的負效用為同量收益的正效用的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
藍藍設計的小編 http://m.skdbbs.com