本文就UI界面中常見的指示性設(shè)計(jì)元素做了一些整理，希望可以幫助到各位設(shè)計(jì)師。
什么是指示性設(shè)計(jì)元素？
眾所周知，道路上的指示標(biāo)志是用來指示車輛和行人該如何通行。同理，在UI界面中，指示性設(shè)計(jì)元素就是用來告知、引導(dǎo)、指示用戶的設(shè)計(jì)元素，因此，只要是在視覺上可以提示特定的交互或內(nèi)容，從而讓用戶更快、更輕松地注意到，比如CTA按鈕，文本提示等，都屬于指示性設(shè)計(jì)元素。
指示性設(shè)計(jì)元素是如何影響用戶體驗(yàn)的？
大多數(shù)情況下，往往只需要幾秒鐘時間，用戶就已經(jīng)決定了要不要使用你的產(chǎn)品。因此，頁面的邏輯是否清晰，結(jié)構(gòu)是否明確，重點(diǎn)是否突出，指示性元素的引導(dǎo)是否合理就顯得非常重要。
指示性設(shè)計(jì)元素是我們今天討論的重點(diǎn)，它對用戶體驗(yàn)的影響是多方面的，使用正確的指示性設(shè)計(jì)元素可以：
- 方便用戶快速瀏覽頁面
- 加強(qiáng)頁面視覺層次感
- 提供更便利的導(dǎo)航
- 提高頁面轉(zhuǎn)化率
關(guān)于指示性元素和用戶體驗(yàn)之間的問題，CXL Lnsitute曾經(jīng)做過一個很有名的實(shí)驗(yàn)。這個研究小組做了很多個不同版本的落地頁面來進(jìn)行測試，根據(jù)用戶行為收集了大量的用戶交互數(shù)據(jù)，并進(jìn)行了準(zhǔn)確分析，發(fā)現(xiàn)不同的設(shè)計(jì)對用戶行為、用戶在頁面的停留時間以及頁面轉(zhuǎn)化率都大有影響。
CXL Lnsitute用于測試的落地頁面如下：
1）界面中人物視線偏移表單：
2）界面中人物視線聚焦在表單:
3）界面中有箭頭指向表單：
4）界面中沒有任何指示性設(shè)計(jì)元素：
5）界面中通過深色背景突出表單：
6）界面中有一個三角指向表單：
測試結(jié)果顯示，落地頁的熱點(diǎn)圖差距非常巨大。
首先，帶有手繪箭頭的頁面熱點(diǎn)圖如下：
該頁面用戶的停留時間最長，并且表單的點(diǎn)擊次數(shù)最多。
其次，人物視線偏離表單的頁面熱點(diǎn)圖如下：
該頁面，用戶的注意力也完全脫離了表單。
可見，指示性設(shè)計(jì)元素對用戶行為和頁面的轉(zhuǎn)化率有著非常重大的影響。
常見的指示性設(shè)計(jì)元素
一、箭頭（Arrows）
箭頭是最受歡迎的指示設(shè)計(jì)元素之一，它通用、明顯、易懂。不同年齡、不同文化、不同教育程度以及不同技術(shù)涵養(yǎng)的人都可以理解。前面提到的CXL Lnsitute的測試也驗(yàn)證了這一點(diǎn)。
- 家居裝飾電子商務(wù)網(wǎng)站
使用箭頭作為交互元素的視覺提示：
- 外賣網(wǎng)站
左右各有一個箭頭，提示用戶可以選擇更多：
- Dance Academy著陸頁
使用箭頭提示用戶頁面在水平方向上存在交互:
- Tubik Studio團(tuán)隊(duì)設(shè)計(jì)的網(wǎng)站
底部箭頭提示用戶可以滾動鼠標(biāo)瀏覽頁面：
二、手型（Pointers）
如果你不想用箭頭這類具有強(qiáng)指示性的元素，可以考慮使用手型提示。回想一下，如果有人想讓你看某樣?xùn)|西的時候，他是不是會用手直接指向該物體？在web或app界面中也一樣，想要引起用戶注意，也可以用“手”直接指出來。這樣，不僅可以把指示性元素和整體的視覺效果融為一體，還非常巧妙地提供了優(yōu)雅的視覺提示。
- 某招聘藝術(shù)家平臺的著陸頁
使用了插畫元素，不僅提升了界面的美觀度，插畫人物的視線和手勢也正好指向了關(guān)鍵信息和CTA。
- 某郵件服務(wù)登錄頁面
該頁面的指示性設(shè)計(jì)元素實(shí)在很巧妙，不易發(fā)覺，卻又能把全部的注意力都集中到一點(diǎn)上——FREE SIGN UP。如果你仔細(xì)觀察，每個元素，無論是紙飛機(jī)的朝向，還是花朵延伸的方向，全部都指向了CTA。
- 行李托運(yùn)網(wǎng)站登陸頁面
使用了插圖，人物和飛機(jī)都指向了頂部最右側(cè)的CTA，也就是BOOK YOUR TRANSFER這個按鈕。
- 郵件管理系統(tǒng)登錄頁面
該頁面的人物手勢和其他構(gòu)圖元素，都把重點(diǎn)指向了首頁大標(biāo)語。
三、視線（Eye line）
視線是建立在人類自然反應(yīng)之上的一種強(qiáng)大的指向方式。當(dāng)看到別人的目光集中在某個點(diǎn)或某個物體上時，我們會自然而然地產(chǎn)生好奇心，他們在看什么？人類的這個心理反應(yīng)經(jīng)常被用在視覺內(nèi)容設(shè)計(jì)中，包括攝影、插圖等，最后在UI界面也被廣泛使用。
- 美發(fā)美容公司網(wǎng)站主頁
使用了首頁大圖，該模特的視線向下方看，視線的焦點(diǎn)停留在CTA上。
- 約會應(yīng)用程序的登錄頁面
使用了帶有文本的插圖，人物的視線正在看向文本內(nèi)容。
- 銷售發(fā)飾的電子商務(wù)網(wǎng)站
使用了精美的插圖，界面中人物的視線集中在首頁標(biāo)語上。
四、視覺提示
箭頭可以提示用戶進(jìn)行某種交互，很多其他元素也可以用于提示用戶，比如，表示交互類型的圖標(biāo)或插圖。此外，鼠標(biāo)還可以提示用戶滾動頁面，手勢動畫可以提示用戶滑動，總之，他們都可以幫助用戶順利地了解和探索你的頁面。
- 某建筑設(shè)計(jì)工作室的網(wǎng)站
底部有一個鼠標(biāo)形狀的圖標(biāo)，告知用可以嘗試向下滾動：
五、呈現(xiàn)部分內(nèi)容
交互過程中可能出現(xiàn)這樣的問題，當(dāng)頁面布局看起來很完整并且滾動鼠標(biāo)時無法加載更多內(nèi)容時，用戶會以為他們已經(jīng)看到了全部內(nèi)容。
對于這種情況，有一個很棒的解決辦法，可以在屏幕上可見區(qū)域的最下方顯示的一部分內(nèi)容，這樣，用戶就不會遺漏任何重要信息了。
- 時裝模特網(wǎng)站
網(wǎng)頁的底部區(qū)域展示了部分照片，提示用戶可以滾動查看更多：
- 外賣網(wǎng)站
在頁面底部顯示菜品的一部分，提示用戶可以滾動查看更多；此外，使用箭頭作為方向提示，告知用戶水平方向上也會看到更多信息：
總結(jié)
以上就是本次分享的一些指示性設(shè)計(jì)元素，其實(shí)這類的設(shè)計(jì)元素還在不斷的創(chuàng)新中，如果你有更多的想法，歡迎和我們交流?？傊?，盡管指示性設(shè)計(jì)元素的表現(xiàn)方式多種多樣，但它們最終的目的都是引導(dǎo)用戶，為用戶提供更好的用戶體驗(yàn)。設(shè)計(jì)師在設(shè)計(jì)過程中，自始至終都要銘記這一點(diǎn)。
原文地址：tubik blog
譯文地址：摹客
作者：Marina Yalanska
譯者：摹客
按鈕交互的設(shè)計(jì)由來
為了設(shè)計(jì)合適的交互方式，我們需要回顧實(shí)體按鈕的發(fā)展歷史，作為UI組件之一的按鈕來源于實(shí)體按鈕，現(xiàn)在廣泛用于互聯(lián)網(wǎng)產(chǎn)品中。按鈕非常神奇，只需手指觸摸，就可以打開一個APP、啟動汽車或者一個系統(tǒng)，即使用戶不懂背后的原理。在《Power Button》這本書里，Rachel Plotnick研究了今天按鈕操作的文化起源，描述了按鈕成為互聯(lián)網(wǎng)產(chǎn)品的命令方式，可以實(shí)現(xiàn)毫不費(fèi)力控制。
“你只需按快門，其余的我們來做。”—柯達(dá)相機(jī)用抓人眼球的口號來吸引潛在的顧客。
這正是迄今為止，按鈕吸引用戶的地方，只需簡單的觸摸，就能獲得處理事件的滿足感。即使很多新家電和其他設(shè)備都進(jìn)化為了觸屏操作，實(shí)體按鈕卻并沒有完全消失，其塑造的行為習(xí)慣仍然影響按鈕設(shè)計(jì)的直觀性和易用性。
按鈕與鏈接的區(qū)別
按鈕傳達(dá)了用戶可以執(zhí)行的操作，它們通常在UI界面中，比如：對話框、表單、工具欄等。區(qū)分按鈕和鏈接特別重要：
鏈接：用于導(dǎo)航到另一個位置，比如：“查看全部”頁面、跳轉(zhuǎn)另一個位置等。
按鈕：用于實(shí)現(xiàn)一個操作，比如：提交、合并、新建和上傳等。
按鈕的多種狀態(tài)
設(shè)計(jì)正確的交互和樣式，對按鈕設(shè)計(jì)十分重要。按鈕每個狀態(tài)必須可識別，要顯著區(qū)別于其他狀態(tài)和周圍的布局，但是也不能完全改變組件或者制造視覺混亂。
普通狀態(tài)：可交互和可用的狀態(tài)。
焦點(diǎn)狀態(tài)：用戶使用鍵盤或其他輸入方法來突出顯示一個元素。
懸停狀態(tài)：用戶把光標(biāo)置于可交互元素上的狀態(tài)。
觸發(fā)狀態(tài)：用戶已點(diǎn)擊按鈕后的狀態(tài)。
加載狀態(tài)：當(dāng)操作沒有立即實(shí)現(xiàn)時，表示正在進(jìn)行的狀態(tài)。
禁用狀態(tài)：按鈕目前不可交互，但以后可以使用。
按鈕的多種樣式
最常見的是圓角按鈕，可以輕易識別，并且在輸入字段旁邊看起來不錯。為按鈕選擇正確的樣式，取決于目的、平臺和規(guī)范。以下是一些最流行的樣式：
不同樣式的優(yōu)先級
樣式最初是用來區(qū)分操作的優(yōu)秀級。明確操作的優(yōu)先級，可以在眾多的選擇前，引導(dǎo)用戶。通常，要有一個突出的按鈕（主按鈕），幾個二級按鈕，還有三級按鈕。
有時不需要默認(rèn)按鈕
通常，把最常用的按鈕設(shè)置為“默認(rèn)”（使用主樣式）和選中的狀態(tài)。這樣可以幫助大多數(shù)用戶，更快完成他們的任務(wù)，引導(dǎo)正確的方向。
此外，當(dāng)選擇同等重要時，或者操作存在危險，在這些情況中，需要用戶明確按鈕的選擇而不是意外選擇。
別讓用戶思考
Don’t make me think（別讓用戶思考）是可用性工程師Steve Krug所著的書的名字（中文《點(diǎn)石成金：訪客至上的網(wǎng)頁設(shè)計(jì)秘笈》）。其中指出，觸屏是為了讓界面更明顯，而不是讓用戶產(chǎn)生困惑?；诙嗄晔褂貌煌脑O(shè)備和其他產(chǎn)品，用戶養(yǎng)成了對按鈕外觀和功能的特定期待。如果和“標(biāo)準(zhǔn)”按鈕的樣式差別太大，就會讓用戶遲疑和困惑。
不要對可交互和不可交互的元素，使用相同的色彩。如果可交互和不可交互的元素，使用相同的色彩，會讓用戶不知道點(diǎn)擊哪里。
一致性提高效率和準(zhǔn)確性
“一致性是最有力的可用性原則之一：當(dāng)元素一直都是統(tǒng)一的樣式，用戶就不必?fù)?dān)心突發(fā)事件。” — Jakob Nielsen
一致性提高速度和準(zhǔn)確性，避免錯誤。創(chuàng)建可預(yù)測性可以幫助用戶獲得掌控感，在產(chǎn)品中實(shí)現(xiàn)他們的目標(biāo)。在創(chuàng)建主要、二級和三級樣式時，嘗試找到一些共同的元素，比如：色彩、形狀等。嘗試不僅對設(shè)計(jì)的系統(tǒng)保持一致性，對平臺也要保持一致性。
按鈕的交互熱區(qū)尺寸
按鍵應(yīng)該是一個簡單的任務(wù)，如果用戶點(diǎn)擊按鈕失敗，或者誤點(diǎn)到了旁邊的元素，會導(dǎo)致不好的體驗(yàn)和浪費(fèi)時間。
對于大多數(shù)平臺，觸屏的區(qū)域至少為48x48dp。交互熱區(qū)的尺寸應(yīng)該是至少9mm，不論屏幕的大小。推薦的觸屏元素的尺寸，至少為7-10mm。
對于icon按鈕，確認(rèn)交互熱區(qū)大于元素的視覺邊緣。這點(diǎn)不僅適用于手機(jī)或平板，同樣的推薦尺寸也適用于對于網(wǎng)頁的點(diǎn)擊設(shè)備，比如鼠標(biāo)。
按鈕的可用性
所有組件都應(yīng)該注意設(shè)計(jì)的可用性。交互熱區(qū)是影響可用性的一個因素，其他因素還有字體大小、色彩和對比。許多工具可以幫助你輕松檢查組件設(shè)計(jì)的實(shí)現(xiàn)效果。
設(shè)計(jì)師應(yīng)該和開發(fā)團(tuán)隊(duì)緊密合作，以確保按鈕的正常使用。按鈕作為一個可點(diǎn)擊的元素，在用戶觸發(fā)時，給予反饋。用戶通過按鈕這個元素，可以實(shí)現(xiàn)交互控制。
按鈕的交互手勢
通過手勢操作，用戶可以和APP進(jìn)行交互。觸摸作為實(shí)現(xiàn)操作的另一種方式，可以節(jié)省時間，獲得觸覺的掌控感。雖然一些手勢，比如滑動引出相關(guān)的操作、雙擊點(diǎn)贊或長按，現(xiàn)在越來越廣泛地使用，但對于普通用戶，這些手勢不太明顯。建議使用手勢作為替代的方案，供高級用戶使用。
按鈕的文案
按鈕文案和樣式一樣重要。使用錯誤的文案，會讓用戶困惑，浪費(fèi)時間，也會誤操作。
一個好的按鈕文案，可以引導(dǎo)用戶操作。最好使用動詞，告訴用戶在做什么。就像這個按鈕在詢問用戶，“你想收藏嗎？”或者“你想確認(rèn)命令嗎？”
避免使用“是”或“不”，或者太通用的，比如提交。
按鈕的位置
確認(rèn)和取消的按鈕，哪個放在右邊，設(shè)計(jì)師們因此而爭論不休。
- 確認(rèn)按鈕放在左邊，符合正常的閱讀順序。如果我們知道用戶最可能的選擇，可以幫助用戶節(jié)省時間。Windows系統(tǒng)將確認(rèn)的按鈕放在左邊。
- 確認(rèn)按鈕放在右邊，優(yōu)化流程。將確認(rèn)按鈕放在右邊，可以幫助用戶在操作前，評估所有的選擇，避免錯誤和沖動決策。蘋果系統(tǒng)將確認(rèn)按鈕放在右邊。
兩個選擇都有理由，并且也不會造成使用困難。我個人傾向于放在右邊，在活動列表或者對話框，可能因?yàn)槲页Ｓ肕ac系統(tǒng)。
按鈕的禁用設(shè)計(jì)
每個人都遇到過禁用按鈕，被困在當(dāng)前頁面幾秒鐘或幾分鐘，嘗試弄清楚為什么禁用按鈕妨礙了當(dāng)前進(jìn)程，然后要怎樣重新開始。禁用狀態(tài)提示組件當(dāng)前不可交互，但是以后可以。為什么使用禁用按鈕呢？因?yàn)槿绻麖脑瓉淼奈恢蒙弦瞥粹o，或者在上層用內(nèi)容覆蓋掉按鈕，會給用戶帶來困惑。
我建議，避免使用禁用按鈕。最好讓按鈕永遠(yuǎn)可以使用，如果用戶沒有提供必要的信息，只需高亮強(qiáng)調(diào)空白的輸入?yún)^(qū)域，或者提醒用戶。
ps：material design中懸浮按鈕、拖拽狀態(tài)，可以了解一下
原文鏈接 | https://uxdesign.cc/button-design-user-interface-components-series-85243b6736c7
來源 | 彩云譯設(shè)計(jì) （id:caiyunyisheji）
本文原作者 | Taras Bakusevych
本文譯者 | Bravert
]]>身為用戶體驗(yàn)設(shè)計(jì)師，無時無刻不被世界上的新事物沖刷著認(rèn)知——互聯(lián)網(wǎng)紅利下降帶來變化莫測的商業(yè)動向、循著摩爾定律野蠻生長日新月異的新技術(shù)、各類亞文化群體催生出多元復(fù)雜的圈層文化、腦洞口味越來越獨(dú)特的年輕人，甚至眼下席卷全球的黑天鵝事件……
任何一個新事物的悄悄冒頭，都有可能在未知的將來影響著用戶體驗(yàn)設(shè)計(jì)師。我們能做的是，在起初感受到微微震幅時，便沿著震感逐步尋找源頭，并思考未來的發(fā)展走向。趕在變化降臨前先擁抱變化。
本文通過研究近一兩年科技、社會文化以及自身用戶體驗(yàn)領(lǐng)域的變化，從用戶體驗(yàn)領(lǐng)域關(guān)鍵的用戶、媒介(設(shè)備與應(yīng)用）、交互行為、信息與場景的五個角度出發(fā)，探索用戶體驗(yàn)設(shè)計(jì)未來的趨勢，希望能帶來啟發(fā)。
更智能的服務(wù)提供方式
隨著人工時代到來，過去機(jī)械的單向交互方式逐漸被打破，機(jī)器漸漸演化成了會主動「觀察」真實(shí)場景，「感受」用戶情感，預(yù)判用戶意圖并自動完成任務(wù)的貼心小棉襖。機(jī)器如何為人們提供更智能便捷的服務(wù)，未來還有非常大的想象空間。
1. 基于真實(shí)場景推理用戶意圖
隨著AI技術(shù)的發(fā)展，智能設(shè)備可以越來越無縫地將數(shù)字世界和物理世界嫁接起來，主動感知用戶所處情境并智能提供相應(yīng)服務(wù)。
在2019的 Google I/O 大會上，Google Lens 展示的AR點(diǎn)菜功能可以智能識別用戶掃描的菜單并將美食網(wǎng)站上的相關(guān)推薦直接呈現(xiàn)在屏幕上。
當(dāng)用 Google Lens 識別到小票信息時，可快速提取小票上的金額，且可自動彈起計(jì)算器快速幫助用戶計(jì)算人均消費(fèi)，節(jié)省人工計(jì)算的時間成本。
隨著信息入口從數(shù)字空間延伸到周圍的物理空間中，未來萬物皆可為用戶體驗(yàn)的媒介，設(shè)計(jì)師未來在設(shè)計(jì)的時候需要注意：
尋找適合的打通真實(shí)世界的切入點(diǎn)：在陌生語言、信息復(fù)雜或者難以處理等苛刻的環(huán)境下，充分發(fā)揮智能設(shè)備對信息智能讀取、批量識別與翻譯等強(qiáng)大能力，幫助用戶高效完成任務(wù)；
將用戶旅程的上下游串聯(lián)：根據(jù)生活常識和經(jīng)驗(yàn)預(yù)判用戶行為目的，前置推薦服務(wù)；
更加系統(tǒng)細(xì)心地考量干擾因素：真實(shí)場景是動態(tài)變化的，需要更全方位考慮光線的強(qiáng)弱、多源的噪音、實(shí)體的可視性、人員和事件的打斷等因素。
2. 任務(wù)自動化，簡化用戶旅程
為了完成一項(xiàng)任務(wù)，用戶往往需要借助多個應(yīng)用來回切換配合，使用起來瑣碎麻煩。如今應(yīng)用越做越強(qiáng)大也越復(fù)雜，過去僅僅解決單一場景的解決方案不再適應(yīng)于用戶對于高效完成任務(wù)的訴求。
Google Assistant 的新能力 Duplex on the web 可以通過自動跨應(yīng)用任務(wù)處理來簡化用戶旅程。只需要用戶發(fā)出語音指令「預(yù)定一輛去某地的車」，助手便可自動跨郵件、日歷、付款等應(yīng)用調(diào)取信息、自動根據(jù)使用習(xí)慣做選擇，并自動填寫信息，而用戶全程需要的只是在關(guān)鍵節(jié)點(diǎn)輕敲「確認(rèn)」即可。
2019年隨著 iOS 13 的更新，「快捷指令」推出了「自動化」能力，用戶通過「if…then…」語法便可為自己的App設(shè)計(jì)一套程序，實(shí)現(xiàn)如：「當(dāng)我回到公司時提醒我打卡」、「每天早上10點(diǎn)給我的女朋友發(fā)送一條表白短信」等能力，將不相關(guān)的場景動作串聯(lián)字一起自動化執(zhí)行，大大節(jié)省人工操作成本。
提升使用效率是用戶體驗(yàn)設(shè)計(jì)孜孜不倦努力的方向之一。在利用新技術(shù)進(jìn)一步簡化用戶旅程時，設(shè)計(jì)師可以充分利用以下因素：
借助語音輸入：比起界面觸控操作，語音交互的直達(dá)性可以「穿透」復(fù)雜界面，讓設(shè)備第一時間明確用戶目標(biāo)；
基于用戶行為形成習(xí)慣記憶：對用戶長期重復(fù)的行為做分析處理，構(gòu)建用戶習(xí)慣模型并主動提供服務(wù)；
適當(dāng)考慮專家級用戶：隨著部分用戶的智能設(shè)備使用水平越來越高，可以考慮為專家用戶提供自定義操作腳本，滿足其自身的獨(dú)特需求。
3. 基于情感感知，主動理解用戶需求
隨著人臉識別、表情識別、肢體跟蹤等技術(shù)的提升，機(jī)器逐漸學(xué)會感性語言，主動感知用戶內(nèi)在情感和心理需求。
2019年1月的CES展上起亞亮相的互動式「情感駕駛空間」技術(shù)，可通過傳感器讀取用戶的面部表情、心率等反應(yīng)，調(diào)整駕駛空間內(nèi)的燈光、影片類型、音樂風(fēng)格等，舒緩艙內(nèi)乘客心情，由此提供更人性化的出行體驗(yàn)。
用戶總是會期待更貼心的服務(wù)，設(shè)計(jì)師未來對同理心的情感嗅覺更加敏銳：
利用感性線索定位用戶情緒：需要通過面部表情、特殊時間節(jié)點(diǎn)或者識別到的關(guān)鍵詞，對用戶情緒進(jìn)行理解和定位，判斷用戶情感理解用戶內(nèi)心訴求是自由探索、趣味娛樂、或者靜謐修行并提供符合用戶當(dāng)下心境的服務(wù)。
綜合使用感性元素進(jìn)行設(shè)計(jì)：通過使用線條、色彩、聲音和動作等傳達(dá)并喚起相對應(yīng)的情感，提供更加人性化的體驗(yàn)。
4. 小結(jié)
更智能的服務(wù)提供方式會讓人們生活擁有更多可能性，但一旦火候把握不得當(dāng)，可能就會造成對人們生活的野蠻入侵。關(guān)于如何讓科技更好造福于人們，早在上個世紀(jì)，施樂帕克研究中心提出了寧靜技術(shù)（Calm Technology）的愿景，認(rèn)為影響最深遠(yuǎn)的技術(shù)應(yīng)該是隱匿不見的，它們?nèi)缋w維般融入日常生活，絲絲入扣，直至不可分辨。
隨著科技的發(fā)展，設(shè)計(jì)師對新技術(shù)不應(yīng)是不加克制地應(yīng)用，而應(yīng)該潤物細(xì)無聲般地提供服務(wù)，幫助人們從繁雜喧囂的數(shù)字世界中解脫出來，將寶貴的注意力資源投放在讓生活更美好的事物上。
更自然豐富的交互方式
回顧人類和機(jī)器的交流語言，從命令行界面、圖形用戶界面到自然用戶界面，人機(jī)交互方式越來越貼合人與人之間更自然的交流方式，其背后是心智模型與實(shí)現(xiàn)模型的高度擬合的趨勢。
在自然用戶界面中，為滿足新形態(tài)智能硬件對新接口的需求，以及人們對更豐富強(qiáng)大的交互方式的自然訴求，越來越多的自然用戶界面被開發(fā)出來。語音交互和隔空手勢交互便是近幾年迅速發(fā)展并落地的兩種交互方式。
1. 隔空手勢交互：更自由、更靈動
為了讓機(jī)器更好地讀懂用戶的身體語言，能夠感知深度信息的攝像頭走進(jìn)了日常手機(jī)。2019年國內(nèi)外手機(jī)廠商的發(fā)布大會上，LG 手機(jī) G8 ThinQ 以及華為發(fā)布 Mate 30 系列推出的隔空手勢，可實(shí)現(xiàn)一些簡單的諸如滑動、切歌、截屏等效果。
除此以外，隔空手勢支持更加細(xì)微的手勢，如旋轉(zhuǎn)、揉搓等，可以更直觀、更靈活的方式操控界面，讓用戶獲得一種像魔術(shù)師用意念控制事物運(yùn)作的快感。
對于隔空手勢操作網(wǎng)上的言論褒貶不一，其中爭議性最大的就是隔空手勢宛如「殺雞用牛刀」，明明可以用更加精準(zhǔn)的手勢觸控，為什么還要用看似很酷炫其實(shí)精準(zhǔn)度更低的隔空手勢操作？
隔空手勢并不是要替代觸控手勢成為主流的人機(jī)交互方式，更多是對情境式障礙場景的補(bǔ)充。在某些場景下，用戶使用設(shè)備的條件可能是充滿干擾的。想想看當(dāng)你邊看手機(jī)食譜邊炒菜的時候、邊煲劇邊剝小龍蝦的時候、疫情期間出門佩戴橡膠手套無法正常觸控手機(jī)屏幕時…..隔空手勢是不是特別好用？
每個人在特殊的場景下都有可能面臨感官障礙，未來的設(shè)計(jì)也應(yīng)該更多地考慮情境式障礙的場景，讓用戶無論身處何時何地依舊能一如既往無障礙地使用設(shè)備。
2. 語音交互：更精準(zhǔn)、更好玩
語音交互作為更趨近于人與人之間最自然的交流方式，近些年有許多發(fā)展的突破點(diǎn)。
在發(fā)展主線上，語音交互趨向更自然、更人性化、更個性化。過去反人類的一些溝通方式慢慢被「調(diào)教」。此外，多人會話場景下的技術(shù)方案日漸增多。
2019的 Google I/O 大會展示了一個視頻片段，視頻中的兩位嘉賓相繼吐槽，經(jīng)常出現(xiàn)針鋒相對難以聽清的時候，這時用戶可以調(diào)節(jié)音源音量選擇性增強(qiáng)自己關(guān)注的人物聲音，讓另一個人「靜音」。
△ 滑動選擇音源
此外，語音交互除了在智能音箱領(lǐng)域廣泛應(yīng)用以外，也逐漸應(yīng)用在廣告等更多的傳播媒介中，刷新人們?nèi)粘Ｊ褂皿w驗(yàn)。2020年2月索尼提交了一項(xiàng)廣告播放新專利。當(dāng)用戶在觀看電視節(jié)目時，如果出現(xiàn)廣告，只要站起來大喊廣告中對應(yīng)品牌的名字，便可直接跳過這個廣告。
設(shè)計(jì)師在語音交互場景下，需要留意以下幾個比較容易被忽視的因素：
用戶語音交互習(xí)慣培養(yǎng)：如今還處于培養(yǎng)用戶語音交互使用習(xí)慣階段，設(shè)計(jì)師需要更多地考慮應(yīng)用的語音交互規(guī)則如何才能更趨近于人們?nèi)粘５臏贤?xí)慣，并進(jìn)一步為人們的社會習(xí)俗所接納。
真實(shí)場景下的多人音源：在現(xiàn)實(shí)情境中， 在多人對話場景下將面臨音源不清、穿插停頓、噪音過多等影響體驗(yàn)的情況，由于計(jì)算機(jī)聽覺分析能力開始從單人音源拓寬到了多人音源，多人對話解決方案上還有很大想象空間。
改變傳統(tǒng)的視聽體驗(yàn)：在使用場景上，語音交互接口也將逐漸運(yùn)用到更多的媒介上，更全面地刷新用戶體驗(yàn)。
3. 小結(jié)
人類擁有雙手、眼睛、耳朵和發(fā)聲的嘴巴，但是并不總是在每個使用場景下都能自如地使用：在安靜的自習(xí)室下聲音收到限制，在駕駛場景下注意力受到限制，在雙手拎著東西場景下雙手受到限制……但目前許多產(chǎn)品設(shè)計(jì)都建立在用戶能完整使用感官功能這一理想化的基礎(chǔ)上。
未來的發(fā)展趨勢傾向于將視、聽、觸、嗅等多通道信息完美整合起來，綜合使用多種輸入通道和輸出通道，根據(jù)用戶使用場景用最恰當(dāng)?shù)姆绞絺鬟f服務(wù)，滿足用戶多方位的需求。
硬件形態(tài)帶來新的挑戰(zhàn)
盡管喬布斯曾斷言3.5英寸是手機(jī)的黃金尺寸，但作為人們?nèi)粘?nèi)容消費(fèi)與娛樂的窗口，手機(jī)屏幕毫無疑問地變得越來越大，甚至超出傳統(tǒng)物理限制。人們對大屏享受的追求與設(shè)備攜帶便捷性之間的矛盾由來已久，硬件形態(tài)的變化對舊有的用戶體驗(yàn)設(shè)計(jì)思路帶來的新的挑戰(zhàn)。
1. 大屏幕：單手持握新挑戰(zhàn)
屏幕橫縱比越來越大，而人類的手部具有先天限制，曾經(jīng)慣用的界面布局方式在高橫縱比的屏幕上可能無法被大拇指無障礙全覆蓋，使得越來越多的設(shè)計(jì)更加重視利用移動屏幕下半部分。
操作與信息進(jìn)一步下移：
高德地圖、蘋果地圖的搜索框下移，方便單手操作用戶快速激活輸入框；
影視資訊平臺IMDB強(qiáng)化底部標(biāo)簽欄功能，雙擊「搜索」tab即可激活輸入框，無須艱難地觸摸頂部。
即時戰(zhàn)斗類手游皇室戰(zhàn)爭的說明卡片主要展示在下半部分，方便用戶進(jìn)行卡片上的相關(guān)操作。
底部導(dǎo)航被賦予更多能力：
Pocket的底部標(biāo)簽欄現(xiàn)在兼任漢堡菜單功能，在激活狀態(tài)下再次點(diǎn)擊主頁icon可選擇主頁上須展示的內(nèi)容。
利用下滑手勢代替點(diǎn)擊：
Snapchat的許多表示前后進(jìn)退關(guān)系的頁面都不是」返回「按鈕，而是向下箭頭，用戶可下滑退出當(dāng)前頁面。
2. 折疊屏：新形態(tài)的交互方式
為了解決設(shè)備形態(tài)和人類手部先天限制之間的矛盾，折疊屏誕生瀏覽并顛覆舊有的界面設(shè)計(jì)方式。
更靈活的信息布局
過去在單屏設(shè)計(jì)下，考慮到用戶注意力由上到下縱向衰減，因此信息布局更多是按照優(yōu)先級從上往下排序。而折疊屏中，屏幕展開后便可以開辟出更大的可利用空間，將次級頁面或者較為重要的內(nèi)容曝光在第二屏，對信息的布局將帶來全新的變化。設(shè)計(jì)師為保證大小屏下順暢的閱讀體驗(yàn)，需要對信息模塊在不同空間布局下的流動性有更強(qiáng)的把控能力。
更便捷的多任務(wù)操作
在過去的單屏體驗(yàn)中，用戶只能將注意力完全集中在當(dāng)前的界面中，一次只做一件事。但在實(shí)際生活中，用戶面臨的情景往往是主線任務(wù)和支線任務(wù)的頻繁交錯，并且根據(jù)會任務(wù)不同的性質(zhì)自由調(diào)動自己的注意力重心，如邊看視頻邊聊天、邊看直播邊逛街等等。在折疊屏中，設(shè)計(jì)師可以探索更多主線和支線交錯進(jìn)行的場景，利用折疊屏帶來的更大的屏幕空間，可以讓用戶在不離開主線場景的基礎(chǔ)上進(jìn)行支線任務(wù)的處理，大大節(jié)約了在不同App上來回切換的操作成本。
更直觀的拖拽交互
此外，隨著多任務(wù)處理越來越廣泛使用，拖拽交互將成為重要的交互模式之一。文本、表情包、圖片、視頻等交互對象，不再需要經(jīng)過復(fù)雜的分享轉(zhuǎn)發(fā)流程才能在不同App中流轉(zhuǎn)，通過拖拽的方式可以更直觀地進(jìn)行交互。
雙面屏互動玩法
外折疊屏在折疊狀態(tài)下可轉(zhuǎn)為雙面屏，等于是給用戶增加多一個觀看視角。例如華為 Mate X 的鏡像拍攝可以讓被拍攝者即時獲知自己的鏡頭影像是否滿意，這一拍女友神器有望成為直男拍攝終結(jié)者。在未來更多的多人觀看和互動玩法將被開拓出來。
△ 華為Mate X 的鏡像拍攝
未來隨著5G通訊技術(shù)的成長，越來越多的設(shè)備可以同時加入物聯(lián)網(wǎng)，人們的生活將被各種智能設(shè)備圍繞，設(shè)計(jì)師需要參與更多屏幕外的設(shè)計(jì)，讓不同設(shè)備串聯(lián)在一起協(xié)同合作，讓用戶能更加自在地享受科技的便利。
疫情催生新的線上體驗(yàn)
席卷全球的新冠疫情讓數(shù)十億用戶乖乖待在家里。過去需要花費(fèi)大量精力去教育的用戶使用習(xí)慣因?yàn)橐咔榧娂娹D(zhuǎn)變。云購物、云蹦迪、云賞櫻、云監(jiān)工……人們足不出戶便可還原許多線下場景。隨著用戶線上和線下生活的界限進(jìn)一步模糊，用戶對于應(yīng)用的效率和情感訴求也發(fā)生了變化。
1. 更關(guān)注效率導(dǎo)向
疫情讓遠(yuǎn)程辦公學(xué)習(xí)需求劇增，多人協(xié)作場景越來越頻繁，許多企業(yè)隨之升級了電話、視頻會議、文檔制作等多人協(xié)作效率軟件。過去僅僅考慮少人場景協(xié)作的方式不適用，設(shè)計(jì)師需要比以往更多地考慮多人協(xié)作場景下，如何對海量密集的信息進(jìn)行分析處理和展示。
在學(xué)習(xí)方式上，由于線下學(xué)習(xí)轉(zhuǎn)移至線上，學(xué)生群體對于娛樂向軟件也有了效率訴求。為了順應(yīng)用戶訴求變化，2020年5月QQ推出學(xué)習(xí)模式，屏蔽娛樂性的內(nèi)容推送，讓學(xué)生更專注在學(xué)習(xí)上。
2. 更注重緩解社交疏離感
除了效率訴求急劇提升以外，隨著長時間的線上學(xué)習(xí)與辦公所產(chǎn)生社交疏離感和缺失感，人們對于線上學(xué)習(xí)工作的情感化訴求也進(jìn)一步增強(qiáng)。
2020年推出的plagi遠(yuǎn)程辦公軟件支持設(shè)置每個人的avartar形象，讓大家在遠(yuǎn)程辦公時依舊能時刻感受到彼此的存在。在完成任務(wù)時還可以放鞭炮慶祝，讓員工能感受到親密無間的線上辦公體驗(yàn)。
設(shè)計(jì)師需要更加關(guān)注如何讓線上生活進(jìn)一步與現(xiàn)實(shí)生活圈和時間線接軌，通過拓展真實(shí)社交下的更多伴生行為讓線上也能還原線下的真實(shí)場景細(xì)節(jié)和互動體驗(yàn)，以彌補(bǔ)用戶對真實(shí)社交的缺失感。
3. 加速人和信息的強(qiáng)連接
疫情的發(fā)生加速了人與信息之間的連接。人們越來越習(xí)慣將自身的身體資料、心情狀態(tài)等信息沉淀在智能設(shè)備上。
為了做好廣大市民群眾的健康監(jiān)測服務(wù)，輔助疫情防控工作，微信和支付寶在2020年年初都上線了健康碼服務(wù)，不同顏色的健康碼代表人們不同的健康情況，市民出入特定場所都需初始健康碼。
隨著人的數(shù)據(jù)化越來越深入，個人身份信息的線上化在各平臺上將成為更加通用的能力。設(shè)計(jì)師需要考慮如何更自然更低成本地將線下動態(tài)變化的資料信息線上化，更有效地對用戶信息進(jìn)行加工處理，以及記憶用戶的使用習(xí)慣和行為，以便幫助用戶更高效地完成任務(wù)。
疫情的出現(xiàn)加速了線下生活線上化，短短時間內(nèi)我們看到日常習(xí)以為常的應(yīng)用為響應(yīng)疫情下的特殊需求紛紛出現(xiàn)改造，釘釘、QQ群被改造成上網(wǎng)課、批改作業(yè)的地方，醫(yī)療衛(wèi)生公眾號開辟了實(shí)時疫情播報(bào)與辟謠通道，無接觸設(shè)計(jì)和服務(wù)需求異常突出……這也啟發(fā)了設(shè)計(jì)師需要保持對突發(fā)事件的敏感力以及應(yīng)急能力，在日常生活中留心思考，為日后突發(fā)事件提供充足的場景支撐。
關(guān)注以人為本
在洶涌的資本語境下，互聯(lián)網(wǎng)設(shè)計(jì)師裹挾在商業(yè)驅(qū)動的結(jié)果導(dǎo)向中狂奔，對設(shè)計(jì)的倫理和責(zé)任鮮有發(fā)聲，但伴隨著互聯(lián)網(wǎng)紅利退潮，發(fā)展放緩，狂奔之下的人本問題也逐漸浮出水面。在大趨勢下，UX設(shè)計(jì)師需要培養(yǎng)自身設(shè)計(jì)對倫理和責(zé)任的敏感度，在滿足商業(yè)目的外，重拾節(jié)操，為多群體，為大社會設(shè)計(jì)，更加注重「以人為本」。
1. 更包容性的設(shè)計(jì)
包容性設(shè)計(jì)師指在做設(shè)計(jì)產(chǎn)品的時候，考慮到各類用戶的訴求，輸出具有包容性的設(shè)計(jì)方案。包容性設(shè)計(jì)依舊是2020年設(shè)計(jì)主題之一，伴隨著互聯(lián)網(wǎng)產(chǎn)品全球化，在通用性和包容性上也提出了新的要求。
為身障人士設(shè)計(jì)
三星在2019年針對東南亞市場推出了一款讓聾盲人士和健全人實(shí)時交流的app：Good Vibes，盲聾人輕擊屏幕輸入摩斯電碼，預(yù)先連線好的另一臺手機(jī)就會顯示從盲聾人發(fā)來的短信。健全人用普通的文字輸入回復(fù)，在盲聾人這一端就會翻譯成摩斯電碼、以手機(jī)振動的方式讀出短信內(nèi)容。
GOOD VIBES宣傳視頻：https://v.qq.com/x/page/g3108sr8qc9.html
餓了么：在餓了么送貨騎手中，約8%受色盲色弱的困擾（全國男性群體中紅綠色盲色弱占比達(dá)8%-9%，餓了么騎手男性占比90%），為此餓了么設(shè)計(jì)團(tuán)隊(duì)在2019年對app的進(jìn)行了重新設(shè)計(jì)，包括使用WCAG無障礙色彩對比度，以及無障礙色盤，以及調(diào)整字階，使用輔助圖形等設(shè)計(jì)手段來解決部分騎手在送貨途中使用APP的痛點(diǎn)問題。
△ 餓了么UED：《為騎士創(chuàng)造平等 — 配送 App 的包容性設(shè)計(jì)》
跨年齡段設(shè)計(jì)
谷歌助手禮貌功能 ( Google Pretty Please ) ：開啟谷歌助手禮貌功能后，如果使用者在下達(dá)指令的語句中包括「Please」，谷歌助手會對禮貌的請求表示感謝，以此培養(yǎng)孩子的禮貌言行。
Google Pretty Please功能宣傳：https://v.qq.com/x/page/e3108ue3e2t.html
Swift Playground：當(dāng)10后小學(xué)生VITA君的編程課被「可敬的發(fā)量」刷滿彈幕時，Swift playgrounds功不可沒，這款為兒童新手學(xué)習(xí)編程的軟件，用趣味的游戲方式為4歲以上低齡用戶提供了一個學(xué)習(xí)編程的低門檻平臺。
為性別平等而設(shè)計(jì)
蘋果emoji：回看歷年蘋果emoji的更新，從膚色平等，到性別、性向平等，再到為殘疾人設(shè)計(jì)，2020年再為跨性別者增加新表情，性別平等依舊是包容性設(shè)計(jì)中重要一環(huán)。
Airbnb插畫：愛彼迎在插畫系統(tǒng)中，也為不同膚色，不同職業(yè)，不同性別，以及身障人士進(jìn)行了人物的繪制。
2. 關(guān)注用戶隱私
2019是互聯(lián)網(wǎng)科技隱私問題沉浮的一年，國外有Facebook因泄露隱私收到史上最大罰單，國內(nèi)則打響了「人臉識別第一案」。籠罩在隱私信任危機(jī)下，個人信息和數(shù)據(jù)立法突飛猛進(jìn)，美國推動《加州消費(fèi)者隱私法案》，國內(nèi)也將在2020年出臺《個人信息保護(hù)法》和《數(shù)據(jù)安全法》。
MIUI12推出隱匿面具功能
Android開放生態(tài)導(dǎo)致的權(quán)限隱私問題一直被用戶所詬病，某些APP存在用戶不授權(quán)就無法使用情況，針對這一情況，MIUI12推出了隱匿面具功能。當(dāng)用戶在開啟某些APP要求授權(quán)權(quán)限時，可以選擇空白通行證進(jìn)行授權(quán)，從而保護(hù)用戶真實(shí)信息。
在MIUI12的更新中，還推出了照明彈、攔截網(wǎng)兩項(xiàng)隱私保護(hù)功能
iOS 14剪貼板提醒
在iOS 14的更新中，保護(hù)用戶隱私方面進(jìn)一步升級。
其中剪貼板提醒設(shè)計(jì)很貼心，當(dāng)用戶打開應(yīng)用，如果該應(yīng)用讀取了你剪貼板的內(nèi)容，會在系統(tǒng)頂部彈出提示，用戶能在第一時間意識到剪貼板內(nèi)容被讀取，幫助用戶更好的保護(hù)自己的隱私內(nèi)容。
3. 健康的數(shù)碼生活方式
科技的發(fā)展是一把雙刃劍，互聯(lián)網(wǎng)產(chǎn)品的發(fā)展給用戶帶來便捷和沉浸體驗(yàn)的同時，也使得用戶沉溺于科技所帶來的惰性和投食之下，逐漸喪失了對真實(shí)生活的把控權(quán)，被科技綁架。
數(shù)字福祉（digital wellbeing）近年被頻頻提起，指科技產(chǎn)品需要權(quán)衡好數(shù)碼產(chǎn)品和真實(shí)生活之間的平衡，防止數(shù)碼產(chǎn)品過渡分散用戶的注意力而影響生活質(zhì)量。
Android Q 專注模式 Google Android Q Focus Mode
Android Q的更新加入了專注模式，用戶在專注模式下，可以在系統(tǒng)層面快捷地關(guān)閉使你分心的應(yīng)用，讓你聚焦于更重要的事情。
防沉迷系統(tǒng)升級
推薦技術(shù)的進(jìn)步，產(chǎn)品體驗(yàn)的升級，給用戶帶來了更合胃口的菜式和沉浸體驗(yàn)，但同時也被冠上了「電子海洛因」的稱號。游戲或者內(nèi)容產(chǎn)品的防沉迷系統(tǒng)依舊會是數(shù)字福祉下不可避免的趨勢。
王者榮耀在2020年升級防沉迷系統(tǒng)，對青少年的娛樂時間和點(diǎn)券充值的限制進(jìn)行了進(jìn)一步升級。承接話。B站在2019年推出青少年模式，在該模式下，使用時長和內(nèi)容推薦等做了定制化處理。
2020年的UI設(shè)計(jì)趨勢，一方面是對往年風(fēng)格的衍變和細(xì)化，另一方面，在扁平克制的界面風(fēng)格盛行后，設(shè)計(jì)師們向往更自由、更突破的視覺表達(dá)。
UI的繼承和創(chuàng)新
1. 深色模式
2019年iOS 13深色模式姍姍來遲，緊接著大廠APP相繼推出此功能。在2020年，深色模式會繼續(xù)普及外，也會在可視性和實(shí)現(xiàn)成本方面有更多細(xì)節(jié)打磨和研究。
2. 新擬態(tài)
設(shè)計(jì)趨勢的發(fā)展是螺旋式上升的，在扁平化設(shè)計(jì)流行之后，對物體的擬真再一次回歸設(shè)計(jì)圈，新擬態(tài)以一種對舊擬物風(fēng)格的再創(chuàng)新，重新流行起來。
新擬物風(fēng)格（Neumorphism）緣起于設(shè)計(jì)師Alexander Plyuto發(fā)布在dribbble的一組作品，以投影重新對扁平界面進(jìn)行了塑造，模仿出類似浮雕的視覺效果，感受耳目一新，引起大量設(shè)計(jì)師相盡模仿。
新擬態(tài)的實(shí)用性和可落地性有待商榷，但是作為一種新的風(fēng)格受到設(shè)計(jì)師擁躉，也不失為下一波風(fēng)潮到來前的靈感繆斯。
WWDC2020對mac OS的更新也重新定義了新擬態(tài)設(shè)計(jì)語言，在mac OS新系統(tǒng)Big Sur中，圖標(biāo)的設(shè)計(jì)增添了輕微的漸變、投影、高光，以此來營造圖標(biāo)內(nèi)元素之間的縱深關(guān)系。
3. 多彩配色
在扁平簡潔UI風(fēng)格盛行之后，豐富的色彩依舊是設(shè)計(jì)趨勢之一，大面積色塊，碰撞配色，帶來更具沖擊感的視覺體驗(yàn)。
4. 字體裝飾化
UI界面逐漸扁平，色塊圖標(biāo)弱化，為突出頁面重心和內(nèi)容，iOS 11在界面標(biāo)題上使用更大的字號，更粗的字重。近年在大標(biāo)題的風(fēng)格衍變下，文字在傳達(dá)信息外，也開始有了裝飾性作用，采用超大字體，成為頁面排版美化的一部分。
5. 更大圓角
大圓角的風(fēng)格會繼續(xù)延續(xù)，相較以往，卡片的處理圓角會更大，隨之帶來的是多的留白處理，結(jié)合大字號，帶來更透氣通透的視覺感受。
Mac OS Big Sur的界面相對舊版本采用了更大的圓角；系統(tǒng)圖標(biāo)的設(shè)計(jì)統(tǒng)一成圓角矩形。
6. 更豐富的插圖
UI插圖的豐富體現(xiàn)在樣式和內(nèi)容上，樣式上開始3D化，內(nèi)容上更注重插圖敘事的表達(dá)。
7. 3D插圖
3D圖形往年更多運(yùn)用在動態(tài)影像或運(yùn)營類設(shè)計(jì)中，隨著3D的普及運(yùn)用，UI插圖也會迎來3D化，給用戶帶來更立體，更新鮮的視覺感受。
8. 講求敘事表意
相較于往年追求形式的UI插圖，新趨勢下的插圖更講求功能性，每一副插圖都承載一定的作用——傳達(dá)功能信息或透傳品牌情感；同時插圖更講求畫面表意和情節(jié)，給用戶敘事性的視覺體驗(yàn)，增進(jìn)用戶和產(chǎn)品之間的情感聯(lián)系。
9. 插圖組件化
插畫的流行，隨之而來的是成本的水漲船高——一套系列插圖為保持風(fēng)格統(tǒng)一，往往由唯一設(shè)計(jì)師繪制，同時為兼容各類場景，設(shè)計(jì)師往往要繪制多張。
為解決插圖的成本和效率，插圖開始以組件化的方式進(jìn)行繪制——插圖設(shè)計(jì)師將插畫進(jìn)行拆分繪制——不同人物，不同場景，不同物件等，再通過組件化的拼接合成，使用組件的設(shè)計(jì)師可以根據(jù)需求場景自由組合，也避免了風(fēng)格不統(tǒng)一問題。
設(shè)計(jì)師Pablo Stanley將日常繪制的插畫制成一套矢量插圖組件庫，將人物分為：半身、全身和坐姿3大類。通過不同表情、發(fā)型和服裝可自由搭配出近60萬種組合。
Pablo Stanley人物插畫系統(tǒng)：https://v.qq.com/x/page/s3108yeyhmt.html
10. 多維度動畫表現(xiàn)
新趨勢下，動畫一方面回溯復(fù)古線描手繪風(fēng)格，另一方面追求更三維的體驗(yàn)，同時幀率進(jìn)一步提升，追求更流暢的視覺感受。
11. 手繪動畫
手繪插圖是往年的熱門，其隨性自然的筆觸，能給用戶帶來親切的感受，在新的趨勢下，動畫的加入賦予手繪插圖一份靈性和趣味。
12. 3D運(yùn)動
Google Material Design通過卡片投影層級和二維動畫規(guī)律，賦予扁平界面Z軸的縱深感。隨著3D的普及流行，新趨勢下的界面，界面的運(yùn)動從二維走向三維，表現(xiàn)出3D場景下透視感。
13. 高幀率動畫
高幀率影視從線下電影院移步到線上流媒體，手機(jī)高幀率屏幕從90Hz到120Hz逐步升級，用戶對畫面流暢的定義一再刷新，UI動畫的幀率升級也會是新的一輪趨勢。
Telegram的表情采用了高幀率動畫，給用戶更流暢的視覺感受。
更高效的涉及協(xié)作方式
體驗(yàn)的持續(xù)升級，產(chǎn)品的高速迭代，對UX設(shè)計(jì)師的設(shè)計(jì)師效率提出了更高的要求。高效的設(shè)計(jì)方式是一個永恒的趨勢。
1. 從本地文件到云端協(xié)作
傳統(tǒng)的文件交接方式效率低下，導(dǎo)致設(shè)計(jì)師之間信息不對稱，最終影響產(chǎn)品的一致性體驗(yàn)。近些年在線設(shè)計(jì)協(xié)同工具發(fā)展迅速，從UI設(shè)計(jì)、 設(shè)計(jì)交付以及組件協(xié)同等環(huán)節(jié)上給設(shè)計(jì)師提供更加高效實(shí)時的協(xié)作體驗(yàn)，獲得大量UX設(shè)計(jì)師的簇?fù)?。?019 uxtool的設(shè)計(jì)工具調(diào)研中，在線設(shè)計(jì)協(xié)同工具佼佼者figma以其協(xié)作和性能優(yōu)勢，大有追趕sketch之勢。
隨著團(tuán)隊(duì)對設(shè)計(jì)效率要求的提高，設(shè)計(jì)文檔從本地走向云端協(xié)作是不可逆趨勢。不過設(shè)計(jì)工具的迭代是需要成本的，尤其在大型設(shè)計(jì)團(tuán)隊(duì)，設(shè)計(jì)工具需要渡過陣痛期來完成迭代，進(jìn)而提升設(shè)計(jì)效率和體驗(yàn)一致性。
2. 科學(xué)有效的設(shè)計(jì)系統(tǒng)
UX的發(fā)展，從早期的靜態(tài)規(guī)范到當(dāng)下的動態(tài)設(shè)計(jì)系統(tǒng)，是為解決產(chǎn)品迭代增速后帶來的設(shè)計(jì)效率和產(chǎn)品體驗(yàn)問題。商業(yè)驅(qū)動下的產(chǎn)品迭代速度有增無減，設(shè)計(jì)系統(tǒng)依舊會是未來幾年的設(shè)計(jì)趨勢之一。
這里說的設(shè)計(jì)系統(tǒng)不是廣義上的設(shè)計(jì)系統(tǒng)，而是在互聯(lián)網(wǎng)設(shè)計(jì)的發(fā)展中，對組件化設(shè)計(jì)逐步迭代升華的一套設(shè)計(jì)協(xié)作方法：
「設(shè)計(jì)系統(tǒng)（Design systems）是一組為了共同目標(biāo)而服務(wù)的內(nèi)在相互聯(lián)系的設(shè)計(jì)模式和多人協(xié)同執(zhí)行的方法?！梗ㄒ浴禗esign systems》，Alla Kholmatova，C7210翻譯）。
3. 設(shè)計(jì)系統(tǒng)歷程衍變
組件化的發(fā)展歷經(jīng)規(guī)范文檔到UI組件，再到設(shè)計(jì)系統(tǒng)，形態(tài)從最初對設(shè)計(jì)一致性的指導(dǎo)規(guī)范，到對產(chǎn)品研發(fā)流程的規(guī)范，以及產(chǎn)品設(shè)計(jì)價值觀的輸出，當(dāng)下的設(shè)計(jì)系統(tǒng)以集大成者形式影響整個產(chǎn)品的設(shè)計(jì)形態(tài)。
設(shè)計(jì)系統(tǒng)的結(jié)構(gòu)見下圖：
4. 設(shè)計(jì)系統(tǒng)的求同存異
設(shè)計(jì)系統(tǒng)并非一成不變的，他是一個動態(tài)進(jìn)化的系統(tǒng)，會根據(jù)團(tuán)隊(duì)性質(zhì)、產(chǎn)品特性在內(nèi)容上有所區(qū)分——比如大團(tuán)隊(duì)更應(yīng)該大而全，小團(tuán)隊(duì)更傾向小而精；成熟產(chǎn)品的設(shè)計(jì)系統(tǒng)更傾向于打造完整閉環(huán)的合作流程機(jī)制，新產(chǎn)品的設(shè)計(jì)系統(tǒng)應(yīng)該以小為始，快速迭代……
隨著產(chǎn)品的垂直化，細(xì)分化，設(shè)計(jì)系統(tǒng)的趨勢會是在趨勢大同之下找到適合產(chǎn)品和團(tuán)隊(duì)自身的形態(tài)和節(jié)奏。
Material Design是一個包含了指導(dǎo)規(guī)范、組件，以及設(shè)計(jì)開發(fā)工具的自適應(yīng)性設(shè)計(jì)系統(tǒng)。
它作為平臺型性設(shè)計(jì)系統(tǒng)，更為大而全的規(guī)范了整個生態(tài)系統(tǒng)的設(shè)計(jì)風(fēng)格，以及提供工具讓研發(fā)者能快速產(chǎn)出符合規(guī)范的產(chǎn)品。
△ Google生態(tài)龐大繁雜，Material Design更為全面
Ant Design作為一個為to B產(chǎn)品提供解決方案的平臺，更多從設(shè)計(jì)可用性和完整性考慮設(shè)計(jì)系統(tǒng)的搭建。
△ Ant Design通過模塊化解決方案，降低冗余的生產(chǎn)成本，讓設(shè)計(jì)者專注于更好的用戶體驗(yàn)
QQ作為一款面向95后的2C社交產(chǎn)品，其設(shè)計(jì)系統(tǒng)Q語言從風(fēng)格調(diào)性上對設(shè)計(jì)進(jìn)行規(guī)范，同時給予設(shè)計(jì)師一定的自由度；也考慮到QQ內(nèi)兼顧多個產(chǎn)品，以及界面主題樣式，對基礎(chǔ)組件的使用場景和代碼進(jìn)行了規(guī)范，方便設(shè)計(jì)和開發(fā)敏捷開發(fā)。
Q語言，給予產(chǎn)品的自由調(diào)性之外，也針對主題和基礎(chǔ)組件進(jìn)行了規(guī)范。
每個產(chǎn)品和團(tuán)隊(duì)都有自身的特征，設(shè)計(jì)系統(tǒng)的建設(shè)也應(yīng)該有的放矢，沒有可照搬的標(biāo)準(zhǔn)答案，在大方向下找到適合自身的解決方案才是的可行之道，將效率最大化。
5. 科學(xué)有效的優(yōu)化迭代
組件是設(shè)計(jì)系統(tǒng)中的重要組成部分，但是以往靜態(tài)的、孤立的協(xié)作方式使得組件的更新迭代滯后和阻塞。隨著設(shè)計(jì)系統(tǒng)的發(fā)展，設(shè)計(jì)師組件化思維的普及，組件的更新需要更科學(xué)高效的方式進(jìn)行管理。
Figma在2019年推出的Design System Analytics功能，組件設(shè)計(jì)師可以借此查看組件的使用情況，包括引用次數(shù)，解組次數(shù)等，并可以生成組件使用情況的曲線趨勢圖，以數(shù)據(jù)的形式，科學(xué)高效地推動組件的優(yōu)化迭代。
選擇分析的時間段；組件使用的次數(shù)曲線圖；團(tuán)隊(duì)使用情況；所有組件使用情況
后記
未來的用戶體驗(yàn)會出現(xiàn)什么新趨勢？人工智能等算法的發(fā)展、5G技術(shù)普及、新的智能設(shè)備形態(tài)、新的信息處理技術(shù)、新一代用戶的喜好和口味……這些往后或?qū)⒂绊懹脩趔w驗(yàn)發(fā)展的走向。未來用戶對體驗(yàn)的要求只會越來越高。
用戶體驗(yàn)設(shè)計(jì)師需要了解更多的技術(shù)動向，但安身立命之本還是讓用戶真正受益：立足于用戶真實(shí)使用場景，在理性價值層面上，打造可用、易用、高效的設(shè)計(jì)；在感性需求層上賦予情感上的愉悅性，在反思層面賦予意義價值。
來源：騰訊ISUX
]]>同時，微信也是互聯(lián)網(wǎng)界的一個異類，張小龍?jiān)谖⑿殴_課上回應(yīng)到：“我們只是守住了做一個好產(chǎn)品的底線，居然就與眾不同了“。
好產(chǎn)品自然是體驗(yàn)和價值至上。下面，我就為大家解讀微信的用戶體驗(yàn)設(shè)計(jì)。
01. 二次確認(rèn)的微創(chuàng)新
先從最簡單的二次確認(rèn)講起。
微信針對首頁消息和收藏列表的刪除操作，做了二次確認(rèn)的微創(chuàng)新。像同類 IM 聊天工具，如 iOS 短信、Facebook Messenger、飛聊等等，二次確認(rèn)都是采用底部系統(tǒng)彈窗。這樣做，從程序架構(gòu)的角度來看兼容和通用性更強(qiáng)。
而從體驗(yàn)設(shè)計(jì)的角度來看，則剛好相反，因?yàn)閺牡谝淮蝿h除操作，到第二次確認(rèn)系統(tǒng)彈窗。之間的目標(biāo)距離太長，耗時也就變長了。根據(jù)菲茨定律（Fitts' Law），獲取目標(biāo)的時間取決于目標(biāo)的距離和大小。這意味著提升交互的效率，不僅需要減少距離，同時要增加目標(biāo)大小。
收藏列表
回過頭看來微信，就是這樣設(shè)計(jì)的。二次確認(rèn)是在第一次的基礎(chǔ)上延展，距離幾乎為0，同時，目標(biāo)按鈕的寬度也增加了幾倍，大大的提升了交互效率。
02. 互動體驗(yàn)廣告
其實(shí)，商業(yè)和用戶體驗(yàn)往往是有沖突的。而微信廣告很好的平衡了這一點(diǎn)。
通過豐富有趣的互動體驗(yàn)式創(chuàng)意，或畫圓、或畫方、或畫愛心，吸引大家主動參與互動。
– 開放首條評論
另外，首條評論功能讓品牌像朋友一樣與大家的對話，利用明星效應(yīng)，從而帶動更多人參與評論，有效提升評論區(qū)活躍度和廣告點(diǎn)擊率。
朋友圈劉雯廣告
以劉雯發(fā)布的朋友圈廣告為例，大表姐把最新款的vivo X30系列手機(jī)交到你手中，并在首條評論中邀請你幫她拍照。數(shù)十萬用戶積極回復(fù)劉雯，評論率高于歷史均值40倍+，“你這么漂亮怎么拍都好看”、“天天給你拍”，大表姐的魅力折服了眾多用戶，有效提升了品牌的親和力與好感度。
– 打開儀式 · 最強(qiáng)震動級別
在交互方面，如果你是 iPhone 用戶，可以體驗(yàn)到 Taptic Engine 線性震動馬達(dá)，通常力度由輕到重分別是 Light、Medium、Heavy。在打開廣告的那一刻，它給你的是最強(qiáng)震動級別，滿滿的儀式感！整個微信應(yīng)該找不到第二個這樣級別的震動了。
03. 提供反饋信息
再舉一個震動的例子，當(dāng)你的好友拍攝了時刻視頻后，可以看到 TA 的頭像右上角多了一個藍(lán)色的小圈圈，雙擊它就能看到好友的時刻視頻了。
當(dāng)然，你雙擊沒有拍攝時刻視頻的好友，TA 的頭像會左右晃動，并且會有 Failure 的震動反饋，動畫和震動節(jié)奏完美匹配，這個體驗(yàn)就像你解鎖 iPhone 輸錯密碼時的震動是一樣的。
沒有時刻視頻時的反饋
我們做產(chǎn)品設(shè)計(jì)時也一樣，對于用戶的操作，應(yīng)當(dāng)給予清晰明了的反饋，幫助用戶更好的理解信息。
04. 跨平臺能力
微信的起步階段是基于手機(jī)來做 App，不基于 PC 來做，PC 端只是輔助，而現(xiàn)在，它的跨平臺能力也逐漸增強(qiáng)。
一周前，微信 PC 版「微信測試版 for Windows」發(fā)布了 2.9.0 的內(nèi)測，同步了移動端的新功能，主要有兩點(diǎn)：
1. 支持打開小程序，也可以玩「貪吃蛇」「跳一跳」等小游戲了。
Windows 微信客戶端
2. 另外，此前的微信 PC 端只支持引用文字消息，也沒有達(dá)到手機(jī)上引用消息的視覺效果。此次更新中，還新增了很多支持的引用類型，包括但不限于圖片/視頻、表情包、公眾號鏈接、小程序、文件等。
如此看來，Mac 端的更新也不遠(yuǎn)了，可以期待一下。
05. 語音實(shí)時翻譯
最近的微信更新了，除了引入深色模式之外。值得一提的是，語音消息的交互體驗(yàn)得到了優(yōu)化，上滑轉(zhuǎn)文字更方便了。
此前的方式是按住說話，滑到轉(zhuǎn)文字按鈕，說完松開手指后，才把語音解析成文字。
現(xiàn)在交互則少了一步操作，達(dá)到了實(shí)時邊說邊轉(zhuǎn)文字的功能。別小看這一步界面上的優(yōu)化，它背后代表的是微信語音識別能力上的技術(shù)突破。
語音實(shí)時轉(zhuǎn)文字
06. 錨點(diǎn)定位
微信有很多隱性和顯性的錨點(diǎn)，隱性錨點(diǎn)就比如你打開的這篇文章，關(guān)閉后，再重新點(diǎn)進(jìn)來，還是顯示上次閱讀的位置。
訂閱號列表
顯性的錨點(diǎn)就比如上面這個：當(dāng)你刷公眾號列表時候，如果有新文章更新，標(biāo)題欄會出現(xiàn)一個錨點(diǎn)按鈕，點(diǎn)擊它讓你快速回到頂部，方便查看最新文章。
朋友圈「跳到還沒看的位置」
基于此，在新版微信朋友圈中，增加了一個「跳到還沒看的位置」。很多信息流產(chǎn)品是往下刷內(nèi)容，直到給你一個分界線提示：下面內(nèi)容已經(jīng)看過了。而微信這是一個逆向操作，我認(rèn)為這個功能還是很有必要的，因?yàn)榻?jīng)常會有刷朋友圈刷到一半聊天退出去，當(dāng)回來查看朋友圈時，需要重新拉到底部，費(fèi)時費(fèi)力。
07. 自然的語音聽筒播放
《在你身邊，為你設(shè)計(jì)》一書中有提到語音聽筒播放的優(yōu)化。大家都知道，手機(jī)帶有距離感應(yīng)器，在感應(yīng)到耳邊貼近時，屏幕會關(guān)閉以節(jié)省電力，并且避免由于耳朵與屏幕的觸碰導(dǎo)致的誤操作。
微信在聊天界面中，也啟用了距離感應(yīng)，以實(shí)現(xiàn)手機(jī)貼近耳邊時，自動將語音從揚(yáng)聲器切換到聽筒進(jìn)行播放，這樣你可以用最自然的姿勢來聽語音，這是一個很好的體驗(yàn)。
但要完美地實(shí)現(xiàn)這個體驗(yàn)，就需要解決距離感應(yīng)器的時延問題。播放語音時，如果你非常迅速地將手機(jī)移至耳邊，這時候距離感應(yīng)器并不會同樣迅速地對這個動作產(chǎn)生反饋。大約在延遲了300毫秒后，感應(yīng)器發(fā)出信號，微信將iPhone的屏幕關(guān)閉。而在這個時間內(nèi)，你的耳廓極有可能已經(jīng)觸碰到了iPhone的屏幕上。觸碰的位置大部分時候是左上角的返回按鈕區(qū)域。于是很容易出現(xiàn)手機(jī)移至耳邊，語音戛然而止。
延時響應(yīng)判斷流程圖
為了解決這個問題，微信設(shè)計(jì)了一個解決辦法：在響應(yīng)返回操作時，先等待500毫秒，這時候如果偵聽到距離感應(yīng)器有發(fā)出信號，則認(rèn)為是貼耳的動作，此情況下不執(zhí)行返回操作，如上圖所示。而500毫秒的延時大部分時候你是不會感知到的。這一解決辦法極大降低了貼耳時候的誤操作。
總結(jié)
在微信的產(chǎn)品設(shè)計(jì)中，我們看到了交互的細(xì)微迭代和背后的技術(shù)突破，我們看到了商業(yè)創(chuàng)意與用戶體驗(yàn)的平衡。給用戶帶來希望，讓創(chuàng)造者體現(xiàn)價值，這就是微信的設(shè)計(jì)之道。
原文地址：洋爺（公眾號）
作者：洋爺
什么是插圖？
基本上，插圖是對特定概念，文本或過程的視覺解釋。這是一個旨在支持、澄清甚至擴(kuò)展人們從其他信息來源獲得的想法的圖像，通常以文本的形式給出。這個詞本身就意味著“為某些事物投光”，因此它的主要目的是幫助用戶理解或想象更好的東西。
多年來，插圖已被整合到各種印刷品中，如書籍，雜志，報(bào)紙，海報(bào)，傳單，教育材料。后來，動畫和視頻制作為插畫帶來了新的氣息。最近，新的技術(shù)和工具推動了數(shù)字插畫時代的發(fā)展。
隨著網(wǎng)站和移動應(yīng)用程序的不斷增長，插畫的需求和應(yīng)用也不斷飆升。由于其美觀性和創(chuàng)造性，插畫也是作為提高可用性、情感和視覺吸引力的界面之一。但是在UI設(shè)計(jì)中有哪些功能是可以通過插圖來說明的呢？
界面設(shè)計(jì)中使用插圖的方法
和其他界面元素一樣，插畫的功能性多于裝飾性，可以使信息或交互變得更清晰明了，也更加時尚。所以，何樂而不為？以下是我總結(jié)的可以使用插圖的地方：
•主頁橫幅
•主題圖片
•吉祥物和人物
•博客文章圖片
•引導(dǎo)流程和工具提示
•獎勵和其他游戲化圖形
•通知和系統(tǒng)消息
•貼紙（特別適用于Messenger應(yīng)用程序）
•講故事
•信息圖表
•營銷材料和廣告橫幅
•內(nèi)容類別的可視標(biāo)記
•支持網(wǎng)站或應(yīng)用的社交網(wǎng)絡(luò)頁面。
以下是插圖在界面設(shè)計(jì)中深受歡迎的十大理由 – 也許你可以考慮在下一個設(shè)計(jì)項(xiàng)目中使用它們。
界面設(shè)計(jì)中使用插圖的十大理由
1. 自定義插圖為原創(chuàng)性和藝術(shù)和諧奠定了堅(jiān)實(shí)的基礎(chǔ)
圖形為界面、印刷品或品牌相關(guān)的東西增添了一絲風(fēng)格和創(chuàng)意。在競爭激烈的世界中，脫穎而出至關(guān)重要。否則，人們甚至可能不會嘗試你的產(chǎn)品，更不用說了解它的好處了。
順便說一下，這就是為什么許多公司將插圖用作博客文章、評論和登陸頁面的主頁橫幅的原因。在這種情況下，設(shè)計(jì)師可以根據(jù)目標(biāo)受眾偏好對作品進(jìn)行微調(diào)，并將其與特定項(xiàng)目或主題背后的業(yè)務(wù)目標(biāo)或想法進(jìn)行平衡。這樣可以找到充滿趣味的隱喻、配色方案、角色和環(huán)境，從而有效地吸引特定的讀者群或觀眾。
看看這副關(guān)于UI動畫的文章的隱喻標(biāo)題插圖。智能手機(jī)扮演幕墻或屏幕的角色，就像在木偶劇院中使用的那種，設(shè)計(jì)師充當(dāng)演員，每個演員都展示了特定的動作表現(xiàn)模型。
2. 插圖充當(dāng)可視觸發(fā)器，可快速傳輸必要的消息
絕大多數(shù)人對圖像的感知能力超過文字。這是一個無關(guān)好壞的事實(shí)，只是設(shè)計(jì)師可以利用這一點(diǎn)來增加網(wǎng)頁或移動布局的視覺效果。一般來說，人們具有非常廣泛的能力來感知視覺標(biāo)記，識別和處理數(shù)據(jù)，甚至轉(zhuǎn)換為高級抽象的圖像。
事實(shí)例證：
•心理學(xué)家聲稱人們需要大約1/10秒來獲得視覺場景或元素的一般感知（文本項(xiàng)目的速度確實(shí)不可能）
•視覺效果能更快地傳遞到大腦。重要的信息通常被大腦固定為視覺圖像，即使它們是通過文本感知獲得的
•與背景和周圍元素相結(jié)合，圖像不易受到影響，而文本則高度依賴于可讀性
•圖像有助于保留長期記憶。這意味著處理界面的用戶不需要處理和記住比實(shí)際需要更多的數(shù)據(jù)，因此交互變得更快
•當(dāng)來自不同國家/地區(qū)的人使用應(yīng)用或網(wǎng)站時，界面中的視覺效果可以使其更加通用
•圖片突出了具有文本識別自然問題的用戶的感知極限，例如閱讀障礙或非閱讀學(xué)齡前兒童。
所有上述內(nèi)容構(gòu)成了與插圖建立強(qiáng)大而快速視覺聯(lián)想的堅(jiān)實(shí)理由：字符、顏色、構(gòu)圖、可識別的細(xì)節(jié)將快速通知用戶并支持文本形式中給出的消息。
這是一個數(shù)字代理商的登陸頁面，通過一個由籃球運(yùn)動員代表的主頁橫幅形象迅速傳遞其準(zhǔn)備迎接最高的商業(yè)挑戰(zhàn)和目標(biāo)的信息。
還有一個例子是為LunnScape創(chuàng)建的主題插圖。LunnScape是一家專門從事景觀設(shè)計(jì)和植物護(hù)理的公司。這些藝術(shù)品旨在用于營銷活動，社交網(wǎng)絡(luò)和網(wǎng)站。經(jīng)過一系列的實(shí)驗(yàn)，設(shè)計(jì)師想出了柔和色彩和筆觸輕盈的圖形。其中一個插圖的特點(diǎn)是人們忙于園藝，而第二個插圖反映了公共空間的風(fēng)景與景觀設(shè)計(jì)。你看，通過這樣的設(shè)計(jì)，插圖立即與景觀主題建立了寶貴的聯(lián)系。
3.圖形為Web或移動界面中應(yīng)用的副本提供有效支持
正如之前提到的，在許多情況下，圖片可以作為一種比復(fù)制更通用的通信工具。但是，也有一些陷阱需要仔細(xì)考慮。感知的速度并不是我們唯一需要的東西：人們可以超快地感知插圖，但如果他們傳輸?shù)男畔⒉磺逦蛘呖梢员浑p重閱讀，速度將無法帶來積極的用戶體驗(yàn)。
快速捕獲導(dǎo)致錯誤理解的圖形不能被定義為識別，它只是被快速注意到。識別不僅意味著速度，還意味著應(yīng)該給你用戶指示正確的動作或傳達(dá)正確的視覺元素信息。因此，請立即清除視覺隱喻以免造成誤解或錯誤關(guān)聯(lián)。
這里是一個金融服務(wù)網(wǎng)站的例證，幫助養(yǎng)老金領(lǐng)取者有效地管理他們的錢并增加他們的儲蓄。藝術(shù)作品會立即傳送信息，使其與標(biāo)語保持一致。 這樣，當(dāng)布局中的所有元素協(xié)同工作時，網(wǎng)頁看起來就很吸引人。
4. 插圖是一個很好的創(chuàng)造性故事的檢驗(yàn)工具
簡而言之，講故事是將不同信息塊合并為一個故事的方法，使它們更讓人印象審核，并在各部分之間建立牢固的聯(lián)系。 這種方法在營銷和用戶體驗(yàn)設(shè)計(jì)方面表現(xiàn)得非常有效。
這是為我們最近的佛羅倫薩項(xiàng)目設(shè)計(jì)的插圖集。它是一個可以讓自由護(hù)士在線尋找工作的平臺。設(shè)計(jì)師創(chuàng)造了原始角色，展示故事，設(shè)置氛圍，發(fā)送信息或以與平臺的情緒、語氣和聲音相對應(yīng)的方式呈現(xiàn)優(yōu)勢。
5. 插圖在設(shè)定情感訴求方面具有重要的力量
毫無疑問，我們都是情感動物。談到情感設(shè)計(jì)，AarronWalter說：“許多網(wǎng)站和應(yīng)用程序正在創(chuàng)造更好的體驗(yàn)。他們重新劃分需求的層次結(jié)構(gòu)，包括一個帶有快樂和愉悅色彩的新頂層。如果界面可以幫助你完成一項(xiàng)關(guān)鍵任務(wù)并讓你感到非常愉悅，那是不是很棒？是的，的確是這樣！這將是你向朋友推薦的一種體驗(yàn); 這將是一個值得傳播的想法。”
這就是你可以利用插圖實(shí)現(xiàn)的一些有效的事情。你投入其中的一切 – 線條、形狀、顏色、面部表情、曲線動態(tài) – 都會對點(diǎn)燃情緒產(chǎn)生重大影響。通過研究用戶行為和影響情感吸引力的因素，設(shè)計(jì)師可以將插圖作為一種強(qiáng)大的工具，將經(jīng)驗(yàn)與用戶情感從最初的互動相互連接。
Kiddy的這個登錄頁面的設(shè)計(jì)概念讓保姆雇傭變得非常簡單。可愛正面的元素在充滿趣味性的插圖中扮演關(guān)鍵角色，為用戶傳遞信息和情緒。在用戶開始閱讀服務(wù)之前創(chuàng)造所需的氛圍，并為所有頁面提供獨(dú)特的外觀。
6. 定制圖形設(shè)計(jì)為美學(xué)滿意度奠定了基礎(chǔ)，從而增加了項(xiàng)目的可取性
通過數(shù)百次關(guān)于“功能優(yōu)先”主題的討論和論證，人們對美麗和喜悅的自然渴望依然存在。當(dāng)然，實(shí)用性和可用性是任何界面的基礎(chǔ)?？扇⌒允峭ㄟ^美觀可愛的外觀讓人們注意到你的產(chǎn)品，感受使用它的樂趣，并希望再次使用它。插圖則是一種經(jīng)過精心檢查的方式來實(shí)現(xiàn)這一目標(biāo)，因?yàn)樗鼈兛梢蕴砑用栏?，風(fēng)格，優(yōu)雅或任何您想要添加到界面中的內(nèi)容。
這是一個網(wǎng)頁設(shè)計(jì)概念，為旅客提供簡單明亮的預(yù)訂服務(wù)。它在頁面左側(cè)使用大幅的3D插圖，而右側(cè)部分則突出搜索住宿的形式。
7. 插圖令人難忘且引人入勝。因此它們在提高品牌知名度和可識別性方面有不錯的表現(xiàn)
與文本相比，圖像在長期記憶中具有更好的粘性。當(dāng)圖像提供信息時，影響將會增長，與目標(biāo)受眾的期望一致的設(shè)計(jì)、布局使得有插圖的UI設(shè)計(jì)可以非常有效的增加網(wǎng)站或移動應(yīng)用程序的品牌性。這就是插圖被廣泛用于引導(dǎo)流程的原因之一。
這些是Perfect Recipes應(yīng)用程序的流程引導(dǎo)圖。在交互開始時，用戶設(shè)定他們想要實(shí)現(xiàn)的目標(biāo)，例如減輕或增加體重，保持健康的飲食等。此外，用戶可能會標(biāo)記他們不喜歡的成分，以便應(yīng)用程序不會顯示包含它們的食譜。插圖以明亮和原始的方式可視化目標(biāo)。
這是另一個使用流程引導(dǎo)的例子。有趣的人物和插圖成為app游戲化的關(guān)鍵元素。集成到UI中的原始吉祥物成為通信和交互的核心元素，在不同的狀態(tài)下，它向用戶傳遞不同的消息，使交互更加用戶友好和擬人化。
8. 數(shù)字插圖可有效創(chuàng)建動畫短片和互動元素，使交互生動優(yōu)雅
越來越多的網(wǎng)站和應(yīng)用程序在用戶界面中應(yīng)用動畫。通過這種方式，不僅可以增強(qiáng)可用性，還可以增強(qiáng)情感吸引力和UI外觀的優(yōu)雅。這也是為什么我們經(jīng)常看到動畫徽標(biāo)，圖標(biāo)甚至復(fù)雜的動畫插圖。動畫能為創(chuàng)意、消息和情緒帶來更多表現(xiàn)力。更重要的是，應(yīng)用動畫視頻也是熱門且有效的趨勢之，插圖可以獲得更高水平的開發(fā)和與用戶的溝通。
這是Whizzly動畫徽標(biāo)的示例。Whizzly是年輕人展示人才和分享創(chuàng)意項(xiàng)目的社交網(wǎng)絡(luò)。應(yīng)用于徽標(biāo)及其動畫版本的藝術(shù)手段使其看起來令人愉悅，令人難忘和情緒化。
9. 基于有趣視覺隱喻的插圖使設(shè)計(jì)獨(dú)特且引人入勝
與藝術(shù)一樣，在設(shè)計(jì)中，隱喻是吸引用戶并使他們考慮所提供的想法的有效方式。插圖使設(shè)計(jì)師能夠處理與特定目標(biāo)和用戶相對應(yīng)的獨(dú)特隱喻。
這是一個約會應(yīng)用程序的登陸頁面的概念，讓人們找到他們完美的一對。插圖展示了主題制作明亮的視覺觸發(fā)器，并有效地結(jié)合了人們聯(lián)合設(shè)備的形象。
平面設(shè)計(jì)師面臨的一個關(guān)鍵挑戰(zhàn)是尋找原始風(fēng)格 – 而這正是激發(fā)這件藝術(shù)品隱喻的原因。在平面插圖的文章中，平面設(shè)計(jì)師分享了如何抓住這條金魚的實(shí)用技巧，并在標(biāo)題插圖中應(yīng)用了相同的比喻。
10. 人們快速注意并解碼圖像，因此明智地使用插圖可以使交互更簡單，更快捷
圖標(biāo)和插圖等自定義圖形可以成為界面清晰直觀導(dǎo)航的重大改進(jìn)。在許多情況下，用戶界面中的基本交互通常會花費(fèi)幾秒鐘，這點(diǎn)非常重要，并且這也是將具有視覺標(biāo)記的的內(nèi)容轉(zhuǎn)換為圖形的基本原因。但是，請記住：如果圖像可能被錯誤地解碼或根本沒有解碼，他們則需要額外的復(fù)制內(nèi)容支持。而用戶測試將有助于找出哪些元素絕對清晰，哪些元素需要用文本解釋。
以下是為移動照片編輯器創(chuàng)建的原始圖標(biāo)Cuteen：支持文本提示的優(yōu)雅插圖可幫助用戶快速輕松地處理內(nèi)容。
要考慮的要點(diǎn)
當(dāng)然，現(xiàn)有的認(rèn)知方案不可能滿足用戶的任何要求，但在圖形設(shè)計(jì)方面有一些必須考慮的要點(diǎn)：
•目標(biāo)受眾（身體能力，年齡，文化背景，總體發(fā)展和教育水平）
•典型的產(chǎn)品使用環(huán)境
•全球或本地產(chǎn)品差價水平
•所選圖形和隱喻的識別水平
•圖形提供的分心/集中程度
所有提到的要點(diǎn)都涉及人類認(rèn)知能力并影響視覺數(shù)據(jù)感知的質(zhì)量。對于設(shè)計(jì)師來說，重要的是要記?。簝H僅讓用戶看到布局的元素是不夠的，讓他們認(rèn)識到這些圖形的意義并快速理解它們所傳遞的信息是至關(guān)重要的。
原文地址：Mockplus
作者：Grace
]]>截止到目前為止，越來越多的設(shè)計(jì)師將動畫作為一種功能元素融入其中，以增強(qiáng)用戶體驗(yàn)。動畫不再只是為了娛樂；它是完成交互的最重要工具之一。
然而，動畫在設(shè)計(jì)中只有用在合適的時間和地點(diǎn)的時候，才能夠增強(qiáng)用戶體驗(yàn)。好的用戶界面動畫是有目的的；它們有意義，而且功能性強(qiáng)。在本文中，我們將討論功能動畫在UX設(shè)計(jì)中的作用，并了解何時將動畫運(yùn)用到設(shè)計(jì)中。
什么是功能動畫？
功能動畫是嵌入在UI設(shè)計(jì)中的一個微妙元素，它是該設(shè)計(jì)功能的一部分。并且它強(qiáng)化了設(shè)計(jì)，具有非常明確和合乎邏輯的目的，包括：
1、減少認(rèn)知負(fù)擔(dān)
2、防止變化迷失
3、在空間關(guān)系中建立更好的聯(lián)系
動畫使用戶界面栩栩如生。在以用戶為中心的設(shè)計(jì)方法中，用戶是主要焦點(diǎn)，用戶界面需要直觀、快速響應(yīng)和人性化。功能動畫就可以幫助你實(shí)現(xiàn)這些目標(biāo)。
功能動畫在用戶界面設(shè)計(jì)中的作用
經(jīng)過深思熟慮和經(jīng)過測試的功能動畫有可能實(shí)現(xiàn)多種功能。
用戶操作的可視反饋
良好的交互設(shè)計(jì)提供反饋。這種反饋會讓你覺得你正在與屏幕上的元素進(jìn)行交互，并演示這種交互的結(jié)果（不管它是否成功）。
用戶界面元素，如按鈕和控件，即使它們位于一層玻璃的后面，也應(yīng)該是可感知的。
按鈕和其他活動控件應(yīng)通過視覺反饋響應(yīng)用戶操作。（圖片來源：Behance）
當(dāng)您需要告訴用戶操作結(jié)果時，視覺反饋也很很重要。在操作未成功完成的情況下，功能動畫以快速、簡單的方式提供有關(guān)問題的信息。例如，當(dāng)輸入錯誤的密碼時，可以使用震動動畫。這樣很容易理解，因?yàn)榛蝿邮且粋€普遍表達(dá)“不”的含義，就像搖頭是人們相互反饋的方式。
用戶看到此動畫并立即了解問題。圖片來源：thekineticui
目的
確認(rèn)系統(tǒng)已收到用戶的操作。
確認(rèn)（或拒絕）用戶的操作。
系統(tǒng)狀態(tài)的可見性
作為尼爾森的可用性的10大法則之一，系統(tǒng)狀態(tài)的可見性仍然是用戶界面設(shè)計(jì)中最重要的原則之一。用戶希望在任何給定時間知道他們在系統(tǒng)中的當(dāng)前位置，并且應(yīng)用程序不應(yīng)該讓他們猜測，系統(tǒng)應(yīng)該通過適當(dāng)?shù)囊曈X反饋告訴用戶發(fā)生了什么。
數(shù)據(jù)上傳和下載得到過程是使用功能動畫的最好時機(jī)。例如，下載進(jìn)度條，給用戶實(shí)時反饋和心理預(yù)期。
有趣的動畫也會分散用戶的注意力，并使他們等待更長時間。
功能動畫還可以用于吸引用戶注意應(yīng)用程序中的重要狀態(tài)變化，例如來電：
或收件箱中的新電子郵件。
目的：
提供系統(tǒng)狀態(tài)的實(shí)時通知，并使用戶能夠快速了解正在發(fā)生的事情。
視覺提示
用戶在第一次使用某個應(yīng)用程序時，通常需要一些幫助來理解如何使用該應(yīng)用程序。特別是含有不熟悉或者獨(dú)特交互方式的界面（如手勢操作的界面），這一點(diǎn)尤為重要。如果沒有幫助，用戶可能會對如何與應(yīng)用程序交互感到困惑。
當(dāng)涉及到教用戶如何使用你的UI界面時，你應(yīng)該提供一組視覺提示，來傳達(dá)哪些是可能存在的交互。這種功能性動畫驅(qū)使用戶注意到可能存在的交互。
視覺提示可以讓用戶了解將要發(fā)生的事情。例如，可以在iOS相機(jī)應(yīng)用程序（iOS 7之前）中找到功能動畫，它為用戶拍攝照片做準(zhǔn)備。
==相機(jī)應(yīng)用程序中的快門圖像===
或者，通過演示設(shè)計(jì)中的某些功能是如何工作的，這種方式可以讓用戶采取進(jìn)一步的步驟。同時，視覺提示也可以提高產(chǎn)品的可用性。
用途：
告訴用戶即將發(fā)生什么給用戶足夠的心理預(yù)期 幫助用戶定位自己在界面中的位置 告訴用戶他們怎樣做才能與屏幕上的元素進(jìn)行交互
導(dǎo)航過渡
導(dǎo)航過渡是應(yīng)用程序中狀態(tài)之間的轉(zhuǎn)換，例如，從主屏幕到細(xì)節(jié)屏幕。通常默認(rèn)情況下的狀態(tài)變化是界面之間很僵硬的切換，這樣很難區(qū)分界面之間的層級關(guān)系。功能動畫可以幫助用戶更好的理解；它可以在導(dǎo)航上下文之間平滑轉(zhuǎn)換，并通過狀態(tài)的轉(zhuǎn)換創(chuàng)建可視連接來解釋屏幕上的變化。
導(dǎo)航過渡可以是分層轉(zhuǎn)換（親子過渡）或同行過渡（兄弟過渡）。當(dāng)用戶探索應(yīng)用程序的更深層次的時候，將使用分層轉(zhuǎn)換，這些應(yīng)用程序是當(dāng)前（父屏幕）的子級。運(yùn)動突出顯示從父母到子女（子元素）的移動，同時加強(qiáng)父屏幕和子屏幕之間的關(guān)系。
同行過渡發(fā)生在層次結(jié)構(gòu)的同一級別的元素之間。例如，當(dāng)用戶瀏覽選項(xiàng)卡時使用此動畫。
每個標(biāo)簽的內(nèi)容和表面保持在同一級別，動畫只是引導(dǎo)視圖之間的焦點(diǎn)。
在這兩種情況下，功能動畫都可以幫助眼睛看到新對象在其顯示的位置以及隱藏對象的位置（并且可以再次找到）。它提供了視覺提示，使交互更容易被發(fā)現(xiàn)并強(qiáng)調(diào)已發(fā)生的事情。
用途：
定義屏幕和元素之間的空間關(guān)系 通過幫助用戶理解頁面布局中剛剛發(fā)生的變化，避免出現(xiàn)意外的過渡
品牌塑造
通常情況下，有幾十個應(yīng)用程序具有相同的功能并完成相同的任務(wù)。他們可能都有很好的用戶體驗(yàn)，但是人們喜歡的東西不僅僅是提供一個良好的用戶體驗(yàn)。用戶更希望與他們建立情感聯(lián)系。
品牌動畫負(fù)責(zé)參與品牌塑造。它可以作為營銷工具-支持公司的品牌價值或突出產(chǎn)品的優(yōu)勢-同時使用戶體驗(yàn)變得令人愉快和難忘。這種方法可能不是以用戶為中心的設(shè)計(jì)，但它有一個功能性的目的。為了成功，品牌動畫應(yīng)該支持體驗(yàn)的連續(xù)性。
用途：
娛樂用戶，為設(shè)計(jì)帶來同理心和樂趣 創(chuàng)建產(chǎn)品的標(biāo)簽; 幫助用戶與產(chǎn)品建立關(guān)聯(lián)，增加品牌認(rèn)知度
如何找到平衡
有用和炫酷的動畫之間的平衡在哪里？花時間仔細(xì)考慮動畫何時恰當(dāng)?shù)暮螘r是不恰當(dāng)?shù)姆浅Ｖ匾摹?/p>
動畫的目的
動畫應(yīng)該是有目的性的，不要為了動而動。當(dāng)一個動畫不適合某個功能性的目的時，它可能會讓人感到厭煩，尤其是當(dāng)它減慢了一個沒有任何動畫的過程的時候。
請記住，用戶出于某種目的訪問網(wǎng)站或啟動應(yīng)用程序 – 我們需要在短時間內(nèi)向他們展示他們所希望看到的內(nèi)容。因此，當(dāng)決定在應(yīng)用程序中使用動畫時，只有當(dāng)動畫有意義并且不會干擾用戶成功完成他們想要做的事情時，才加入動畫。
時刻牢記
即使是好的動畫，如果使用過度也會很煩人。在設(shè)計(jì)動畫時，問你自己一個問題：“動畫在第100次使用時會很煩人嗎，或者它是普遍清晰和不引人注目的嗎？
原型和測試動畫
在將UI動畫添加到你自己的工作中時，與實(shí)際用戶進(jìn)行迭代原型設(shè)計(jì)和測試是非常正確的。原型設(shè)計(jì)是能夠表達(dá)你打算如何在設(shè)計(jì)中使用動畫的最佳方式。如果你使用交互原型，你將得到一個清晰的設(shè)計(jì)描述，關(guān)于怎樣工作和應(yīng)用程序的缺陷隱藏在哪里。通常，這會導(dǎo)致頻繁的返工，因?yàn)閯赢嫷耐庥^與感覺不同。因此，經(jīng)常迭代和快速迭代！在最微小的細(xì)節(jié)上多次嘗試和重復(fù)都會使你的動畫很棒。
結(jié)論
如果你要在設(shè)計(jì)中運(yùn)用動畫，那么應(yīng)該好好的創(chuàng)造關(guān)聯(lián)，并且只有當(dāng)動畫是設(shè)計(jì)過程的自然組成部分時，這才是可能的。
作者：Coldrain1
個人主頁：https://i.ui.cn/ucenter/310170.html
在本文中，我們將分享ISUX設(shè)計(jì)趨勢報(bào)告的最后一部分“用戶體驗(yàn)趨勢”。用戶體驗(yàn)是產(chǎn)品、人與環(huán)境共同作用下，用戶使用產(chǎn)品的感受。隨著科技不斷進(jìn)步，新的產(chǎn)品和服務(wù)層出不窮，消費(fèi)者的行為和心理也在不斷變化。我們從技術(shù)、硬件、環(huán)境和人四個維度，來分析和總結(jié)用戶體驗(yàn)趨勢，在這個多變的行業(yè)中，大家進(jìn)行新的設(shè)計(jì)和改進(jìn)設(shè)計(jì)時，加以對趨勢的了解，為即將到來的未來做準(zhǔn)備。
為了更好的了解趨勢出現(xiàn)的原因，我們從影響趨勢的客觀條件中歸納了一些信號：
2019年是5G元年
思科最新研究表明，2022年，全球近12%的移動數(shù)據(jù)流量來自5G連接。5G超高速率讓內(nèi)容推薦更加個性化和精準(zhǔn)化，萬物互聯(lián)會帶來更多的智能終端和更多細(xì)分場景，AR將會有更多應(yīng)用場景。
2019年00后進(jìn)入20歲
00后的特點(diǎn)更加多樣化，千人千面時代到來。他們喜歡多社交和多互動，內(nèi)容是激發(fā)他們互動的工具，會對自己感興趣的領(lǐng)域投入更多時間和金錢。
人工智能技術(shù)加速落地和擴(kuò)大應(yīng)用
近年來，人工智能技術(shù)在移動互聯(lián)網(wǎng)廣泛應(yīng)用，人工智能手機(jī)研究報(bào)告指出，消費(fèi)者最常用的AI功能有語音助手、人臉解鎖、智能識圖、智能拍攝和美顏，圍繞語音和視覺的核心應(yīng)用場景技術(shù)將會持續(xù)升級。
智能手機(jī)的差異化
全面屏的出現(xiàn)，讓Face ID逐漸取代了Touch ID；各大手機(jī)廠商也試圖在產(chǎn)品形態(tài)上創(chuàng)新，推出了折疊屏手機(jī)。
01. 個性化體驗(yàn)
互聯(lián)網(wǎng)的產(chǎn)品從大眾化轉(zhuǎn)向個性化，越來越多的產(chǎn)品通過定位細(xì)分找到了新的機(jī)會。設(shè)計(jì)從同質(zhì)化的體驗(yàn)轉(zhuǎn)向追求個性化和創(chuàng)新。設(shè)計(jì)師必須了解與自己完全不同的目標(biāo)人群，進(jìn)行用戶細(xì)分研究，通過良好的用戶體驗(yàn)留住用戶，提升產(chǎn)品價值。
01-1. 個性化內(nèi)容推薦
在大數(shù)據(jù)背景下，個體興趣多樣，隨著機(jī)器學(xué)習(xí)和人工智能的技術(shù)的發(fā)展，產(chǎn)品越來越注重個性化推薦。
“更懂你”的信息流推送讓用戶不需要從一堆歌單中去尋找你喜歡聽的歌曲，豆瓣的音樂地圖和Google的For you讓你的偏好一目了然。
01-2. 個性化應(yīng)景設(shè)計(jì)
用戶經(jīng)常在不同地方使用手機(jī)，場景化生活特征被互聯(lián)網(wǎng)設(shè)備所感知。設(shè)計(jì)師需要感知用戶當(dāng)前場景，理解當(dāng)前場景的需求來進(jìn)行精準(zhǔn)的應(yīng)景設(shè)計(jì)，提升用戶的驚喜感和愉悅感。
Snapchat能識別聚會拍照的地點(diǎn)，在app里在線預(yù)定打車到那個位置。
麥當(dāng)勞個性化推薦技術(shù)，讓餐廳根據(jù)天氣、時間和顧客的點(diǎn)餐記錄來調(diào)整菜單。
在電影院選座位能感受到座位的真實(shí)觀影角度，快到電影院時會推送電影票二維碼。
02. 語音交互
AI語音技術(shù)的快速普及，幫助人們改變使用習(xí)慣和觀念，用戶越來越多的使用語音交互。據(jù)ComScore的報(bào)告稱，預(yù)計(jì)在2020年，用戶使用搜索功能時，50%會用語音搜索；72%擁有智能語音助手的用戶表示這已成為他們生活的一部分。各大科技公司出了自己的智能音箱，AI智能設(shè)備改變了與界面的交互方式，從GUI到VUI，不依賴觸摸屏的輸入，出現(xiàn)無導(dǎo)航、無按鈕、無菜單界面。就目前而言，國內(nèi)的AI音箱還是比較初級的人工智能，經(jīng)常被用戶病垢為人工智障般的語音系統(tǒng)。
02-1. 語音更趨近自然
隨著人工智能和機(jī)器學(xué)習(xí)的不斷發(fā)展，Google的智能語音助手快速進(jìn)化，從去年I/O發(fā)布的Continued Conversation（連續(xù)對話），用戶不用每下一個指令都要說一聲‘hi google’，到今年已經(jīng)不需要說喚醒詞，拿起手機(jī)就可以讓它幫助你。
去年發(fā)布的Google Duplex，可以打電話給飯店或理發(fā)店等商家，幫你預(yù)約，到今年可以幫你租車、回復(fù)消息、找照片分享給好友、寫郵件等一系列跨app的任務(wù)。
技術(shù)進(jìn)步必然帶來效率的提升，AI越來越能全面理解用戶提出的高度個性化需求，語音交互可以像人與人互動一樣自然且同時快速處理跨app的多任務(wù)，降低用戶操作成本，縮短操作鏈路，成為用戶的日常“助手”。
02-2. 語音交互的泛娛樂
對用戶來說，語音的使用不僅僅是它的便利性，娛樂性也是重要因素之一。短視頻在聲音交互和語音識別上進(jìn)行了補(bǔ)位。Snapchat推出聲音濾鏡，不僅能根據(jù)聲音音量做出反應(yīng)，還能識別語音指令，觸發(fā)對應(yīng)的動畫。
Google的Live Caption的語音識別技術(shù)，可將視頻語音內(nèi)容轉(zhuǎn)化成文本字幕顯示在聊天界面，還可識別關(guān)鍵詞，形成文本鏈接，用戶可直接點(diǎn)擊跳轉(zhuǎn)。
聲控游戲和聲音社交不斷興起，語音讓體驗(yàn)更加多元化。騰訊NEXT新作《疑案追聲》，以聲音表現(xiàn)故事，聽聲音進(jìn)行推理破案，用聲音來打造沉浸式體驗(yàn)。
03. 秒驗(yàn)身份認(rèn)證
登錄app身份認(rèn)證從以前五花八門的“用戶名 密碼”的模式優(yōu)化到獲取手機(jī)動態(tài)驗(yàn)證碼，這種身份校驗(yàn)的方式在使用體驗(yàn)上談不上好用。驗(yàn)證碼的收取、輸入都需要用戶花費(fèi)一定的時間和精力。全面屏手機(jī)的出現(xiàn)使Face ID取代了Touch ID，當(dāng)全屏設(shè)備越來越普及時，越來越多的app將加入面部識別認(rèn)證，實(shí)現(xiàn)更實(shí)時更精準(zhǔn)的一鍵登錄。
04. 手機(jī)新形態(tài)帶來新體驗(yàn)
各大手機(jī)廠商為了調(diào)動消費(fèi)者的換機(jī)熱情，從全面屏、升降攝像頭、雙面屏到最近的折疊屏，手機(jī)新形態(tài)的出現(xiàn)會帶來不一樣的操作體驗(yàn)。
折疊屏折疊時能讓手機(jī)背面成為一個附加的交互空間，方便用戶同時使用兩塊屏幕進(jìn)行不同app操作，例如打游戲的同時，不用切換退出游戲，直接翻過屏幕處理社交消息。
折疊屏展開能使空間更大，在小屏中運(yùn)行的app，會自動調(diào)整大小匹配大的布局，并展示更多的功能。還可以進(jìn)行多窗口操作，避免多個應(yīng)用之間來回切換。
全屏手機(jī)的出現(xiàn)，讓手勢操作取代物理按鍵。折疊屏的出現(xiàn)，雙屏幕的操作會增加更多手勢操作，需要在設(shè)備中模擬人的自然的、習(xí)慣的手勢。
05. AR 融入到生活每個角落
AR技術(shù)會隨著5G發(fā)揮更大價值，創(chuàng)造更多的新場景。人們借助AR，能讓原本虛構(gòu)的數(shù)字世界融入到現(xiàn)實(shí)的物理世界。2018年Gartner調(diào)查顯示，2020年，約有46%的零售商計(jì)劃將AR/VR技術(shù)融入到顧客的購物體驗(yàn)中。
Snapchat可以使用相機(jī)掃描物理對象，會展示Amazon的購買鏈接，還可以掃描歌曲或者數(shù)學(xué)題。
通過Nike App的“掃一掃”，對雙腳進(jìn)行全面掃描和評估，會有左右腳長寬顯示，根據(jù)選擇的運(yùn)動鞋款，會推薦該鞋款最適合的鞋碼。
AR讓數(shù)字世界的物體更具象。當(dāng)你搜索到想買的一副畫，可通過AR把畫放入現(xiàn)實(shí)場景中，用一種全新的方式看看該物體的大小、顏色和自己家搭不搭。
Google地圖推出了AR實(shí)景導(dǎo)航。屏幕上面部分會展示實(shí)景內(nèi)容，底部顯示數(shù)字地圖，屏幕中會有大大的3D引導(dǎo)箭頭引導(dǎo)。AR的交互行為模擬真實(shí)世界中的用戶行為，讓用戶能很快明白怎么使用。因此需要通過最簡單的模擬真實(shí)環(huán)境的呈現(xiàn)方式，來傳遞核心信息，3D元素的設(shè)計(jì)能聚焦視覺引導(dǎo)用戶操作，加上符合物理性的動效，對現(xiàn)實(shí)生活中的重力、慣性模擬，使3D元素看上去更真實(shí)自然。
Google首款支持多人AR交互的Just a Line，通過相機(jī)拍攝，點(diǎn)擊屏幕進(jìn)行繪畫，畫出你想表達(dá)的畫面。
06. 產(chǎn)品表現(xiàn)向 3D 發(fā)展
除游戲外，有許多以3D為展示形態(tài)的產(chǎn)品進(jìn)入了我們的視線，如使用3D Avatar為用戶定制形象的“ZEPETO”、“IMVU”；使用3D的角色作為界面設(shè)計(jì)元素的“BOO!”，“ZENLY”在界面卡片使用陀螺儀效果讓卡片擁有立體的效果變化。3D的手法已經(jīng)在產(chǎn)品設(shè)計(jì)中的使用的更加頻繁。
除了更新鮮的視覺感受外，3D的手法也可以更好地服務(wù)于“商品”的展示，讓用戶對產(chǎn)品有更直觀的了解。我們可以看到更多真實(shí)環(huán)境或產(chǎn)品的展示使用三維的方法表現(xiàn)。
設(shè)計(jì)師也可利用三維空間的表現(xiàn)力，將產(chǎn)品頁面打造成一個更加立體與真實(shí)的空間。在用戶操作屏幕的過程中，帶來更流暢與真實(shí)的體驗(yàn)感受。
07. 為內(nèi)容設(shè)計(jì)
“知夜晚而不睡”的人群越來越多，他們擁有更多碎片化和大段閑暇時間來消費(fèi)內(nèi)容，app的設(shè)計(jì)需要更有沉浸感。
07-1. 舒適便捷的使用體驗(yàn)
屏幕尺寸越來越大影響著用戶日常操作的方便性。界面的設(shè)計(jì)如何能提升大屏手機(jī)的操作效率和使用體驗(yàn)？三星的One UI讓手機(jī)屏幕分成兩個區(qū)域，上面的區(qū)域用于查看內(nèi)容，下面的區(qū)域用于交互操作。
為了方便頁面層級切換，增加了下滑退出的手勢。
屏幕上的操作和內(nèi)容根據(jù)用戶操作發(fā)生變化，讓用戶更容易注意到已完成的操作，并提示下一步的操作。信息在用戶需要的時候呈現(xiàn)，減少用戶的認(rèn)知負(fù)荷。
更靈活與有連續(xù)性的頁面轉(zhuǎn)換效果也可以幫助用戶在頁面跳轉(zhuǎn)間更好的記住產(chǎn)品路線，同時帶來更舒適的使用感受。頁面之間的轉(zhuǎn)換不再只有簡單的四個方向的進(jìn)入或拉起，而更是與內(nèi)容形態(tài)相關(guān)的靈活的轉(zhuǎn)換過程。用戶通過手勢對頁面進(jìn)行有方向的操作時，將得到連貫的操作體驗(yàn)。
07-2. 沉浸式的全屏表現(xiàn)
為了更好地服務(wù)于內(nèi)容，我們看到許多的產(chǎn)品去掉了頂部的“色塊”的設(shè)計(jì)。需要帶給用戶更沉浸的體驗(yàn)，所有“生硬”的分割形式也將不再流行。而在這其中，白色與黑色的全屏幕底色可以更加凸顯產(chǎn)品內(nèi)容本身的差異化，而不是頁面表現(xiàn)的差異。
在4月底Facebook推出了新的更簡單、更沉浸式的“FB5”設(shè)計(jì)風(fēng)格，除開去掉厚重的頂部藍(lán)色塊的設(shè)計(jì)外，新加入的“黑暗模式”將先出現(xiàn)在視頻觀看的模塊中，這將更好地服務(wù)于視頻內(nèi)容的觀看。
“黑暗模式”將出現(xiàn)在更多APP在設(shè)計(jì)中。在滿足用戶在瀏覽內(nèi)容時的“沉浸感”的同時，APP可以在夜間幫助用戶開啟“黑暗模式”，服務(wù)于用戶在夜間暗環(huán)境下的使用，減輕屏幕過亮的視覺疲憊。
07-3. 用戶深度參與內(nèi)容
00后喜歡多互動強(qiáng)體驗(yàn)，內(nèi)容 互動賦予了內(nèi)容新的可能性。互動視頻讓用戶增加代入感、獲得個性化的游戲體驗(yàn)，也讓內(nèi)容更具有娛樂性和新鮮感。
電影、游戲、網(wǎng)劇都推出了互動作品，用戶從第三視角轉(zhuǎn)向第一視角進(jìn)行主動參與選擇，成為高度個人化的內(nèi)容。互動視頻不僅要保證故事內(nèi)容的優(yōu)質(zhì)，還要保證互動體驗(yàn)，對內(nèi)容的交互必須是有意義的、影響劇情發(fā)展的，這樣的互動才有效、才能更加觸動用戶的情感。
07-4. 內(nèi)容從吸睛到吸金
00后不看電視，主要用智能手機(jī)獲取感興趣的商品和服務(wù)。移動支付改變了用戶的付費(fèi)習(xí)慣，用戶愿意為自己感興趣的內(nèi)容付費(fèi)。
以內(nèi)容為載體的電商給用戶帶來更加信息豐富化和娛樂化的體驗(yàn)方式，用戶消費(fèi)內(nèi)容的同時可以隨手進(jìn)行購物。
08. 感性審美的提升
年輕的互聯(lián)網(wǎng)用戶們，在高速發(fā)展的科技與文化環(huán)境下成長。也自然地造就了這些用戶對產(chǎn)品審美上更高的追求。近幾年，擁有自我個性的“小而美”的設(shè)計(jì)也更容易打動用戶。
08-1. 符號化的圖標(biāo)設(shè)計(jì)
從Office365的新圖標(biāo)設(shè)計(jì)中，我們可以看到更抽象與符號化的圖標(biāo)表現(xiàn)。降低圖標(biāo)上的具象（文字區(qū)域）占比，使用更多的抽象形狀表達(dá)圖標(biāo)所具備的含義。圖標(biāo)向更簡潔與幾何的方向發(fā)展，同時使用豐富的色彩和質(zhì)感變化滿足圖標(biāo)的辨識度。
此外，圖標(biāo)的設(shè)計(jì)也更講究適配效率。Office使用了svg格式的資源以適應(yīng)于不同平臺的應(yīng)用擴(kuò)展。
08-2. 貼近自然感的操作響應(yīng)
隨著表現(xiàn)手法的進(jìn)步，如3D元素的使用；以及動畫實(shí)現(xiàn)技術(shù)的進(jìn)步，在響應(yīng)動畫表現(xiàn)上也將更加細(xì)膩。而模仿自然的運(yùn)動規(guī)律也將更為流行，“弧線運(yùn)動”“光感”“粒子表現(xiàn)”“三維空間”等等也將提升產(chǎn)品的設(shè)計(jì)表現(xiàn)。
對界面中的控件而言，控件的設(shè)計(jì)將越發(fā)貼近真實(shí)的物理規(guī)則。設(shè)計(jì)師們可以通過對控件在動畫上的表現(xiàn)賦予它們更真實(shí)的觸感。
有趣的響應(yīng)動畫也可以帶給用戶更愉快和親切的感受，而在動畫中體現(xiàn)更多的“人情味”便是帶來愉悅體驗(yàn)的關(guān)鍵。我們可以感受到圖標(biāo)所傳達(dá)出來的情緒與性格。
08-3. 風(fēng)格化的插畫表現(xiàn)
審美的提升帶來最為直觀的感受即是對圖形本身追求的進(jìn)步。所以在界面插畫中，視覺藝術(shù)性的追求也更加重要。用戶們早已厭倦了千篇一律的幾何小人或是簡單的線性圖標(biāo)，更具有個性的角色表現(xiàn)及繪畫手法將更受年輕人的歡迎。
08-4. 彩蛋
越來越多的電影流行彩蛋，一個小小的彩蛋能帶給用戶驚喜感和儀式感。我們在滿足用戶需求和打造用戶體驗(yàn)的同時，可以給用戶設(shè)計(jì)一些觸動人心的設(shè)計(jì)。
Google搜索在《復(fù)聯(lián)4》熱映時，加入了滅霸的彩蛋。點(diǎn)擊無限手套，搜索結(jié)果就會隨機(jī)“消失”一半。
Google地圖在愚人節(jié)發(fā)起了貪吃蛇游戲，可以在不同的地圖上，讓蛇（地鐵或巴士）吃掉目標(biāo)不斷變長。
Google 為 Chrome 的生日埋了個小彩蛋，在 Dino Game 中加入了派對元素：當(dāng)小恐龍吃蛋糕后即可戴上生日帽。
總結(jié)
2019年我們可以看到科技對設(shè)計(jì)、體驗(yàn)產(chǎn)生的巨大影響?！秳?chuàng)新者的窘境》一書中描述：“每個技術(shù)由慢到快到發(fā)展至瓶頸時，另一個顛覆式的技術(shù)會悄悄萌芽，并替代上一個技術(shù)”。因此有些設(shè)計(jì)趨勢會由于技術(shù)驅(qū)動突然爆發(fā)，也有可能會因?yàn)榧夹g(shù)的顛覆而消失。作為設(shè)計(jì)師，要學(xué)會識別設(shè)計(jì)趨勢中的變與不變，來進(jìn)行創(chuàng)新和設(shè)計(jì)改良。
科技和產(chǎn)品最終都是回歸到以人為本，設(shè)計(jì)師要洞察人性底層的需求，除了關(guān)注屏幕內(nèi)的設(shè)計(jì)，還需關(guān)注屏幕外的設(shè)計(jì)，改善人們使用產(chǎn)品或服務(wù)的設(shè)計(jì)就是未來的趨勢。
相關(guān)文章：
1、《2019-2020 設(shè)計(jì)趨勢：圖形篇》
2、《2019 – 2020 設(shè)計(jì)趨勢：IP形象篇》
3、《2019-2020 設(shè)計(jì)趨勢：Avatar角色篇》
4、《2019-2020 設(shè)計(jì)趨勢 · 用戶體驗(yàn)篇》
文章來自公眾號：騰訊ISUX
(https://isux.tencent.com/articles/isux-designreport-2019-part4）
亚洲中文字幕乱码av,熟女人妻在线观看网站,久久人妻人人爽日韩一二三区,欧美激情二区三区四区,丝袜无内一区二区三区,粗大肉棒猛插骚女人的逼逼,国产精品亚洲成人精品,蜜桃av噜噜一区二区三区在,熟妇高潮精品一区二区三老牛
吸引老年人作為用戶群體的一部分，這曾經(jīng)被認(rèn)為是互聯(lián)網(wǎng)世界中最后需要考慮的事情。但是，這種罕見的情況正在成為現(xiàn)實(shí)，我們見證了老年用戶群體持續(xù)不斷的增長，他們經(jīng)常登錄、注冊和訂閱。Statista的記錄顯示，光是在美國境內(nèi)，2016年就有64%的老年人在線，這個數(shù)字在2013年的時候只有4%。
盡管數(shù)量在增長，老年用戶群體在人口統(tǒng)計(jì)學(xué)中，仍然屬于用戶體驗(yàn)的不毛之地。如果用戶體驗(yàn)從業(yè)者不將老年用戶納入考慮，就會疏遠(yuǎn)這個整個群體，把他們從在線體驗(yàn)中排除出去：這情況可不樂觀。
通過加大UI元素、使用顏色強(qiáng)調(diào)重要內(nèi)容、進(jìn)行適當(dāng)?shù)挠脩魷y試，遵循這些最佳實(shí)踐，可以做到為老年用戶定制網(wǎng)頁設(shè)計(jì)。
保證界面適合閱讀
文字：越大越好
首先要考慮文字和屏幕本身的尺寸，確保用戶界面清晰可辨。不像我們UX設(shè)計(jì)師，并非每個用戶都有高分辨率的顯示器，未必對眼睛友好。對于60歲以上的用戶，小號文字真的會讓人抓狂。如果你想要定位老年用戶群體，界面正文字號不要小于12磅。
有時候用戶會選擇調(diào)節(jié)瀏覽器本身的字號。但是多數(shù)時候，這樣只是放大了整個頁面，這就會產(chǎn)生功能和顯示問題。要避免讓用戶去手動設(shè)置字號。
而且，要把信息分解為更小的部分，通過留白分隔，就不會在局促的空間里塞進(jìn)大量文字，使用戶感到眼花繚亂。
調(diào)節(jié)顏色和對比度達(dá)到最佳可見性
當(dāng)設(shè)計(jì)師忽略顏色規(guī)范時，用戶體驗(yàn)就會崩塌。界面中的顏色和對比度幫助用戶確定哪些元素對應(yīng)哪些任務(wù)，掌握自己當(dāng)前處在網(wǎng)站的什么位置，并且知道哪個詞語可以通向特定的頁面。比如說，不帶鏈接的文字就要避免使用藍(lán)色——深藍(lán)色是網(wǎng)頁鏈接約定俗成的標(biāo)準(zhǔn)用色。
而且，如果未訪問和已訪問的鏈接在顏色上沒有區(qū)別，他們可能很難回到之前去過的地方。這對所有用戶都有影響。不過，老年用戶更難記住自己訪問過網(wǎng)站的哪些部分，可能會浪費(fèi)時間反復(fù)操作，然后又回到原點(diǎn)。
使用用戶熟悉的語言
Nielsen Norman Group的Jakob Nielsen指出，不是所有設(shè)計(jì)師都會閱讀自己設(shè)計(jì)出來的網(wǎng)頁，因此就不會去思考人們閱讀它所需的努力。
為老年用戶設(shè)計(jì)網(wǎng)頁時，要考慮展現(xiàn)信息的方式，他們聽力不佳或者視覺損傷。WCAG提醒我們，內(nèi)容必須可被感知，具有特殊障礙的用戶仍然要能獲取到這些信息。如果視頻或音頻的內(nèi)容對于試聽障礙者的體驗(yàn)至關(guān)重要，就要額外提供副標(biāo)題或字幕。提供朗讀功能，對于需要別人把文字讀出來的用戶至關(guān)重要。你可以嘗試使用一個文字轉(zhuǎn)語音（TTS）程序軟件，比如說Ivona（它很快會成為Amazon Polly）。
還有，要知道語音學(xué)、俚語和雙關(guān)語對于特定年齡的群體是一項(xiàng)挑戰(zhàn)。俚語會破壞用戶體驗(yàn)，所以得確保文案迎合受眾。避免使用那些會讓用戶迷惑的行話，堅(jiān)持使用能夠準(zhǔn)確表達(dá)含義的語言。同理心地圖可以幫助你寫出對特定目標(biāo)群體有效的內(nèi)容。
易于點(diǎn)擊
55-65歲的年齡段，手眼協(xié)調(diào)和運(yùn)動機(jī)能開始衰退，這就使得操作用戶界面變得更加困難。對于運(yùn)動機(jī)能逐漸衰退的用戶，鼠標(biāo)是一個特別的問題，因?yàn)辄c(diǎn)擊界面目標(biāo)、在界面元素間移動、響應(yīng)屏幕上的某個目標(biāo)，都十分困難。
按Smashing Magazine的Ollie Campbell所說的，要應(yīng)對這種障礙，就要確保可點(diǎn)擊的UI元素足夠大（對角線長度至少11mm），并且與其他元素之間距離要足夠大（至少2mm）。你也可以盡量減少鼠標(biāo)點(diǎn)擊，如有必要，可以只留一個可點(diǎn)擊的元素。
對于運(yùn)動機(jī)能損傷的用戶，滾動條同樣會導(dǎo)致可用性問題。按住細(xì)長的滾動條并執(zhí)行滾動操作非常困難。而且，對于有閱讀障礙的用戶，滾動會影響他們的體驗(yàn)，因?yàn)樵诮缑嬉苿又?，他們要持續(xù)不斷地重新找回之前閱讀文字的位置。
簡化滾動條——無論是外觀還是感受。給用戶多一些選擇（點(diǎn)擊滾動條箭頭、點(diǎn)擊頁面自身的可拖動區(qū)域、拖動滑塊、使用鼠標(biāo)滾輪、或者使用鍵盤的上下鍵）。不過總而言之，還是盡可能避免產(chǎn)生滾動吧。
所幸的是，電腦鍵盤和移動觸摸屏能幫助老年用戶跟上時代。因?yàn)槭种更c(diǎn)按的機(jī)能退化得比其他機(jī)能要晚，許多老年用戶更擅長使用電腦鍵盤和觸摸屏。
使UI模式易于記憶，幫助認(rèn)知
對于任何想要通過UI來完成任務(wù)的用戶，他們都需要盡可能快和簡單地從A點(diǎn)（入口）到達(dá)B點(diǎn)（任務(wù)完成）。所以清晰的UI導(dǎo)航如此重要。
但對于老年人，UI導(dǎo)航系統(tǒng)還需要更直接地為用戶流程提供方便。為什么？雖然我們的長期程序性記憶（記住如何做某件事）能力不容易隨年齡增長改變，但我們的注意力在衰退，短期的情景記憶會受損。這就意味著，我們學(xué)習(xí)新概念的能力會有極限，比方說學(xué)習(xí)操作一套為年輕人設(shè)計(jì)的新界面。
應(yīng)該嘗試使用標(biāo)準(zhǔn)的圖標(biāo)和導(dǎo)航模式，例如頂部通欄，能夠一眼看到所有選項(xiàng)，或者面包屑導(dǎo)航來引導(dǎo)用戶通過幾次點(diǎn)擊前往特定的位置。這有助于用戶習(xí)慣各功能所在位置，還有如何在網(wǎng)站上找到它們。
不要隱藏重要信息。保留面包屑導(dǎo)航來引導(dǎo)用戶前往網(wǎng)站的相關(guān)區(qū)域。
還有，要避免出現(xiàn)非必要的鏈接。這么做可以增加用戶的信任，鼓勵他們點(diǎn)擊鏈接，前往網(wǎng)站或應(yīng)用中的重要位置。
了解你的用戶基礎(chǔ)
要使用戶體驗(yàn)更愉快，應(yīng)該要有一套捕捉目標(biāo)用戶需求的框架。但是，不同的用戶成長在不同的科技年代，設(shè)計(jì)師們永遠(yuǎn)無法取悅所有年齡層的用戶。
怎么解決？做用戶測試。
即使設(shè)計(jì)師們遵循這些為老年用戶設(shè)計(jì)的準(zhǔn)則，但真正了解某人如何操作網(wǎng)站的唯一方法，就是做測試。對于老年用戶，考慮使用邊想邊說的方法做定性分析，通過測試，你能看到受試者屏幕上發(fā)生的一切。這有助于增進(jìn)你對于用戶認(rèn)知過程和物理限制的理解，并且確定UI系統(tǒng)的哪些部分需要再調(diào)整。
老年用戶最大的一個痛點(diǎn)是難以看清和閱讀屏幕內(nèi)容。視覺或聽覺障礙，意味著某些老年人要非常費(fèi)勁地解讀網(wǎng)站和移動設(shè)備上的內(nèi)容。通過對你的界面設(shè)計(jì)進(jìn)行真人測試，發(fā)現(xiàn)真實(shí)問題，你就會更準(zhǔn)確的知道解決方案效果如何。
考慮使用原型工具來進(jìn)行用戶測試，例如Justinmind，可以實(shí)時演示你的設(shè)計(jì)。這能讓你獲得即時反饋，知道為何和如何解決設(shè)計(jì)上的問題——這是定性用戶測試背后的原則。
而且，為什不再更進(jìn)一步呢：把老年人受試者加入到設(shè)計(jì)過程中，讓老年用戶掌控自己的在線體驗(yàn)。
總結(jié)
老年用戶群仍然有巨大的增長潛力。但就像其他任何用戶群體一樣，老年用戶需要我們設(shè)計(jì)出符合他們需求的體驗(yàn)。隨年齡而產(chǎn)生的局限意味著，數(shù)字科技中一些常規(guī)的吸引用戶手段對老年用戶不管用。
識別出老年用戶的這些糟糕體驗(yàn)，可以避免設(shè)計(jì)師在設(shè)計(jì)中犯這些錯誤。用戶測試是很安全的方式，確保你的用戶得到他們所需的東西。把老年用戶納入到界面設(shè)計(jì)過程中，用戶體驗(yàn)絕不會差。
作者信息：Emily Grace Adiseshiah
原文鏈接：http://usabilitygeek.com/ux-design-thinking-senior-citizen-user/
]]>圖中可以看出5.5英寸以上屏幕可以稱Phablet，7英寸以上就是Tablet。這次案例以Tablet設(shè)備為主，Phablet設(shè)備為輔進(jìn)行體驗(yàn)設(shè)計(jì)。
在我們的社交平臺上，用戶消息在多個終端設(shè)備傳遞中，產(chǎn)品功能只是在原有基礎(chǔ)上簡單粗暴放大而已，那么大屏手機(jī)/平板電腦存在的價值化為烏有。
案例分析：這種結(jié)構(gòu)化消息是目前國內(nèi)主流的一種設(shè)計(jì)形態(tài)。
1.以消息為主的結(jié)構(gòu)化設(shè)計(jì):
不論是資訊分享、音樂分享、視頻分享不以內(nèi)容區(qū)分而設(shè)計(jì)，都在一種載體內(nèi)呈現(xiàn)，這種結(jié)構(gòu)雖普適性強(qiáng)，可以兼容多元化的場景。但因設(shè)計(jì)形態(tài)統(tǒng)一，導(dǎo)致在內(nèi)容辨識度上也有所下降，內(nèi)容設(shè)計(jì)上沒有各自特點(diǎn)，用戶在瀏覽過程中容易忽略內(nèi)容本質(zhì)。
2.信息內(nèi)容碎片化:
用戶可以獲取到更多信息，但因內(nèi)容平均分布，所以畫面不夠聚焦。我們可以把這些內(nèi)容信息看成點(diǎn)的組合，點(diǎn)的基本屬性是矚目性，能形成視覺的中心.當(dāng)畫面中有3個以上的相同大小點(diǎn)時，畫面就會顯的凌亂。當(dāng)畫面有不同面積的點(diǎn)時，較大點(diǎn)會引起人們的注意 ，依次會關(guān)注較小的點(diǎn)。
3.以標(biāo)題文字為主進(jìn)行快速瀏覽：
在瀏覽過程中用戶通常以抓取關(guān)鍵詞為主,快速吸引到下一級信息。而圖片在大部分情況下會有被縮小，裁剪，因圖片尺寸較小，從圖中獲取不到更多的信息。
在原圖中可以清晰的看到電視劇領(lǐng)銜主演的演員，這也是吸引用戶的關(guān)鍵因素之一。但被縮小裁剪后，必須借助文字才能獲取到關(guān)鍵信息。
這種以消息為主的結(jié)構(gòu)化設(shè)計(jì)在iPhone7Plus設(shè)備顯示，相同信息可顯示約4-4.5條左右,有效提升屏幕利用率。但如果直接放大或拉伸到大屏幕中，這種設(shè)計(jì)體驗(yàn)顯的蒼白無力，沒有充分體現(xiàn)大屏幕沉浸感、聚焦、畫面感的優(yōu)勢。
1.以內(nèi)容為主進(jìn)行設(shè)計(jì)：
用戶會更加關(guān)注內(nèi)容本身，不同的內(nèi)容采用不同圖片的尺寸和排版，有利于用戶快速區(qū)分和記憶。
2.以圖片為主進(jìn)行快速瀏覽：
首先圖片消費(fèi)已成為閱讀消費(fèi)中的一個大類，比文字而言，圖片更直觀，更具有視覺沖擊力，也更能適應(yīng)現(xiàn)代社會的快節(jié)奏。圖片對于文字的詮釋作用幫助個人加深文字理解和形象記憶，提高閱讀的有效性和趣味性。一張圖片勝千言萬語，可以有效傳達(dá)情緒，迅速和用戶建立起共鳴。
3.比例結(jié)構(gòu)：
從布局結(jié)構(gòu)上盡量保證原始的攝影圖片和視頻比例不被過度裁剪。Flickr的一組數(shù)據(jù)顯示，隨著iPhone很大程度上替代單反成為主流拍照設(shè)備，4:3和16:9的圖片數(shù)量占比追上了傳統(tǒng)攝影的3:2。而16:9更接近美學(xué)比例，黃金分割。
4.突顯內(nèi)容，降低信息密度：
使用負(fù)空間讓重要內(nèi)容吸引用戶的注意力。很多人都說設(shè)計(jì)師這樣會浪費(fèi)屏幕的空間，但是留白本身就是設(shè)計(jì)的基本元素之一。這樣更專注內(nèi)容展現(xiàn)，通過放大內(nèi)容，降低頁面信息密度，內(nèi)容讀取更加舒適。
方案場景應(yīng)用：
用戶可以快速辨識出內(nèi)容類型，畫面有了聚焦元素，而不是滿屏的文字，界面賦予了感染力和活力。但如果用戶快速轉(zhuǎn)發(fā)了很多內(nèi)容時，在兼容小屏設(shè)備時，屏幕利用率會有所下降。在iPhone7Plus設(shè)備上，同樣大小的信息在一屏內(nèi)展示2-2.5條。用戶需要在縱向滑動多次才能抵達(dá)下一個信息類別。所以針對提高屏幕利用率上進(jìn)行了方案2橫滑設(shè)計(jì)。
方案場景應(yīng)用，引入橫滑設(shè)計(jì)
打破屏幕界限，減少跳轉(zhuǎn)，便于用戶獲得更多信息，在這個系統(tǒng)的基礎(chǔ)之上，構(gòu)建跨平臺和超越設(shè)備尺寸的統(tǒng)一體驗(yàn)。
總而言之不去追求那些奇異的事物，而是從人們所“共有的特征”來提取價值，用最自然最合適的方法來重新審視，重新設(shè)計(jì)。
Via: ISUX
]]>