文字是設計中的重要組成部分，就像我們平時看到的海報，里面各種被精心設計過的字體經(jīng)常會成為視覺焦點，以醒目且個性化方式傳達出內(nèi)容的精髓，最后達到的效果事半功倍。
雖然在UI設計中不需要對文字過分設計，但圖文作為主要的傳播途徑，字體的使用是否規(guī)范合理將直接影響著信息傳播的優(yōu)先級、重要程度以及用戶的接收質(zhì)量和效率。所以不管是平面設計還是UI設計，字體都是不可忽視的核心元素，做好對文字信息層級的處理，對用戶的視覺體驗有著至關(guān)重要的作用。
互聯(lián)網(wǎng)經(jīng)過多年的發(fā)展，也積累的很多的專業(yè)字體知識，設計師應該去了解字體的性格及特征并將其合理運用，才能將信息更清晰的傳達給用戶。本文將圍繞著字型、字號、字距、字重等幾個屬性，針對各方面深度解析，希望能夠幫到大家。
一、字體的基本特征
二、字體的基本屬性
三、不同場景下的屬性參考
四、字體使用基本原則
五、UI設計需注意的問題
六、結(jié)語
文字是信息內(nèi)容的載體，能最直接的將信息清晰的表達出來，字體則表現(xiàn)了文字的外在特征，合理的使用這些屬性特征不僅能清晰準確的傳遞信息、用于特定場景還能賦予情感表達，展現(xiàn)出獨特的魅力，例如：健身、器械類的產(chǎn)品使用的字體通常會給人一種力量、剛硬、壯實的感覺，而女性專用產(chǎn)品字體則顯的纖細、苗條。
不同類型的字體傳達出不同的氣質(zhì)，綜合來講，字體可分為黑體、宋體、圓體、書法體這四類，平時大家看到的各種形形色色的其他字體，基本是通過這幾類延伸而來。
在UI設計中，絕大多數(shù)的文字排版用的是黑體，諸如思源黑體、阿里巴巴普惠體、蘋方（ios）、微軟雅黑（PC web）等都是標準的黑體。另外，特定場景如瓷片區(qū)、卡片、banner、專題頭圖、引導頁、閃屏等，對于用什么字體不會有太大的限制，在避免商用侵權(quán)的前提下符合產(chǎn)品氣質(zhì)即可。
黑體字的筆畫橫平豎直、粗細均勻且字面呈正方形，一般來說，沒有襯線的字體都可以稱作黑體。黑體結(jié)構(gòu)清晰、簡潔有力，能讓界面顯得莊重還附有現(xiàn)代感，雖然氣質(zhì)上沒有太大的個性化、但可塑性很強，這也是在UI設計中、黑體一直很受青睞的原因，無論是標題、正文、提示等使用場景都可以作為首選，對老設計師能多一個選擇、新手設計師也不易犯錯。
iOS與Android是移動設備的兩大系統(tǒng)，雖然很多設計師用一稿適配兩端、遇到特殊頁面也只是單獨拎出來微調(diào)即可，但對于中、大型的互聯(lián)網(wǎng)公司則很難滿足優(yōu)質(zhì)用戶體驗中的部分細微差別，例如：iOS的蘋方字體在Android設備中無法高度還原、預留的文字數(shù)量上限位置無法顯示完整等，都會影響用戶體驗。
此外，iOS和Android都有自己獨立的設計規(guī)范，大家有時間的可自行查看，本文只對字體規(guī)范作基本了解。
iOS使用的是「蘋方」字體，提供了6個字重，英文字體為「San Francisco」；Android使用的是Google聯(lián)合Adobe發(fā)布的「思源黑體」，為充分滿足設計要求，提供了7個字重，英文字體為「Roboto」。
此外，如果界面中涉及的數(shù)據(jù)較多，數(shù)字使用DIN字體也是不錯的選擇，字體外形較長，易用且耐看，很適合數(shù)據(jù)統(tǒng)計展示，不過這款字體商用的話需要收費的。
字號的大小決定信息的層次和權(quán)重，不規(guī)律的使用字號會讓頁面信息雜亂，不利于用戶閱讀。在設定字號規(guī)范時，需特別注意最小值和遞增值。
最小值決定信息的可讀性，以2倍圖為例，iOS11系統(tǒng)將最小字號規(guī)范為11pt（22px），但很多產(chǎn)品依然將最小字號設定為20px，甚至部分產(chǎn)品將18px的數(shù)字加粗運用在標簽中，所以最小字號的設定并沒有固定數(shù)值，原則上不影響用戶的瀏覽就行。筆者建議最小字號不要低于20px，在設計過程中，可以通過設備實時預覽，因為同樣的字號在不同的環(huán)境、色值、背景下，其視覺效果都有所區(qū)別。
其次，遞增值決定著信息層級區(qū)分的明顯程度，遵循字號越大、遞增值越大的原則，常用字號數(shù)量控制在6種左右。iOS和Android都是采用的2倍數(shù)柵格系統(tǒng)，為了讓字號的層級區(qū)分更明顯，字號設定要避開奇數(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設計中，實用的就常規(guī)體、加粗兩個字重，再通過色彩、字號使其成為對立關(guān)系，明顯的拉開文字內(nèi)容層級后，方能保持良好的瀏覽體驗。
這種主要針對標點符號，以英文字母為標準，半角是指一個符號占用一個標準字符（英文）的位置，全角則是占用兩個字符位置。
眾所周知，中文使用都是全角、英文使用半角，并且會隨著中/英文的切換而自動改變，但有時候難免會操作失誤讓頁面中的某處信息看著怪怪的卻不明所以、另外中文信息中的時間/日期也大多會使用半角符號，所以設計師對此有一定的了解時候、，在處理這些細枝末節(jié)就能做到收放自如。
在色彩規(guī)范中，除主/輔助色之外，設計師還會提供3~4個等級的配色，如通用的#333（標題）、#666（正文）、#999（提示）、#ccc（占位符），這也是UI通用的文字色用色規(guī)范，不同的字號需用色規(guī)律。
如果想進一步延展，可以增加一點品牌色，也可以使用#000（純黑）調(diào)整不透明度來體現(xiàn)文字色彩層級，深色模式中很常見，下面我們一起來了解幾個常見的使用場景。
標題的主要作用是讓用戶以最快的速度了解界面主要信息，需要時刻吸引用戶的注意力，例如APP中的導航欄、模塊標題、內(nèi)容標題、數(shù)據(jù)統(tǒng)計等。需要簡單明了且有沖擊力，字號一般會控制在30px以上并加粗顯示，直接使用一級色值（#333）即可。
在特殊場景下，標題也可以使用主體色值，但一定要注意容器背景與其他信息色彩的協(xié)調(diào)，不然花里胡哨的還不如用回一級色值。
正文并不需要吸引用戶注意力，它主要是提供標題的注釋或內(nèi)容的詳細說明。
當白色背景文本內(nèi)容過多、在需要用戶仔細閱讀的情況下，一定要注意顏色不能太深，不然顯的主次不分，還有些刺眼，這里推薦26~30px字號使用二級文字（#666）色值。
提示類文字使用場景就相對較多，它除了給用戶展示當前狀態(tài)，還能給予合理的引導，促進用戶進行下一步操作。常見使用色值為三級（#999）、四級色值（#ccc），例如界面中的操作注意事項、表單占位符等。字號一般為24px，因使用場景不同，也會有特殊的存在，例如表單中占位符的字號會跟隨輸入后的字號統(tǒng)一。
超鏈接在字號、色值上沒有一定的限制，但需要一個特定的輔助元素/屬性來提示用戶這是可點擊的。
例如APP登錄頁面，找回密碼、注冊、獲取驗證碼等，大部分都是用主體色、圖標（右箭頭）等方式強化可操作入口，而PC端網(wǎng)頁中超鏈接的表現(xiàn)方式，下劃線、藍色字體、>>這三種方式幾乎能涵蓋所有。
規(guī)范并非不可更改，它只能幫助設計師在大部分使用場景中減少設計出入并提高產(chǎn)出效率，但總有一些使用場景需特殊對待，字體也不例外，如以下場景：
◇ APP金剛區(qū)入口字體大多使用24px，一級色值（#333）；
◇ 底部Tab欄字體未激活使用淺色，激活后切換為一級色值（#333）或主體色；
◇ 重量級的提示語用紅色色值；
◇ 按鈕中的文字跟隨按鈕的等級權(quán)重變化；
◇ 深色容器標簽的文字反白；
◇ ......
雖說黑體（蘋方、思源、阿里巴巴普惠）是UI設計中的首選字體，但這也僅僅只是建立在不出錯的的情況下、滿足基本條件而選擇，如果想表達出產(chǎn)品的類型、情感、氣質(zhì)等品牌屬性，在不影響用戶識別的前提下，可選擇一款符合產(chǎn)品氣質(zhì)的字體，打造出差異化的瀏覽體驗，對于追求完美的APP來時是一個不錯的解決方案。
例如，部分藝術(shù)、女性類的APP會選擇使用宋體，整體看起來有一種高端、時尚且優(yōu)雅的感覺。
整體界面使用特殊字體還是相對較少，為了更好的體現(xiàn)出產(chǎn)品屬性/風格，將其融入不同的模塊及使用場景，會讓產(chǎn)品更有特色，例如banner、瓷片區(qū)、大標題、頭圖等，對用戶的視覺吸引力能得到很大提升。
在一個APP中，堅持使用同一個家族的字體，對標題、正文等文字信息有一個統(tǒng)一的視覺規(guī)劃，這樣有助于建立起體系化的設計思路，避免在開發(fā)落地時存在一致性問題，減少開發(fā)與設計的出入。
筆者曾見過這樣的設計師，界面中原本用了「蘋方」字體，在一個特殊場景下，「蘋方」的粗體字重無法滿足大標題的使用需求，于是將大標題單獨改為「阿里巴巴普惠體」的最大字重。
從表面上看，上述的設計需求是滿足了，但稍有不慎就會成為沒有價值的藝術(shù)品，首先，單獨一處使用不同家族的字體，會影響整體視覺的一致性；其次，若程序沒有嵌入另外的字體，產(chǎn)品落地后其視覺效果毫無改觀，且更沒有必要為了某個場景的使用要單獨嵌入幾十到幾百兆的家族字體，讓應用安裝包無故加大。在設計中，有時候在解決某個問題時，解決方案并非無可替代，加粗字體亦是如此。
另外，在可用性、實用性強且必要的情況下，并非不能再增加一個家族字體，例如所有標題系列使用「阿里巴巴普惠體」、數(shù)字系列都使用「DIN」，前提是一定要形成體系化，并非某一處的使用。
在同一個界面中，字體色值、字號、字重等，都是用于區(qū)分信息層級，盡量不要使用過多的層級，避免層級混亂影響信息瀏覽。
在信息層級處理方式的四個基本原則中，「對比」就是將復雜的信息通過元素的各種屬性以不同的視覺效果呈現(xiàn)，來體現(xiàn)信息節(jié)奏感，并非是為了好看而隨意給文字賦予各種屬性及樣式效果。
避頭尾使用在文字內(nèi)容較多的折行場景中，主要處理標點符號剛好出現(xiàn)在一行文字的開頭或結(jié)尾時，通過自動調(diào)整單行的字符間距、在視覺上將標點符號前移或后移。
在新聞資訊類應用的詳情頁中，避頭尾使用的較多，用以避免頭/尾存在標點符號造成視覺重量不一、信息參差不齊的問題出現(xiàn)。
很多時候，為了區(qū)分信息層級，首先想到的是利用不同的字號、字重來體現(xiàn)，這當然沒有問題，但如果結(jié)合字體的明暗關(guān)系（灰度色值等級）則效果更佳。
如下圖：標題一級色值（#333）、正文二級色值（#666）、時間日期三級色值（#999）。
備用字體只會運用在web頁面中，如果網(wǎng)站需要一款特殊的字體才能彰顯其獨特的氣質(zhì)、同時又擔心用戶在某些設備中因為沒有這個字體而無法瀏覽其效果，則會另外再選擇一款相近的通用字體作為備選，以彌補視覺體驗上的損失。
如果字體包不大，也可以讓開發(fā)將其放在服務器端，這樣能讓所有用戶都能看到相同的效果，省去了不少麻煩。
可讀性應該是選擇字體的首要元素，雖說很多文字我們都可以從前后字義、聯(lián)想詞等角度將自己的理解補充完整，但完全沒有必要。
UI設計不像海報那樣融入較多的藝術(shù)成分，更需要的是內(nèi)容清晰、表意明確、高效率的傳達，任何增加用戶閱讀、理解成本的做法都應該規(guī)避掉，例如過于變形的可愛風格、書法手寫體等都盡量少用。
文本內(nèi)容是UI界面中占比較多的元素之一，設計師需要對其基本屬性及使用場景有一個清晰的了解，使用的是否恰當取決于我們對字體的選擇。雖說在UI領域，字體模塊類的文章比較少（更多是文字、字庫的設計），但它在設計規(guī)范中的地位是舉足輕重，選好一款字體對設計來說是錦上添花。
關(guān)于UI界面中的字體，其實沒有太多的講究，也沒必要整得花里胡哨，重點在于排版過重中注意信息層級的劃分以及有足夠的視覺舒適度即可。
作者：大漠飛鷹CYSJ 來源：站酷
藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( m.yvirxh.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
按鈕設計是我們經(jīng)常會遇到的一個類型，一個好的按鈕其最重要的就是激起點擊欲，讓人忍不住去戳戳戳。
我們來看看下面這個按鈕：
很普通，處處都很常見的一種按鈕，沒有任何點擊欲。
那我們應該怎么做出她的點擊欲呢？
其實就是要讓按鈕更有立體感，話不多說直接上干貨！
可以用不同的顏色，放大一圈，形成對比：
上下錯開一些讓按鈕的造型飽滿立體一些，從原來的單一一層變?yōu)閮蓪樱?
為了讓按鈕更立體我們可以把這兩層個復制一層，往下移動幾個像素：
這樣按鈕是不是就已經(jīng)立體多了？別急，還有呢！
這里細節(jié)就比較多，想把按鈕做到晶瑩剔透可不容易，給大家好好講一下。
先給圖形加上一個內(nèi)發(fā)光：
使用剪切蒙版，涂顏色或者再來一層內(nèi)發(fā)光，加強這個效果：
復制一層，選用更深的顏色，向下移動，剪切蒙版到里面去，把按鈕有一個明顯的明暗分割線，形成這種光的層次和厚度：
沿著造型刻畫高光，和邊緣有些間隔：
在白色的底座上加入按鈕的投影：
這樣一個剔透，立體感強的按鈕造型就完成啦！
那還能不能讓點擊欲更強一些呢？
放上文案看看：
就還是有點單對吧。
這種時候我們就可以從按鈕的文案出發(fā)，加入一些圖案，讓它更生動！
比如這里的文案是“發(fā)射”，就聯(lián)想到了火箭，我們可以繪制一個火箭出來。
把它加入到按鈕上：
這樣一個豐富且有點擊欲的按鈕就完成了！
并可以用同樣的邏輯去延展別的按鈕，讓他們保持統(tǒng)一性：
增強按鈕的點擊欲的方式，其實就是讓它變得立體且豐富。
1.層次：單獨的一個色塊，會很單薄，增加層次增加其在造型上的豐富度。
2.厚度：厚度可以讓按鈕變得更立體。
3.光影：讓按鈕富有變化，更立體和吸引人。
4.表像圖形：一個關(guān)聯(lián)文案信息的點綴圖案，可以讓人更有食欲。
作者：菜心輕量文 來源：站酷
藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( m.yvirxh.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
今天和大家分享用了幾年的一個社交軟件Instagram。發(fā)現(xiàn)這款軟件整體的設計與體驗有值得學習的地方，從10個維度分享分享，希望大家喜歡啦～～
下圖是關(guān)于Instagram的從2010-2022整個圖標變化的過程，從中能發(fā)現(xiàn)：
1.圖標從擬物的風格慢慢變成扁平的風格。
2.從具象的相機變成更加簡約線形的相機圖標。
3.顏色越來越艷麗、明亮，給人年輕、炫彩、簡約的設計感受。
4.從logo的變化中能看出頁面將從擬物的時代跨進了扁平時代，也能折射Instagram界面必將是往極簡、炫彩的方向走。
我重新臨摹Instagram啟動圖標，發(fā)現(xiàn)里面有許多的設計小知識點值得學習。
例如：圖標背景顏色有黃色、紅色、紫紅色、紫色，相鄰的兩個顏色互為鄰近色，使得繪制出的背景自然而炫彩，非常不錯的設計，漸變的融入也很自然。
當我們自己做漸變的圖標背景時可以用兩兩相鄰的顏色，讓漸變?nèi)谌氲母匀弧?/span>
明顯的發(fā)現(xiàn)Instagram顏色跟色譜的規(guī)律一致，顏色從左到右色相的變化值在50度左右，4種顏色都是用的高飽和度、高明度的色彩，非常艷麗、明亮，利用漸變附在英文上做出英文版的logo。
iPhone 14的字體漸變也是用的這種方法，利用兩兩相鄰的顏色來做漸變。連蘋果、Instagram都在用，趕緊學起來吧，你也可以的～～
1.通過自己仔細的觀察發(fā)現(xiàn)Instagram攝像頭圖標圓角是帶有平滑過度的圓角，和普通的圓角不一樣。
2.平滑圓角給用戶的感受會更舒適、平滑、有活力，而普通的圓角顯得更加生硬、不自然。
3.蘋果的主題圖標都是帶有平滑過度的圓角而不是一個普通圓角，使得圖標顯得更加自然。
4.可以去看看之前原研哉幫小米設計的logo，會發(fā)現(xiàn)他們的logo給人干凈會更加有活力、生命力，而不是使用這種普通圓角，而是一種平滑過度的圓角～
1.從Instagram的啟動頁面看出，Instagram追求的是簡約、突出品牌色的方向。
2.主界面主要以用戶發(fā)的圖片為主而不是文字，往往圖片比文字更容易產(chǎn)生閱讀與反饋。
3.整體的界面簡約、素白，圖標都是統(tǒng)一用黑色線條的描邊。
4.當自己關(guān)注的用戶，發(fā)了一些視頻，頭像上附帶Instagram的品牌色的圓形，在白色的界面用品牌色進行了點綴，讓單調(diào)的界面更具有識別性。
Instagram的發(fā)現(xiàn)頁面做的很不錯，我重新繪制了這個頁面，發(fā)現(xiàn)系統(tǒng)想推送給你的圖片或者視頻會做等比放大2倍處理，一屏顯示圖片或者視頻至少有一個最大顯示，給用戶的感受是有主次。同時開發(fā)也能很好實現(xiàn)這種布局，具有一定的規(guī)律性。
在Instagram界面當用戶發(fā)的圖片超出5張時，圖片下方的輪播點會出現(xiàn)變化，有大有小。
我重新繪制了一個用戶發(fā)的7張圖片的示例，當用戶在左右滑動圖片時，輪播的點會跟著動，同時會有大小的顯示，暗示用戶后面或者前面還有多張圖片，有近大遠小的感覺，非常細節(jié)的設計～（可以利用在自己的一些設計上）
1.在Instagram的用戶界面，視頻、多張圖片、單張圖片和置頂4種狀態(tài)右上角有個圖標的標識，讓用戶清晰知道圖片的內(nèi)容狀態(tài)，提前給用戶有個心理預期與區(qū)分。
2.當用戶點擊進去類似抖音的布局，可以進行上下滑動切換視頻內(nèi)容，雙擊可給該視頻點贊，整體的體驗很絲滑，沒有任何的卡頓與拖沓。同時界面圖標用線性的形式，布局統(tǒng)一、和諧。
Instagram整體的圖標設計是線性的圖標，線性圖標給人的感覺是可點擊、可操作的，同時感覺簡潔明快的氣質(zhì)。圖標的統(tǒng)一讓每一個界面的視覺感受都是一致的。
這個界面放在你面前可能都會知道是Instagram這個應用，這個界面框架已經(jīng)形成品牌意識。 Instagram幾年一直沒有更改這個布局，非常經(jīng)典的設計，沒有太多花里胡哨的圖標與信息，只有簡約的線性圖標與用戶發(fā)布的圖片，克制的設計。也有很多相機應用、戶外廣告都借鑒了Instagram布局，已經(jīng)在用戶的心智里面了～
1.越來越多的企業(yè)的品牌色往鮮艷的方向走，突出品牌形象。
2.圖片的排版不一定是同樣大小的，可以有大有小，取決于更想給用戶傳達什么。
3.圖標的統(tǒng)一性很重要，當整個app的圖標風格都一致時，給用戶的體驗的感受也是一致的。
4.不斷重復一個設計框架、設計組件時，會形成品牌意識，讓用戶記得你的產(chǎn)品。
百度小說是百度APP內(nèi)的垂直頻道，擁有過億月活和行業(yè)最全的正版書籍。隨著著作權(quán)保護意識逐步上升，越來越多的用戶愿意為優(yōu)質(zhì)的資源和閱讀體驗付費。2019年底，為了滿足用戶消費升級所產(chǎn)生的一系列需求，百度小說初步建立了會員體系。經(jīng)過兩年多的打磨，我們不斷提升會員的服務體驗，并進行了多次優(yōu)化升級，現(xiàn)在將我們的設計經(jīng)驗分享給大家。
一、設計背景
2021年我國數(shù)字閱讀用戶規(guī)模達到5.06億，同比增長2.43%，半數(shù)以上用戶愿意為電子閱讀付費，占比最重的人群為19~25歲用戶，達到44.63%（數(shù)據(jù)來源《中國數(shù)字閱讀報告》），“Z世代”已經(jīng)成為我國數(shù)字閱讀的主要群體。隨著消費升級，用戶對服務的需求不斷提升，更看重信息之上的附加價值，如認同感、歸屬感和儀式感。
二、改版原因
2019年，由于時間緊、任務重，我們完成了小說會員從無到有、從0-1的基礎場景搭建。但隨著設計趨勢的變化，當時小說會員的設計風格與主流用戶的喜好不完全匹配，在使用場景中也存在易用性不足、內(nèi)容缺乏吸引力等問題。下圖是2019年小說會員的界面。
同時，我們對小說用戶進行了視頻訪談，搜集了用戶在使用會員服務中遇到的問題，如會員福利少、找不到會員專屬內(nèi)容、購買過程有卡頓等，最終梳理為的三大核心問題：身份感知弱、購買路徑長和資源內(nèi)容少。
三、設計目標
在小說會員亟待改版的背景下，我們結(jié)合業(yè)務目標、舊版核心問題和用戶訴求，推導出了本次改版的設計目標—品牌化、鏈路化和服務化。
1、品牌化—強化會員品牌
小說會員作為百度APP眾多會員之一，設計團隊希望能帶給閱讀用戶一些不同的品牌記憶點。
1）設計關(guān)鍵詞
基于會員的主流用戶、產(chǎn)品屬性和用戶訴求，我們衍生出以下關(guān)鍵詞：年輕、品質(zhì)、尊貴、超值。年輕用戶群體的占比越來越高，新版的設計風格力求更好滿足年輕用戶的審美需求。
2）會員符號
符號是最直觀的視覺元素之一，能夠以最快的方式傳遞產(chǎn)品記憶點。在會員品牌符號設計的草圖階段，我們從字母V、VIP、鉆石、王冠和小說IP白嘟嘟等多個方向進行了方案發(fā)散。最終采用了白嘟嘟圖形與尊貴感的V形符號相結(jié)合的形式。該方案既延續(xù)了小說的視覺符號，又與競品的會員標識形成差異，從而加深用戶的品牌感知和視覺記憶。
3）會員色彩
為了確定更加獨特的品牌色，設計團隊搜集了大量的尊貴氛圍圖片，提煉出了玫瑰金，牙金，赤墨等8個具有品質(zhì)感的顏色。在視覺初稿階段，我們選擇了玫瑰金和黃金兩種主色進行了方案嘗試。最終根據(jù)整體效果確定主色為明亮、高貴的玫瑰金，輔色為黑茶棕，深支子和漆黑的配色方案。新的配色方案讓用戶感受到新穎、現(xiàn)代，煥然一新。
4）會員圖標
在圖形元素上，為了增強親和感，我們選擇了圓潤的面形圖標樣式，通過大圓弧和小圓角的細節(jié)處理，傳遞給用戶一種年輕、品質(zhì)的品牌印記。
5）信息傳達
我們對會員購買頁和權(quán)益詳情頁進行了布局重構(gòu)，采用深色的背景襯托卡片信息，使得產(chǎn)品框架層和內(nèi)容信息層更加明確，突出核心內(nèi)容。
在各類場景中，我們通過會員品牌色彩、圖形、符號和IP形象的滲透，強化會員品牌印記。
經(jīng)過分析研究和實踐，我們完成了主場景的設計升級。
2、鏈路化—精細化運營
就會員體驗而言，我們需要關(guān)注用戶在各種時間和各類場合下的需求，因此我們將會員的全鏈路狀態(tài)分為時機、場景和人群三個維度。
1）時機
在不同的時機狀態(tài)下，我們需要傳遞給用戶不同的信息。只有深入剖析不同狀態(tài)下的用戶訴求，才能為其提供更好的服務。接下來我們從購買前、購買中、購買后和即將過期四個階段闡述：
①購買前—權(quán)益/優(yōu)惠信息引導
在用戶購買前，我們強化了低價和省錢信息，讓用戶直觀的感受到購買會員后的價格福利。為此我們從三個方向上進行優(yōu)化，在開通購買頁，外露省錢金額，幫助用戶了解開通會員可享受的收益；在會員頻道頁，采用外露多項權(quán)益，讓用戶快速了解會員權(quán)益；在章節(jié)購買頁，采用突出會員折扣和會員優(yōu)惠價，讓用戶感受到開通會員的折扣福利。
②購買中—優(yōu)化路徑流程
在用戶購買中，我們在會員購買鏈路環(huán)節(jié)進行簡化，采用當前頁彈出半層面板替代跳轉(zhuǎn)至會員聚合頁的方式，縮短等待加載時間；在章節(jié)付費鏈路環(huán)節(jié)，將商品選擇區(qū)信息結(jié)構(gòu)進行優(yōu)化，減少多章購買的頁面跳轉(zhuǎn)，使得用戶能夠更流暢的完成支付，提升付費體驗。
③購買后—強化權(quán)益感知
在用戶購買后，鑒于付費用戶對商品和服務品質(zhì)有著更高追求，為此我們通過在各類重要入口展示會員權(quán)益，包括省錢金額、去廣告次數(shù)以及各類場景VIP狀態(tài)提示等方法，以達到強化用戶的權(quán)益感知。
④即將過期—輕引導續(xù)費
在即將過期前，為了避免對用戶造成強付費的不友好感知。過期前3天，我們采用了輕量化的形式告知用戶續(xù)費，通過各類引導信息的提示，讓用戶知曉會員服務期限屆滿。
2）場景
我們在入口和功能場景中也進行了精細化設計，讓用戶更便捷地使用會員服務。為了突出會員優(yōu)質(zhì)內(nèi)容和服務，我們設置了會員專屬的頻道和書庫，方便用戶選擇。
在各類功能場景中，為了方便用戶在使用功能的過程中隨時購買，我們設置了多個功能場景的會員開通入口。讓用戶快捷享受會員服務。
3）人群
通過小說用戶數(shù)據(jù)分析，我們將用戶人群分為會員用戶、潛在用戶、新用戶和過期用戶。
為了讓會員用戶能夠體驗到區(qū)分于普通用戶的尊貴感，我們在付費頁、批量離線、TTS播放頁和簽到頁等場景均采用了會員定制化的配色方案和引導提示，這樣使得會員用戶在體驗服務的各類場景中有更強的身份專屬性。
所謂潛在用戶，是指仍在猶豫是否購買會員的用戶。我們通過限時優(yōu)惠券、激勵視頻試用15分鐘、書架省錢提示、挽留彈窗和降級版免廣告權(quán)益等方式，讓潛在用戶不僅可以先試后買了解會員權(quán)益，而且可以通過各類信息提示通曉會員體驗，更好地判斷是否通過會員服務減少付費金額和提升閱讀體驗。
我們針對新用戶建立了新人見面禮活動，用戶在新手福利活動期內(nèi)可享受超值折扣開通會員，低價體驗會員權(quán)益。而針對已過期的用戶，我們通過下發(fā)優(yōu)惠券、強化特權(quán)等形式喚醒用戶，以免錯過各類福利和特權(quán)。
3、服務化—提升會員服務
在內(nèi)容為王的時代背景下，為了增加會員產(chǎn)品的核心競爭力，我們持續(xù)擴充會員書庫的數(shù)量和類目、拓展會員權(quán)益，讓用戶閱讀到更加豐富的小說內(nèi)容和體驗到更多權(quán)益的會員服務。小說書庫的付費和免費書數(shù)量大幅擴充，且書籍類型新增了有聲書和短篇故事，增添了小說資源的多樣性。
在權(quán)益上，對內(nèi)我們持續(xù)拓展會員特權(quán)，從最初的4項擴展為10項，新增了有聲免費聽、免費讀故事、整本離線、專屬字體、簽到1.5倍書幣等權(quán)益；對外我們聯(lián)合其他產(chǎn)品，推出了會員贈禮和聯(lián)合會員服務，用戶可以根據(jù)自己的需求進行購買，享受組合購買的優(yōu)惠。
通過多個版本的迭代，我們完成了會員體系的設計升級和落地，用戶體驗得到了顯著提升。
四、未來規(guī)劃
提升付費產(chǎn)品的用戶體驗是一個體系化的研究課題，需要各個角色通力合作，合力同行，開拓革新。將來我們還會不斷探索，通過不斷優(yōu)化體驗細節(jié)，不斷增加用戶權(quán)益感知，不斷嘗試方案創(chuàng)新，形成設計組合拳，為用戶提供更好的服務。
作者：百度MEUX 來源：站酷
藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( m.yvirxh.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
百度酒店以比價為核心特色，經(jīng)歷多次設計探索，初步建立了用戶認知。
設計中通過“核心流程分析-明確用戶關(guān)注信息-探索比價價值”的方式去制定設計策略，并在方案探索與落地階段，通過思路發(fā)散、多輪數(shù)據(jù)驗證與方案迭代，驗證了“氛圍感知強化、價值信息傳達、聚合比價”等設計手段的作用，希望給服務和電商等比價類產(chǎn)品的設計師一些啟發(fā)和參考。
一、項目背景
酒店住宿在線預訂市場中，各個平臺基于用戶權(quán)益、運營補貼等差異進行著激烈的價格競爭，導致行業(yè)存在天然的價差。而在我們進行的一次酒店預訂訪談中發(fā)現(xiàn)，超過半數(shù)的用戶在預訂酒店時會進行比價，而比價的用戶中多數(shù)會使用2個以上的酒店APP。因此，在市場存在價差且用戶有比價訴求的背景下，百度酒店通過接入多家供給及會員低價，旨在建立酒店聚合比價平臺，為用戶提供性價比最高的酒店搜索服務。
二、設計策略與落地觸點
1.目標和策略制定
在上述背景下，我們與產(chǎn)品側(cè)對齊業(yè)務目標，結(jié)合對用戶訴求的分析，確定了設計目標。
為了達成設計目標，需要明確比價在酒店預訂的各個觸點下對用戶的價值是什么，以探索比價如何發(fā)揮作用。下圖列出了酒店預訂的核心流程、核心模塊及用戶關(guān)注信息，由于用戶在各個環(huán)節(jié)關(guān)注的信息不同，比價所能發(fā)揮的價值也就不同，因此基于比價是否影響用戶進行選擇和決策，我們又將核心流程分成服務報價選擇前、服務報價選擇時、服務報價選擇后。
設計目標的實現(xiàn)也對應上述3個環(huán)節(jié)如下圖：
2.明確落地觸點
為了找到一些好的比價概念和價值的傳達方式，以及提升比價體驗的方式，我們進行了競品調(diào)研，競品包含酒店、商品等不同行業(yè)，調(diào)研結(jié)論歸納如下：
結(jié)合競品調(diào)研結(jié)論，我們根據(jù)百度酒店的核心流程和觸點進行了設計策略的拆解，建立了策略和落地的映射關(guān)系。
三、方案探索與落地
1.提升感知-讓用戶知道百度酒店可以比價
這一環(huán)節(jié)的設計目標是要讓用戶知道百度酒店可以比價，以吸引用戶在百度酒店完成下單行為，因此清晰、有吸引力的比價元素設計十分重要。基于競品調(diào)研內(nèi)容，我們進行了設計探索。
1）酒店列表-氛圍感知強化及價值信息傳達
下圖所示為酒店列表比價設計的探索過程，最初的方案，為了保證酒店信息的獲取體驗，采用了與傳統(tǒng)酒店預訂平臺采用一致的結(jié)構(gòu)和信息優(yōu)先級，僅結(jié)合圖片區(qū)域和價格做了比價信息的結(jié)合，但這種設計與傳統(tǒng)酒店預訂平臺差異很小，比價感知和價值的傳達效果并不好。因此設計側(cè)轉(zhuǎn)變思路，在酒店列表中通過更強化的模塊來突出比價的感知，同時結(jié)合“比某平臺低xx”的文案說明比價結(jié)果，傳達“比價獲得更低價”的感知。
酒店列表覆蓋多個場景，為了建立百度酒店一致的體驗和認知，我們將列表的設計覆蓋到了搜索結(jié)果頁和小程序的多個頁面，如圖所示。
2）房型及服務報價-基于低價推薦去強化比價
房型及服務報價模塊對應酒店精準需求和酒店詳情頁，與酒店列表思路一致，方案在逐漸與傳統(tǒng)酒店預訂平臺產(chǎn)生差異化，去強化比價、低價的感知，形成記憶點。
下圖為搜索結(jié)果頁的方案，最初外露了多個房型，以滿足用戶的選擇訴求，但從用戶行為數(shù)據(jù)來看，百度酒店的絕大多數(shù)用戶會選擇酒店的最低價房型及報價，因此我們調(diào)整設計方案，結(jié)合最低報價，用模塊式的對比方式去強化比價，并通過“低價立省xx”的信息去傳達低價感知。另外，這一部分的設計也和聚合比價有所結(jié)合，后面會進行詳細的說明。
詳情頁的主要模塊設計與搜索結(jié)果頁基本一致，如下圖所示，詳情頁中將最低報價作為低價房型推薦，以建立一致的比價認知同時便于用戶快捷預訂低價。另外，在常規(guī)的報價列表中，為了提升用戶查找報價的效率，相比于最低價房型，采用了弱化的形式。最終方案上線后，數(shù)據(jù)上也取得了正向的效果，報價展現(xiàn)到預訂點擊的轉(zhuǎn)化得到了提升。
3）“產(chǎn)品縫隙”中的比價概念滲透
“產(chǎn)品縫隙”并不像上述列表模塊那樣感知強烈，設計的目的是為了進一步加深“百度酒店可以比價”的用戶印象。結(jié)合百度酒店的核心頁面，我們重新設計了酒店列表和房型報價列表的加載態(tài)，利用“多資源方交替動效+文案說明”的方式，構(gòu)建動態(tài)的比價感知，在用戶進入頁面或者進行篩選等場景時會出現(xiàn)。另外，我們也利用了小程序首頁和詳情頁的頁尾，在閱讀結(jié)束時去傳達全網(wǎng)比價的概念。
2.建立認知-聚合比價模式的構(gòu)建
在競品調(diào)研部分，我們提到了聚合比價模式，百度酒店由于報價復雜，也適合用這種方式去簡化報價。
如圖所示，常規(guī)酒店預訂平臺，同一房型（如標準大床房）會存在不同服務政策（早餐服務、取消規(guī)則、支付方式）的報價，而在百度酒店中，由于又加入了預訂平臺的差異，報價會更加復雜，數(shù)量更多且同質(zhì)化嚴重，即服務政策相同，僅預訂平臺不同的報價多次出現(xiàn)，這就導致了報價列表的查看和選擇效率較低。
聚合比價模式就是要將這些服務政策相同的報價聚合在一起進行比價，以簡化報價列表提升選擇效率，同時在服務相同的情況下，絕大部分用戶會更傾向于低價，在報價聚合后，可以突出低價以便用戶預訂。
我們也在探索如何讓聚合比價更簡單，初始方案采用點擊展開的形式，用戶可以保持滑動瀏覽的交互體驗，整個過程的交互體驗比較流暢，但頁面的層級關(guān)系較為復雜，用戶認知成本高。因此我們又嘗試了調(diào)起面板展示比價詳情，讓用戶聚焦在當前報價的對比，并通過模塊式的設計，清晰羅列了每個平臺的服務、優(yōu)惠明細等差異信息，讓信息的對比更高效，同時強化低價平臺，與前面的比價模塊保持認知一致。
聚合比價模式下，存在了兩種用戶路徑，如圖所示。用戶可以直接選擇最低價資源方完成預訂，也可以通過比價詳情彈層，查看針對同一服務的所有平臺報價，對比平臺的詳細服務、優(yōu)惠差異后再選擇預訂。
這種預訂模式的目的，一方面在教育用戶建立百度酒店可以比價、可以買到低價的認知，另一方面也提升了用戶選擇低價平臺的效率。另外，聚合比價要具有清晰的規(guī)則才能被理解和信任，在比價詳情中，為了進一步降低認知成本，我們通過標題突出了聚合項，并增加了比價說明入口，讓聚合規(guī)則更明確。聚合比價的方案上線后，報價的預訂點擊到成單轉(zhuǎn)化也得到了提升。
另外，前文提到的精準需求搜索結(jié)果頁和詳情頁的低價房型推薦也利用了這種模式，不過在比價感知上做了更強化的處理。用戶可以在詳情頁直接點擊各個平臺報價完成預訂，也可以點擊文字部分查看房型詳情，在頁面底部的比價詳情中完成報價的對比和預訂。
3.強化記憶-比價價值感的再次強化
填單場景是在預訂完成后，這個環(huán)節(jié)我們可以將比價的概念和價值再次展示給用戶，以加深用戶對比價的認知。這里的設計手段與“提升感知”階段類似，如圖所示為一些方案探索，在用戶選擇低價平臺預訂，點擊跳轉(zhuǎn)至填單頁后，我們會強化用戶“預訂到最低價”以及“為用戶節(jié)省xx元”的感知。另外，在用戶提交訂單時，會存在一定的加載時間，我們也利用了這里的“產(chǎn)品縫隙”，結(jié)合加載態(tài)繼續(xù)傳遞低價、省錢的認知。
四、結(jié)語
回顧百度酒店的比價設計過程，我們以比價及低價感知傳達、高效預訂低價為設計目標，基于百度酒店的核心預訂流程，探索比價在各個環(huán)節(jié)如何發(fā)揮作用，進而將設計目標的實現(xiàn)劃分為了“提升感知、建立認知、強化記憶”三個階段，并為業(yè)務帶來轉(zhuǎn)化提升。
提升感知過程結(jié)合流程中的主要模塊，通過模塊式對比形式、傳達比價價值感、基于低價推薦強化比價、以及利用“產(chǎn)品縫隙”等手段，去吸引用戶了解和使用比價；建立認知過程利用“聚合比價”模式去精簡報價，同時結(jié)合對低價報價、低價平臺的強化，讓用戶更便捷的預訂低價；最后強化記憶的環(huán)節(jié)，我們進行了一些方案嘗試，再次強調(diào)比價的價值。另外，為了建立一致的比價認知，整體的設計中也堅持一致性的原則。百度酒店的比價設計也在不斷地嘗試和優(yōu)化中，希望能給用戶創(chuàng)造更好的使用體驗。
作者：百度MEUX 來源：站酷
藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( m.yvirxh.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
通知是產(chǎn)品中極其重要的一部分，它能快速將內(nèi)容的狀態(tài)及變化通過不同的方式傳達給用戶，以便用戶在收到信息后根據(jù)所傳遞的內(nèi)容及時做出應對策略。
在這里，有一個很現(xiàn)實的問題，很多產(chǎn)品喜歡一股腦的把有效的/無效的、重要的/不重要的、用戶想知道的/不想知道的等所有信息通通推送給用戶。那么，你的推送渠道真的用對了嗎？是否做了信息優(yōu)先級區(qū)分？推送時間段是否有效？站在用戶角度，下面這些場景你肯定碰到過：
◇ 手機屏幕總是頻繁彈出信息，接二連三的震動、提示音讓你一怒之下卸載了一些不太常用的APP；
◇ 桌面圖標99+、主頁的消息入口99+、進入消息分類還是99+，清理起來非常麻煩，還不如關(guān)閉幾個分類通知，少一個也能緩口氣；
◇ 一天少看了幾個小視頻，好不容易節(jié)省出來的流量被通知無情的消耗，還不如關(guān)閉系統(tǒng)通知權(quán)限來得快；
◇ 每隔一段時間，都要在手機短信中回復一大堆TD（退訂），想吐的感覺；
◇ ......
在頻繁地打擾下，用戶關(guān)閉了一個個通知權(quán)限、甚至一度卸載APP。不難看出，好的消息通知能巧妙的將用戶求留?。ú糠钟脩衾猛ㄖ湍鼙３謱ξ⑿拧Q的控制欲），做的不好就會起到負面作用、失去了消息通知的初衷，這里面最需要把控就是推送的一個“度”。
用戶可能因為一條走心的推送而轉(zhuǎn)化、也可能因為被打擾而放棄使用，站在設計角度，需盡可能打造讓用戶更喜歡的通知系統(tǒng)。那么，對于不同的業(yè)務需求及使用場景，又該如何差異化的進行消息推送，筆者通過本文進行分析總結(jié)，與大家一起了解。
一、消息推送的基本知識
二、消息通知渠道
三、讓用戶再次開啟通知權(quán)限
四、提高觸達率的小技巧
五、結(jié)語
消息通知是產(chǎn)品提供的一項服務，能夠及時將產(chǎn)品的期待或內(nèi)容的變化、根據(jù)其等級權(quán)重合理的通過不同渠道及時同步給用戶，常見的如互動提醒、老用戶召回、活動拉新、產(chǎn)品更新或幫助提醒等，通過站內(nèi)紅點、彈窗、短信、郵件等方式與用戶進行信息交換。
用戶層面，方便及時獲取到想要知道的信息、以及對信息交換的控制權(quán)。例如：用戶發(fā)布一條新的短視頻想要對評論/點贊及時掌控、給心上人發(fā)了信息想在第一時間看到回復...等，產(chǎn)品也是借此用戶對內(nèi)容的控制欲，利用消息推送提升用戶的使用體驗。
產(chǎn)品層面，通過主動推送想讓用戶知道的信息，以達到新/老用戶轉(zhuǎn)化的目的。例如：通過手機短信形式發(fā)放優(yōu)惠券對老用戶召回、應用內(nèi)通知或桌面推送對用戶拉新...等，以此提高產(chǎn)品收益，獲取更大的商業(yè)價值。
首先，一個好的消息系統(tǒng)首先需要將消息內(nèi)容設計的全面，以便用戶通過消息通知能準確無誤的了解到對應內(nèi)容；
其次，消息的觸達方式需合理有效，必須提供便捷的操作入口以供用戶及時反饋；
另外，為了避免過于打擾用戶，需選擇合理的推送渠道，提高用戶觸達概率及反饋效率。
消息通知渠道分為應用內(nèi)通知應用外通知。應用內(nèi)通知主要來源于消息中心或系統(tǒng)主動觸發(fā)的彈窗來體現(xiàn)，而應用外通知包括桌面圖標紅點、手機短信、電子郵件、push、公眾號信息（需綁定）等渠道推送。
1）消息功能入口
消息功能入口提示也稱為紅點提示，主要有底部Tad欄、首頁右上角、個人中心右上角三種形式。當有新的通知出現(xiàn)時，對應圖標的右上角會出現(xiàn)小紅點提示，清晰明了，關(guān)于小紅點設計，之前《小紅點篇 | 用好這招，讓用戶的觸達率大幅度提升！》這篇文章有詳細說明。
紅點提示的用戶觸達率較高，但需要用戶在登錄狀態(tài)下才能查看，比如訂單狀態(tài)變化、用戶與用戶/產(chǎn)品之間的互動消息、產(chǎn)品活動通知等。
2）消息列表
當產(chǎn)品的消息類型較多時，點擊消息功能入口即可跳轉(zhuǎn)至二級分類列表。與上述相比，消息列表的內(nèi)容則更加清晰，通過第一次消息入口功能的引導觸發(fā)，這里的用戶觸達率將成倍增加。
3）彈窗通知
以彈窗的形式覆蓋在頁面內(nèi)容頂層，阻礙用戶的當前操作并迫使用戶對彈窗做出決策，可以是系統(tǒng)主動彈出或用戶手動觸發(fā)，對用戶的干擾極大。
彈窗通知最大的優(yōu)勢在于會100%被用戶看到，無法忽略，否則將不能進行其他操作，很適合產(chǎn)品的一些重要事件提醒，例如應用升級、活動通知、優(yōu)惠券引流等。
4）Toast 通知
Toast通知是用戶在操作之后給出的即時反饋，與當前頁面內(nèi)容關(guān)聯(lián)性極強，但不會中斷用戶的操作，出現(xiàn)的時間很短，一般持續(xù)3秒后自動消失，對用戶的干擾也比較小。
需要注意的是，Toast容易在用戶不注意的情況下被遺漏，所以適合用于操作后不影響大局、且不可二次操作、不可逆轉(zhuǎn)的輕量提示，例如刪除成功、提交成功等。
1）桌面小紅點
小紅點通常以圓點+數(shù)字的形式出現(xiàn)在圖標右上角，用來提示應用內(nèi)的未讀消息數(shù)量，進入應用查看或清除后小紅點則會消失。桌面小紅點有一個必備前提，需要同時開啟設備和應用內(nèi)的通知權(quán)限方能接收提醒通知。
在部分應用中，桌面小紅點具有較大的價值，能對用戶產(chǎn)生積極的影響，使用頻率得到進一定的提升。例如：社交類應用中的私信、評論、點贊等；商家端的咨詢信息、下單提醒等，用戶在看到后都會有強烈的點擊欲望，對一些數(shù)據(jù)的提升起到推動作用。
2）PUSH推送
PUSH推送通知常見于設備頂部橫幅（幾秒后消失）、通知中心以及鎖屏后的中部區(qū)域，用戶可從卡片中的內(nèi)容獲取信息類型及重要程度，用以決策是否需要立即打開。
這種推送方式，用戶幾乎很難忽略，不處理的話會長時間浮于屏幕之上，非常適合價值及時效性較高的消息通知。除視覺提醒之外，還可通過聽覺觸達用戶，例如支付號、微信的收款信息等，不過依然要同時開啟設備和應用內(nèi)的通知權(quán)限。
3）手機短信
短信推送是大家很熟悉的通知渠道了，畢竟現(xiàn)在都是用手機注冊賬號，手機號獲取難度幾乎為“0”，常見的有驗證碼短信（用戶請求）、營銷短信（產(chǎn)品推送）兩種：
驗證碼類似“一問一答”的互動，沒有什么特別的玩法；
營銷類短信對于拉取新用戶、老用戶召回、節(jié)日/活動促銷能起到不可替代作用，產(chǎn)品可通過短信發(fā)送圖片、文字以及超鏈接，內(nèi)容的時效性、用戶的觸達率都相對較高。
著重說明一點，因為短信通知的成本較高，在使用之前需要足夠的思考分析，細分用戶群體做到精準投放，避免所花費的成本與產(chǎn)生的價值不成正比。另外，如果需要放超鏈接，那么短信內(nèi)容一定要有足夠的說服力及吸引力，總是被用戶當做詐騙短信刪除、舉報的話還不如不放。
為了減少對用戶的打擾，讓產(chǎn)品更人性化，一般會在短信結(jié)尾提供TD（退訂）提示，用戶回復即可取消后續(xù)的推送，但是否真的取消成功，這就得看產(chǎn)品了(???)...
4）電子郵件
電子郵件推送方式使用的并不多，一方面需要產(chǎn)品有web端服務，純粹的移動端APP郵件推送不會有什么效果；另一方面，絕大多數(shù)的用戶登錄電子郵箱并不頻繁，還容易被用戶一鍵清理或誤刪。
電子郵件唯一的好處就是用戶可通過超鏈接直達內(nèi)容出處，相比APP應用，免去了下載等一系列操作，還可以長時間滯留，便于用戶隨時查看或添加星標，處理時間段選擇較為靈活，很適合web端服務。針對一些商業(yè)化的郵件推送，也需要花費一定的經(jīng)濟成本。
產(chǎn)品獲取用戶郵箱地址的難度較大（郵箱賬號除外），不難理解，使用手機號一鍵登錄、驗證碼登錄、第三方賬號登錄遠比郵箱地址登錄要方便的多。除此之外，還可以通過個人設置的添加郵箱、問卷調(diào)查的郵箱地址預留來獲取，不過這就要看用戶的主動意愿了。
5）公眾號消息
公眾號背靠社交應用，普及程度及用戶觸達率是極高的，不過這需要產(chǎn)品利用部分業(yè)務、活動為導向，引導用戶關(guān)注公眾號后方能接收到消息通知。
目前公眾號只能向用戶發(fā)送符合部分場景要求的服務通知，例如刷卡通知、物流軌跡變化、商品購買等。如果預算足夠的話，還可以購買公眾號列表、內(nèi)容詳情頁、朋友圈等產(chǎn)品廣告位進行特定用戶群體推送，無需用戶關(guān)注也可以看到并進行轉(zhuǎn)化。
用戶一旦關(guān)閉通知權(quán)限，對產(chǎn)品來說無疑是一個損失，這意味著沒有消息通知的推動，用戶的使用頻率以及與產(chǎn)品之間的互動顯然會減少（就連夫妻之間都需要時?；优c溝通交流，何況對于有選擇余地的產(chǎn)品），時間長了，用戶轉(zhuǎn)投其他產(chǎn)品的“懷抱”也不是不可能。
有沒有想過，用戶只是關(guān)閉通知權(quán)限而已，并沒有卸載APP，真的就沒辦法了嗎？是不是該做點什么...
用戶之所以還未卸載APP，說明還有價值，歸根結(jié)底，關(guān)閉通知權(quán)限的原因都是因為消息的“狂轟亂炸”帶來的無盡騷擾，幾乎沒有例外，而產(chǎn)品還會添上一把火，用戶再次打開APP時無底線的催促用戶再度開啟，耗盡用戶最后一點耐心后，或許再也沒有機會了。
這個時候，設計師考慮的不是頻繁提醒用戶開啟，而是用戶關(guān)閉通知的真正原因（“狂轟亂炸”只是概括），細化各種可能性，然后從中找出機會點，但凡有所改進都值得試一試，畢竟相比什么都不做不會更糟。這么解釋似乎毫無說服力，下面舉個例子：
當產(chǎn)品中的某項免費服務突然有一天開始收費了，但受到了大多數(shù)用戶的抵觸，這個時候你該怎么做，是無視用戶訴求繼續(xù)收費、還是恢復到之前的免費？這并不是一個選擇題，繼續(xù)收費會導致大量用戶流失、恢復免費可能連維持運營成本都難，所以不經(jīng)思索的選擇草草收場、連下下策都算不上。用戶抵觸的原因可能收費過高或是與實際價值不符，有沒有想過利用限時折扣、附加其他增值服務（成本較?。┗蛘呓M合捆綁銷售也不失為一種策略。
那么，到底該如何做既能愉快的發(fā)送消息通知、還能能挽回用戶的心呢？
用戶關(guān)閉通知權(quán)限，并非沒有需求，最典型的就是在某寶、某東加了滿滿一“車”商品等待降價，然后抱怨消息通知太吵關(guān)掉了通知權(quán)限，最后就是無法收到折扣通知、還把問題怪在了APP身上，著實太冤。用戶只要還有需求，通知權(quán)限就還有被重新開啟的機會。
1）損失厭惡/利益引誘
首先，我們需要找出對應的價值點，利用優(yōu)秀的文案給予用戶思考的余地，用戶每多思考一會，結(jié)果都有可能發(fā)生改變。
人們都討厭失去，對于損失的不可控很難接受，在引導用戶開啟通知權(quán)限時，需要強調(diào)不開啟會失去什么，畢竟面對“得到”和“失去”時，損失更加讓人難以忍受，例如物流產(chǎn)品告訴用戶“未開啟通知，將錯過重要的快遞信息”。還可以通過激勵等進行利益引誘，如“開啟后能及時獲取紅包卡券、折扣通知”等，并提供快捷通道，促使用戶重新開啟通知權(quán)限。
2）消息分類/分別處理
每種類型的通知都不可能符合所有用戶的“胃口”，針對社交、電商類產(chǎn)品，可將通知類型分類處理，用戶希望接收哪種類型的消息單獨開啟即可。
例如支付寶將消息拆分為多個類型；京東還增加了午休免打擾設置，開啟后在12：30-13：30不會收到任何消息提醒；微信群過多、消息太吵時，開啟免打擾又擔心錯過重要人的信息，于是微信在去年上線了開啟群消息免打擾后、可設置群內(nèi)4個人的消息正常通知，算是比較人性化的設計了。
3）提供關(guān)閉/關(guān)不徹底
部分產(chǎn)品提供了關(guān)閉消息通知功能，但又關(guān)不徹底，這是產(chǎn)品基于妥協(xié)的基礎上，依然在低頻推送消息的“流氓”玩法，與用戶完全關(guān)閉相比，已經(jīng)算是不錯的結(jié)果了。
常見于PC客戶端，就像很多軟件的插件一樣，不管怎么關(guān)，總是無法徹底關(guān)閉，甚至還將開啟操作偽裝成其他內(nèi)容引導用戶誤觸；手機短信推送也會有這種情況，用戶回復過“退訂”后依然會收到相關(guān)短信。
這種方式需謹慎使用，在用戶關(guān)閉通知后，需通過后續(xù)推送內(nèi)容的質(zhì)量、頻率試探用戶底線，然后逐漸提升，切不可無視用戶操作。
反復推送相同的內(nèi)容只會讓用戶更加反感，回復退訂、卸載應用都可能在這一刻發(fā)生。
很明顯，消息發(fā)出后，如果用戶的觸達率較高就沒必要再次推送。反之觸達率較低，重復推送會讓用戶有種被催促、脅迫的感覺，適得其反，觸達率低有沒有可能是文案不夠友好、表達不夠清晰或者吸引力不夠？即便同一件事情，也盡量使用不同的表達方式，如何想辦法重新引起用戶的關(guān)注才是關(guān)鍵點。
中華文字博大精深，且有56個民族，其性格習慣各異，特別在利用當前社會熱點、媒介進行的營銷推送時，盡可能規(guī)避掉敏感信息，如地域/民族歧視、性暗示等。
很多時候，消息推送太少無法滿足產(chǎn)品目標、太多則會惹惱用戶導致通知權(quán)限被徹底關(guān)閉，所以不僅要考慮消息推送頻率，更重要的是對受眾群體進行分類、分別推送，不要每次都一股腦的將消息發(fā)給所有用戶，當然，能做到千人千面（成本大）則會更好。
沒有用戶愿意在不明所以的情況下來看長篇大論的內(nèi)容，需確保消息內(nèi)容簡單直接、清晰易懂，并符合用戶認知習慣，還得保持友好的語氣以及富有創(chuàng)造力的品牌形象。
處于營銷目的時，可利用感興趣的事件/事物勾起用戶的點擊欲望，例如網(wǎng)絡熱詞、時下熱點等，筆者雖然并不提倡“標題黨”，但不得不說，很多標題黨都能起到不錯的效果。
消息通知需要一個有效操作入口，并且在消息內(nèi)容中有對應的指向，點擊應用內(nèi)通知切換APP界面、應用外推送鏈接跳轉(zhuǎn)至web頁，從始至終都需要為用戶提供一個查看更多內(nèi)容或參與的有效途徑。
消息通知設計的主要目的是在正確的時間、以正確的方式將內(nèi)容呈現(xiàn)給用戶，并提高產(chǎn)品的轉(zhuǎn)化率，不管用戶愿不愿意接受，這始終都是一個呈現(xiàn)信息的不錯途徑。
本文主要總結(jié)了消息的通知渠道、常見問題處理、提升用戶觸達率的方法，以幫助新手設計師快速掌握完整的消息系統(tǒng)?；蛟S最終的結(jié)果事與愿違，但不能否認其魔力，需要做好的是確保消息內(nèi)容質(zhì)量、對應的受眾群體及合理的推送渠道，相信總有一種方式適合你產(chǎn)品。
作者：大漠飛鷹CYSJ 來源：站酷
藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請加微信ban_lanlan，報下信息，藍小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責聲明：藍藍設計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( m.yvirxh.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
前幾天眼睛不太舒服，去醫(yī)院做了一個檢查（視疲勞導致）。因為要走商保，所以要使用社保卡，之前我記得用社保結(jié)算都需要去人工窗口，我剛過去就被一個穿著紅馬褂的大媽攔住說自助機也可以用社保，要我掃她胸前掛的碼（可以快速到達電子社保二維碼界面），掃完她就開始幫我點擊操作。
她覺得我應該不會操作，所以讓我看一遍，其實這個操作并不難，只是因為我不知道自助機上可以用，自助機周圍也沒引導操作流程。而且她這種方式讓很多年紀大的人和外地過來看病的覺得你是個騙子，后面好幾個人都還是去了窗口。
在B端產(chǎn)品中也有很多類似問題，用戶不知道有這個功能、也不知道這個功能怎么使用，特別是一些大數(shù)據(jù)產(chǎn)品，專業(yè)性比較強。產(chǎn)品、技術(shù)都認為用戶和他們一樣都懂，實際上并不是，這個時候你需要提供一些邀請，引導用戶進行使用。
邀請就是引導用戶進行操作前的提醒和暗示，通常包括實時的提示信息和預期功能，以表明在下這個界面或下個界面可以做什么，這是成功的交互式界面關(guān)鍵所在。
例如：飛書我的空間，當鼠標停留在可編輯區(qū)域上時，就會實時地顯示邀請（復選框），這個例子的缺點是鼠標如果不處于相應區(qū)域上，就不會顯示邀請。
另一種方案是任何時候都顯示邀請，例如：石墨文檔我的桌面，復選框一直顯示。
靜態(tài)邀請就是通過直接在頁面上給出交互提示，可以讓用戶隨時看到期望的界面功能。
靜態(tài)邀請主要有兩種模式：引導操作邀請、漫游探索邀請
例如：華為云HECS服務器產(chǎn)品就給出1、2、3操作步驟 引導操作會占據(jù)頁面較大的空間，同時也會吸引用戶的眼球。所以在設計時需要思考一下，你希望引導用戶執(zhí)行什么操作，用戶是否可以多次查看，這樣有利于設計出明晰的頁面和信息層。
另一種引導操作邀請叫作白板式引導。 意思很明確：現(xiàn)在只有一個空白頁面，需要引導用戶創(chuàng)建內(nèi)容。
利用空白區(qū)域“變廢為寶”，如何對該區(qū)域應有的功能給出提示，是誘導用戶創(chuàng)建內(nèi)容（填補空白）的有效方式。
與引導操作邀請關(guān)系密切的是漫游探索邀請。假設你重新設計了某個頁面并添加了一組全新的功能，怎樣才能保證用戶恰當?shù)厥褂眯马撁?，同時發(fā)現(xiàn)新添加的功能呢？漫游邀請是向用戶介紹新功能最好的方法。
1、漫游功能用戶可能不想用，所以需要有可選功能，也就是可以跳過或關(guān)閉；
2、漫游功能不是“創(chuàng)可貼”不要亂用，只有針對精心設計的界面使用才能發(fā)揮價值；
3、設計漫游的關(guān)鍵在于保持簡單，讓它容易開始也容易停止。漫游應該只是頁面本身的一個演示。脫離頁面的“教程”式漫游很難起到作用。
靜態(tài)邀請適合提示用戶當前界面中包含什么功能。然而，許多調(diào)查試驗表明，用戶經(jīng)常不會閱讀指導說明性的文字。而在用戶交互過程中，在他們需要的時候提供邀請則是一種不錯的方式。動態(tài)邀請就是在用戶交互過程中的某個點上吸引用戶，并引導他們繼續(xù)下一步操作。
吸引用戶的一種方式是通過鼠標懸停來顯示邀請
例如：飛書消息列表鼠標移入后， 背景變化的同時會有一個“勾”圖標來吸引用戶，鼠標移入上去后提示可以勾選完成，點擊完成后消息移除列表。
1、當操作沒有內(nèi)容重要，而且希望界面整潔時，使用懸停邀請。
2、在實現(xiàn)懸停邀請時，可以通過改變光標、改變背景和顯示提示條共同配合表明所邀請的操作
3、在交互的不同階段，盡量點綴一些用戶熟悉的元素，通過熟悉的概念引出新概念有助于用戶快速理解新功能。最常見的元素是按鈕、鏈接、下拉箭頭和眾所周知的圖標。
4、通過距離表明邀請操作的目標對象。
唐納德·諾曼將這個術(shù)語引入到設計領域。最經(jīng)典的例子是門把手，門把手的預期功能是可以抓握、扭轉(zhuǎn)或按壓。屏幕元素可感知的預期功能沒有物理屬性，不過，由于習慣、術(shù)語、圖形及一致性等原因，用戶能夠在某種程度上感覺到他們可以操作這些元素。
例如：第一張圖飛書文檔sheet頁“加號”圖標與第二張圖“三個點”圖標，就是一種預期功能邀請。用戶沒觸發(fā)之前就能猜到觸發(fā)后會是什么效果。
預期功能邀請之所以有效，是因為利用人們已知的習慣與認知引入交互，從而讓用戶順利完成一連串操作。
1、通過人們習以為常、司空見慣的概念來引出新的、不熟悉的交互方式。
2、使用可感知的預期功能來給出邀請?zhí)崾?例如，用向下的箭頭表示可以打開下拉菜單，而用向上的箭頭表示可以關(guān)閉菜單)
3、把邀請安排在適當?shù)纳舷挛闹?，特別是要靠近交互的主體。
設計邀請時怎么才能猜測用戶的想法，也是一項重要挑戰(zhàn)。如果用戶下一步可能會執(zhí)行多種操作，而事實上又不可能準確判斷用戶想法，那么面臨的困難就會比想象的大很多。
在google sketchup （ 3D）繪圖工具中，當鼠標點擊某個點后，進行第二個點連接時，會有多種可能性，這個時候系統(tǒng)也不確定用戶會怎樣連接，但會給出對應的提示，比如：端點、中點、背面、側(cè)面等點位來輔助用戶進行連接。
例如：這種工作流場景個人覺得也算是一種，點擊“加號”右側(cè)會滑出面板，給出你可以添加的動作。 這種在交互期間以可見方式向用戶表明系統(tǒng)推斷出的用戶想法被稱為推論邀請。
圖片類型的更多邀請，例如：站酷相關(guān)推薦
文字更多邀請，例如：QQ郵箱右側(cè)最近聯(lián)系人
精心設計的應用能夠通過邀請體現(xiàn)出各自的細微差別，無論是靜態(tài)還是動態(tài)，都是引導用戶順利進入下一個交互層次的有效方法。
謝謝觀看！
搜索的本質(zhì)是什么？無疑是內(nèi)容的召回和信息的推薦。
可隨著時代的發(fā)展和行業(yè)公司的內(nèi)卷，不少公司除了持續(xù)優(yōu)化搜索結(jié)果與推薦外，在搜索的體驗和彩蛋上也是下了不少功夫，從而進一步加強自有產(chǎn)品的競爭力與用戶黏性。因此今天就來盤點一些，那有意思的大廠搜索交互。
大體上分為兩類：彩蛋流和體驗流
注重提升搜索過程中的趣味程度，以增加用戶的好感度與產(chǎn)品印象/口碑。行業(yè)代表：谷歌瀏覽器、百度瀏覽器
可以說是搜索彩蛋的先行者，內(nèi)置了很多搜索關(guān)鍵詞的有趣彩蛋，如娛樂角色：搜索【滅霸】，頁面右邊會打響指，相關(guān)字段會被’毀滅‘掉
搜索【馬里奧兄弟】，右邊也有游戲里一樣的點擊彩蛋
還有各種有意思的搜索結(jié)果比如搜：is google down（谷歌關(guān)閉了嗎），搜索結(jié)果優(yōu)先顯示：NO
再如搜索《銀河系漫游指南》的一句話：the answer to life, the universe, and everything。此時搜索結(jié)果頁會自動計算成42。貌似也只有讀過《銀河系漫游指南》的人才能明白其中的奧秘。聽說是生命、宇宙與萬事萬物的終極解答。
而且在日常的節(jié)日、活動、熱點運營上，谷歌也從不缺席。都會在搜索框上用【插畫、動效】等形式承載各種活動入口、吸引用戶參與，可以已經(jīng)形成一個穩(wěn)定、具有品牌感的企業(yè)文化了。
如各種復活節(jié)、開學季、母親節(jié)動效。而且更多有趣、創(chuàng)意的設計案例，可上：有蛋案例 youdananli.com 近千個行業(yè)/大廠里的創(chuàng)意案例、上百個知識模型、設計方法。
百度在搜索彩蛋里下的的功夫也不少，最著名的應該是搜索【黑洞】時，頁面上會出現(xiàn)黑洞的吸入特效。
而且和谷歌相同，在其他的搜索關(guān)鍵詞上，百度也是埋下了不少彩蛋，比如：搜索【翻轉(zhuǎn)】，頁面會左右翻過來
搜索【跳躍】，頁面會在上下跳動
搜索【失重】，頁面上的字會飄起來?
而在【活動運營】上，百度也是很有心地進行著創(chuàng)新設計，力求給用戶一種眼前一亮的感覺。比如每年的愚人節(jié)，搜索結(jié)果頁上都有‘調(diào)戲’用戶的創(chuàng)意設計，各種輕松調(diào)皮的畫風 給不少用戶帶來了新鮮感和趣味性。
還有在【活動入口】的設計上也是特別有想法：在某年的圣誕節(jié)上，百度創(chuàng)新性地將活動入口’嵌套‘在結(jié)果頁卡片中間，用活動里的ip形象-雪人「抬著」結(jié)果頁卡片和在上面「滾動」
用這種充滿創(chuàng)意+應景的的入口設計與引導方式，最大限度地降低漏斗，吸引讓更多用戶參與該活動。另外，百度搜索框上面的運營活動入口，也和谷歌有異曲同工之妙。
而且更多有趣、創(chuàng)意的設計案例，可上：有蛋案例 youdananli.com 近千個行業(yè)/大廠里的創(chuàng)意案例、上百個知識模型、設計方法。
注重提升搜索過程中的交互體驗，以增加用戶的操作效率與產(chǎn)品易用性。
代表：蘋果產(chǎn)品、夸克瀏覽器
·iPhone
iPhone的【桌面搜索】除了能查詢手機上的各種信息、文件，它還自帶了【匯率轉(zhuǎn)換和計算器】。在搜索框輸入【數(shù)學公式、匯率轉(zhuǎn)換】時會自動計算對應的結(jié)果。無需用戶額外打開計算器、瀏覽器，大大減少操作鏈路。
在iOS的原生鍵盤里，可以根據(jù)輸入詞檢測+搜索對應的手機號碼：當你輸入 【打+我或通訊錄好友+電話】時，鍵盤上會自動顯示自己或好友的電話號碼，點擊號碼就能自動粘貼在輸入框中。
用戶無需前往通訊錄就能輕松「獲知+想起」誰誰的電話號碼，大大提升操作體驗與效率
·Mac
在Mac電腦的工具欄上搜索相關(guān)幫助時，系統(tǒng)會直接把該結(jié)果所對應的頁面位置調(diào)取出來并懸浮展示。用戶可以直觀地該結(jié)果在哪里，并減少尋找的操作路徑，免去多余操作
在Mac電腦的‘系統(tǒng)偏好設置’里搜索幫助，在結(jié)果列表上會以聚光燈的形式展示各個結(jié)果入口。選擇具體某個結(jié)果時，該入口的聚光燈會更清晰些，特別容易找到搜索結(jié)果。
夸克瀏覽器除了傳統(tǒng)的「點擊搜索框」喚出輸入欄外，在屏幕任意位置下滑手勢同樣可以喚出搜索框。
降低「需要往上手指移動，才能點擊搜索框」的操作成本，讓用戶更快、更精準地觸達搜索。
而且在輸入網(wǎng)址或英文等字段時，搜索框下方會出現(xiàn)一個滑塊區(qū)。點擊就會變成長條的滑塊，拖拽滑塊即可改變光標位置。
而且更多有趣、創(chuàng)意的設計案例，可上：有蛋案例 youdananli.com 近千個行業(yè)/大廠里的創(chuàng)意案例、上百個知識模型、設計方法。
讓用戶更方便地將光標快速移動到想要的位置中，以便更快地搜索信息，大大降低操作成本。而且夸克還會前置搜索結(jié)果， 比如在搜索框中輸入“某城市+天氣”的關(guān)鍵詞，上方就會以卡片的形式顯示該地區(qū)最近一周的天氣。
用戶無需觸發(fā)搜索、進入結(jié)果頁才能看到想要查詢的信息。
– END
藍藍設計的小編 http://m.yvirxh.cn