一、項目背景
百度文庫APP是一個在線文檔分享平臺，上線已有十余年的時間，是一款名副其實的老字號互聯(lián)網(wǎng)產(chǎn)品。隨著互聯(lián)網(wǎng)的成熟以及年輕用戶的涌入，時代語境和流行文化發(fā)生了變化。年輕化設(shè)計已經(jīng)成為互聯(lián)網(wǎng)產(chǎn)品設(shè)計中不可避免的話題。在日常對用戶反饋的監(jiān)測中，我們發(fā)現(xiàn)文庫APP當(dāng)時的體驗已經(jīng)不能滿足用戶多樣化的需求。并且在體驗走查以及用戶訪談中發(fā)現(xiàn)，文庫APP的視覺風(fēng)格、交互方式、使用感受都存在老舊、不貼合流行趨勢的問題。
二、由內(nèi)而外，打造年輕化感知
通過對年輕市場進行洞察，我們發(fā)現(xiàn)年輕用戶對產(chǎn)品的需求是多維度的。不僅對產(chǎn)品的“顏值”有高要求，他們更追求使用時的便捷和流暢度。他們對新鮮事物的接受程度更高，也更愿意去探索產(chǎn)品新的玩法，與產(chǎn)品進行沉浸的情感互動。
所以此次年輕化改版不能只是對“產(chǎn)品的外表”進行升級，要從視覺、體驗進行全方位、多維度的年輕化升級。由內(nèi)而外的打造年輕化感知。
三、“老字號”互聯(lián)網(wǎng)產(chǎn)品的煥新之路
2.1 視覺升級-更好看
2.2 體驗升級-更好用
寫在最后
從UI設(shè)計誕生初期，設(shè)計師在屏幕上模擬現(xiàn)實世界的交互方式，用擬物化的設(shè)計風(fēng)格幫助用戶熟悉UI界面操作。到現(xiàn)在用戶對移動屏幕越來越熟悉，設(shè)計師們可以在產(chǎn)品設(shè)計中去嘗試更多的可能性。產(chǎn)品與用戶共同成長才是年輕化設(shè)計的意義。
未來，我們也會保持好奇心和探索欲，不斷打磨產(chǎn)品體驗，與用戶共同成長。
感謝閱讀，以上內(nèi)容均由百度MEUX團隊原創(chuàng)設(shè)計，以及百度MEUX版權(quán)所有，轉(zhuǎn)載請注明出處，違者必究，謝謝您的合作。申請轉(zhuǎn)載授權(quán)后臺回復(fù)【轉(zhuǎn)載】。也歡迎加入MEUX視覺/交互/運營設(shè)計師，可投簡歷至MEUX@baidu.com (注明信息獲取來源如：站酷）
關(guān)于我們：
MEUX,百度移動生態(tài)用戶體驗設(shè)計中心，負責(zé)百度移動生態(tài)體系的用戶/商業(yè)產(chǎn)品的全鏈路體驗設(shè)計。服務(wù)的產(chǎn)品包括百度APP、百度搜索、百度百科、百度貼吧、百度商業(yè)產(chǎn)品等。MEUX以「簡單極致」為設(shè)計理念，創(chuàng)造極致用戶體驗的同時賦能商業(yè)，推動設(shè)計行業(yè)的價值和影響力，讓生活因設(shè)計而更美好。
作者：百度MEUX 來源：站酷
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
本文將分享另一個更為深層全面的B端用戶研究方法——用戶訪談。通過面對面的溝通，以及觀察用戶的表情、行為去挖掘更深層的需求。
下面是本次分享的文章結(jié)構(gòu)，標??的為重點部分。
用戶訪談通?？梢圆捎?span style="font-weight:700;">線上會議、電話或者線下面對面交流兩種形式。
線上會議和電話訪談的優(yōu)勢顯而易見，可以不受地域限制展開調(diào)研訪談，整體的成本也比較低，設(shè)計師可以自己找領(lǐng)導(dǎo)或者協(xié)調(diào)資源去推動。
缺點也是比較明顯，溝通起來效率低下，比如我們一定有過“電話里說不清，我們見面詳談”的經(jīng)歷。
所以，相較而言線下訪談無疑是最佳的調(diào)研形式。首先當(dāng)面溝通更加高效，其次對于搭載硬件設(shè)備的產(chǎn)品來說，讓受訪者在真實場景里操作演示，可以發(fā)現(xiàn)更多隱性問題。
在訪談過程中通常會接觸到以下3種類型的受訪用戶，不同類型的用戶我們應(yīng)該怎么接觸交流呢？
話癆型的受訪者占大多數(shù)，通常就是想法、意見比較多。他們不僅有一大堆不滿意的點要訴說，甚至連對應(yīng)的解決方案都想好了。
整體接觸下來，我覺得該類型的受訪者，可提供的有價值信息會更多一點。只不過我們要學(xué)會過濾信息。因為他們的修飾用詞通常比較多，例如：“太難用”、“超級麻煩”、“哎 我真的是受不了啊”…
訪談話癆型的受訪者，我們需要注意無論怎么聊都要緊扣主題，防止變成了吐槽專場。
其次也要表達肯定，安撫情緒，并對問題進行進一步提問：“您的這些建議真的很棒，也給我們提供新的思路，我都記下來了，我還想確認下，剛才您說的3個關(guān)于結(jié)算環(huán)節(jié)的問題，哪一個給您造成的困擾最大？”
顧名思義，受訪者可能是因為性格內(nèi)向或害怕說錯了不好意思等緣故，在受訪過程中問一句答一句，比較容易冷場。答案的價值也比較低，例如：“對，是的”、“還行吧”、“沒啥感覺啊”、“反正就這樣用用吧”、“說不上來”。
這種情況下要嘗試緩解下氛圍壓力，換個形式溝通：“就是隨便聊聊，公司派我們來呢，就是因為非常關(guān)注用戶的使用感受，想收集一波用戶反饋與建議，您有啥不滿意的地方都可以跟我講講，越多越好?！?
其次我們在提問的時候也要帶有引導(dǎo)性，例如：“還有呢、然后呢、具體說說呢”，如果對方實在說不出所以然，最有效的辦法就是進入上機操作環(huán)節(jié)，通常操作過程中那些問題也會隨之暴露出來。
專業(yè)型的受訪者一般是老板或者店長、經(jīng)理崗位的員工，他們對于產(chǎn)品或整個門店乃至行業(yè)都了解得比較透徹。
和這樣的受訪者溝通，不僅是局限于產(chǎn)品的一些問題挖掘，他們會從這個行業(yè)的角度闡述一些個人的見解觀點，給我們提供一些有價值的優(yōu)化方案或者改進方向。
例如餐飲的老板其實并不是很關(guān)心點餐、結(jié)算的流程有多么的順暢高效，畢竟他們不需要親自去做這些執(zhí)行，而且坦率的說，對于絕大部分產(chǎn)品而言，好用并不能成為其核心競爭力。
他們關(guān)心的是如何帶來更大的商業(yè)價值，類似于如何提升坪效，如何提升門店會員的儲值能力等等。而這些老板的關(guān)注點，也會給我們未來的產(chǎn)品優(yōu)化方向打開新的思路，去思考如何給我們的用戶創(chuàng)造更高的商業(yè)價值。
我們在做訪談之前，首先一定要熟悉產(chǎn)品業(yè)務(wù)的相關(guān)背景、受訪商戶的基本情況。
訪談過程中可能會提及一些專業(yè)名詞，例如餐前餐后模式、明檔、一魚多吃、坪效、估清等等。我們具備了這些基礎(chǔ)相關(guān)知識以后，省去了不必要的解釋環(huán)節(jié)，可以使訪談推進地更順利。
其次建議要了解下行業(yè)相關(guān)的基礎(chǔ)知識。尤其是餐飲業(yè)態(tài)，華南、北方、四川等地都因為飲食習(xí)慣的不同，在產(chǎn)品的功能和使用上的需求也是相差很大。具備了這些知識點以后，在提問過程中，也更利于提出一些深刻的問題，而不是浮于表面的提問。
行業(yè)相關(guān)的分析報告，可以去艾瑞、36氪、發(fā)現(xiàn)報告等網(wǎng)站進行查詢收集，在此不做贅述。
在訪談初期，需要準備一份訪談框架，但并不意味著我們整個過程只能按提綱來提問。尤其是B端這種千載難逢的訪談機會，只按規(guī)定的框架提問屬實是太吃虧了。所以在時間允許的情況下，除了框架以內(nèi)的問題，盡可能多發(fā)散地去提問。
例如餐飲業(yè)態(tài)，會有各種不同載體的終端設(shè)備聯(lián)動使用，一體機POS、手持的POS、廚房KDS、廚顯大屏、各類打印機等等都可以順便了解、調(diào)研下，讓我們對于全鏈路的協(xié)作流程也會有更深刻的認知。
再例如后廚會涉及到KDS大屏顯示，可以問問目前的大屏顯示是否夠清晰（字夠大），也可以和負責(zé)海鮮稱重的工作人員聊聊，海鮮的售賣、計價流程，以及菜品雙單位（例如：1【條】魚，重量1【公斤】）的使用等等。
在溝通過程中，一定會有一些觸類旁通的收獲與問題被發(fā)現(xiàn)。這些問題也許來自一個模塊、或者某個特定角色，又或者是主產(chǎn)品關(guān)聯(lián)的其他后臺產(chǎn)品。
在提問的時候要考慮到受訪者的年紀和理解能力，如果措辭過于專業(yè)，可能會導(dǎo)致受訪者理解不到位，因此溝通的過程中要盡可能的說大白話。
我們都知道沒有經(jīng)歷過的事，很難感同身受。有時候看到客戶群里，因為產(chǎn)品的各種原因?qū)е律虘羟榫w激動，我們理智上非常理解，但是情感上很難共鳴。
因此每次的門店調(diào)研，我都會抓住機會觀察整個門店的運營情況，去感受那種忙碌的氛圍。
有時候開始進入營業(yè)高峰期，機器出現(xiàn)卡頓或者外賣不接單等情況時，自己的情緒都會一下子緊張起來，也能夠深刻感受到產(chǎn)品給客戶帶來的困擾。
當(dāng)再次有產(chǎn)品迭代優(yōu)化時，這些體驗總能讓自己能更容易代入用戶的角度思考問題。
除了去體會產(chǎn)品對情緒的直接影響，還可以關(guān)注下整個門店的布局、收銀產(chǎn)品的數(shù)量與擺放位置、不同產(chǎn)品的協(xié)同使用等等。
這些都會幫助我們發(fā)現(xiàn)，到底什么是門店運營環(huán)節(jié)里最重要的模塊。
在訪談過程中，不排除受訪客戶會反饋一些暫時無法解決的問題。這時候一定要告訴受訪商戶：“您的問題我已經(jīng)記錄下來，回去會針對這個問題反饋上報，最遲X天我會讓顧問給您回復(fù)的”。
這么做一方面也是細節(jié)處維護公司品牌的整體售后體驗，其次也有助于我們再次回訪時，受訪商戶樂意花時間跟我們聊。
了解了用戶訪談的一些基本信息和注意點以后，到了本文核心部分，關(guān)于整個訪談的推進過程，一共分為3個階段。
1）訪談的3種類型
首先明確訪談的類型，用戶訪談的類型主要分為以下三種，最常見的就是第三種類產(chǎn)品使用回訪。
①新品場景調(diào)研新品調(diào)研的訪談，一般是由于業(yè)務(wù)的發(fā)展，可能需要升級或者打磨一款新產(chǎn)品來滿足市場的需求。
在訪談的過程中，我們需要關(guān)注的點就是用戶畫像、商戶訴求、使用場景、終端載體等一系列因素。
②潛在商戶拜訪當(dāng)去往一個城市進行批量客戶調(diào)研的時候，偶爾會有拜訪潛在客戶的調(diào)研機會。這種類型訪問的關(guān)注點集中在商戶的痛點與需求上。
由于是潛在客戶，我們勢必是要了解他們想要購買或者替換產(chǎn)品的前因后果。也是借此機會了解到競對的優(yōu)劣勢，他們放棄競對的原因，以及我們當(dāng)前產(chǎn)品的功能是否滿足客戶的需求，還有哪些點不滿足，客戶重點關(guān)注的是什么。
③產(chǎn)品使用回訪
使用回訪是最常見的訪問類型，主要目的是對商戶進行售后維護、提升使用體驗。
且由于B端產(chǎn)品的復(fù)雜性和遠距離特點，以及新功能同步給商戶存在的滯后性，公司會安排定期的上門回訪。如果有這樣的機會，UED一定要盡量申請跟著去門店調(diào)研。2）問題設(shè)計3步走
到了最關(guān)鍵的一步，就是關(guān)于訪談的問題設(shè)計。
總結(jié)一下，問題的設(shè)計渠道來源主要有3種。主要還是根據(jù)調(diào)研目標進行問題設(shè)計，另外兩種方式，作為輔助。
那具體問題應(yīng)該怎么設(shè)計，這邊我們分為3個步驟，從面到點依次拆解進行問題設(shè)計。
第一步：了解產(chǎn)品全場景能力
B端產(chǎn)品的特點可以借用《U一點料》的9個字概括，“多場景、全鏈路、多角色”，所以設(shè)計問題前，我們可以從場景+鏈路+角色/節(jié)點功能的維度來設(shè)計問題。
以餐飲行業(yè)的產(chǎn)品舉例，首先建議了解自家產(chǎn)品的全場景業(yè)務(wù)能力。
即從商家端到消費端會經(jīng)歷的產(chǎn)品模塊和具備的現(xiàn)有功能，做到心中有數(shù)即可，畢竟不會一下子調(diào)研這么多模塊和功能。
第二步：確定要調(diào)研的流程主線
其他ToB產(chǎn)品同理，可根據(jù)某個操作鏈路為主線，確定主流程后進行問題設(shè)計。其實就可以理解為確定調(diào)研的目標。例如下圖要調(diào)研的主流程，就是提取點餐>下單>結(jié)算為主線。
第三步：關(guān)鍵節(jié)點問題展開設(shè)計
根據(jù)剛才確定的主流程，我們找到所有關(guān)鍵節(jié)點進行問題框架設(shè)計。
以上3個步驟可以理解為，如何在功能極其復(fù)雜的B類產(chǎn)品當(dāng)中，篩選出與訪談目標緊密相連的功能鏈路。避免我們的訪談提綱做的過于冗余沒有核心。
3）2種提前準備工作
①提前告知
這點也非常重要，每一次去門店調(diào)研之前，先由當(dāng)?shù)刎撠?zé)的顧問與受訪商戶提前溝通。
一方面是需要與對方預(yù)約時間，另外一方面這種訪談對商戶而言就相當(dāng)于優(yōu)質(zhì)的售后服務(wù)，會有受訪商戶提前列框架，準備問題。
那么這種情況更有利于調(diào)研，因為受訪者明確自己的問題點在哪里，就等著調(diào)研團隊（售后團隊）來門店后，好好拉扯一番。
②準備材料與設(shè)備
萬事具備，只欠東風(fēng)。我們再盤點確認下本次訪談的各類工具是否備齊，準備進入訪談階段，大致需要準備的東西是以下4種材料工具。
在了解了受訪者類型、采訪者需要注意的點，以及帶著我們設(shè)計好的問題，下面正式進入訪談階段。
1）開場白
到達門店后，我們的顧問會給受訪客戶做一下來訪成員介紹，并講明此次到店的目的。一般都是產(chǎn)品使用回訪，或者新功能推薦培訓(xùn)。
通常來說，受訪商戶對來訪團隊總是有很多”心里話“想嘮一嘮，因此暖場氛圍比較容易起來，也有助于我們接下來的溝通。
2）訪談中
進入正題以后，我們會先大致了解下受訪者最近使用的體驗以及遇到的問題，而后會根據(jù)問題框架進行提問。在整個過程中也需要注意觀察用戶在描述問題時候的表情和肢體語言，搜集用戶對于產(chǎn)品的真實態(tài)度。
其實整個訪談流程我們歸納一下，需要關(guān)注的就是四個關(guān)鍵點，手+口+心+顏。
①手-實操演示
關(guān)于實操演示放在第一個講，是因為這個環(huán)節(jié)非常重要。線下訪談時強烈不建議“脫機訪問”，這種形式對受訪者而言需要花更多的時間去思考問題的答案。
會遺忘甚至想不起來當(dāng)時的具體情況，隨便的敷衍回答“嗯，還行”、“挺好的”，或者干脆彼此都不在一個頻道上。
其次，在操作過程中，建議用手機進行拍攝記錄。因為每個人對產(chǎn)品的理解方式與程度不同，在用戶操作的過程中，會發(fā)現(xiàn)一些有意思的代償方案。這些也是思考的切入點。代償方案是否比原先設(shè)定的實現(xiàn)方法更便捷。
回去通過視頻仔細分析受訪者的操作路徑，以及每個操作之前是否有遲疑等等。并且將問題點一一記錄下來。
②口-問具體操作
這個就是根據(jù)問題框架進行提問。在這個過程中，通常會穿插著上機操作演示，在現(xiàn)場記錄的時候可以先記錄個大概，等結(jié)束后再仔細整理。
③心-問心里感受
問受訪者的心理感受，其實就比較偏主觀了，我們可以從“我們家的產(chǎn)品”和“人家的產(chǎn)品”兩個維度去對比詢問心里感受。值得注意的是，即使是這樣開放式的提問，也有提問技巧。
比如“你覺得現(xiàn)在還有什么不好用的地方”就比“你感覺現(xiàn)在的產(chǎn)品好用么”這樣的提問方式更有效。
因為產(chǎn)品一定是有可有優(yōu)化的空間，“有什么不好用的地方”這樣提問的方式就是具體到了某個點上面，具體什么點不好用。
而后者的提問方式是基于整個產(chǎn)品，受訪者可能會出于不好意思等原因直接說“你們的東西還行吧，還可以”。
④顏-關(guān)注動作表情
當(dāng)我們提問產(chǎn)品優(yōu)缺點的時候，受訪者大部分都會帶上表情和肢體語言，并且情緒表現(xiàn)和性格有比較大的關(guān)系。
性格比較雷厲風(fēng)行、急躁一點的，通常會像連珠炮一樣瘋狂輸出，并且措辭會比較極端。例如：“真的太難用了”、“太麻煩了”、“嚴重影響門店營業(yè)了啊”。
接受到這種信息我們首先要做的就是安撫對方的情緒，其次對于這些信息要學(xué)會剔除一些夸張描述。
而性格溫和一點的受訪者，在闡述問題的時候也會比較婉轉(zhuǎn)?！安皇翘奖恪?、“這個改動沒啥感覺”、“也還行、都可以”，如果某個高頻操作真的很影響日常工作效率，往往會表現(xiàn)得很無奈，甚至還有點委屈。
那么無論是哪種表現(xiàn)，其實都要考驗采訪者的經(jīng)驗，結(jié)合產(chǎn)品的功能去考慮，找到反饋中真實有效的部分。
通過以上4個環(huán)節(jié)，其實就可以收集到很多有用的信息，語言信息、視頻信息、動作表情信息等等。接下來的任務(wù)就是信息的梳理歸納。
3）結(jié)束語
訪談結(jié)束后，我們需要做個簡單的總結(jié)回顧。將關(guān)鍵問題再次復(fù)述確認，進行查漏補缺并且再次感謝受訪者，表達他們今天提的建議價值很大，后續(xù)會梳理出可落地的點優(yōu)化到產(chǎn)品當(dāng)中。
如果說聊得比較開心，大多數(shù)的受訪商戶都會邀請來訪團隊吃個飯再走，也算是額外的福利。在就餐過程中的非正式場合交流，也可以聊聊門店的一些運營情況等等，幫助我們更深入的了解這個行業(yè)。
1）資料梳理
我們在訪談過程中會有大量未整理的一手記錄，結(jié)束后需盡快地梳理，盡可能詳細地記錄下用戶描述的細節(jié)、肢體動作表情語言等等。建議使用石墨、語雀、騰訊文檔等在線編輯工具，方便分享修改。
如果是連續(xù)訪談幾位商戶，我會在訪談結(jié)束以后，迅速地將剛才的訪談內(nèi)容整理出一份原始資料。并羅列出一些受訪者反饋但訪談提綱里沒有的問題，去下一家受訪商戶的時候可以驗證下該問題的普遍性。
2）整理落地
輸出后我們需要再次進行提煉，將有價值可落地的問題點提取出來，進行匯報分享，并找到相對應(yīng)的產(chǎn)品研發(fā)進行探討排期，這樣就形成了一個完整的閉環(huán)，真正做到了發(fā)現(xiàn)問題、解決問題。
3）流程概括
前文絮絮叨叨說了很多，其實關(guān)于用戶訪談這事用6個字就可以概括，簡單理解：
問誰？問啥？答啥？改啥？
能夠回答清楚這4個問題，那么這就是一次有價值的訪談經(jīng)歷。
ToB業(yè)務(wù)的特點就是會有一定的行業(yè)壁壘，設(shè)計師在剛接觸的時候一定會有很多茫然時刻。對于各種專業(yè)詞匯的一臉懵，對于行業(yè)的不了解。
或者很多人對于B端的認知還停留在，B端好像沒啥好設(shè)計的，都是現(xiàn)成的組件庫拖一拖，成就感比C端差遠了。
那么做訪談、體驗優(yōu)化的意義是什么呢？
作者：B端設(shè)計情報局
來源：人人都是產(chǎn)品經(jīng)理
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
本文介紹了一個案例研究，是作者在一家擁有 60 多年歷史的產(chǎn)品導(dǎo)向型公司中實施服務(wù)設(shè)計的旅程，本文將著重介紹如何在大型國際數(shù)字支付技術(shù)組織 IDPTO（化名）中建立服務(wù)設(shè)計創(chuàng)新中心。這份經(jīng)驗希望傳遞到每一個正在用服務(wù)設(shè)計影響公司內(nèi)外部的朋友們。
在擁有 25 年的設(shè)計實踐經(jīng)驗后，我收到了一份具有挑戰(zhàn)性的邀請，成為一家全球性公司的執(zhí)行董事，并通過設(shè)計領(lǐng)導(dǎo)其轉(zhuǎn)型。選擇巴西是因為它負責(zé)拉丁美洲 75% 的支付交易。該公司已經(jīng)針對該市場實施了加速增長計劃，因為他們認為這是正確的創(chuàng)新計劃的測試市場。在六個月的時間里，我從自己的服務(wù)設(shè)計咨詢公司轉(zhuǎn)行到 IDTPO。
在那段時間里，我有機會參觀了該公司位于美國的公司總部。這種面對面的互動對我來說至關(guān)重要：
2016 年 3 月，在圣保羅，我開始了為期三個月的組織問題診斷，以及另外三個月的定義問題階段。然后，我正式開始確定公司的痛點、局限性和全球領(lǐng)導(dǎo)層的戰(zhàn)略目標。我參與了公司接下來一年、三年和五年周期的整個戰(zhàn)略定義。
自過渡過程開始以來，我一直致力于競爭對手研究并繪制生態(tài)系統(tǒng)地圖。我還收集了有關(guān)公司直接面向消費者市場和幾項趨勢研究的可靠材料。在第二個月，我向領(lǐng)導(dǎo)層提交了一份戰(zhàn)略計劃，其中包括我們將如何工作的大綱，該計劃基于三個層面的行動：戰(zhàn)略、戰(zhàn)術(shù)和行動。
組織診斷的結(jié)論是，該公司已經(jīng)在對設(shè)計原則的基本理解和應(yīng)用的基礎(chǔ)上致力于以技術(shù)為中心的創(chuàng)新。
根據(jù)設(shè)計階梯 1，我確定該公司處于“界面設(shè)計”階段。如下所示，除了更改其圖形表示之外，我還修改了該工具并添加了另一個“設(shè)計作為文化”步驟。這是對上述模式的重要升級，更符合當(dāng)前的創(chuàng)新戰(zhàn)略。
這一步（第4階梯）很重要，因為這是在組織中實施設(shè)計策略時的最終部分，即通過設(shè)計優(yōu)化組織使其成為組織文化的步驟。
在我看來，“設(shè)計作為文化”分為三個層次：
我提出的戰(zhàn)略計劃包括兩個三年一次的周期性循環(huán)策略和相關(guān)的年度目標。第一個周期側(cè)重于通過開發(fā)獨特的創(chuàng)新流程來整合組織內(nèi)的設(shè)計。
第二個周期側(cè)重于發(fā)展組織的能力，以從“設(shè)計作為過程”過渡到“設(shè)計作為戰(zhàn)略”。在最初執(zhí)行的六年后，我們將能夠衡量組織中以設(shè)計為主導(dǎo)的變革的進展和收益。
評估指標后，我們將能夠繼續(xù)下一步（即“設(shè)計作為文化”）。
第一個周期從為組織的創(chuàng)新中心定義五項創(chuàng)新原則開始。這些原則已經(jīng)與組織的領(lǐng)導(dǎo)團隊共同制定。
這不僅改變了交付方法，還引發(fā)了大膽的組織轉(zhuǎn)型，因為它改變了組織過去工作的范式。
甚至在創(chuàng)新中心正式啟動之前，我們就嘗試了兩種開發(fā)形式來解決問題。第一個是用經(jīng)典五天設(shè)計沖刺模型幫助一家重要地區(qū)性銀行。第二個是為電子商務(wù)平臺開發(fā)聊天機器人。最后一個解決方案經(jīng)歷了一個更長的七周時間，使我們能夠測試初創(chuàng)公司的融入，以幫助我們采用開放式創(chuàng)新方法。
在這個周期的第一年，三點很重要：
這就是為什么我選擇服務(wù)設(shè)計作為創(chuàng)新過程的基礎(chǔ)，同時參考了 Richard Buchanan 教授的工作。如圖 3所示，過去 20 年是從基于人工制品的物質(zhì)性的實踐到為解決復(fù)雜問題而開發(fā)的“非物質(zhì)解決方案”的設(shè)計思維轉(zhuǎn)變的時刻。
我們的經(jīng)濟現(xiàn)在建立在象征價值的交換之上。經(jīng)驗決定了每個人在這種交換中投入的價值。在過去的二十年里，我們看到了一系列新公司的出現(xiàn)，例如 Uber 或 Airbnb，它們誕生于數(shù)字環(huán)境中，專注于我們所說的體驗經(jīng)濟 。
因此，服務(wù)設(shè)計和交互設(shè)計等主題近年來受到關(guān)注，因為它們是這種新經(jīng)濟發(fā)展的基礎(chǔ)。僅六個月后，我們就協(xié)助五家金融科技公司將 IDPTO 技術(shù)應(yīng)用于他們的流程。之后，其中三家金融科技公司能夠開發(fā)出現(xiàn)成的市場解決方案。在第 1 年末，我們向整個組織展示了流程（圖 4）。
該活動在公司的美國總部舉行并引起了很多關(guān)注，因為在一年內(nèi)我們有項目要展示、成功指標和接下來兩年的路線圖。
創(chuàng)新過程不一定是線性的。該過程以簡報會（與不同利益相關(guān)者的協(xié)作研討會）開始，以最終確定和實施的解決方案結(jié)束。
到第 3 年末，我們超越了指標，贏得了獎項，并開始為公司的第二個創(chuàng)新周期做好準備——在戰(zhàn)略層面采用設(shè)計。創(chuàng)新中心戰(zhàn)略的一部分是將其工作方法擴展到整個拉丁美洲地區(qū)。2018年，我們對區(qū)域團隊進行了培訓(xùn)，并準備了文件，包括經(jīng)驗、教材、方法和工具。其他一些地區(qū)也采用了部分方式，例如美國和亞洲的加速計劃以及歐洲和亞洲的服務(wù)設(shè)計。盡管如此，還是存在挑戰(zhàn)：創(chuàng)新中心位于組織的產(chǎn)品領(lǐng)域內(nèi)。
在第一個周期的最后一年，由于全球項目和獎項，我在內(nèi)部和外部獲得了很多知名度之后，我與全球首席產(chǎn)品官討論了：
次年，他決定將該領(lǐng)域的名稱從“產(chǎn)品”改為“解決方案”。
在業(yè)務(wù)加速數(shù)字化的背景下，成功的戰(zhàn)略規(guī)劃為城市交通、公共交通、即時支付、新支付技術(shù)和新信息交易技術(shù)等領(lǐng)域的項目設(shè)定了總體目標。
我們有幾個項目要管理，我們需要使用對公司文化產(chǎn)生重大影響的項目管理方法。實施了新的高管培訓(xùn)課程。加大投資力度，竣工項目穩(wěn)步增長。
設(shè)計現(xiàn)在是公司戰(zhàn)略的一部分。設(shè)計已成為開發(fā)新服務(wù)和新技術(shù)的戰(zhàn)略決策的主要因素。
以下是我領(lǐng)導(dǎo)下的兩個創(chuàng)新周期后的一些數(shù)字：
這篇文章無疑是給了我們在自己的組織中運用服務(wù)設(shè)計的一針強心劑，讓我們有更多的自信去運用服務(wù)設(shè)計和影響組織，我們要相信服務(wù)設(shè)計方法論帶來的作用，相信其本身有強大的能力。
記得之前做項目的時候，小伙伴有說過一句：之所以可以反復(fù)成功，其實是方法論本身的能力，而我們更多的是在運用罷了。希望大家以此共勉。
作者：陳昱志Yeutz
來源：人人都是產(chǎn)品經(jīng)理
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
很多情況下，用戶選擇一個產(chǎn)品的理由是有沒有某個功能，但棄用的理由卻常是產(chǎn)品好不好用。能否打造優(yōu)質(zhì)的B端用戶體驗，成了影響B(tài)端產(chǎn)品用戶續(xù)約的一個關(guān)鍵因素。
(1）流程越短越好。 我們在上班、逛街的時候，傾向選擇一條最短的路線，希望用最少的時間到達目的地。用戶操作系統(tǒng)時也希望這樣。
(2）整合功能場景。 某個功能由誰、在什么場景下操作，以及可能會遇到什么問題、需要什么關(guān)聯(lián)功能來解決，如果功能點相互獨立， 關(guān)聯(lián)很少，會讓用戶用起來很不順手，有種斷層的感覺。
（3）有效指導(dǎo)異常。Saas 有一個特點是功能模塊間會盡可能相互獨立，基礎(chǔ)數(shù)據(jù)的設(shè)置和業(yè)務(wù)上面的使用往往是在不同的功能模塊內(nèi)。這會導(dǎo)致B端用戶在遇到空數(shù)據(jù)的情況下， 可能不知道該怎么操作。這時，需要要提示用戶按具體步驟操作來順利完成任務(wù)。
交互體驗，對上承接了業(yè)務(wù)，對下承接了視覺。好的交互體驗?zāi)茏寴I(yè)務(wù)流程簡捷，更關(guān)注用戶習(xí)慣。 B端產(chǎn)品的交互和C端產(chǎn)品差異較大，C端常用的移動客戶端屏幕小，可顯示的內(nèi)容較少，需要不停地跳轉(zhuǎn)完成操作，但B端產(chǎn)品大多用電腦來操作，一頁可顯示的內(nèi)容較多。所以做B端產(chǎn)品交互一般需要注意下面幾點：
(1）少跳轉(zhuǎn)。曾有用戶反饋，說某個功能操作流程太長了，操作起來很麻煩。通過走查發(fā)現(xiàn)流程其實是沒有問題的，不能再縮減流程了。通過可用性測試發(fā)現(xiàn)是因為跳轉(zhuǎn)頁面導(dǎo)致，用戶在操作時去了另一個界面，然后再返回來，讓用戶在操作時感覺流程更長。于是就把頁面跳轉(zhuǎn)優(yōu)化成了彈窗，彈窗里面操作完點擊關(guān)閉即可， 改后用戶覺得流程縮短了，操作效率更高了。
B 端產(chǎn)品能用彈窗的時候，不要跳轉(zhuǎn)，哪怕彈窗里面加彈窗，只要不跳出這個頁面，用戶都會覺得沒有阻斷他的操作。雖然，從交互的角度講，彈窗里再加彈窗不符合規(guī)范，但在實用性面前是可以商榷的。
(2）少彈窗。 相比彈窗，在某些場景下，有更好的處理方式。比如，直接放頁面上。 彈窗是點擊按鈕觸發(fā)的，自動完成操作后關(guān)閉，或者用戶手動關(guān)閉。雖然比跳轉(zhuǎn)好，但比不上在頁面上直接呈現(xiàn)高效。
頁面上直接呈現(xiàn)是理想狀態(tài)。但是往往因為內(nèi)容太多，很多時候不得不隱藏起來。直接呈現(xiàn)對于頁面的布局和設(shè)計都有極高的要求，原則是高頻且重點的內(nèi)容外露。
（3）交互形式統(tǒng)一。 整個系統(tǒng)里面的交互規(guī)則要保持一致，大到彈窗的出現(xiàn)形式是居中彈出還是右側(cè)滑出，小到多選控件是不是一致。 在整個系統(tǒng)里面相同的業(yè)務(wù)都用同一個控件。雖然可能由于一些業(yè)務(wù)的特殊性， 需要對控件做個性化處理，但不要影響整體的一致性。
(1）信息清晰。 信息清晰不僅指信息結(jié)構(gòu)的層次，還包括頁面的內(nèi)容，最好讓用戶一眼就能看到上面寫了什么，有什么功能。有些設(shè)計師不喜歡加黑、大、粗的字， 覺得不夠高級，而是根據(jù)自己的美感把字體設(shè)計為一些個性化字體，且字號不大。
很多時候B端用戶的操作時間比C端用戶長，他們需要長時間盯著頁面，所以頁面信息清晰就能減少他們的疲勞。
(2）信息緊湊。 當(dāng)頁面上想要呈現(xiàn)的內(nèi)容較多時，設(shè)計師一定要壓縮空間，使布局合理緊湊。
(3）少用圖標。 有時候，設(shè)計師會使用圖標來代替文字表達，并花大精力設(shè)計很好看的圖標。圖標的應(yīng)用在C端產(chǎn)品中非常常見，一是為了節(jié)省空間，二是為了美觀。但在B端產(chǎn)品中，大多數(shù)情況下，圖標越少越好，有時文字的簡寫比圖標來得直觀易懂。圖標過多用戶需要使用很多遍才能記住每個按鈕的含義。
B端產(chǎn)品設(shè)計需要非常重視用戶體驗。這直接影響到用戶的工作效率，轉(zhuǎn)而影響到軟件的續(xù)約率。 為打造好的用戶體驗，我們通常從業(yè)務(wù)層面、交互層面、視覺層面來著手提升用戶體驗。 很多時候，有些好的交互方案會受到技術(shù)框架的限制，導(dǎo)致方案無法實施。
但是為了產(chǎn)品獲得更好的用戶體驗，首要考慮的依然是用戶的使用流暢度、易用性，而不是實現(xiàn)的復(fù)雜程度、系統(tǒng)現(xiàn)有框架的限制、現(xiàn)有規(guī)范的標準。 系統(tǒng)上的難點應(yīng)當(dāng)留給內(nèi)部去解決，把最大的便利性留給用戶。這樣我們才能獲得更好的產(chǎn)品口碑、更高的續(xù)約率、更大的市場。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
在B端產(chǎn)品設(shè)計中，理解并設(shè)計好流程，對產(chǎn)品的體驗非常重要。通常涉及到有三個方面的流程：業(yè)務(wù)流程、審批流程、操作流程。
在企業(yè)的日常經(jīng)營中，為了對業(yè)務(wù)過程進行更好的管理，企業(yè)會梳理出一系列流程、規(guī)范以及作業(yè)標準。流程化能夠幫助企業(yè)各崗位的員工更好地分工合作，使企業(yè)效率更高。對于 B端產(chǎn)品，設(shè)計師首先要讀懂業(yè)務(wù)流程，然后才能設(shè)計好產(chǎn)品。 業(yè)務(wù)流程，是指為達到特定的業(yè)務(wù)目標而由不同的人分工合作完成的一系列活動?；顒又g不僅有嚴格的先后順序限定，而且活動的內(nèi)容、方式、責(zé)任等也都必須有明確的安排和界定，以使不同活動在不同崗位角色之間進行流轉(zhuǎn)交接。
下圖是某企業(yè)的采購流程，涉及了五個部門、多個崗位角色、多個業(yè)務(wù)活動。
業(yè)務(wù)流程大多是企業(yè)根據(jù)業(yè)務(wù)特征、自身經(jīng)營特點以及資源配置情況而制定的，在業(yè)務(wù)上具有一定的通用性，但在具體應(yīng)用上又充滿了企業(yè)的個性。業(yè)務(wù)流程和單據(jù)是經(jīng)典搭檔，可以說“流程 + 單據(jù)=業(yè)務(wù)”， 每個環(huán)節(jié)的工作形成一張單據(jù)，記錄著時間、地點、參與人、業(yè)務(wù)狀況。當(dāng)這個環(huán)站的工作完成后，進入到下一個環(huán)節(jié)的工作時，單據(jù)也會隨之流轉(zhuǎn)到下一個系統(tǒng)中對應(yīng)的功能節(jié)點，并形成一張新的單據(jù)，記錄新的信息。
下圖是某企業(yè)采購流程中從采購到結(jié)算部分涉及的單據(jù)：
除讀懂業(yè)務(wù)流程外，我們還需要應(yīng)用“場景驅(qū)動的設(shè)計”方法，整理出每個環(huán)節(jié)中涉及的用戶、場景，以及作業(yè)的特征，并大膽地通過設(shè)計來改造流程，最后通過設(shè)計減少人員工作量，減少流程中的多余環(huán)帶， 提升企業(yè)效率。這樣才能設(shè)計出對客戶有價值、用戶體驗好的產(chǎn)品。企業(yè)的收貨流程，要經(jīng)過到貨簽收、質(zhì)檢、 收貨入庫等過程，每個環(huán)節(jié)都會有諸多問題。下面是梳理了某企業(yè)收貨流程的簡易體驗地圖：
經(jīng)過對場景和可行性分析后，設(shè)計了一套新的業(yè)務(wù)流程。流程簡化為貨車司機直接將貨物送入指定倉庫的電子圍欄，并全自動質(zhì)檢、入庫，大幅降低了人工成本并提升了工作效率。這一步通常是產(chǎn)品經(jīng)理去完成，作為用戶體驗設(shè)計師在調(diào)研的過程中發(fā)現(xiàn)有好的流程優(yōu)化方法，或者看到好的競品值得參考，可以和產(chǎn)品經(jīng)理溝通一起推動產(chǎn)品業(yè)務(wù)流程用戶體驗的提升。
在企業(yè)中，出于對重點業(yè)務(wù)的管理需求，除了會制定固定的業(yè)務(wù)流程方便大家協(xié)作，還會對業(yè)務(wù)關(guān)鍵節(jié)點做審批。簡單的審批只需要在流程進行到關(guān)鍵節(jié)點時，將重要結(jié)果發(fā)給相應(yīng)業(yè)務(wù)管理者審批。但是，由于一些企業(yè)組織機構(gòu)復(fù)雜，管理嚴格，為了保證業(yè)務(wù)的合規(guī)與安全，需要多個角色、多個環(huán)節(jié)的審批，這個流程即是審批流程。
（1）首先員工提交需要審批的材料（系統(tǒng)中是提交單據(jù))。
(2）各環(huán)節(jié)審批者會根據(jù)流程分別對材料進行審批。
(3）審批通過后會自動進行到下一步。
(4）審批不通過，就此流程結(jié)束。
(5）退回則打回到流程起點，待改進后重新走流程。
(6）審批都通過后，審批流程結(jié)束。
在實際應(yīng)用中，可能會有非常復(fù)雜的流程與功能。比如除常規(guī)的審批通過、不通過、退回功能外，還會有改派、加簽、抄送等。
(1）改派：當(dāng)前審批人將審批材料轉(zhuǎn)給其他人。
(2）加簽：增加審批的步驟，在一些企業(yè)中還會有前加簽、后加簽。
(3）抄送：將材料同時抄送給某人或某角色。
以上只是列舉一些常用的動作，在一些大型企業(yè)或者國企，流程和功能更復(fù)雜。當(dāng)面對復(fù)雜而多變的審批需求時，需要將審批流程設(shè)計得更加靈活、自由，具有自定義功能。另外，需要將審批流程設(shè)計得更加模塊化，可以在任何一個業(yè)務(wù)環(huán)節(jié)中加入審批過程。
在審批流程的設(shè)計中， 根據(jù)企業(yè)制定的審批規(guī)則，自動判斷是否符合標準，自動審批。尤其對一些每天都在發(fā)生、經(jīng)常重復(fù)而不重要的事情，可以完全省去人工審批的過程，采用自動審批，自動觸發(fā)業(yè)務(wù)流程，以此來提高審批效率。
前面兩個流程主要基于企業(yè)業(yè)務(wù)制定，在企業(yè)沒有信息化前就已經(jīng)存在了，在改造優(yōu)化上還有一些阻力和困難。作為用戶體驗設(shè)計師，可以通過對操作流程的優(yōu)化來改進用戶體驗。
以上文中的收貨案例為例子：
（1）系統(tǒng)中收到若干個質(zhì)檢任務(wù)。
(2）逐一打印質(zhì)檢單。
（3）帶著質(zhì)檢單來到倉庫，尋找需要質(zhì)檢的貨品。
(4）找到貨品，逐箱打開進行檢查，業(yè)務(wù)操作不熟練的還需要詢問老員工。
(5） 將質(zhì)檢結(jié)果隨時記在打印出的質(zhì)檢單上。
(6） 逐一檢查完畢，回到辦公室，將信息錄入系統(tǒng)。
這個過程繁瑣，而且在操作的過程中，容易出錯。因此根據(jù)實際工作中的業(yè)務(wù)場景，對操作流程進行了優(yōu)化如下：
整個操作流程省去了“打印單據(jù)”“重復(fù)記錄單據(jù)”“詢問老員工” 的過程，并簡化了“尋找單據(jù)”的過程及記錄結(jié)果的過程。
在對操作流程的設(shè)計過程中，也應(yīng)遵循“場景驅(qū)動設(shè)計”的方法，并將物理實體、數(shù)字實體統(tǒng)一考慮，充分利用各自的特點，盡最簡化用戶的 操作流程，并降低操作的復(fù)雜度。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
一、前言
視頻播放器中承載著極其豐富的內(nèi)容畫面和播控功能，尤其是在寸土寸金的移動端視頻播放器中，為使內(nèi)容更沉浸消費，需盡可能克制界面中的功能元素/入口直接外露。基于此種場景下，合理的手勢設(shè)計不但可為界面“減負”，還可幫助用戶更快捷觸達功能、提升操控便捷性。
視頻場景中目前已有部分的常規(guī)單向手勢已被用戶廣泛接受并形成習(xí)慣認知，如「單擊 →暫?！?、「雙擊→點贊」、「長按→快進」、「橫滑→導(dǎo)航」、「縱滑→切視頻」、「雙指捏合→縮放視窗」等通用手勢。
那么如何在保留用戶對于常規(guī)通用手勢認知的基礎(chǔ)上，進一步對視頻場景中的手勢交互進行擴容升級？這也是我們接下來在手勢進階交互上的重點探索方向。
本次針對百度APP中的視頻播放器場景，為提升手勢操控效率，我們試圖將常規(guī)的基礎(chǔ)通用手勢進行打散重組、并結(jié)合實踐案例梳理出「組合手勢」設(shè)計模型，以探索如何在視頻場景中構(gòu)建便捷高效的進階手勢體驗設(shè)計。
二、什么是「組合手勢」
「組合手勢」是基于常規(guī)手勢的組合擴展，其通常由兩種或兩種以上的常規(guī)基礎(chǔ)手勢所構(gòu)成，若組合方式及使用場景得當(dāng)，可助力用戶更便捷的觸達功能。
以前述的視頻場景常規(guī)手勢為例，其觸發(fā)機制一般可分為兩個階段：step1交互信號→step2執(zhí)行任務(wù)，即用戶通過某一基礎(chǔ)手勢發(fā)出交互信號，系統(tǒng)收到信號確認后便可立即執(zhí)行任務(wù)，但整個過程是線性的，手勢擴展性十分有限且難以滿足視頻場景對于手勢擴容的訴求。
于是我們在現(xiàn)有常規(guī)手勢兩階段觸發(fā)機制的基礎(chǔ)上，嘗試引入「意圖識別」環(huán)節(jié)，并梳理出「組合手勢」的設(shè)計模型，以探索不同基礎(chǔ)手勢相互組合后的擴展可行性。
「組合手勢」觸發(fā)一般可分為三個階段：step1交互信號→step2意圖識別→step3執(zhí)行任務(wù)，前兩階段均可由對應(yīng)的基礎(chǔ)分支手勢構(gòu)成并進行組合搭配、以尋求最高效的手勢組合觸發(fā)路徑。
由于「組合手勢」并不像常規(guī)手勢那樣早已被系統(tǒng)定義為可供直接調(diào)用的接口，因此，其差異化創(chuàng)新具有較大設(shè)計靈活度，尤其需根據(jù)具體的使用場景進行綜合考量。
三、「長按組合手勢」激活快捷菜單
1.項目背景
百度APP視頻場景早期的播控功能較少，如“視頻下載”等個別特色功能入口一般都融合于基礎(chǔ)菜單之中。
隨著后續(xù)視頻場景的功能建設(shè)日漸完善，我們便在基礎(chǔ)菜單面板中拓展了一行視頻菜單，專門用于承載視頻場景特有的播控功能。但當(dāng)前播控功能已達10余項，菜單面板彈出后還需左滑才可露出后面的功能入口，因此也常收到用戶反饋找不到常用功能、菜單面板功能排布無章且觸發(fā)成本高。
2.競品調(diào)研及選型
通過對競品進行調(diào)研，我們發(fā)現(xiàn)競品均有使用長按手勢作為切入口以觸發(fā)相關(guān)播控功能、并歸納出“視頻播控觸發(fā)”目前主流的三種長按交互選型， 分別為：長按觸發(fā)獨立播控面板、長按觸發(fā)浮層播控選項、長按觸發(fā)特定播控功能。
選型A
「長按觸發(fā)獨立播控面板」：通過長按手勢可激活從屏幕底部彈出的獨立播控面板，此方案擴展性較強，但對視頻沉浸觀感體驗有一定的打斷感；
選型B
「長按觸發(fā)浮層播控選項」：通過長按手勢可觸發(fā)置于視窗上層的浮層選項入口，一定程度上可延續(xù)視頻觀看的沉浸體驗，但浮層擴展性有限；
選型C
「長按觸發(fā)特定播控功能」：通過長按手勢觸發(fā)特定的某個播控功能（如長按“快進”），一定程度上可滿足此功能的重度用戶，但對于長按手勢的使用效率較低；
3.設(shè)計方案
1）長按手勢交互擴容
針對目前視頻播控菜單存在的問題，經(jīng)過和業(yè)務(wù)對上述三種長按交互選型方案進行綜合考量，最終決定聚焦于以方案“選型B”的「長按觸發(fā)浮層播控選項」作為設(shè)計切入點。我們意圖將部分高頻播控功能從基礎(chǔ)菜單中拿出進行前置，并探索一套更便捷的觸發(fā)機制，以此對視頻場景中的播控菜單進行設(shè)計升級。
但隨之而來的難點是我們目前播放器中的長按手勢已被“快進”功能占據(jù)，用戶對此功能的使用頻率高、并已形成較深的操控認知，若直接下線“快進”功能則會對用戶使用習(xí)慣產(chǎn)生較大影響，尤其是視頻場景的重度用戶。
那么如何在兼容用戶已有長按操作習(xí)慣的基礎(chǔ)上再拓展“快捷菜單”呢？是否有可能將“快進”和“快捷菜單”進行融合？這也是本次項目對于便捷手勢體驗的重要設(shè)計探索點。
基于此，我們決定嘗試使用「組合手勢」設(shè)計模型來對視頻播放器中的長按手勢進行重新定義，通過「長按+滑選」的機制觸發(fā)快捷菜單功能項，以縮短視頻常用功能路徑。對應(yīng)到設(shè)計模型的三個階段分別為：
step1：以“長按手勢”創(chuàng)建一個新模式，即發(fā)出交互信號并喚出浮層菜單；
step2：若用戶未松開手指，則系統(tǒng)默認開始識別用戶意圖，是否有以“拖拽手勢”滑選至目標功能項以選擇功能；
step3：用戶滑選錨定至目標功能后，松手釋放即可完成最后的功能執(zhí)行確認。
「長按+向上滑選」快捷觸發(fā)對應(yīng)功能項；
「長按+向下滑選」快捷觸發(fā)“快進”（一定程度上兼容老用戶對于此功能的使用習(xí)慣）。
2）容錯性兼容
在設(shè)定「長按+滑選」組合手勢的同時，考慮到兼容主流的長按習(xí)慣、以及對于滑選手勢需要有一定的適應(yīng)過程，我們同時也支持點選的操作模式，即用戶長按后若未產(chǎn)生滑選行為便松手，則松手后依然可通過點選的方式觸發(fā)對應(yīng)播控功能項。
3）易用性打磨
差異化的創(chuàng)新設(shè)計形式在前期總會面臨質(zhì)疑和挑戰(zhàn)，本次項目也不例外。我們擔(dān)心用戶能否接受并認知「長按+滑選」組合手勢的操作形式，于是在DEMO開發(fā)完成后便進行了一次小范圍內(nèi)的定性可用性測試，以預(yù)期在上線前可先收集一波體驗問題進行快速打磨優(yōu)化。
我們根據(jù)測試目標、用戶類別、測試前序準備及測試步驟等環(huán)節(jié)提前擬好必要的測試腳本，并邀請了10+名不同年齡段的目標用戶進行訪談測試。
測試訪談的過程中，被測用戶在進行1至2次嘗試操作之后，均可掌握如何使用「長按+滑選」的組合手勢，這也為我們增添了不少信心。
同時，我們通過觀察用戶操作行為及用戶主動反饋，發(fā)現(xiàn)仍有部分易用性細節(jié)可進一步打磨優(yōu)化。
3.1 ）擴展觸發(fā)熱區(qū)：
考慮到單手握持手機的使用場景，可盡可能擴大定義長按手勢的觸發(fā)熱區(qū)，屏幕中除頂/底bar框架區(qū)以及本身就自帶長按事件的按鈕入口之外，其它大面積區(qū)域熱區(qū)均可支持長按觸發(fā)快捷菜單，以降低觸發(fā)難度、提升易用性。
3.2 ）支持跟手觸發(fā)：
長按后浮出的快捷功能項，其浮出位置支持跟隨手指的縱向觸發(fā)位置而浮出，可減少手指在屏幕上的位移距離、操控更便捷。
3.3 ）實時提示及響應(yīng)反饋：
靈活判斷當(dāng)前手勢觸控狀態(tài)（如滑入選擇 / 松手觸發(fā)），在界面中即時給出相對應(yīng)的引導(dǎo)提示或振感反饋，以幫助用戶快速適應(yīng)新的手勢觸發(fā)機制。
方案上線及驗證
以AB實驗對本次設(shè)計方案進行定量測試驗證：
「對照組」效果：長按觸發(fā)“快進”（各播控功能入口仍歸置于基礎(chǔ)菜單面板之中）；
「實驗組」效果：長按觸發(fā)“快捷菜單”選項（支持滑選和點選模式）；
小流量實驗上線后，經(jīng)過近半個月的觀察，大盤指標穩(wěn)定、播放完成率等滿意度指標穩(wěn)步提升。
「實驗組」長按快捷菜單中的功能使用率相對「對照組」均有大幅提升，說明用戶對部分高頻功能的確有很強的快捷觸發(fā)訴求。
「實驗組」的“快進”雖多了一步觸發(fā)步長，實驗前期“快進”使用率不及「對照組」，但隨著用戶對于「長按+滑選」手勢整體的使用占比持續(xù)走高，通過滑選觸發(fā)“快進”的操作習(xí)慣也快速被培養(yǎng)起來，對于用戶來說，長按快捷菜單帶來的整體收益是大于折損的。
二期擴展方案
隨著長按快捷菜單的上線推全，長按手勢的滲透率也持續(xù)走高，用戶逐漸對視頻場景更多的播控功能有了長按觸發(fā)的訴求，于是我們對長按菜單進行了二期的設(shè)計升級，在長按浮層最右側(cè)新增“更多”快捷入口以承接視頻場景所有的播控功能，用戶通過長按后的可選播控項增多，播控功能整體的使用量得到進一步提升。
四、「組合手勢」拓展探索
手勢交互是用戶在現(xiàn)實世界行為的映射，無論是基礎(chǔ)手勢還是組合類高級手勢，都須符合用戶認知習(xí)慣、并融入具體的使用場景中進行設(shè)計。
以「組合手勢」設(shè)計模型為指導(dǎo)基礎(chǔ)、并結(jié)合具體的項目實踐，我們進一步對視頻播放器中更多功能場景進行了便捷手勢的設(shè)計擴容探索。
1.「右滑返回手勢」激活“小窗播放”
“小窗播放”旨在退出當(dāng)前視頻落地頁、并可將當(dāng)前視頻切換成以懸浮視窗的形式進行延續(xù)消費。
基于用戶的此種操控意圖，我們以“右滑返回手勢”發(fā)出交互信號而觸發(fā)浮出小窗入口，隨后系統(tǒng)根據(jù)用戶“縱向拖拽手勢”的行為來判斷其是否有激活小窗的意圖，若有短距上滑拖拽行為，松手釋放即可快捷激活視頻小窗，以提升觀看體驗的連續(xù)性。
2.「雙指手勢」激活“滿屏播放”
“雙指拖拽手勢”可拖拽并清屏視窗畫面，以此手勢發(fā)出交互信號，若在“雙指拖拽手勢”基礎(chǔ)上有識別到“雙指擴張手勢”行為，則松手釋放即可快捷激活“滿屏播放”，以滿足更沉浸視頻瀏覽體驗。
五、結(jié)語
便捷手勢的設(shè)計出發(fā)點是為提升操控效率、縮減功能觸發(fā)路徑，從而使視頻內(nèi)容更沉浸消費。希望本次基于視頻播放器場景的手勢體驗設(shè)計實踐能給大家?guī)韼椭蛦l(fā)，后續(xù)我們也將持續(xù)深耕視頻領(lǐng)域、并進一步探索更貼合用戶使用場景的手勢交互體驗。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
如今人們出行都離不開手機，都通過手機接觸過互聯(lián)網(wǎng)地圖，手機地圖憑借著可手勢直觀操作、地圖可快速迭代、信息可實時更新的優(yōu)勢，形成了成熟的地圖交互體驗。在解析手機地圖的體驗設(shè)計前，讓我們先看看地圖的發(fā)展歷程。
地圖擁有著古老的歷史，記錄了人類對世界認知的演進過程，經(jīng)歷過泥板、壁畫、羊皮、紙張等載體，依據(jù)使用和文化需要擁有著豐富多樣的美術(shù)形式。不同時期、材質(zhì)、美術(shù)形式的地圖見證人們認識世界的過程。
隨著照相機和飛機的發(fā)展，出現(xiàn)了航空攝影測量技術(shù)，讓地圖的測繪精準度達到頂峰。交通、旅游、印刷業(yè)的發(fā)展，讓紙媒地圖開始融入人們的生活，地圖的平面設(shè)計更是百花齊放，有具體也有抽象，讓地圖兼顧功能、美感、有趣。
再隨著衛(wèi)星影像、瓦片地圖技術(shù)和互聯(lián)網(wǎng)的發(fā)展，人們可以日常地使用電子地圖。受限于網(wǎng)絡(luò)速度的限制，矢量地圖應(yīng)運而生，在特定范圍顯示相應(yīng)的矢量瓦片信息，讓互聯(lián)網(wǎng)地圖的形狀趨向統(tǒng)一化。
iPhone革命性的觸屏體驗，通過手勢與地圖進行直觀自然的交互體驗，結(jié)合內(nèi)置GPS、陀螺儀傳感器，小藍點成為地圖定位的通用標志，激發(fā)更多地圖的功能和創(chuàng)意。
二、手機地圖的創(chuàng)新體驗
手機地圖繼承了互聯(lián)網(wǎng)電子地圖的可快速迭代、信息可實時更新的優(yōu)勢，結(jié)合觸屏手勢操作后，大大的提升了地圖展示信息的維度。電子地圖從工具逐步被引入到各種垂類服務(wù)和社交娛樂中，這些場景也不斷豐富和完善著地圖的信息。
手勢交互讓地圖從移動到縮放都高效地動起來，激勵人們探索更廣的區(qū)域。更革命性的是讓地圖從平面到立體之間的順滑轉(zhuǎn)換，幫助人們更好的映射到真實世界。
可視化信息是互聯(lián)網(wǎng)地圖的主要優(yōu)勢之一，將數(shù)據(jù)轉(zhuǎn)化為可視化圖形，歸類在不同的數(shù)據(jù)層，可以單個或多個層級疊加在地圖上展示，傳達位置上的數(shù)據(jù)。
底圖是手機地圖的基礎(chǔ)，通常就是地圖本身，它承托著上面的可視化信息。隨著地圖可更自由地縮放，地圖本身的內(nèi)容不斷細化和歸類，在不同的縮放層級下，展示符合用戶查看場景的核心內(nèi)容。
觸屏手勢交互有別于搖桿、鼠標、觸控筆等物理外設(shè)的控制方式，讓用戶在小小的屏幕對大范圍的地圖有更隨心所欲的操作，讓原本受矢量圖形限制的地圖有了更多層次、更豐富立面的信息呈現(xiàn)方式。
單指拖動
拖動是地圖最基本的閱讀操作，一般以用戶的定位為初始中心點，用戶可以有目的有方向地查看附近的地點。
單指劃動
當(dāng)用戶想快速翻閱時會撥走要略過的內(nèi)容，劃動模擬了這一行為。地圖被劃動后也會模擬物理世界以一定的摩擦力停下，向用戶展示地圖的新區(qū)域，是比拖動要快速的瀏覽方式。
雙指拖動縮放
物理控件只能讓地圖根據(jù)屏幕中心進行縮放，而觸屏縮放能讓地圖根據(jù)兩個指尖的中心點縮放，并同時位移，符合用戶空間操控認知。
雙指劃動縮放
劃動縮放和劃動一樣，讓用戶以更輕量的手勢加速的縮放地圖，并以一定的摩擦力減速停止，讓用戶快速找到目標位置。
單指快捷縮放
為了讓用戶能單手并可控地縮放地圖，不少地圖都設(shè)計了自己獨有的縮放方式。 zenly，通過屏幕兩側(cè)的邊緣，直接完成地圖的最大和最小縮放跨度。
snapchat拖動右側(cè)邊可緣喚起縮放滑塊，并使用emoji來表達距離，充滿幽默感。
騰訊地圖，通過劃動右側(cè)的滑塊，實現(xiàn)單手順滑地縮放，滑塊也支持劃動手勢。
百度地圖，通過點擊一個縮放控件，讓地圖以當(dāng)前中心點進行分段縮放。
無限循環(huán)的地圖
地球是圓的，可以無限巡航，一些應(yīng)用將縮到最小的世界地圖做循環(huán)處理，以呼應(yīng)地球的循環(huán)轉(zhuǎn)動體驗。
方向視角切換
在陌生的環(huán)境用戶未必能分得清楚南北方向，利用手機的陀螺儀，可以告知用戶正在面向的方向。定位按鈕的二次點擊，將地圖從南北向轉(zhuǎn)到用戶面向的方向，有助于用戶二次確認自己的定位。
更多地圖使用了2D/3D視角的切換方式，2D是南北向的標準地圖，3D是用戶面向方向的地圖，幫助用戶更直觀地對應(yīng)物理空間。
旋轉(zhuǎn)方向
可通過雙指或陀螺儀旋轉(zhuǎn)地圖，地圖上的文字也做出相應(yīng)調(diào)整，保持水平、沿道路方向調(diào)整，以保證可讀性。
3D的旋轉(zhuǎn)也一樣，在保持水平和沿道路方向的同時，文字保持垂直。
當(dāng)縮小到足夠遠時，用戶面向的方向意義就不大了，蘋果在縮小到一定范圍時，將地圖回彈保持南北向。
雙指拖動調(diào)整視角
地圖3D視角也支持自由調(diào)節(jié)，通過雙指平行的上下滑動，可以平順調(diào)整3D視圖鳥瞰的角度。
在地圖的最低視角做回彈處理，生動不呆板。
遠近也能影響鳥瞰的視角變化，視角越低越接近平視，拉進時有俯沖的感覺。
四、可視化信息：生動呈現(xiàn)地圖動態(tài)數(shù)據(jù)
從古代開始，人們就已經(jīng)懂得通過繪制山脈、河流、海洋、建筑等對重要位置信息進行標記，地圖本身就是一個信息可視化工具。 互聯(lián)網(wǎng)地圖最大的優(yōu)勢，就是能提供實時的信息數(shù)據(jù)。將數(shù)據(jù)標記在相應(yīng)位置的坐標上，并分別歸類在不同的層級，疊加在地圖上查看。
地圖的常用數(shù)據(jù)形式可大致分為：點、線、面、熱力圖等，一個地圖可同時喚起多種類型、多個圖層的信息內(nèi)容。
點數(shù)據(jù)
點數(shù)據(jù)是單個地理坐標上的標記，代表該位置上的信息，是地圖上最常用的數(shù)據(jù)信息。地圖通過不同的小圖標來區(qū)分位置類型，使用頻率越高的樣式越簡潔，地標建筑做形象化圖形標識。
聚合圖在地圖上呈現(xiàn)也是點數(shù)據(jù)，它實質(zhì)是顯示一定區(qū)域內(nèi)的信息聚合，但不強調(diào)具體的區(qū)域。聚合圖可以避免因為該區(qū)域的點數(shù)據(jù)過多，在地圖上信息過于密集。
百度的充電樁地圖就是以區(qū)域聚合充電樁數(shù)量，根據(jù)縮放調(diào)整數(shù)據(jù)的聚合。
騰訊地圖的文博地圖也是聚合圖，并根據(jù)文物的類型做了快速篩選。
線數(shù)據(jù)
線數(shù)據(jù)在地圖上呈現(xiàn)為線性，一般都沿著可行道路展示信息。導(dǎo)航路線是最常用的線數(shù)據(jù)，它提供具體行駛路線方案，并實時展示線路行駛的進度與方向。
也有粗略表示進度的線路數(shù)據(jù)，如快遞的物流進度路線就不需要具體的實際線路，只需要示意大致進程。
街景地圖則僅展示有全景圖的道路范圍，不提供進度與方向。
面數(shù)據(jù)
面數(shù)據(jù)要展示地圖上的具體區(qū)域，疫情環(huán)境下出現(xiàn)了區(qū)域風(fēng)控需求，需通過了面數(shù)據(jù)畫出區(qū)域范圍。疫情地圖采用了聚合圖、面區(qū)塊兩種數(shù)據(jù)形式。
zenly使用了反向的面數(shù)據(jù)，根據(jù)用戶的行走記錄，將用戶走過的范圍擦亮，用戶未走過的地方是一塊彩色的平面，充滿娛樂感。
熱力圖
熱力圖以特殊的高亮梯度顯示地圖上區(qū)域的熱度，熱力圖的數(shù)據(jù)不會指向地圖上具體的位置，它能呈現(xiàn)熱度變化的趨勢。百度地圖用熱力圖直觀展示地區(qū)上的擁擠程度。
高德地圖的空氣質(zhì)量地圖，使用聚合圖作為空氣質(zhì)量評分，熱力圖作為空氣質(zhì)量范圍。
snapchat使用熱力圖來表現(xiàn)該區(qū)域用戶發(fā)布動態(tài)的熱度，引導(dǎo)用戶發(fā)現(xiàn)內(nèi)容，由于熱力圖不指向具體位置，能更好的保護用戶隱私。
熱力圖并不局限于面，路線也可以反映道路的熱度。Strava利用用戶的騎行數(shù)據(jù)，生成光點線路的熱力圖，可以看出哪些是熱門的騎行線路和必經(jīng)地點。
路況也是一種線性的熱力圖，路況使用按段測量的方式，熱力值的梯度相對跳躍。
讓數(shù)據(jù)動起來
地圖是安靜的，但真實世界是忙碌的，讓數(shù)據(jù)動起來，給地圖增添更多情感化設(shè)計，緩解用戶的等待壓力。
忙碌的商家
外賣小哥端午節(jié)雨中送餐
公交努力奔來
五、底圖：為更好呈現(xiàn)信息的色彩系統(tǒng)
手機地圖的底圖最常使用矢量瓦片地圖，因為數(shù)據(jù)體積小，在互聯(lián)網(wǎng)環(huán)境下讀取速度快。矢量地圖用幾何圖形來表達區(qū)域，不展示具體細節(jié)，因此需要通過顏色去傳達不同區(qū)域的屬性或功能。
人們對于顏色和環(huán)境是能建立一定的聯(lián)想的，如綠色想到大自然，藍色想到水，紅色想到警示。根據(jù)人們對色彩的聯(lián)想，給矢量地圖中不同屬性的區(qū)域進行配色，幫助用戶理解地圖。谷歌地圖就曾經(jīng)為不同類型的信息標記出700多種顏色，最后簡化為25個顏色，形成了地圖的色彩系統(tǒng)。
工具類地圖應(yīng)用以地圖為核心基礎(chǔ)，對矢量圖形有最全面的歸類，因而擁有最豐富的配色系統(tǒng)。由于人們對區(qū)域功能的顏色聯(lián)想是相似的，各地圖廠商的標準地圖的配色都很接近。地圖用色素雅，才能讓多個顏色能和諧的同時存在，降低用戶的視覺疲勞，并能突出地圖上的信息圖層，讓用戶聚焦所關(guān)心的數(shù)據(jù)。
而一些垂直場景的應(yīng)用，地圖區(qū)域功能的描述相對次要，通常會對地圖的用色進行大幅度精簡。以打車應(yīng)用為例，地圖用色少且色調(diào)相近，突出核心的打車狀態(tài)信息顏色，同時體現(xiàn)應(yīng)用的品牌特色。
不少運用地圖的概念設(shè)計中，會更極致的使用單色系地圖，僅突出數(shù)據(jù)信息的顏色，充滿未來感。
六、未來的地圖
隨著網(wǎng)絡(luò)速度的提升，手機硬件的升級，順應(yīng)AR/VR技術(shù)的發(fā)展，地圖逐步進入3D和全真時代。蘋果地圖在現(xiàn)有的地圖的3D視圖下，已對地標建筑賦予更多細節(jié)，并在夜間模式模擬了燈光效果。
3D地圖就像是虛擬世界中的基礎(chǔ)建設(shè)一樣，蘋果地圖添加精細地標模型后，同時應(yīng)用到Carplay的導(dǎo)航中，在駕駛時可直觀看到與現(xiàn)實世界對應(yīng)的3D地標。
谷歌更是提出“沉浸式視圖”的高保真3D地圖，使用圖像還原一座城市的面貌，為瀏覽一座城市提供了幾乎真實的鳥瞰視角。
同時全真模擬日照和天氣系統(tǒng)，和現(xiàn)實一樣模擬東升西落的光線方向，模擬晚上和雨天下的城市面貌。
隨著地圖的立體全真化，地圖的數(shù)據(jù)也將向空間延伸。相對全真地圖而言，人們本身就身置真實的地圖場景中，未來借助AR設(shè)備，人們無需對照地圖即可完成導(dǎo)航。
結(jié)語
地圖歷來是人們借助藝術(shù)的手法，以極具想象力的方式對世界進行再現(xiàn)，它遵循科學(xué)測量的法則，使用幾何的線條和形狀對地球的進行抽象化。地圖反映了制作者對世界的認知，而現(xiàn)代的科學(xué)技術(shù)讓地圖呈現(xiàn)盡可能客觀。但地圖并非單純地呈現(xiàn)地球，而是呈現(xiàn)人們眼中的世界，它寄托著人們對美好生活的想象，更好的認識、探索和規(guī)劃世界。
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
其實用戶故事還是由人物故事演化而來。
傳統(tǒng)的人物故事主人公一定是一個響當(dāng)當(dāng)?shù)拿?，至少是做出了某種貢獻的，并且這類的內(nèi)容傳播目的并不在于轉(zhuǎn)化或“帶貨”，而是為了傳遞某種價值觀。
或許我們可以把傳統(tǒng)的人物故事稱為“名人傳記”。
到現(xiàn)在，越來越多的企業(yè)、品牌，甚至是個人IP都在做用戶案例故事，而這類內(nèi)容與傳統(tǒng)人物故事恰恰相反：
那么，如何讓用戶幫你的產(chǎn)品講好故事，賣得更好？接下來從三點展開說說。
以目的為導(dǎo)向，在決定做用戶故事/用戶案例分享前，首先要明確：
一般做用戶故事，我們所期望達到的效果不外乎是以下三種：
1）品牌宣傳
通過用戶故事達到品牌曝光和宣傳的效果，讓用戶知道我們的品牌、知道有這么一個產(chǎn)品。
B端產(chǎn)品，且對接客戶是比較有名的公司，會比較適合使用客戶故事來進行品牌宣傳。
比如：影刀RPA、三維家。
內(nèi)容結(jié)構(gòu)一般是某大公司使用了我們的產(chǎn)品，解決了什么問題，達到了一個怎樣的驚人效果。
2）產(chǎn)品介紹
這類產(chǎn)品的功能或許比較多，借助用戶故事來介紹產(chǎn)品及其功能的使用場景，并根據(jù)不同的用戶使用場景來給出具體的解決方案。
比如：印象筆記、訊飛智能錄音筆。
一般內(nèi)容結(jié)構(gòu)是用戶在某類場景下遇到什么難點，如何使用產(chǎn)品，達到了什么目的/收獲了什么。
3）種草營銷
如果是為了營銷，讓用戶種草某類產(chǎn)品而輸出用戶故事，那么此類故事要深究用戶的痛點和爽點，這樣才能精準打動用戶，促使用戶進行下一步的使用、購買等轉(zhuǎn)化動作。
比如：微眾銀行（理財產(chǎn)品）、人人都是產(chǎn)品經(jīng)歷（付費課程）。
值得一提的是，像小紅書的種草筆記也是很不錯的素材，但對于種草軟文來說篇幅略短，需要擴寫。
一般內(nèi)容結(jié)構(gòu)是用戶使用產(chǎn)品前后的對比、反轉(zhuǎn)，給人一種出其不意的效果，讀者看了后會覺得很爽，也想達到一樣的效果。
用戶故事的素材來源一般有以下幾個方式：
1）用戶投稿
最簡單快捷的方式就是由用戶自行撰寫，當(dāng)然如果能提前跟用戶溝通好主題、確認好內(nèi)容框架，并且用戶文筆還不錯，那自然是最好的。但這個方式對用戶的門檻還是比較高的。
如果用戶故事想要追求真實性、接地氣，這類素材是最合適的。要是真能遇到一個很不錯的故事，還可以由官方再次編輯再進行傳播。
素材收集渠道：官方自有投稿渠道、用戶外部平臺分享（如小紅書、微博、豆瓣等）。
2）征稿活動
策劃征稿活動，明確內(nèi)容主題、內(nèi)容要求，由用戶輸出，再由官方進行二次創(chuàng)作。
二次創(chuàng)作的方式一般有2種：
①一篇長文
長文形式一般是在用戶原創(chuàng)的基礎(chǔ)上（此類用戶的創(chuàng)作水平一般，文案多以流水文形式呈現(xiàn)），對排版、邏輯、結(jié)構(gòu)進行打亂重建，讓文章結(jié)構(gòu)整體更具邏輯性及可讀性，并突出產(chǎn)品優(yōu)勢，必要時可能需要加上一些“夸張手法”。
②一個專題
從大量稿件中篩選一批有相同點的精彩內(nèi)容，由官方匯總成專題，并加上官方導(dǎo)語、前言或結(jié)語等。這種形式的工作量會輕松很多，并且豐富性更強。
征稿方式：公眾號、官方社區(qū)、核心用戶群等官方自有陣地發(fā)布征稿活動。
3）征集話題
以話題形式征集用戶案例素材，官方借用相關(guān)案例進行原創(chuàng)輸出。
手段跟征稿活動的方式差不多，但活動形式較后者更輕。話題討論對用戶和運營方的壓力都不大，并且對運營方來說可創(chuàng)作的自由性更大。
形式同樣可以長文或?qū)ｎ}的結(jié)構(gòu)來呈現(xiàn)，如果是專題，只需要把比較精彩的內(nèi)容呈現(xiàn)出來即可；如果是長文，需要提煉主觀點，再結(jié)合產(chǎn)品進行小觀點的闡述。
征集方式：公眾號、官方社區(qū)、核心用戶群等官方自有陣地發(fā)布話題征集活動。
4）核心用戶采訪
這類素材是最真實、最有說服力的，但同時操作難度也是比較大的，并且還有一個隱形問題，就是你辛辛苦苦做了人物采訪，好不容易輸出了一篇自認為很優(yōu)秀的用戶故事，但讀者卻不這樣認為，各項數(shù)據(jù)可能都不會太好看。
但這類用戶故事是最適合做品牌宣傳的。因為你做了一個很高大上的東西出來，無論是掛在公司網(wǎng)站首頁，還是用來推廣產(chǎn)品，這都可以作為一個品牌的門面。
在方式上來說，可以采用問卷的形式，最終文稿還是由官方撰寫。問卷的形式最簡單便捷也是使用互聯(lián)網(wǎng)工作風(fēng)格的。
對于使用產(chǎn)品的核心用戶，他們既不會自行撰寫，也不會參與任何的話題討論，但是典型的使用用戶，那么可以根據(jù)他們對產(chǎn)品的使用習(xí)慣，提出相關(guān)的問題，以問卷或邀約訪談的方式進行了解他們對產(chǎn)品的使用感受。
對于提供案例故事的用戶，最好能由官方給與一定的獎勵，哪怕是由用戶自發(fā)輸出的內(nèi)容，也應(yīng)當(dāng)給與一定的回應(yīng)，會顯得品牌方更有人情味。
當(dāng)然獎勵不一定非要實物獎勵或金錢獎勵，有時候一個肯定或感謝也能讓用戶感到很暖心。
一般回饋用戶不過就是“老四樣”：
1）金錢獎勵
根據(jù)用戶參與的程度、提供素材的豐富度、故事的完整度等設(shè)定不同等級的金錢獎勵標準。
2）物質(zhì)獎勵
對于參與的用戶，可以獎勵一些產(chǎn)品周邊、紀念品等實物。
3）榮譽獎勵
設(shè)置一些徽章、頭銜名稱給到用戶，比如xx代言人，xx宣傳官等。
4）流量獎勵
給與一些運營位、廣告位宣傳參與的用戶或其公司，類似異業(yè)合作，此類獎勵適用于小有名氣的kol或商家用戶；
如果是B端產(chǎn)品的用戶，還可以有“人脈獎勵”，即搭建核心用戶社群或舉辦線下交流會，定期舉辦一些課程、培訓(xùn)等，不僅能幫助用戶搭建人脈橋梁，還能讓用戶有收獲知識的快感。
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
“三角測量”在用戶體驗研究領(lǐng)域正在變成一個時髦用語。它究竟是什么？它可以如何幫助你提高用戶洞察的質(zhì)量呢？
“三角測量”這一術(shù)語源自幾何學(xué)，它指的是根據(jù)已知的點向未知的點構(gòu)建三角形的方式來確定該點的位置。
在社會科學(xué)領(lǐng)域，三角測量指采用多種調(diào)查方法來研究同一種現(xiàn)象（例如訪談或定量調(diào)查等）。這一概念跟法醫(yī)學(xué)中的“交叉詰問”（cross- examination）接近，通過詢問多位目擊者的證詞更易接近事實真相。這是通過發(fā)現(xiàn)數(shù)據(jù)的一致性和不一致性來實現(xiàn)的。
根據(jù)《研究設(shè)計百科全書》（Encyclopedia of Research Design）的定義：
三角測量是指使用多種來源的數(shù)據(jù)進行研究，或使用多種方法分析數(shù)據(jù)，以提升調(diào)查研究的可信度。
研究的可信度通常包含：
Denzin [1] 認為，沒有哪一種的方法、理論或觀察員可以捕獲一項研究中所有相關(guān)或者重要事物。而三角測量法正是被提出來解決這一問題的。Denzin 在 20 世紀 70 年代確定了四種主要類型的三角測量法，如今仍舊被研究學(xué)界廣泛地認可。
（[1]諾曼·K.鄧津，伊利諾伊大學(xué)香檳分校社會學(xué)系榮譽教授，質(zhì)性研究法終身成就獎獲得者之一）
1）數(shù)據(jù)三角測量（多數(shù)據(jù)集）
指在一項研究中使用不同的數(shù)據(jù)源。尤其是，通過不同的樣本策略收集數(shù)據(jù)，例如收集不同時間、不同環(huán)境或不同的研究對象的數(shù)據(jù)。這種方法可以用其他數(shù)據(jù)的優(yōu)點來彌補當(dāng)前數(shù)據(jù)存在的不足，這樣可以提升結(jié)果的有效性和可靠性。
2）研究員三角測量（多研究員）
該方法指在同一調(diào)查中采用多個調(diào)查人員 / 評估人員。為了做好三角測量，每一位評估者都會使用相同方法（例如訪談、觀察）進行相同的實驗，之后將所有評估者的發(fā)現(xiàn)進行比較。如果所有研究人員都得出了一樣的結(jié)論，那么其有效性就成立。
在用戶體驗研究中，同樣可以通過讓多個研究人員分析同一組定性數(shù)據(jù)來實現(xiàn)。使用不同種族、年齡、性別和階級群體的研究人員可以糾正諸如觀察者或訪談?wù)咂姷膯栴}。
3）理論三角測量（多理論）
該方法只涉及一組數(shù)據(jù)，但研究人員會采用不同的理論或替代的理論進行詮釋。人們甚至通過一些相互矛盾的理論視角來看待數(shù)據(jù)。
4）方法三角測量（多方法）
指在使用不同的方法來研究一種情景或現(xiàn)象。其目的是用其他方法的優(yōu)點補足某一種方法的不足和偏差。該類型的三角測量與在社會科學(xué)研究中所使用的“混合研究方法”（mixed-method approaches）類似，用一種方法得出的結(jié)果來提升、增強和闡述另一種方法的結(jié)果。
不同的方法可以解答不同的問題，但同樣也有一定的局限性。在用戶研究（或者說任何一種社會研究）中沒有哪種方法是完美的。
利益相關(guān)者或初級研究員們會經(jīng)常來問我，究竟該如何解決各種研究方法的局限性，我的解答通常就是“三角測量”。即使是計劃周密、控制得當(dāng)?shù)难芯咳耘f會存在局限。但針對特定的問題采用 多個視角（方法、數(shù)據(jù)點、研究人員以及理論），可以提升我們的信心，幫助我們獲得可信度。
在用戶體驗研究中，最常用的三角測量類型就是“方法三角測量”（例如通過調(diào)查和訪談來研究同樣的問題）和“研究員三角測量”（例如多個研究員分析同一組數(shù)據(jù)）。三角測量使我們對研究數(shù)據(jù)更有信心，揭示意想不到的發(fā)現(xiàn)，對現(xiàn)象有更清晰的認識。
針對一個問題使用多種方法進行研究以理解用戶的行為及其原因。例如，我們可以調(diào)查用戶如何使用一個特定的功能，然后通過深度訪談來探究為什么用戶會這樣用。使用混合方法常常可以讓我們用更清晰的視角看問題。
通常來說，研究會從定性的方法開始，以確定和縮小問題。例如，在做發(fā)現(xiàn)研究時，我們可以從訪談開始，一旦我們確定了一些主題，就可以用定量的方法來驗證我們的見解。當(dāng)然過程也可以反過來，這取決于我們正在研究的問題。
無論是哪種類型的三角測量都是基于這樣一個假設(shè)：使用不同的數(shù)據(jù)來源、方法或者研究員可以減少數(shù)據(jù)集或方法論的偏差。
這意味著，使用三角測量可以增加我們對自己的見解的信心。
然而使用這一方法的同時，需要警告的是，它也可能導(dǎo)致“證實偏差”?？赡苣悴惶煜み@一含義，“證實偏差”就是描述我們潛在的傾向，即注意、聚焦且更相信那些符合我們現(xiàn)有信念的證據(jù)。
如果你之前并未使用過三角測量，請記住它有時會得出矛盾和不一致的結(jié)果。在這些情況下，要由研究者來理解數(shù)據(jù)和不一致的來源。這對于經(jīng)驗較少的研究者來說尤其有挑戰(zhàn)性。
三角測量有助于我們對正在研究的現(xiàn)象有更寬泛的視野但仍舊不是全貌。不用說，合適的設(shè)計研究仍舊對保證可信度至關(guān)重要。如果你的設(shè)計研究較差，那么三角測量將對你幫助不大 —— 輸出的質(zhì)量往往取決于輸入的質(zhì)量。
理想情況下，我們希望有數(shù)月的時間以及無限的預(yù)算來進行研究。但是事實是，我們通常會發(fā)現(xiàn)我們幾乎沒有足夠時間來嚴格執(zhí)行某一種方法，且資源有限。這就使得應(yīng)用三角測量具有相當(dāng)大的挑戰(zhàn)性，它無法應(yīng)用在我們所做的每個研究中。
所以我們應(yīng)該如何決定什么時候使用三角測量呢？
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加藍小助，微信號:ben_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
文字是設(shè)計中的重要組成部分，就像我們平時看到的海報，里面各種被精心設(shè)計過的字體經(jīng)常會成為視覺焦點，以醒目且個性化方式傳達出內(nèi)容的精髓，最后達到的效果事半功倍。
雖然在UI設(shè)計中不需要對文字過分設(shè)計，但圖文作為主要的傳播途徑，字體的使用是否規(guī)范合理將直接影響著信息傳播的優(yōu)先級、重要程度以及用戶的接收質(zhì)量和效率。所以不管是平面設(shè)計還是UI設(shè)計，字體都是不可忽視的核心元素，做好對文字信息層級的處理，對用戶的視覺體驗有著至關(guān)重要的作用。
互聯(lián)網(wǎng)經(jīng)過多年的發(fā)展，也積累的很多的專業(yè)字體知識，設(shè)計師應(yīng)該去了解字體的性格及特征并將其合理運用，才能將信息更清晰的傳達給用戶。本文將圍繞著字型、字號、字距、字重等幾個屬性，針對各方面深度解析，希望能夠幫到大家。
一、字體的基本特征
二、字體的基本屬性
三、不同場景下的屬性參考
四、字體使用基本原則
五、UI設(shè)計需注意的問題
六、結(jié)語
文字是信息內(nèi)容的載體，能最直接的將信息清晰的表達出來，字體則表現(xiàn)了文字的外在特征，合理的使用這些屬性特征不僅能清晰準確的傳遞信息、用于特定場景還能賦予情感表達，展現(xiàn)出獨特的魅力，例如：健身、器械類的產(chǎn)品使用的字體通常會給人一種力量、剛硬、壯實的感覺，而女性專用產(chǎn)品字體則顯的纖細、苗條。
不同類型的字體傳達出不同的氣質(zhì)，綜合來講，字體可分為黑體、宋體、圓體、書法體這四類，平時大家看到的各種形形色色的其他字體，基本是通過這幾類延伸而來。
在UI設(shè)計中，絕大多數(shù)的文字排版用的是黑體，諸如思源黑體、阿里巴巴普惠體、蘋方（ios）、微軟雅黑（PC web）等都是標準的黑體。另外，特定場景如瓷片區(qū)、卡片、banner、專題頭圖、引導(dǎo)頁、閃屏等，對于用什么字體不會有太大的限制，在避免商用侵權(quán)的前提下符合產(chǎn)品氣質(zhì)即可。
黑體字的筆畫橫平豎直、粗細均勻且字面呈正方形，一般來說，沒有襯線的字體都可以稱作黑體。黑體結(jié)構(gòu)清晰、簡潔有力，能讓界面顯得莊重還附有現(xiàn)代感，雖然氣質(zhì)上沒有太大的個性化、但可塑性很強，這也是在UI設(shè)計中、黑體一直很受青睞的原因，無論是標題、正文、提示等使用場景都可以作為首選，對老設(shè)計師能多一個選擇、新手設(shè)計師也不易犯錯。
iOS與Android是移動設(shè)備的兩大系統(tǒng)，雖然很多設(shè)計師用一稿適配兩端、遇到特殊頁面也只是單獨拎出來微調(diào)即可，但對于中、大型的互聯(lián)網(wǎng)公司則很難滿足優(yōu)質(zhì)用戶體驗中的部分細微差別，例如：iOS的蘋方字體在Android設(shè)備中無法高度還原、預(yù)留的文字數(shù)量上限位置無法顯示完整等，都會影響用戶體驗。
此外，iOS和Android都有自己獨立的設(shè)計規(guī)范，大家有時間的可自行查看，本文只對字體規(guī)范作基本了解。
iOS使用的是「蘋方」字體，提供了6個字重，英文字體為「San Francisco」；Android使用的是Google聯(lián)合Adobe發(fā)布的「思源黑體」，為充分滿足設(shè)計要求，提供了7個字重，英文字體為「Roboto」。
此外，如果界面中涉及的數(shù)據(jù)較多，數(shù)字使用DIN字體也是不錯的選擇，字體外形較長，易用且耐看，很適合數(shù)據(jù)統(tǒng)計展示，不過這款字體商用的話需要收費的。
字號的大小決定信息的層次和權(quán)重，不規(guī)律的使用字號會讓頁面信息雜亂，不利于用戶閱讀。在設(shè)定字號規(guī)范時，需特別注意最小值和遞增值。
最小值決定信息的可讀性，以2倍圖為例，iOS11系統(tǒng)將最小字號規(guī)范為11pt（22px），但很多產(chǎn)品依然將最小字號設(shè)定為20px，甚至部分產(chǎn)品將18px的數(shù)字加粗運用在標簽中，所以最小字號的設(shè)定并沒有固定數(shù)值，原則上不影響用戶的瀏覽就行。筆者建議最小字號不要低于20px，在設(shè)計過程中，可以通過設(shè)備實時預(yù)覽，因為同樣的字號在不同的環(huán)境、色值、背景下，其視覺效果都有所區(qū)別。
其次，遞增值決定著信息層級區(qū)分的明顯程度，遵循字號越大、遞增值越大的原則，常用字號數(shù)量控制在6種左右。iOS和Android都是采用的2倍數(shù)柵格系統(tǒng)，為了讓字號的層級區(qū)分更明顯，字號設(shè)定要避開奇數(shù)且最小遞增值不要低于4px，下面舉幾個常見的例子：
①：20、24、28、32、40、48、64...
②：20、24、30、36、42、48、64...
③：22、26、30、34、40、48、60...
...
規(guī)范好的字號該如何使用，還得根據(jù)界面中的實際場景來決定，如下圖：
字間距是指兩個字符之間的橫向間隔距離，在界面排版中，除了西文的字間距調(diào)整需求較大外，中文通常只保持默認，只有少數(shù)場景才會手動調(diào)整，且沒有固定的規(guī)律，保持視覺舒適狀態(tài)即可。例如：banner、界面大標題、重要數(shù)字（取件碼）顯示等。
行高是指包圍在字體之外的隱形邊框，一個字體元素的的行高等于文字上邊框+下邊框+字號的高度之和。
西文字體因高度的參差不齊，本身就能制造出視覺上的上下空間，通常行高為字號的1.2倍，而中文字體沒有上下間隙的延伸，行高則較大，一般在1.5倍左右，如果字號較小且折行較多，行高甚至能達到字號的2倍。
字重指的是字體的粗細，不同的字重能體現(xiàn)出不同的層級關(guān)系，給用戶的視覺感受也截然不同。
像蘋方、思源、阿里巴巴普惠這些家族字體一般都會有極細體、細體、常規(guī)體、黑體、粗體等多個字重，在UI設(shè)計中，實用的就常規(guī)體、加粗兩個字重，再通過色彩、字號使其成為對立關(guān)系，明顯的拉開文字內(nèi)容層級后，方能保持良好的瀏覽體驗。
這種主要針對標點符號，以英文字母為標準，半角是指一個符號占用一個標準字符（英文）的位置，全角則是占用兩個字符位置。
眾所周知，中文使用都是全角、英文使用半角，并且會隨著中/英文的切換而自動改變，但有時候難免會操作失誤讓頁面中的某處信息看著怪怪的卻不明所以、另外中文信息中的時間/日期也大多會使用半角符號，所以設(shè)計師對此有一定的了解時候、，在處理這些細枝末節(jié)就能做到收放自如。
在色彩規(guī)范中，除主/輔助色之外，設(shè)計師還會提供3~4個等級的配色，如通用的#333（標題）、#666（正文）、#999（提示）、#ccc（占位符），這也是UI通用的文字色用色規(guī)范，不同的字號需用色規(guī)律。
如果想進一步延展，可以增加一點品牌色，也可以使用#000（純黑）調(diào)整不透明度來體現(xiàn)文字色彩層級，深色模式中很常見，下面我們一起來了解幾個常見的使用場景。
標題的主要作用是讓用戶以最快的速度了解界面主要信息，需要時刻吸引用戶的注意力，例如APP中的導(dǎo)航欄、模塊標題、內(nèi)容標題、數(shù)據(jù)統(tǒng)計等。需要簡單明了且有沖擊力，字號一般會控制在30px以上并加粗顯示，直接使用一級色值（#333）即可。
在特殊場景下，標題也可以使用主體色值，但一定要注意容器背景與其他信息色彩的協(xié)調(diào)，不然花里胡哨的還不如用回一級色值。
正文并不需要吸引用戶注意力，它主要是提供標題的注釋或內(nèi)容的詳細說明。
當(dāng)白色背景文本內(nèi)容過多、在需要用戶仔細閱讀的情況下，一定要注意顏色不能太深，不然顯的主次不分，還有些刺眼，這里推薦26~30px字號使用二級文字（#666）色值。
提示類文字使用場景就相對較多，它除了給用戶展示當(dāng)前狀態(tài)，還能給予合理的引導(dǎo)，促進用戶進行下一步操作。常見使用色值為三級（#999）、四級色值（#ccc），例如界面中的操作注意事項、表單占位符等。字號一般為24px，因使用場景不同，也會有特殊的存在，例如表單中占位符的字號會跟隨輸入后的字號統(tǒng)一。
超鏈接在字號、色值上沒有一定的限制，但需要一個特定的輔助元素/屬性來提示用戶這是可點擊的。
例如APP登錄頁面，找回密碼、注冊、獲取驗證碼等，大部分都是用主體色、圖標（右箭頭）等方式強化可操作入口，而PC端網(wǎng)頁中超鏈接的表現(xiàn)方式，下劃線、藍色字體、>>這三種方式幾乎能涵蓋所有。
規(guī)范并非不可更改，它只能幫助設(shè)計師在大部分使用場景中減少設(shè)計出入并提高產(chǎn)出效率，但總有一些使用場景需特殊對待，字體也不例外，如以下場景：
◇ APP金剛區(qū)入口字體大多使用24px，一級色值（#333）；
◇ 底部Tab欄字體未激活使用淺色，激活后切換為一級色值（#333）或主體色；
◇ 重量級的提示語用紅色色值；
◇ 按鈕中的文字跟隨按鈕的等級權(quán)重變化；
◇ 深色容器標簽的文字反白；
◇ ......
雖說黑體（蘋方、思源、阿里巴巴普惠）是UI設(shè)計中的首選字體，但這也僅僅只是建立在不出錯的的情況下、滿足基本條件而選擇，如果想表達出產(chǎn)品的類型、情感、氣質(zhì)等品牌屬性，在不影響用戶識別的前提下，可選擇一款符合產(chǎn)品氣質(zhì)的字體，打造出差異化的瀏覽體驗，對于追求完美的APP來時是一個不錯的解決方案。
例如，部分藝術(shù)、女性類的APP會選擇使用宋體，整體看起來有一種高端、時尚且優(yōu)雅的感覺。
整體界面使用特殊字體還是相對較少，為了更好的體現(xiàn)出產(chǎn)品屬性/風(fēng)格，將其融入不同的模塊及使用場景，會讓產(chǎn)品更有特色，例如banner、瓷片區(qū)、大標題、頭圖等，對用戶的視覺吸引力能得到很大提升。
在一個APP中，堅持使用同一個家族的字體，對標題、正文等文字信息有一個統(tǒng)一的視覺規(guī)劃，這樣有助于建立起體系化的設(shè)計思路，避免在開發(fā)落地時存在一致性問題，減少開發(fā)與設(shè)計的出入。
筆者曾見過這樣的設(shè)計師，界面中原本用了「蘋方」字體，在一個特殊場景下，「蘋方」的粗體字重?zé)o法滿足大標題的使用需求，于是將大標題單獨改為「阿里巴巴普惠體」的最大字重。
從表面上看，上述的設(shè)計需求是滿足了，但稍有不慎就會成為沒有價值的藝術(shù)品，首先，單獨一處使用不同家族的字體，會影響整體視覺的一致性；其次，若程序沒有嵌入另外的字體，產(chǎn)品落地后其視覺效果毫無改觀，且更沒有必要為了某個場景的使用要單獨嵌入幾十到幾百兆的家族字體，讓應(yīng)用安裝包無故加大。在設(shè)計中，有時候在解決某個問題時，解決方案并非無可替代，加粗字體亦是如此。
另外，在可用性、實用性強且必要的情況下，并非不能再增加一個家族字體，例如所有標題系列使用「阿里巴巴普惠體」、數(shù)字系列都使用「DIN」，前提是一定要形成體系化，并非某一處的使用。
在同一個界面中，字體色值、字號、字重等，都是用于區(qū)分信息層級，盡量不要使用過多的層級，避免層級混亂影響信息瀏覽。
在信息層級處理方式的四個基本原則中，「對比」就是將復(fù)雜的信息通過元素的各種屬性以不同的視覺效果呈現(xiàn)，來體現(xiàn)信息節(jié)奏感，并非是為了好看而隨意給文字賦予各種屬性及樣式效果。
避頭尾使用在文字內(nèi)容較多的折行場景中，主要處理標點符號剛好出現(xiàn)在一行文字的開頭或結(jié)尾時，通過自動調(diào)整單行的字符間距、在視覺上將標點符號前移或后移。
在新聞資訊類應(yīng)用的詳情頁中，避頭尾使用的較多，用以避免頭/尾存在標點符號造成視覺重量不一、信息參差不齊的問題出現(xiàn)。
很多時候，為了區(qū)分信息層級，首先想到的是利用不同的字號、字重來體現(xiàn)，這當(dāng)然沒有問題，但如果結(jié)合字體的明暗關(guān)系（灰度色值等級）則效果更佳。
如下圖：標題一級色值（#333）、正文二級色值（#666）、時間日期三級色值（#999）。
備用字體只會運用在web頁面中，如果網(wǎng)站需要一款特殊的字體才能彰顯其獨特的氣質(zhì)、同時又擔(dān)心用戶在某些設(shè)備中因為沒有這個字體而無法瀏覽其效果，則會另外再選擇一款相近的通用字體作為備選，以彌補視覺體驗上的損失。
如果字體包不大，也可以讓開發(fā)將其放在服務(wù)器端，這樣能讓所有用戶都能看到相同的效果，省去了不少麻煩。
可讀性應(yīng)該是選擇字體的首要元素，雖說很多文字我們都可以從前后字義、聯(lián)想詞等角度將自己的理解補充完整，但完全沒有必要。
UI設(shè)計不像海報那樣融入較多的藝術(shù)成分，更需要的是內(nèi)容清晰、表意明確、高效率的傳達，任何增加用戶閱讀、理解成本的做法都應(yīng)該規(guī)避掉，例如過于變形的可愛風(fēng)格、書法手寫體等都盡量少用。
文本內(nèi)容是UI界面中占比較多的元素之一，設(shè)計師需要對其基本屬性及使用場景有一個清晰的了解，使用的是否恰當(dāng)取決于我們對字體的選擇。雖說在UI領(lǐng)域，字體模塊類的文章比較少（更多是文字、字庫的設(shè)計），但它在設(shè)計規(guī)范中的地位是舉足輕重，選好一款字體對設(shè)計來說是錦上添花。
關(guān)于UI界面中的字體，其實沒有太多的講究，也沒必要整得花里胡哨，重點在于排版過重中注意信息層級的劃分以及有足夠的視覺舒適度即可。
作者：大漠飛鷹CYSJ 來源：站酷
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設(shè)計( www.bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
藍藍設(shè)計的小編 http://www.bouu.cn