用戶體驗（User Experience，簡稱UE/UX）這個詞是在上世紀90年代中期，由用戶體驗設計師 唐納德·諾曼（Donald Norman）所提出和推廣。
定義：用戶在使用產品過程中建立起來的一種純主觀感受。即用戶在使用一個產品或系統之前、使用期間和使用之后的全部感受，包括情感、信仰、喜好、認知印象、生理和心理反應、行為和成就等各個方面。
可用性指的是產品對用戶來說有效、易學、高效、好記、少錯和令人滿意的程度，即用戶能否用產品完成他的任務，效率如何，主觀感受怎樣，實際上是從用戶角度所看到的產品質量，是產品用戶體驗的核心，不好的可用性會導致用戶放棄使用產品。
可用性由易學性、效率、可記憶性、容錯性、滿意度、實用性、個性化、可預測性組成。
指的是用戶學習如何與產品進行交互，以實現目標所花費的時間和精力，即用戶能否在初次使用產品時完成簡單的任務或實現用戶目標。
用戶在使用產品一段時間后，能否在合理的時間完成想要達成的目標任務。這里以騰訊視頻為例，用戶能否快速的下載想要的東西，在同一系列中，可以快速下載更多的相關內容。
我們常說互聯網是有記憶的，好的產品體驗是幫助用戶去記憶。用戶在體驗中，要對一些有意識、無意識的行為進行記憶是一個比較大的負擔，如果在一些環節通過系統能幫用戶記錄，會降低用戶的負擔。比如在搜索、歷史記錄、瀏覽記錄等。
用戶在使用產品時，發生錯誤后，能否快速幫助用戶識別和糾正錯誤，幫助用戶從錯誤中恢復的能力。如常見的注冊登錄，當用戶屬于郵箱格式不對的時候，給出提示，并且告知錯在哪里。如果提示語只是："請輸入正確的郵箱" 用戶可能會疑惑，錯在哪里。
滿意度指的是用戶與設計互動產生的愉悅程度，可以是用戶使用產品時流暢的交互和優秀的視覺設計，也可以是用戶在產品中得到的滿足感。比如sir語音交互，王者榮耀等級（滿足感）
產品能否提供用戶在完成任務時所需要用到的基本功能，例如P圖類軟件，用戶需要對圖片進行裁剪、添加濾鏡、摳圖、美顏、補妝、添加文字、去除水印、添加文字等操作。
在滿足實用性的基礎上 針對用戶提供不同場景下的功能定制，如美圖秀秀，在提供圖片美化的同時，針對用戶不同的使用場景還提供視頻剪輯、視頻美容等功能。
用戶能夠預測到下一步操作或者整個流程的交互，將會發生什么。舉例淘寶的購買流程。點擊購買按鈕> 選擇商品屬性> 付款> 輸入密碼> 購買成功; 用戶在點擊購買按鈕開始就能夠預測到下一步或者整個流程的步驟會發生什么。
可見性是用戶根據界面中可見元素確定產品可以做什么的設計原則。
物理功能可見性是基于對象的物理外觀。在視覺上，這種類型的功能可見性使用戶能夠立即清楚地看到在設計界面中能干什么。例如當我們使用音樂類軟件，最常使用的就是播放/暫停，上一曲/下一曲。我們就會尋找去這些圖標。其次是分享、收藏、下載、評論等功能需要用到的功能展示在頁面中，這就是功能可見性。
當信息或者列表過多時區分狀態的展示，將重要的狀態信息呈現在盡可能高的信息層級當中。如iOS信息和QQ郵箱中區分未讀信息的微標。如果將這些徽標隱藏起來，會極大地破壞易用性，因為人們將不得不進入一個個郵件詳情頁當中進行確認，才能獲取到原本由徽標提供的狀態信息，這樣的互動非常低效且乏味。
當用戶在執行某項任務的時候應該清晰明了的告知用戶目前在什么步驟，后面還有多少步驟，完整清晰的流程展示。如果將這些信息隱藏起來，用戶會困惑當前進行到哪一步，接下來還有多少步驟。
強調需要明確的視覺線索向用戶展示產品可以做什么。例如用戶界面中的交互元素（如滾動條、命令按鈕和圖標等）的設計必須能夠為用戶提供足夠清楚的建議，讓用戶可以清晰地辨別出這些元素所代表的意思是什么、它們的功能是什么，以及如何與它們進行交互行為（點擊、長按、滑動 等）
給用戶及時、恰當的反饋，是體驗設計中非常重要的一項原則；對每個用戶的操作都應該有恰當的系統反饋（包含視覺、聽覺、觸覺）。
明確告知用戶當前操作發生了什么。如點擊下載和下載過程給出相對應的反饋及進度條。
當用戶產生某個動作時，給予相對應的連接反饋。如大概用戶點擊某個按鈕時，按鈕默認的外觀與點擊后的外觀發生變化，結合現實世界的開關去思考（按下 開燈）動作與反饋是連接的，即時的。
?？硕?，是1951年由威廉·埃德蒙·?？耸紫忍岢龅?，認為人們從數組中選擇目標的時間取決于可用選項的數量。也就是當一個人所面臨的選擇越多，做出選擇所花的時間就越多，當面臨選擇的數量增加，做出決定的時間也會跟著增加。
如京東篩選，在搜索結果頁會將篩選條件收起，因為里面的篩選條件內容過多。用戶會在當前頁面選擇的時間增加.將一些項目分組放入二級下單，并且做好歸類，用戶能夠更迅速的作出決定。
費茨定律，是1954 年 由保羅.菲茨首次提出，在人機交互中指的是通過圖形用戶界面使用鼠標或其他類型的指針從一個起始位置移動到一個最終目的所需的時間。
T：代表完成移動所需的平均時間
A：代表光標開始/停止時間
B：代表光標移動速度
D：代表從起點到目標中心的距離
W：代表目標的尺寸
簡單來說就是指：隨著目標的距離增加，移動到目標的時間更長，并且隨著目標的尺寸減小，選擇目標的時間也會增加。
所以在界面設計當中會遵循越重要的功能，占據面基會越大。重要圖標的點擊熱區也會增大。便于用戶快速點擊。
屏幕外邊緣和四個角部比屏幕中的其他位置都更容易被定為和選中，所以我們在進行產品設計的過程中，會將常用/重要的操作放置在屏幕邊緣處，便于用戶操作。
神奇數字7±2法則是1956年由 喬治·米勒 所提出的，根據喬治·米勒的研究，人類短期的記憶一般一次只能記住5-9個。也就是為什么大多數APP底部導航為5個的原因。
由于人類的大腦處理信息的能力有限，大腦會將復雜信息劃分成 塊 和小的單元。如：京東和每日優鮮的分類處理。
人類短期的記憶一般一次只能記住5-9個，所以人們總是傾向于把一串數字拆分為多個較短的部分進行記憶。如銀行卡號和手機號碼等。
復雜守恒定律是1984年由 拉里·泰斯勒 所提出的，也稱作泰斯勒定律。認為每一個產品設計的過程中，都有其固有的復雜性，存在著一個臨界點，超過了這個點產品設計的過程就不能再簡化了，你只能將固有的復雜性從一個地方轉移到另外一個地方。
在產品設計中，會盡量的簡化界面。當功能過多時進行一個整合的處理，跳轉或者滑動操作。如查看更多或者常見的漢堡導航。
新鄉重夫認為遺忘有兩種：一種是疏漏，另一種是忘卻。他建議采用一些措施來預防產品的缺陷。
防錯原則認為大部分的意外都是由設計的疏忽，而不是人為操作疏忽。因此，在設計中要有必要的防錯機制；比如常見的信息輸入狀態，未輸入置灰不可點，輸入變為可點擊狀態。
微信拍一拍：微信在出了拍一拍功能之后，很多時候點擊頭像的時候會不小心拍到別人，現在的拍一拍是可以撤銷的，在客戶端鼠標懸浮上就可以進行撤回，移動端長按出現撤回彈窗，兩分鐘內有效。
微信朋友圈動態：點擊返回圖標會出現的彈窗，避免誤操作。利用防錯原則，可以避免用戶重新編輯。微信當中有很多友好的體驗細節。可以多多去感受。
奧卡姆剃刀 定律 ：它是由14世紀英格蘭的邏輯學家、圣方濟各會修士奧卡姆的威廉 （William of Occam，約1285年至1349年）提出。 這個 原理 稱為“如無必要，勿增實體 ”，即“ 簡單有效原理 ”
不必要的元素會降低設計的效率，不管是實體、視覺或者認知上，多余的設計元素，有可能造成失敗或者其它問題。這并不意味著不能提供給用戶很多的信息，可以用「更多信息」來實現。如夸克瀏覽器，首頁只放置重要功能 搜索 和幾個整合內容的圖標入口。
讓用戶通過較少的點擊就能找到他們想要的東西或使用功能。如音樂類軟件，在播放音樂之后進入其他的tab，在上面都會懸浮播放/暫停的區域。都能夠隨時操作。
就是產品的易用性，如果年紀大點的人，也能夠輕松使用所設計的產品那么是成功的。如抖音沉浸式的體驗，簡單的滑動就能夠觀看想看的內容。目前抖音的用戶老年人也逐漸包含在內，并且抖音會根據用戶的停留時長等推送用戶感興趣的內容。
頁面的使用率，當你想要在一屏新增很多內容時，頁面的布局就會變得擁擠和區域變小，容易過于干擾用戶做出選擇，重要功能不夠突出等。夸克瀏覽器首頁強化了搜索功能 和幾個整合內容的圖標入口；uc瀏覽器首頁內容過多，當用戶想要使用搜索功能時很容易被其他內容干擾。
前面說到的?？硕烧f到，當選擇的數量越多，用戶做決定的時間就更長。做過多的決定也是一種壓力，在展示內容的時候要努力減少用戶的思維負擔。如攜程和馬蜂窩金剛區的內容展示，馬蜂窩根據產品屬性放置了6個重要的功能入口，便于用戶更快的去選擇所想要的功能。
最后我們來探討一下設計和藝術的區別是什么。我看到一句話覺得挺好的。設計和藝術的重要區別是：藝術拋出問題，而設計解決問題。
我們設想一個場景，當你在藝術展廳站在一副名畫面前，你所思考的是什么？是驚嘆畫家的畫技還是整個畫面給你的感覺是一種故事，你會不會思考藝術家在作畫時的心情，處境，為什么要這么去畫？想表達怎么樣的情感？
然后我們再設想一個場景，同樣在藝術展廳，你身上帶有手機和相機。你會選擇用相機拍照還是用手機。答案是 相機 對吧？因為相機的拍照效果在任何環境下都會比手機好。這就是設計。是能夠真真切切的解決用戶問題的。能夠去感知到的。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
一、馬蜂窩 — 人性化設計識別文章地點
二、微博 — 社區游戲化設計提升互動率
三、QQ — 通過手勢消除未讀消息
四、最右 — 情感化設計保護用戶隱私
五、抖音 — 深夜提醒貼心的功能
六、網易音樂 — 把分享游戲化
七、QQ音樂 — 歌詞沉浸式體驗
八、盯潮 — 趣味性banner輪播，增加用戶點擊
在馬蜂窩任意文章中，如果出現地區則可以通過當前頁面對地區進行提取
減少用戶操作路徑，降低產品使用成本
日常在各個平臺瀏覽文章時大家都會遇到在文章內會出現一些如地名、人名、物品等相關名詞，此時如果對名詞感興趣則需要切換場景去進行搜索，而馬蜂窩在這方面深入洞察到用戶痛點，基于旅游社交產品背景下在添加地點直達（包含多個地點）功能，解決了對景點感興趣的用戶使用體驗。
根據馬蜂窩這個人性化功能，是否可以在不同的產品內進行應用，如在一些游戲社區中所提到的虛擬裝備、道具等物品添加彈窗簡要說明，幫助新手玩家快速理解玩法、功用等
在微博動態詳情中進行長按點贊觸發動畫
通過游戲化點贊玩法激勵用戶進行互動，提升互動率
打破傳統點贊動畫，微博設計動效采用大膽創新的全屏動畫并搭配上散發的微表情，在長按與連點兩種手勢下動效規律不同，消除用戶枯燥感，微博作為國內最大社交平臺，頁面展示上已經形成用戶深刻認知，在不影響基本風格上進行彩蛋設計有效的提成用戶互動率
在qq聊天頁面中對底部消息氣泡進行拖動，消除所有未讀消息
提升用戶操作效率和使用體驗
qq作為社交工具，每位用戶都會添加大量人、群以及關注各種推送，在這種場景下用戶每條消息都去操作需要花費大量時間，QQ把傳統的消息已讀以一種簡單的交互手勢作為代替，相對全部已讀在操作上更佳便捷
通過qq的這個交互細節，在其他產品場景中同樣適用，如一些音樂、電臺相關的產品在離開播放頁面后播放狀態會懸浮在頁面之上，如果關閉的話則需要點擊暫停或者進入詳情后關閉，也可以考慮使用拖動手勢進行關閉
在最右登錄頁面輸入密碼時ip形象會出現捂眼睛動作
強化用戶隱私和心理信任感
日常在使用一些敏感性操作時我們都會注重隱私，如一些表單的填寫、密碼輸入等相關操作，最右在登錄頁面使用到了ip形象的動作去向用戶傳遞心理上的暗示，這種手法很好的把品牌曝光與體驗相結合
長時間刷抖音時會系統會提示，在深夜使用時會支持設置提醒時間
防止用戶疲勞使用產品，定時緩解注意力
在使用抖音時大家可能會經常深陷其中無法自拔，往往忽略了時間影響身體健康，提醒機制則在深夜不同時間段進行間接提示，雖然在用戶體驗中不提倡打擾用戶，但在短視頻這個場景下如果過渡沉浸便會造成反向影響
在網易音樂對某首音樂進行分享時可以對音樂進行個性化定制，對歌曲進行編輯添加文字、圖片、語音等以視頻方式呈現
把分享以一種偏游戲化的形式呈現，提升用戶分享率
傳統分享基本是直接讓用戶分享到第三方平臺，而網易音樂這個設計把分享場景進行多元化處理，以定制音樂罐子為切入點，用戶自由編輯個性化處理裝進罐子進行分享，是一種視頻剪輯融合音樂的一種新玩法，破圈傳統枯燥的分享場景，提升用戶分享率
在音樂歌詞頁面中可以支持設置歌詞主題
新穎的呈現手段，強化用戶沉浸式聽歌
傳統的音樂產品在詳情頁面展示了一屏歌曲歌詞，面對大量的文字用戶在尋找某段歌詞時效率不是很高，對大量的字段也極為枯燥，而qq音樂使用了創新的展現形式，把手機主題概念融入歌詞中達到新的視覺體驗，根據不同的主題對應的動畫也不同，大大的提高了用戶的視聽體驗
在盯潮首頁banner處對其進行拖動甩出
通過交互玩法提升用戶對banner的點擊
banner在頁面通常點擊率較低，用戶會默認為廣告，在盯潮內滑動banner時會發現banner可以進行拖動，并且松開時會自由掉多，把傳統的banner切換做出了可玩性更高的效果，同時這個設計手段也能吸引用戶注意力引導用戶對banner進行點擊
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
具有大量庫存商品，或是涉及復雜產品的網站，通常會提供產品類別頁面，或者是產品列表頁面。 類別頁面就像是特定產品類別的主頁。他們可能不提供完整的產品列表，但可能會展示一些產品并提供產品子類別的鏈接。這種頁面本質上是用戶在進入產品列表頁面的過程中經過的一個中間步驟，讓用戶不用一下子面對海量的分類信息。
Eddie Bauer 在其全局導航中， WOMEN 鏈接將用戶帶到了這個傳統的類別頁面。這些頁面通常包含產品照片和營銷內容，以及促銷子類別（例如SHOP FLANNEL 和 SHOP FLEECE ）的鏈接。
類別頁面通常提供以下組合：
并非所有產品都需要專門的類別頁面。 不過這種情況有時候會讓用戶非常惱火，因為用戶需要通過額外的步驟才能查看特定類別的產品。
許多網站完全省略了類別頁面，而是將用戶直接引導到產品列表頁面，在那里他們可以借助過濾篩選的方式來瀏覽產品。
Bonobos 網站上的 Pants & Jeans 鏈接不是類別頁面，而是將用戶直接帶到產品的列表頁面。這種方法通常效果很好，因為它盡快向客戶展示了他們可選的選擇。
雖然本文偏向于電商網站中的類別頁面的探討，但實際上這些頁面也用于其他類型的網站，特別是新聞資訊和教育類的網站。這些建議也可能適用于這些情況，但最好根據領域對你的設計進行測試，以防你的用戶需求與購物型用戶的需求不同。
如果您的電商網站所涉及的產品非常復雜，以至于您的許多客戶需要經過學習之后才會使用，才能正確地過濾和比較產品，那么類別頁面就是一個好主意了 。此外，具有 大類別和大量子類別的網站，有時會提供某種類型的獨立類別頁面，以幫助用戶找到有意義的起點。
不過，你可以決定讓特定的產品具有類別頁面，而其他的則不具有獨立的類別頁面。例如，Lululemon 主打的健身服裝產品（大多不需要分類頁面），同時也銷售一種名為 MIRROR 的昂貴的家庭健身產品，后者需要更詳細的解釋，因此有自己的分類頁面。
Lululemon 為其復雜的家庭健身產品 MIRROR 提供了一個單獨的類別頁面，但并未為其所有產品類別使用類別頁面。
類別頁面可以對電子產品等復雜產品起到解釋作用 。如果用戶還不了解產品選項，他們可能還沒有準備好單擊單個產品。與隨機點擊不同的產品相比，類別頁面為他們提供了一種更有效地了解各種潛在相關產品功能的途徑。
例如，智能手表通常會有不同的功能和價格范圍，著名智能手表品牌 Fossil 在自己的網站提供了一個類別頁面，列出了不同類型的智能手表，并提供「立即購買」、「了解更多」 以及「比較」的選項。
Fossil 的 智能手表分類頁面解釋了不同型號的智能手表的功能和性能差異
購物型用戶可能不需要通過網站來學習服裝或食品等熟悉商品的內容和知識。然而，一個擁有大量產品和內容，并組織成許多子類別的網站，仍然可以從類別頁面中受益——尤其當子類別頁面可以通過獨特的圖文清楚地介紹產品的時候。這比一長串標簽文本更容易方便用戶了解產品，此外它還可以為國外的購物者提供幫助。
REI 銷售用于各種戶外活動的許多產品，從皮劃艇到登山用具。如果點擊網站的全局導航中Camp & Hike 鏈接之后，頁面跳轉到一個包含所有露營產品的列表面，用戶可能會不知所措，而且無趣。相反，REI 讓鏈接指向到一個傳統的類別頁面，而不是列表，這個頁面包括：
REI 使用傳統的類別頁面來幫助購物者在龐大的 Camp & Hike 類別中找到適合自己的產品。
如果你的網站確實提供了傳統的類別頁面，請同樣為用戶提供了避免進入這些頁面的簡單方法，并在他們愿意時，也能直接轉到產品列表頁面。為你的站點的全局導航，提供指向子類別產品的列表頁面（比如使用超大導航 Megamenu ），以及指向傳統類別頁面的鏈接。
可能還需要確保搜索結果始終指向產品選項，而不是將購物者引導到類別頁面。在我們的研究中，Zappos 會將某些搜索結果指向到以品牌為中心的類別頁面，而不是鏈接到該品牌的產品。
在用戶測試的時候，一位參與者看到孩子后很生氣，因為搜索她最喜歡的品牌 Sam Edelman 時，她進入了一個具有促銷感的傳統類別頁面，而不是指向她要的產品。對她來說，這感覺像是一個不必要的額外步驟。
「當我進入 Sam Edelman 時，我想看到結果。我不希望打開一個品牌的分類頁面。」
當用戶在 Zappos.com 上搜索「sam edelman」時，她很惱火地看到一個沒有列出任何單個產品的品牌類別頁面。
當用戶搜索時，他們希望立即看到結果。
為了避免傳統的類別頁面的缺陷，并提供對產品列表的快速訪問，許多電商網站現在在主產品列表頁面中，結合混用了少量的類別有頁面的設計——例如簡短的描述性內容，或簡短的子類別菜單。
在女士緊身褲 產品列表頁面上，Lululemon 包含了一些傳統會在類別頁面上顯示的元素：營銷內容（藍綠色框標注的區域）和對不同緊身褲樣式的解釋，以及指向這些子類別的鏈接（以黃色框標注的區域）。
這種混合呈現方法效果很好，因為對描述或子類別菜單感興趣的用戶可以暫停并閱讀它，而不感興趣的用戶可以簡單地跳過，直接快速訪問實際的產品列表。
一些電商網站在 產品 Banner 旁邊加入營銷的內容和元素，這些元素傳達有用的信息而不會減慢用戶的速度，就像傳統的類別頁面一樣。
高級珠寶零售商 VRAI 使用混合式設計，在一些產品列表頁面中包含類別頁面樣式元素。它的一個產品列表頁面當中，圓形訂婚戒指頁面中，包含了帶有價格的產品列表，以及解釋性的內容。頂部的文字描述了此類產品的一般特征。側面板提供了有關該類別中所有產品共有特征的說明，以及更多詳細信息。
在這個列表頁面中，VRAI 包含了促銷內容（以藍綠色框標注）和說明性內容（以黃色框標注）。其中所呈現的圖文內容是典型的傳統類別頁面的特征（沒有產品列表）。
一些零售類的網站不使用類別頁面，而是提供指向產品列表頁面上的子類別的導航鏈接。這些鏈接（這是最初發明類別頁面的原因之一）讓用戶輕松瀏覽網站的產品庫存。
例如，Ann Taylor 的 褲子 列表頁面顯示了不同款式褲子的類別，并提供指向該子類別的鏈接。這些內容直接顯示在產品列表上方，幫助用戶了解可用類別項目，并且直接導航到這些類別。
Ann Taylor 的網站在 褲子 的列表頁面的頂部，加入了不同褲子款式和合身度的說明和圖片，以便用戶了解其中的差異。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
老齡化社會已經到來，如何讓中老年群體更好地使用互聯網產品是當今的熱門話題。貓眼演出設計團隊負責的一個 B 端項目的使用人群需覆蓋到中老年用戶，也屬于適老化的涵蓋范疇。
在前期調研和設計環節中，我們收集了一些相關的文獻及案例，并且結合項目實踐有所思考和沉淀，在這里與大家分享。
世界衛生組織根據現代人生命狀況，提出了人生階段年齡的新劃分。45~59 歲為中年人；60~74 歲為年輕老年人；75~89 歲為老年人；90 歲以上為長壽老人。[1]
隨著年齡的增長，人們的身體機能、心理狀態、認知能力等都會出現衰退的情況。
適老化設計是無障礙設計中的一種。無障礙設計于 1974 年由聯合國組織提出，設計中需要充分考慮具有不同程度生理傷殘缺陷者和正?；顒幽芰λネ苏撸ㄈ鐨埣踩恕⒗夏耆耍┑氖褂眯枨蟆2]
目前互聯網產品中大多數的適老化設計，主要是集中在 C 端。針對不同障礙（視覺、肢體、聽覺、認知障礙）[3]，目前普適的適老化設計原則有：
1. “強烈“好于“柔和”
針對視覺障礙，常見做法有增大字體大小，使用非襯線體字體，提高顏色對比度等。
相比原版的 App，百度大字版 App 和支付寶長輩模式修改了 UI 界面，每個功能模塊都用了明亮的大色塊、加大字體的設計。
2. 善用“輔助”和“替代”
針對聽覺障礙，常見的做法有通過視覺輔助，將聲音轉化成文字、擴大音量、降低語速等。
Google 安卓系統推出了 Live Caption 功能，可自動將手機上播放的內容轉換成字幕。Live Transcribe-「Sound Notification 聲音通知」功能，可識別特定聲音（比如煙霧警報器、嬰兒啼哭、敲門聲等），并轉化成文字及視覺符號推送至手機，方便聽障用戶辨別生活當中一些重要的聲音信號。
3. “點擊”好于“滑動”
針對肢體障礙，減少頁面信息的密度，避免使用過小的按鈕以及復雜的交互手勢。
有研究表明，老年群體在操作時難以瞄準物體，在瀏覽圖片時，由于視力衰退導致無法對焦，他們會不斷地用兩只手指放大/縮小并反復點擊屏幕。[4]
平安銀行 App 關懷模式采用卡片拼接的設計方式，將間距放大，保證每個信息有更大的展示空間，同時也放大按鈕點擊熱區，提高操作的準確率。
4. “具象”好于“抽象”
針對認知障礙，避免使用不易識別的圖標，盡可能配有圖標或圖片，簡化信息內容。
有研究表明，文字+圖標為主的設計有助于提升老年新手用戶對新 ATM 使用的學習效率和記憶。[5]
滴滴 App 關懷模式針對老年人進行功能精簡，滿足高優先級核心訴求，首頁只放「一鍵打車」，操作簡單，大字、無廣告。
在很多行業中，中老年人因為擁有豐富的經驗在崗位上更具競爭優勢，譬如教師、醫生、律師、會計等職業，工作年限長、經驗足是優勢，可以提供更好的服務。他們既會使用 C 端產品，也有使用 B 端產品的場景。
隨著時代變遷，2015 年世界衛生組織提出了“健康老齡化”理念[6]，倡導改變過去“老了就要退出社會生活”的消極認識。
從“老有所依”到“老有所為”，很多的 B 端場景都覆蓋了中老年用戶，如何提升中老年用戶的辦公用戶體驗是重要課題。
另外我們看下 C 端與 B 端的主要差別：
C 端 App 中時常將簡單作為適老設計宣傳點。追求簡單有一部分原因是，C 端用戶是在自己的場域操作且幾乎無時間壓力。而 B 端產品卻相反，業務邏輯復雜，用戶要長時間使用而且要求效率。B 端面向企業定制化，針對特定人群、情景，使得在適老化設計中要解決的問題更清晰。
留意生活中的零售行業，如餐廳、商場、藥局、便利店的服務人員，往往能看到中老年人的身影。
POS 系統是 B 端場景中使用率最高的產品之一，POS 系統的英文全名為 Point of Sale，中文名為銷售時點信息系統。[7]它由硬件與軟件組成，根據產業和店面類型的不同，會有功能上的差異。
最近團隊參與了一個改造 POS 系統的項目，使用人群覆蓋到了中老年用戶，提升他們的辦公用戶體驗是其中一個產品目標。
本次項目主要是 POS 界面的更新，完整的 POS 體驗不僅有軟件本身，有更大的部分在于實體環境與設備，例如：結賬區的控件、店面的擺設、掃描槍，讀卡器等，而 POS 界面是連結上述元素的節點。
在對 POS 系統進行改造時，我們是按照以下設計思路進行的：
第 1 步:沿用舊系統規則與結構
B 端系統背后往往由成熟的業務場景和復雜的業務邏輯構成。B 端系統往往不是一個從 0-1 全新的系統，而是存在一個被使用了很多年的系統。
在這種情況下，企業服務的每個用戶都是趨向于規避風險的。人們可能已經習慣了原有的解決方案（盡管不好用，但是大家都會用了），但新的方案如果不好用，他們的生產力反而會因為不知道如何使用新方案而降低。
這就意味著在做 B 端設計時，現行的方案會產生很大的習慣引力。
當設計師要引入一個新方案時，取消或改變某些功能及操作行為將有難度，不能霸道性更改，取代需要合理性。
設計思路：
第 2 步：理清主要用戶與使用場景
想要了解使用者的真實痛點，需從場景出發。
第 3 步:用適老化設計原則去解決場景中的問題
POS 使用場景有很多，這里列舉 3 個常見的使用情境：
可能存在的障礙：無法聚焦信息內容，難做到邊看屏幕邊與顧客交流。
設計目標：確保信息在復雜的環境中，信息內容清晰可讀。
設計思路：
1. 放大信息內容
服務至上，POS 使用者在工作時需保持端莊熱情的姿態，不能只專注看 POS 屏幕信息而不顧顧客。
內容大小的確立由設備分辨率、環境燈光、字體、視距等因素決定，在復雜的現場環境中，信息內容要清晰易讀。
2. 色彩對比度符合 WCAG 標準
參照 WCAG 有 AA 和 AAA 的對比度標準，界面中的信息與其背景間的關系對比度至少在 4.5:1 之上，保證信息易讀性。
WCAG 全稱是 Web Content Accessibility Guidlines(網頁內容無障礙指南)。這是一套由無障礙功能專家編輯的指南，有若干國家在其網絡無障礙功能法律要求中明令必須使用這些指南。[8]
一些設計插件可以幫助我們檢驗色彩對比度是否符合 WCAG 標準，給大家推薦 2 款：Sketch 插件 Cluse，Figma 插件 A11y-Color Contast Checker。
3. 設計有意義的動畫
通過動效來表達靜態視覺效果無法準確傳達的信息，如反饋、引導下一步、狀態表達等。好的動效與視覺設計是互補而成系統的。
比如用動畫來展示商品被加進購物車的狀態，引導下一步操作。
4. 加大點擊熱區
提高使用者點擊操作的準確率和速度。
5. 一屏策略
在這次的項目中存在一個場景，除了銷售端服務員看到的屏幕，顧客也會有一個客顯屏，即服務人員看到的界面，顧客也會看到。
對于頁面信息框架以及布局盡量“一屏”展示，確保雙方的視線和注意力一致，便于溝通交流。但這時會有挑戰：字放大、按鈕放大，信息和功能在一屏上怎么放得下？
解決思路：
可能存在的障礙：在顧客的“催促”下，使用者也會著急，對事物表現出茫然的情緒，定位當前位置困難。
設計目標：追求信息的有效表達和操作的直覺性與效率。
設計思路：
1. 避免使用不易識別的圖標
B 端系統中會有些功能很難用一個圖標去表達其含義，此時文字+圖標按鈕優于純圖標按鈕，能幫助 POS 使用者更好地理解語意并做出操作。
2. 信息的呈現符合用戶眼動規律，操作軌跡越短越好
可運用古騰堡圖表法 Diagonal Balance，它由 14 世紀西方活字印刷術的發明人約翰·古騰堡提出。他發現人們視覺閱讀規律，左上角是視覺第一落點區，右下角是視覺最終落點區，右上角和左下角都是一個視覺落盲點，大多數情況容易被忽略。
在進行信息排布時，可根據用戶習慣性的眼動規律，將最重要的信息放在左上角，右上角和左下角添加輔助元素，右下角作為整個視覺落點可以展示重要操作。
可能存在的障礙：百忙之中，應變能力下降，容易發生誤操作的情況。
設計目標：預防不當行為，提升容錯率，反饋要及時有效且清晰。
設計思路：
1. 通過二次確認避免誤操作
在產品設計時，要把各種可能性考慮進去，通過模態對話框讓用戶二次確認來避免誤操作行為。
當有重要操作時需告知用戶處理結果，狀態反饋信息采用的顏色需要遵守用戶對色彩的基本認知，如紅色代表警示，黃色代表警告、綠色代表成功等。
上述舉例的設計原則是啟發但不是限制，每個設計提案最后都要經過用戶調研，看是否符合使用者的使用習慣，是否真能解決業務與工作中的痛點。
附上總結圖：
其實設計到后面會發現，起初為了方便中老年用戶使用 POS 運用的設計原則，最終都能給多數人帶來很大便利。
這是因為我們每個人在某些時候都會遇到各種臨時的無障礙需求。
適老化設計，不僅僅只是為中老年群體做設計，更是一種新的設計思維方式，去挖掘更多普適的場景痛點，來指導我們做方案設計。
市面上很多適老化設計方法為 B 端產品提供了借鑒，但 B 端產品不能為了適老而適老，理清相關工作情境和要解決的問題很重要；不能霸道性更改，取代需要合理性，因為 B 端產品現行的方案會產生很大的習慣引力。
以上是近期對 B 端引入適老化設計的一些思考和沉淀，是開始，也將繼續，適老化設計還有很多值得深究和驗證的內容。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
在 2020 年，疫情最為嚴峻的時候，B 端這一領域得到了前所未有的關注，而那時，身為 B 端用戶體驗設計師的我，也曾總結過，當時 B 端設計的諸多趨勢，比如：
多端需求：即桌面端、平板端、移動端的設計形式
設計中臺：擁有更為統一的設計平臺，與這兩年討論較多的設計資產相同，都是起到快速協作的作用
隨著 2022 年的到來，B 端行業又會迎來哪些新的機會？今天我們就從整個的 B 端入手，回顧一下 2021 年的設計形式，展望一下 2022 年的設計趨勢。當然趨勢完全是我自己個人主觀理解，僅供參考，如有異議，以你為準~
完整的趨勢，我們會分為視覺趨勢與產品趨勢：
雖然 3D 化的視覺風格早已到來，但是在 B 端市場上，3D 風格在此之前依舊表現的十分克制。隨著 C4D、Blender 這些 3D 建模軟件的不斷普及，再加上互聯網上關于 3D 建模教程的增多，你會發現 3D 風格的視覺表現，是一個 B 端視覺設計師的基本要求。
而 3D 風格用在 B 端軟件當中，會有兩個使用場景：
圖標
因為在 B 端產品當中，圖標本身就是非常難以去表現，比如“物聯網，大數據”，許多抽象詞匯很難通過一個具象的事物進行表達，而在企業官網當中，在視覺表現上的要求又十分的高。因此你會發現，在視覺風格上的選擇，往往只有 3D 圖標 + 插畫這一條路。
并且 3D 圖標的使用場景不會太過于局限，也可以用于產品的工作臺、運營營銷工具箱等頁面，因此 3D 圖標的出現，它的應用場景也會相比之前要更加的廣闊。
可視化大屏
大屏設計也在不斷的“內卷”，因為傳統的 2D 可視化大屏所搭建出來的大屏已經滿足不了企業的野心， 像 DataV 騰訊云圖 ，大家都在朝著 3D 風格，炫酷的方向進行延展，因此也就會導致 3D 的視覺風格需求激增，而 3D 建模仿佛就是大勢所趨。
雖然新擬態是在前兩年的產物。這個設計風格背后，遭到了很多設計師的質疑與排擠。但是隨著這個風格的不斷成熟，感覺它在 B 端視覺領域（特指的是官網 ），是非常受歡迎的，因為整體的風格，與官網的設計形式趨同。
同時作為 B 端產品的官網，其實是更需要新擬態這種風格。因為電腦場景下鼠標光標對頁面進行 Hover 操作給出的真實反饋，而使用了新擬態的官網按鈕，給你的反饋非常真實。
這里安利一下騰訊云的首頁官網，大家就會發現在設計風格上大量的采取了新擬態元素，并且配合 3D 風格的圖標，以及毛玻璃材質的設計，讓它的設計瞬間加分不少。
在去年，設計系統迎來了一波發展的高峰期，隨著字節、騰訊，三大設計系統（Arco Design、TDesign、Semi Design）的開源，其實是給我們很多 B 端設計初學者，有了更加完整仔細的 B 端入門教程。
清晰的講解了每一個組件的使用方式，以及注意事項，仔細閱讀這里面的內容，其實就是 B 端設計的入門學習。而未來，國內的環境，開源的系統也會越來越多，大家可以針對這幾大類不同的設計系統進行對比，或許會有一番收獲。
這里的超級 app 可能和大家潛意識里的支付寶、微信這些軟件不太一樣
在 B 端行業，隨著疫情的不斷擴散、再加上兩年時間的發展，很多 B 端產品的功能架構都出現了一個現象，產品的功能開始變得非常擁擠。因為 B 端軟件的核心價值其實就是靠著一個又一個功能去累積，也就意味著隨著 B 端產品的發展，功能模塊在不斷的累積，導致在設計層面，這樣的現象變得更加嚴峻。
你會發現左側的導航菜單已經完全沒有辦法裝下這些導航內容，而這一現象也反映在很多產品當中，比如我了解的飛書管理后臺、薪人薪事 等等諸多 B 端產品，它們在整個導航內容上，已經增加到一級導航 15+ 、二級導航 40+ ，這無疑會開始對設計師的能力造成巨大考驗。
面對這一情況，許多導航菜單都將會迎來前所未有的挑戰，最近也在深入研究導航菜單過多時的解決辦法，發現了一些新的導航菜單設計方法，有機會咱們重新梳理一下導航菜單的內容，將 B 端設計指南文章進行更新。
低代碼定制化
低代碼一直是我關注的一個領域，先給不明白低代碼的同學簡單科普一下。
低代碼，一種快速開發應用的軟件，將通用、可重復利用的代碼形成組件化的模塊，通過圖形化的界面來拖拽組件并形成應用。低代碼能夠實現只寫少量代碼或不寫代碼，類似用“樂高積木”的方式來開發。
在國外有很多著名的低代碼成功案例。Outsystems（國外非常出名的低代碼平臺）幫助施耐德電氣在 20 個月內推出了 60 款應用程序，開發過程加速了兩倍；在 2012 年即將推出 Model S 之際，特斯拉放棄了 SAP 的 ERP 產品（可以思考一下為什么），改用低代碼開發平臺 Mendix，用 25 個人四個月時間自建 ERP 系統。
去年，低代碼平臺，也有很多新產品面世，其中就包含：
因此你會發現，其實低代碼就是在解決一件事，圍繞著某一個業務場景，通過平臺的持續完善優化。讓所有的功能都能圍繞這個業務展開，其中包括：權限、時間軸、流程、表單、公式等等，能夠解決很多特殊的業務場景。而低代碼會涉及到設計思路上的轉變，以及低代碼編輯器的出現，如何去設計如此復雜的配置流程，如何讓用戶能夠快速上手，如果你能夠有比較完整的思路，這些都會成為我們設計的新機會。
行業細分
隨著互聯網市場的不斷發展，用戶會越來越關注產品在自己行業的應用，比如 CRM，其實只是一個籠統的稱呼，現在 CRM 市場又會分為 SCRM、運營 CRM，等諸多產品。
SaaS 類的平臺也出現了負責從虛擬主機和數據庫層面入手的 iPaaS 以及從應用和數據層面入手的 aPaaS。
即使是大家經常使用的 釘釘、企微、飛書，它們也在各自的領域有所擅長。
因為 B 端產品，在底層邏輯上是不能允許趨同的產品出現，如果你和別人的產品一樣，其實是沒有辦法在目前的市場上立足。因此你會發現，雖然產品形式都會比較相同，但是 B 端市場十分廣闊，大家都在去尋找自己產品的差異化。
當然市場是瞬息萬變的，這里也只是簡單聊聊我自己的看法，希望對你有所幫助。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
B 端產品主要是 Web 端產品，空間大、操作多，內容相對復雜。需要通過頁面布局或者視覺設計表達出明確的邏輯關系，從設計角度降低用戶的學習成本。而用戶有固定的認知規律。格式塔原理揭示了人類視覺的認知是整體的：我們的視覺系統自動對視覺輸入構建結構，并在神經系統層面上感知形狀、圖形和物體，而不是只看到互不相連的邊、線和區域。
格式塔主要包括 7 個基本原則：
今天我們就來總結下，格式塔原理在 B 端產品中是如何應用的？
我們先看 2 張截圖，分別是不同分辨率下的界面效果。
可以明顯的感覺到高分辨率下，菜單列間距離較大，菜單的歸屬關系很清晰。而低分辨率下，菜單間的距離變小，特別是后面兩列的菜單會給人混在一起的感覺。這就是格式塔原理中的接近性原則，距離近的關聯親密，距離遠的就各自獨立分組。
當我們想要傳達給用戶層級關系時，就需要善于利用接近性原則。例如表格上方的功能按鈕，通常我們將高頻、核心操作放置在左側，低頻、輔助功能放置在右側。通過增大元素間的距離，達到功能分區的目的。
相似性原則是通過顏色、尺寸、圖形等方面的共同屬性，實現信息的分組或者高可讀性。
例如在可視化圖表中，不同范圍值的指標采用不同的背景色。通過背景色的差異，將同一范圍內的數據形成視覺關聯，提高用戶對信息的識別效率。
通過圖形尺寸的相似性也可以構建內容分區。例如阿里云、騰訊云控制臺的首頁，都采用了雙列設計，左側主要以高頻的業務功能信息為主，右側是輔助運營信息。兩列尺寸寬度有明顯差異，用戶會將相同寬度的卡片歸為一組。這樣有助于用戶理解兩類卡片的內容差異，并有效地突出業務信息。
IBM、蘋果的 Logo 設計，無論是“用刀砍過”，還是被“偷咬了一口”，用戶仍然可以識別出完整圖形。這就是視覺閉合性原則的一種表現方式。
在 UI 設計中，則會通過對齊方式，形成虛擬空間。例如下圖中阿里云通過明顯的背景色、陰影等手法形成有形的內容空間。而微信公眾號則是平鋪背景色，內容區借助標題、卡片對齊形成視覺閉合空間，最終將頁面劃分為左側導航菜單和內容區兩個空間。視覺表現上更輕量化。
另外閉合性是需要元素之間相互輔助的，單獨的元素無法構建出閉合空間。以下圖為例，雖然四個小的卡片做了間距分割，但是由于界面整體上是橫向分割的。我們會將 4 個卡片看作是整體元素去理解和認知。
用戶更習慣于從左到右的橫掃閱讀，因此連續性主要體現在橫向空間中。
下圖中，雖然左側的標簽文字與右側的內容信息有較為明顯的間距，高度尺寸差距也比較大。但是用戶不會將內容看作是 4 個獨立的個體，而是理解為兩組信息。
在某些場景中，如果信息平均分布，不會產生連續性的視覺感知。
例如下圖指標監控中，指標都是采用小卡片，間距、尺寸較為統一。這種情況下用戶就很難對信息分組處理。在我看來這些指標只是一個個的視覺散點，沒有明確的視覺重點。用戶無法感知到內在的邏輯性。用戶想要找到某個指標時，需要逐個檢索，花費的成本更高。
通過上述很多圖片，我們可以看出頁面元素基本都是橫平豎直，中規中矩的元素和分割方式?；蛟S有些單調乏味，但是勝在簡單，不會帶來額外的視覺噪點。
特別是 B 端產品，基本看不到異形的存在，甚至全圓角矩形都很少見到。即使有異形，也只是作為視覺表現元素存在于內容中，而不會作為空間的劃分邊界。
主體與背景原則最典型的應用就是蒙版彈窗。通過拉大主體與背景的差異性，凸顯彈窗信息。
當我們需要著重表現內容時，同樣適用于主體與背景原則。例如登錄界面的設計，會通過差異化的背景、陰影等方式，帶給用戶清晰的視覺層級，適當凸顯輸入框的主體地位。
而 B 端內容區是核心空間，基本都是采用純白背景，與頁面背景形成對比，從而占據信息的主體地位。
共同命運原則聽起來有點玄學，指的是相同運動特征的元素會被認為是同一組或者是具有相關性的內容。運動的元素在 B 端產品中應用很少，我沒有找到合適的案例解釋這個原理。
在移動端產品中有些應用案例。比如 iOS 系統中，桌面布局編輯態下抖動的圖標，可以與靜態不可編輯的內容形成隔離效果，視覺引導性更強。同樣今日頭條頻道編輯時，也采用了抖動效果。
雖然 B 端產品沒有 C 端色彩豐富，表現力上沒那么炫酷。但是兩者對信息傳達的要求是一樣的，要求和諧、有序、層次分明，輔助傳達內在的業務層信息。靈活地運用格式塔原理將對產品的體驗提升會有很大的幫助。
格式塔原理不僅限于視覺表現，產品經理或交互設計師在原型設計時，也要重視格式塔原理，輔助設計方案表達，提高團隊間的協作效率。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
提到輪播首先可能想到的是廣告，我們經常在移動端首頁或網站首頁會看到各式各樣的輪播banner，不管在移動端還是網頁上通常點擊數據都是非常差的，本篇文章帶你深入了解banner輪播。
如果需要設計一個輪播，我們應該考慮哪些因素？如何讓輪播更具有價值？如何讓輪播的體驗更好？如何避免輪播常見的問題。
本篇文章通過以下幾點探索輪播的特性，預計閱讀20分鐘
1、用戶真的使用輪播嗎
2、輪播的輪換形式
3、輪播的進度展示
4、輪播定位
5、輪播的切換
6、對輪播進行分類
7、使用縮略圖進行預知
8、輪播異形化
9、輪播時間
10、總結
用戶是否對輪播有感知，這個則需要根據不同的場景進行判斷，包括每個產品中的每個輪播對用戶用戶的定位也不相同，常見的應用場景品牌曝光、活動營銷、產品展示，每個場景下相關的數據也不相同。
促銷輪播banner
品牌推廣輪播banner
產品介紹輪播banner
同時還有個關鍵因素，輪播的占比，這里以pc端為例若是產品是以品牌效應吸引用戶的，大多輪播是以大的屏幕占比為主通常會占首屏的50%，如果是以營銷、內容為主的產品，輪播通常以16:9、7:4的常規比例進行展示。
用戶在使用產品時會默認忽略輪播區域，一般輪播都會有自動輪換機制，一定時間后自動輪放下一張banner，那么每當頁面上進行輪播時便會吸引用戶進行關注，效果上會有一定的提升，所以在輪播中第二張第三張的效果往往會比第一張輪播的效果更有效一些。
還有一種用戶比較喜歡關注輪播過去的banner以此來滿足好奇心。
如果banner是作為內容傳播希望用戶通過banner了解內容，那么則要避免放在最后一位置，對于用戶而言最后一張輪播路徑過于長，并且用戶很少會手動滑動banner。
國外一家公司在針對輪播中進行了相關的研究測試，隨著頁數的增加用戶的點擊逐步下降。
那么如果想讓產品中的輪播更具有效果，則需要根據不同的場景設定策略達到目的。
不管在移動端還是手機端，輪播都有各種交互形式和尺寸，以pc為例在交互上會多樣化一些，常見的幾種則是通過滾輪滑動、通過點擊切換兩種。
如下圖某藝術網站，它則是通過鼠標滾輪進行切換輪播banner，并且banner的占比也是鋪滿首屏，這種輪播形式適合一些品牌、產品宣傳等相關的網站以此來突出產品的亮點，同時也符合用戶目標。
在看下面這個醫美網站它的切換方式則是通過鼠標點擊進行切換，并且占比也是鋪滿首屏，在醫美領域用戶更關注美感，而輪播形態也是符合用戶的心理預期更加沉浸美觀。
而在移動端輪播的形式就比較統一，大多都是自動播放+手指滑動進行切換。
在網頁中輪播都會有當前的定位點，許多用戶的習慣是點擊進度條進行切換banner這樣能夠更快的達到目標，不用一張一張切換，但是在有些產品中會忽略這一點，設計中會做的非常小導致用戶在點擊上可用性不太友好，如下圖中的banenr進度點設計上過于小導致點擊上有些阻礙。
如以下網站去除進度定位的方式，通過縮略圖預覽來告知用戶下一個banner的內容，空白區域也可以添加縮略圖引導介紹等關鍵信息，幫助用戶提前預知在體驗上相對較好。
以下國外某網站在進度定位的設計上采用了標簽文案方式進行設計，能夠幫助用戶更加全局的了解banner內容
定位主要是用來指示當前輪播的進度，像上圖中講的便于用戶更加全局的觀看banner的張數和當前進度。
以下網站的設計中則把定位與進度相結合，進度條展示該banner預計多久會切換下一張，對于自動切換的產品輪播這個更直觀的進度展示體驗上相對較好。
以下是某個國外網站，不管是pc還是移動端都在輪播底部添加了水平條，告知用戶當前位置
隨著市場上產品同質化嚴重，產品的競爭力也更依賴體驗，在下圖中的數據可視化的網站上，在進度條上就利用了產品的特性以餅狀圖的形式進行展示。
在剛才上面舉的例子中很多優秀的網站在設計上都很有創新性，但是需要注意一個點，在輪播中不只有自動播放，還需要考慮用戶手動切換，因為在實際用戶瀏覽中可能會對產品的播放時間達不到預期，此時則會使用手動切換，除去可點擊的進度點，還需要上一張和下一張的入口切換。
在此基礎上需要注意，在處于最后一張banner時，下一張切換還能不能點擊，第一張時上一張切換還能不能切換，這個取決于產品特性和輪播張數，如果輪播張數過小的話則需要進行循環播放，如果過多的頁數則第一步和最后一步不可點擊。
上一張和下一張的距離遠近取決于banner的大小，如果輪播banner占比較大時則需要考慮用戶的操作時長，距離越短時間越快，為了避免用戶操作失誤在相對較近的切換按鈕則需要在視覺上做的比較突出，便于用戶尋找。
如果banner占比在首屏中占比較少的情況下則需要讓切換按鈕的間距拉大，保持視覺平衡，因為小區域banner用戶能夠更加全局的觀看，在使用上不會猶豫。
反觀移動端在輪播中除了展示banner進度外很少展示切換按鈕，移動端更加依賴手勢交互。
當輪播banner過多時利用標簽進行分類，用戶通過點擊標簽進行查看相關的輪播組合。
此方式更適合一些電商平臺、新聞網站這種內容過多的產品
如下圖國外社交媒體網站則使用了標簽進行分類，此處提一句輪播不僅限于首屏banner。他的用處可落地在各個場景。
在banner首屏中，顯示的內容越多，越能激發用戶進行點擊，像上面講過的農業產品網站就使用下一張預覽圖的形式進行展示，當然不僅局限于這種形式，如下圖中的餐飲網站把所有的輪播banner展示給用戶觀看。
相對于縮放圖，圖標展示效果上也較好，空間占用更少，使用這種方式需要謹慎，對圖標的識別性要求較高，我印象中能夠使用的這種方法的網站是蘋果官網，讓產品抽象化展示。
在移動端也存在這種設計手法，但是基于分辨率原因移動端的縮略圖展示過少，最常見的如下圖中的馬蜂窩和企鵝電競。
輪播最大的缺陷則是像剛開始講的用戶會默認為廣告，對此可以使用個性化設計突破用戶心理障礙，使輪播banner更具備親和力。
如下圖中的數碼科技網站，利用產品與背景的結合營造出一種功能性的展示。
再例如下圖中蘋果官網入口，結合百度的定制化功能在大搜中進行個性化處理，把常規的banner輪播以功能卡片形式進行展示，同時卡片承載產品動畫引導用戶進行點擊。
蘋果官網進入后隨意點擊產品介紹頁后會發現，蘋果把輪播結合鼠標滾輪營造沉浸式觀看，每個屏效內都展示產品一個功能特點，打破傳統banner的展現形式。
自動播放的輪播會根據用戶的耐心和用戶的訴求進行調整優先級，如我們平常使用產品時會忽略banner廣告，我們會更加關注移動中的東西，特別是在移動端上通常是banner進行輪播時才會關注。
谷歌設計團隊曾對banner輪播的時間進行測試，測試結果得出5s-7s的輪播時間最佳，在這個時間內用戶有足夠的時間對輪播banner上的產品內容進行了解。
如下圖谷歌商店的輪播時間設定在6s。
同時還需要注意，在自動播放的過程中如果用戶鼠標hover上去后，則需要判定播放暫定，避免用戶錯過感興趣的內容。
本文從輪播的樣式、特性、用戶對輪播的認知等多方面的介紹，在實際產品中輪播有很多可用性上的問題存在，我們在設計中則需要根據自己產品的特性、用戶群體特點等多維度去思考適合什么樣的輪播形式。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
Dribbble 平臺對于互聯網 UI 界面設計有著舉足輕重的定位，對 Dribbble 設計的研究會讓我們看清設計的方向。
為了保證這篇文章的質量，Dribbble 年度的每個作品都超過 550 贊。在此原則下挑選了 828 件作品，作品總的大小為 2.2G。
從挑選出的 828 件作品中，排名前十的作品中 9 件為 B 端設計，另一件作品也是 B 端產品 C 端化的產物。其中：
明眼人都能看出其中的比重關系，B 端設計再次大火，為什么是再次？因為 B 端設計之前火過，只不過沒有趕上一個好的時代，在 C 端設計風光的十年里而忽略了其存在。隨著 C 端市場飽和與數字化的浪潮下，實體經濟、ToB、ToG 的產業再次迎來了它的曙光。視頻動效的作品占比也已超過 C 端界面設計，相信今年視頻動效作品占比還會再次提升。
Dribbble 年度最佳作品來自大家最熟悉的 UI8 團隊中的 Tran Mau Tri Tam ?，作者來自越南西貢，最佳作品截止目前355K瀏覽量，2933個贊。
為什么看似平平無奇的作品卻能獲得 Dribbble 年度最佳作品呢？既不是 C 端也不是純 B 端的作品，更像一個網頁與平面的結合體。如果去掉搜索圖標、分類圖標和按鈕，你可以理解它就是一個平面作品，一個字體加幾何形體構建的作品，為了豐富畫面的層次，讓畫面更加的活潑采用了多彩加幾何色塊，讓標題閱讀有停頓感和呼吸感。faster 底部的橫線讓它從標題文字中脫穎而出，這種使用線條突出重要信息的設計也是今年Dribbble 設計流行趨勢之一。
MetroUI 是 Windows8 的界面設計語言，在 2010 年至 2013 年間曾經風靡一時，那也是移動互聯網的發展元年，現在國家推行實體經濟、數字化帶動 To B、To G 的發展元年，通過幾何色塊（MetroUI）實現 B 端產品與 C 端設計風格的傳承與銜接，你會發現歷史總是驚人的相似。最后背景結合今年最流行的微軟風，毛玻璃的多彩高斯模糊漸變風，年度作品當之無愧。
最后來看下按鈕的設計，正常的按鈕要么文字加色塊，要么左圖標加右文字，它設計成左文本加右圖標，更加注重信息的可讀性和易讀性，也體現 B 端設計重功能和交互體驗，視覺點到為止的設計理念。
下面我們來欣賞年度最佳作品里面的流行趨勢吧。
1. 易讀性（停頓感）
字體三原則：可讀性、易識性、易讀性。當你同時讀一篇文言文和一篇設計文章，肯定設計文章的內容可讀性更好。易識性是用在字體設計上，不能過于浮夸的改變字體骨架、形體而不易識別。易讀性和每個位設計師都息息相關，因為我們都需要編排文本。當我們小時候寫作文時，不會寫的文字可以用拼音代替。這時候讀者讀到拼音時會有停頓感，更加適合用戶閱讀。
通過給用戶制作停頓感來增加用戶的易讀性?？梢栽谙嚓P聯文本后面添加圖片、表情、圖標來更好的理解文本內容，豐富文本內涵。比如情侶間表達愛意時會輸入文本，“我愛你”、“我 Love 你”、“我 ai 你”、“我??你”，哪個更加會有情感共鳴呢？不言而喻，相信你心中已經有答案了。
2. 曲線
在標題文字上添加曲線來突出重要文案是 2021 Dribbble 最流行的趨勢之一，第一個設計目的就是突顯文字，其次就是想表現鉛筆真實書寫的感覺。之前很多帶有簽名的設計中，簽字的文本都是手寫體的感覺，手寫體對比電腦的機械字體會帶有一種人文氣息，也會讓兩者之間產生一種對比、矛盾。
除了突顯文本外，曲線還有視覺引導的作用。通過視覺引導讓用戶按照設計師編排的順序進行瀏覽界面。當然還有比這更科學的工具就是眼動儀測試，通過真實用戶眼睛瀏覽界面顯示對應的熱點圖。
3. 多彩高斯漸變風
多彩高斯漸變風是從色彩的角度來傳達和豐富畫面的，多彩高斯漸變風其實是從制造矛盾到平衡矛盾的過程，多彩漸變多為冷暖對比來制造畫面的沖突，需要控制冷暖畫面的大小來實現平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。
多彩高斯漸變還可以結合輕擬物、幾何圖形、三維等新的組合方式去創新，給用戶呈現一種更加新穎的視覺表現形式。最后我們還是要回歸到內容上，為了更好的傳達信息需要去設計與內容相匹配的視覺風格。
1. 側邊欄 Sidebar
B 端設計的火爆帶動了 B 端相關模塊設計，更多的人也愿意嘗試 B 端相關模塊設計，側邊欄作為產品架構中重要的導航系統，好的側邊欄設計能為用戶帶來更好的效率。主流側邊欄都做了展開、收起、拖拽等交互效果，也是受限于 PC 屏幕為展示更多數據而騰空間。側邊欄主要承擔的功能有導航、分類、自定義篩選、共享、新增等。Dribbble 的 B 端產品設計已經不再是假大空概念設計，而是一套實用美觀可落地的設計。
2. 儀表盤設計
儀表盤設計是一個很好的隱喻，想象一下開摩托車或汽車主駕駛前面的屏幕，汽車儀表有燃油表、車速表、里程表、水溫表、轉速表、故障指示燈等。B 端類產品后臺界面的儀表盤設計也需要展示一些重要的數據和各種狀態，大體分為側標欄、導航欄、待辦任務、個人信息、報表數據、消息中心、快捷入口等。當然最重要的就是報表數據，團隊收益、任務進度、轉化比例、新增、存量、團隊工作時長等都是老板或領導關心的內容。每個公司業務不同、每個人員權限不同，自定義的儀表盤也各有差異。重要的是突顯數據和業務狀態，需要分層級系統性去思考和設計。
3. 流程設計
復雜的事情簡單化，簡單的事情標準化，標準的事情流程化，流程的事情自動化。流程設計是每一個企業核心功能和業務，可自定義的管理流程系統搭建也是 B 端產品設計的難點，需要對業務高度抽象，讓每一個業務人員可自定義的流程才是好的流程設計。
4. B 端 C 化
B 端 C 化是 B 端產品設計的視覺表現力慢慢往 C 端產品設計的視覺靠齊，國內 B 端產品界面設計視覺水平還有很大的提高空間。除了視覺上的提升外，由于業務的發展，B 端產品也開始移動化、智能化，國內主流還是通過小程序、H5 來現實 B 端產品 C 端化。
5. 輕代碼化
輕代碼化是一種低代碼賦能無代碼的方式，彌補無代碼拓展性差、覆蓋場景少的問題。在保有無代碼靈活、易用、快捷的同時，又能覆蓋低代碼使用場景。簡單理解就是無需代碼開發即可如搭積木般快速、靈活地創造屬于你的個性化管理系統，輕松實現多元業務場景的數字化管理。
輕代碼化將功能進行打包，升級成全局可以用的配置，技術人員配置好后，業務人員在應用編輯時直接選擇使用模版，綁定對應的變量即可使用。
1. 人文氣息
為什么人加色塊的組合方式能流行起來？還是 B 端行業流行帶動的。B 端講的更多的是企業對企業。企業對企業除了講行業解決方案外，還需要傳達公司的價值觀、使命、愿景。人加色塊的組合方式非常適合體現公司的企業文化。對于一家全球化的公司不同膚色的人物組合在一起，這種人文氣息和價值觀已經就不言而喻了。
當然企業也需要進行營銷，抓人眼球。幾千年來的遺傳證明了，人的大腦對食物、性、動的東西、人臉和眼睛、危險的動物很敏感。人加色塊的組合方式也具有抓人眼球營銷的功能。真可謂一舉兩得。
這種風格更適合大公司，國內的一些手機廠商 OPPO、VIVO 等也會通過手機+背景+人物來體現科技與人文的結合，而對于中小型公司產品差異化和行業解決方案展現應該還是重中之重。
2. 毛玻璃效果
毛玻璃效果加大了模糊程度，透明效果更加扁平，很好的順應當下 UI 扁平化的設計趨勢。蘋果 Mac OS Big Sur 系統的圖標、界面中運用了大量毛玻璃和半透明元素，界面更扁平。至于 C4D 三維彩色玻璃的視頻教程可以在 B 站搜索“透光藝術-C4D 創建彩色玻璃的 4 個技法”，完全能滿足 UI 設計師。當然還有一個好消息就是 Mac 用戶可以享有 OC 一年免費的使用權，具體安裝購買方法上某寶就可以輕松搞定，真香。
3. 輕擬物
輕擬物這幾年一直流行，在 UI 設計中趨于穩定的位置。從寫實到扁平再到輕擬物，其實是設計師們一路不斷探索的結果。本質就是光影對形體產生的視覺感受。在色彩中對高光、亮面、明暗交界線、暗面、反光（環境光）五個部分的處理。寫實三維的圖標等設計更適用于簡潔的畫面中，扁平等設計更適用于復雜一點的界面中，比如 B 端產品界面中的功能圖標。輕擬物可使用的范圍更廣，效果更佳。Sketch、Figma 軟件對于漸變、高光、投影、高斯模糊處理已經非常簡單且出彩。
4. 簡潔設計
簡潔設計遵從了密斯·凡德羅的“少即是多”的設計原則，在 B 端產品界面中更加需要簡潔設計，我們最熟悉的 Sketch 軟件界面已經是相當的簡潔了?；氐浆F實當需求功能不斷增加，產品界面的編排如何取舍，如何保證界面的簡潔是設計師需要深度思考的問題？如何與上級溝通？該功能是否可做可不做？是否需要埋點用數據說話？如果只是一味競品有我們就需要有，功能不斷累加只會讓界面越來越重。
5. 幾何圖形
幾何圖形和幾何插畫有異曲同工之妙，幾何圖形多為產品界面和宣傳內容的抽象，產品界面的幾何圖形多為占位符形式，加上色彩和幾何色塊讓其成為一個整體。B 端產品視覺設計 C 端化的進程中，幾何圖形、幾何色彩不失為最好的突破口，相信今年Dribbble B 端產品的視覺設計一定會更上一個臺階。
幾何圖形另一個場景化的地方就是品牌，作為一名 UI 設計師一定會經歷從圖標到幾何圖形到品牌設計的過程，品牌設計的技巧基本還是以幾何圖形為主，至于品牌的內涵需要更深層次的解讀。掌握主流品牌設計的技巧對產品定位、品牌宣傳打下扎實的基礎。
6. 暗黑設計
暗黑模式的設計是解決在微弱環境下內容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設備時長增大，如何在夜晚這個特定場景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞，提高在夜間使用的可讀性。
在設計暗黑主題時，不能為了突顯視覺上的逼格，而去使用高飽和度鮮艷的色彩來突顯界面的品質感。而應該把舒適度、可讀性作為設計的衡量指標。Material Design 給出了暗黑主題的設計準則，即正文和背景之間的對比度應至少為 15.8:1。按照此標準設計，可讀性都還不錯。這里介紹一個插件“Stark”（Figma、Sketch、XD、Chrome 插件）用來測試界面的對比度。
7. 模塊化（組件化）
為什么叫模塊化，而不叫組件化，組件化更多的利用原子系統從原子、分子、組織、模版、頁面來快速的搭建界面，但在 B 端產品設計中基礎組件和業務組件的搭建是以提高工作效率為前提，是否有從 0 到 1 搭建 B 端產品組件的經歷是設計師一生中最寶貴的經驗之一，它能提高設計師的系統化思維、邏輯思維和抽象思維能力。
產品模塊化設計就是將產品分成幾個部分，也就是幾個模塊，每一部分都是具有獨立功能，具有一致的連接接口和一致的輸入、輸出接口的單元，相同種類的模塊在產品族中可以重用和互換，相關模塊的排列組合就可以形成最終的產品。通過模塊的組合配置，就可以創建不同需求的產品，滿足客戶的定制需求 。
8. 插畫
插畫作為設計的一大品類，不同的插畫師都有自己擅長的風格，本質是都有自己的個性，但是在產品設計中更多是需要共情、共性來講故事，表達產品理念和價值觀。這就需要插畫師去嘗試并探尋出適合互聯網產品設計類的插畫風格。設計的本質是舊元素的重新組合，插畫不會過時，而是需要結合當下和產品找到最匹配的設計風格。
9. 幾何插畫
幾何插畫算是插畫簡化的一種表現形式，人和物的形態不再寫實，而是抽象成幾何圖形拼湊的感覺，同時保留人物形態的神韻。加上幾何色塊與人物交互形態的表現，傳達出簡潔、科技的現代感。難點還是在人物形態的表現上，平時多練習練習速寫還是很有必要的。
10. 線面插畫
線面插畫最近一兩年非常流行，準確的說是非常適合。首先線面插畫主要是由線條和塊面組合而成，用塊面表現人物形態時某些結構會表現不出來，這時候用線條簡單勾勒后，結構就會清晰明了。其次當線面插畫運用在界面上時，可以打破界面純文字或組件化的機械和沉悶感。線面插畫的風格提升畫面熱鬧感的同時，還能保持界面的干凈整潔。
1. 微交互
界面微交互動效會讓用戶的體驗更加精致到位。想要打造優秀的產品設計，微交互和動效設計是繞不開的，UI 界面設計通過微交互反饋告知用戶當前正在發生的事情，所處的狀態。細微的動效更能調動用戶情緒，取悅用戶。C 端產品微交互和動效已經很成熟了，一部分功勞來自 iOS 系統原生自帶的效果。B 端產品的微交互和動效更多還是在學習海外產品，還需要給前端工程師灌輸微交互和動效的設計價值，共同打造產品體驗細節。
2. Mg 動畫
Mg 動畫需要很好的節奏感、韻律，每一個場景動畫都需要其中的元素進行連接變化，讓轉場動畫更加自然，MG 人物動畫通過點線面的動效變化讓畫面更加有趣、自然，通過粒子效果讓特定場景無限循環會讓人更加印象深刻。
1. 三維圖標
MacOS Big Sur 系統圖標的更新帶動了三維圖標的流行，三維圖標的應該場景還是需要有較大留白空間的界面，因為三維圖標太小后就看不到更多細節。三維圖標感覺又回到了擬物化和扁平化哪個更好的問題上？設計師應該保持開放多元的視角。設計本身也在不斷的演化融合，存在即合理。合適最重要，它們都會有適合自己的場景和設計價值。
2. 輕三維
為什么輕三維在界面設計中占有一席之位？一個是設計師不斷追求差異化的產物。另一個是更好的表現內容，并與用戶產生共鳴。輕三維的基礎模型都是來自手機界面中的各種元素，比如組件、開關、按鈕、占位符、圖表、幾何圖形、圖標、進度條等，這些都是用戶日常使用系統軟件常見的元素，通過簡單的幾何形體建模—打燈光—加材質—渲染—PS調色。難度系數不大但效果很出彩。第一個出彩點是模型帶有厚度的倒角，結合燈光渲染的光澤是二維軟件不能比擬的。第二個出彩點就是材質自由添加，特別是當下流行的毛玻璃效果，玻璃材質渲染效果更佳。第三個出彩點就是可以加局部燈光，局部的漸變色或環境光更加出彩。
3. P4D（PS+C4D）
P4D 是 PS 加 C4D 的設計表現技法，也是視覺設計的最后一個環節，通過 PS 對 C4D 的渲染圖片進行調色，利用 PS 的調色技巧可以很好的解決 C4D 打燈光的瑕疵，還可以利用 PS 強大的合成功能，將渲染圖片與圖片素材進行合成，來表現畫面的視覺度，當然三維軟件比較難實現的水、粒子、煙花等效果，也可以通過 PS 的后期合成來實現，這也是 P4D 的強大之處。
4. 卡通 IP
卡通 IP 設計最近三四年技術的迭代已經慢慢的走上成熟，卡通 IP 也從傳統的純 PS 手繪技法，轉到 C4D 建模—角色綁定—MD衣服制作—OC渲染—PS（靜態）/AE（動態）調色。
卡通 IP 火的本質更適合做營銷，相比于品牌或 Slogan，卡通 IP 具有親和力和畫面感。隨著各種手辦行業大熱，受互聯網大廠影響下，卡通 IP 已經是互聯網 B 輪以上公司的標配了。如果團隊中沒有這樣能力的人，也可以通過繪制好二維，一套三維可以選擇外包完成。
對于 UI 設計師來說學習是有成本的，暫時并不是必備技能，如果喜歡完全可以學習，從設計差異化的角度來看三維視覺確實有一定的競爭力。
5. 三維動畫
C4D 三維場景動畫通過構建實物和場景模擬生活中的現實場景，會讓用戶體驗真實感，三維軟件制作動效的最大優勢是通過動力學和表達式來模擬真實感，未來在 AR/VR 領域會有更好的發展。相對于界面動效學習成本難度也相對較大。在三維動畫中 C4D 軟件對于域、動力學還是有一定的優勢。
上一次寫 Dribbble 流行趨勢還是兩年前了，通過兩年的沉淀對趨勢流行有了更深的認知。十年的互聯網行業風風火火，隨著最近的互聯網裁員潮大家也慢慢的進入到反思層，客觀的看待和理解這個真實的世界，曾經的流行趨勢也需要慢慢的沉淀下來。
存在即合理，趨勢流行稍縱即逝，注定是不長久的，只有大浪淘沙歷史遺留下來的風格才能更長久。但我們也不能不去關注，因為哪有什么所謂的創新，只不過是舊元素的重新組合，并符合當下這個時代人的審美需求。香奈兒的“時尚易逝，風格永存”大概就是這個意思吧。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
客戶與公司的商務售前進行溝通，客戶的痛點和建議會傳達給產品經理，產品需求明確后，做出原型圖給到設計師。等設計師拿到需求的時候，基本已成定局，合不合理、如何優化的空間都會比較小了。造成這個現象的根本原因是設計師能看到的視角范圍有限，B端業務場景本身比較專業，難以直接帶入使用者的角色，就比較難取得大的突破了。
如何打破這一僵局呢？答案只有一個，那就是設計師要主動更前置的加入到產品方案設計中，深刻理解業務，為產品升級提供助力。這就涉及到用戶研究了，本文將和大家分享用研的相關理論基礎和方法。
雙鉆設計模型由英國設計協會提出，該設計模型的核心是：發現正確的問題和發現正確的解決方案。
雙鉆模型是一個結構化的設計方法，被很多設計師喜愛和使用。
探索/調研——透析問題（發散）
定義/合成——聚焦領域（集中）
發展/構思——潛在問題（發散）
傳達/實現——實施方案（集中）
實際工作中用到雙鉆模型會有一些變體，舉個例子：
下圖是對阿里內部款移動運維產品的分析，分析其從0-1的方向探索和從1-1.5的發展歷程：
下圖是曾經在一個設計講座中，滴滴CDX 一位設計師的分享，她把雙鉆模型利用到設計的研究和輸出階段，個人感覺此模型的使用場景也很貼切。
不僅僅是在完整的一個項目中，在單一的某個階段雙鉆模型也是理念很好的承載容器。在每一個“確定”前后，都有用研的身影。
用研旨在通過實驗和觀察結合的研究方法來提高產品的可用性，指導產品的設計、開發和改進。重點是通過觀察技術、任務分析和其他反饋方法來了解用戶的行為、需求和動機。
在獲取后臺數據之后，我們會分析為什么留存、為什么流失、為什么買這個不買那個，
設計師認為很棒的新功能，真的是用戶想要的嗎？用戶真的會用嗎？
觀察數據只是一種手段，而非結果。當一個頁面中出現值很低的功能時，我們不能直接判斷他就是不重要的，也可能是因為視覺上太弱或者交互操作不方便引起的。只有做用戶研究才可以真正了解用戶的行為背后的原因，真正的動機。
如上圖，是一個紅包發放頁面的設計前后對比，從數據中了解到使用優惠券的用戶不到30%，埋點發現大多都點擊了返回，用戶沒有按照期望的路徑走，調研發現操作路徑不清晰，沒有形成閉環。由此可見，發現問題時，先埋點細化問題——再分析問題——結合用戶研究，提出優化方案，才能真正發現問題解決問題。
產品的發展周期分為產品概念期、設計開發期、宣傳推廣期、平穩發展期和產品衰退期五個階段，在每個階段都有相對應的用戶研究測試可以做。
對應上文的產品發展周期可以做的用戶測試，我們要找到相對應的人群：
最后就是將用戶研究進行落地了，如何讓用戶研究達到預期的目的和效果呢？可以在開始前的準備階段問問自己如下的問題：
接下來我們看看到實際落地環節，有哪些用戶研究的類型可以做以及怎么去做。
桌面研究又叫“文案研究”，指不進行一手資料的實地研究和收集，而是通過電腦，雜志，書籍，文檔，互聯網搜索等現有二手資料進行分析和研究的方法。
完整的桌面研究分為以下五個步驟：
在需求細分階段，可以用到SWOT 分析、波特五力模型、PEST分析、波士頓矩陣等模型
收集數據通常可以從內部數據和外部數據來源廣泛獲取然后結合分析。
內部數據來源：市場營銷數據、產品后臺數據、其他相關報告等。
外部數據來源：政府部門、國際組織、行業協會、專門調研機構、聯合服務公司、其他大眾傳播媒介、商會、銀行等金融機構、官方和民間信息機構等。
定性研究是指通過收集、分析和解釋那些不能被數量化的信息，來挖掘問題、理解事件現象、分析人類行為與觀點的方法，主要作用是探索“可能性”。
定性研究專注于更小但更集中的樣本，通過非結構詢問和觀察來獲得不能量化的信息。
流程如下：
常用的定性研究方法：
我們需要明白訪談適合哪一種項目研究，比如要針對新功能進行一次面訪。
接下來我們需要進行用戶的招募，因為面訪比較耗費時間和精力，所以最好準備一些禮品，否則很難招募到用戶。招募用戶的渠道可以是產品中投放問卷、社群招募等方式來邀約難度用戶。
用戶訪談環境，準備一個安靜的房間，準備好水、紙、筆、錄像、錄音筆等工具。
整理訪談內容，每訪談完一位用戶進行一次小結。
接下來模擬一次用戶訪談的整個流程：
開場：首先介紹一下自己的情況，并且讓用戶了解這次訪談的目的，建立一個輕松的談話氛圍。
探索：針對研究目的進行探索，比如目的是做用戶體驗地圖，了解用戶在使用過程中遇到的問題。
注意：如果直接問平時怎么使用我們的產品，用戶會比較懵。這個時候最好給他一個確定的環境，比如你能不能演示一下你平時是怎么管理貨源的，這個時候他就明白原來需要我進行這樣一個任務。
觀察：在用戶回答提問和操作演示中，查看用戶碰到了什么難題。比如有超過一半的用戶多次點擊一個按鈕，說明這個按鈕設計的大小不太合理。
思考：深層次挖掘。比如用戶反饋字太小，但實際操作中并沒有瞇著眼或更靠近屏幕，可能原因一是他們本身就把手機屏幕文字調為最大，二是信息排布過于密集，效率低，并非因為字小。
定量研究是指確定事物某方面量的科學研究，將問題與現象用數量來表示，進而分析和解釋，從而獲得意義的研究方法。定量研究的數據分析，主要作用是回答“多少”的問題。
定量研究的意義：
用一個數值來表示你產品的可用性。數值有時比質量檢測的結果和視頻更有說服力（特別是當你試圖說服像高管或客戶這樣的人）時。
比較不同的設計（比如，你的產品的新舊版本，或者是你的產品與競爭對手的產品相比），并且確定你觀察到的差異是否具有統計學意義，而不是隨機的。
改進用戶體驗權衡決策。比如，如果預期的設計改進成本很高，那么它值得做嗎？定量研究方法可以幫助你驗證重新設計是否值得。
常用的定量研究方法包括：可用性研究、A/B Test、問卷調查和滿意度調查。
測試的重點是收集數據指標，比如任務時間或者成功率，一旦你收集了相對較大的樣本量（大約35個或者更多），你就可以使用它們來跟蹤產品的可用性，或者將其與競爭對手產品的可用性進行比較。
在A/B測試中，團隊需要創建同一界面的兩個不同的最新版本，然后將每個版本展示給不同的用戶，用來確定哪個版本的性能更好?；诜治龅膶嶒灒瑢τ跊Q定同一個設計的不同變體非常有用，并且可以結束團隊關于哪個版本最好的爭論。
問卷調查是一種靈活的用戶研究工具，調研時可以同時獲得定量和定性的數據，比如評分、多項選擇題中的答案的比例，再加上開放式問題的答案。你甚至可以把對調查的定性回答轉化為數字數據。
問卷的一個優點是：可以經常將你的調研結果與行業或競爭者的分數進行比較，看看你做得怎么樣。即使你創建了自己的自定義問卷，也可以隨時間的推移對自己產品平均分數進行追蹤，來監控產品的改進情況。
可以根據你的研究問題進行定制，這些方法通常會首先讓參與者接觸到產品（通過向他們展示靜態圖片或者要求他們使用現場產品或原型）。然后，要求用戶通過從描述性的詞語列表中選擇一個來描述當前設計。
如果你獲取自身目標用戶的樣本量足夠大，那么整體趨勢就會顯示出來。例如，你可能會有84%的受訪者將此設計描述為"最新"。
比如這次改版用戶對新版本的滿意度怎么樣。只有確定了目標，你的問卷才是有價值的。
因子分析法要求調查數量是調查問卷問題數量的5-10倍，因此，如果調查問卷中共有20個問題，那么調查樣本數量可以大概確定為100～200個，有效回收樣本30份即可。
問題順序的基本原則
往前放：
熟悉的問題
簡單的問題
引起興趣的問題
往后放：
開放式的問題
個人背景資料
簡潔明確：
?你用了多久的Google map？（?）
?你第一次使用Google map是什么時候？（?）
這兩個問題看似類似，但是當用戶在思考的時候，第一個問題顯然會思考更多的時間，用戶很可能在想，是想知道我第一次用的時間，還是我用了多久的時間。
中立、無誘導性：
?你喜歡這個功能的設計嗎？（?）
?請您對這個功能的滿意程度進行一個打分，最低1分最高5分？（?）
避免使用帶有引導性的問題，問用戶是否喜歡、是否滿意，這樣通常用戶都會偏向于回答喜歡。
設置選項時，要做到：
定量分析的結果多以數據、模式、圖形等來表達。
?眼動追蹤，英文Eye Tracking，是指通過測量眼睛的注視點的位置或者眼球相對頭部的運動而實現對眼球運動的追蹤。
眼動儀是一種能夠跟蹤測量眼球位置及眼球運動信息的一種設備，在視覺系統、心理學、認知語言學的研究中有廣泛的應用。
注視分析——分析注視軌跡、先后順序與流暢度
注視熱點圖——分析最關注區域和忽視區域
興趣區分析——分析平均注視時間與各興趣區注視順序
通常需要輔助測試（如定性訪談）來收集更多實驗數據
?腦電研究，大腦活動時，腦內億萬神經元活動引起頭皮表面的電位變化，含有大量心里信息，測量腦電信號可繪制腦電圖，以不同波形反映出來。
利用生理探測技術，研究用戶對產品的情緒反應
相比傳統調研，更加能夠排除從眾行為、事后回憶偏差、社會贊許效應等的干擾
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
藍藍設計的小編 http://www.syprn.cn
