引言

如今人們出行都離不開手機(jī)，都通過手機(jī)接觸過互聯(lián)網(wǎng)地圖，手機(jī)地圖憑借著可手勢直觀操作、地圖可快速迭代、信息可實時更新的優(yōu)勢，形成了成熟的地圖交互體驗。在解析手機(jī)地圖的體驗設(shè)計前，讓我們先看看地圖的發(fā)展歷程。

一、地圖的發(fā)展

地圖擁有著古老的歷史，記錄了人類對世界認(rèn)知的演進(jìn)過程，經(jīng)歷過泥板、壁畫、羊皮、紙張等載體，依據(jù)使用和文化需要擁有著豐富多樣的美術(shù)形式。不同時期、材質(zhì)、美術(shù)形式的地圖見證人們認(rèn)識世界的過程。

隨著照相機(jī)和飛機(jī)的發(fā)展，出現(xiàn)了航空攝影測量技術(shù)，讓地圖的測繪精準(zhǔn)度達(dá)到頂峰。交通、旅游、印刷業(yè)的發(fā)展，讓紙媒地圖開始融入人們的生活，地圖的平面設(shè)計更是百花齊放，有具體也有抽象，讓地圖兼顧功能、美感、有趣。

再隨著衛(wèi)星影像、瓦片地圖技術(shù)和互聯(lián)網(wǎng)的發(fā)展，人們可以日常地使用電子地圖。受限于網(wǎng)絡(luò)速度的限制，矢量地圖應(yīng)運(yùn)而生，在特定范圍顯示相應(yīng)的矢量瓦片信息，讓互聯(lián)網(wǎng)地圖的形狀趨向統(tǒng)一化。

iPhone革命性的觸屏體驗，通過手勢與地圖進(jìn)行直觀自然的交互體驗，結(jié)合內(nèi)置GPS、陀螺儀傳感器，小藍(lán)點成為地圖定位的通用標(biāo)志，激發(fā)更多地圖的功能和創(chuàng)意。

二、手機(jī)地圖的創(chuàng)新體驗

手機(jī)地圖繼承了互聯(lián)網(wǎng)電子地圖的可快速迭代、信息可實時更新的優(yōu)勢，結(jié)合觸屏手勢操作后，大大的提升了地圖展示信息的維度。電子地圖從工具逐步被引入到各種垂類服務(wù)和社交娛樂中，這些場景也不斷豐富和完善著地圖的信息。

手勢交互讓地圖從移動到縮放都高效地動起來，激勵人們探索更廣的區(qū)域。更革命性的是讓地圖從平面到立體之間的順滑轉(zhuǎn)換，幫助人們更好的映射到真實世界。 

可視化信息是互聯(lián)網(wǎng)地圖的主要優(yōu)勢之一，將數(shù)據(jù)轉(zhuǎn)化為可視化圖形，歸類在不同的數(shù)據(jù)層，可以單個或多個層級疊加在地圖上展示，傳達(dá)位置上的數(shù)據(jù)。 

底圖是手機(jī)地圖的基礎(chǔ)，通常就是地圖本身，它承托著上面的可視化信息。隨著地圖可更自由地縮放，地圖本身的內(nèi)容不斷細(xì)化和歸類，在不同的縮放層級下，展示符合用戶查看場景的核心內(nèi)容。

三、手勢交互：全方位呈現(xiàn)地圖立面

觸屏手勢交互有別于搖桿、鼠標(biāo)、觸控筆等物理外設(shè)的控制方式，讓用戶在小小的屏幕對大范圍的地圖有更隨心所欲的操作，讓原本受矢量圖形限制的地圖有了更多層次、更豐富立面的信息呈現(xiàn)方式。

單指拖動

拖動是地圖最基本的閱讀操作，一般以用戶的定位為初始中心點，用戶可以有目的有方向地查看附近的地點。

單指劃動

當(dāng)用戶想快速翻閱時會撥走要略過的內(nèi)容，劃動模擬了這一行為。地圖被劃動后也會模擬物理世界以一定的摩擦力停下，向用戶展示地圖的新區(qū)域，是比拖動要快速的瀏覽方式。

雙指拖動縮放

物理控件只能讓地圖根據(jù)屏幕中心進(jìn)行縮放，而觸屏縮放能讓地圖根據(jù)兩個指尖的中心點縮放，并同時位移，符合用戶空間操控認(rèn)知。

雙指劃動縮放

劃動縮放和劃動一樣，讓用戶以更輕量的手勢加速的縮放地圖，并以一定的摩擦力減速停止，讓用戶快速找到目標(biāo)位置。

單指快捷縮放

為了讓用戶能單手并可控地縮放地圖，不少地圖都設(shè)計了自己獨(dú)有的縮放方式。 zenly，通過屏幕兩側(cè)的邊緣，直接完成地圖的最大和最小縮放跨度。

snapchat拖動右側(cè)邊可緣喚起縮放滑塊，并使用emoji來表達(dá)距離，充滿幽默感。

騰訊地圖，通過劃動右側(cè)的滑塊，實現(xiàn)單手順滑地縮放，滑塊也支持劃動手勢。

百度地圖，通過點擊一個縮放控件，讓地圖以當(dāng)前中心點進(jìn)行分段縮放。

無限循環(huán)的地圖

地球是圓的，可以無限巡航，一些應(yīng)用將縮到最小的世界地圖做循環(huán)處理，以呼應(yīng)地球的循環(huán)轉(zhuǎn)動體驗。

方向視角切換

在陌生的環(huán)境用戶未必能分得清楚南北方向，利用手機(jī)的陀螺儀，可以告知用戶正在面向的方向。定位按鈕的二次點擊，將地圖從南北向轉(zhuǎn)到用戶面向的方向，有助于用戶二次確認(rèn)自己的定位。

更多地圖使用了2D/3D視角的切換方式，2D是南北向的標(biāo)準(zhǔn)地圖，3D是用戶面向方向的地圖，幫助用戶更直觀地對應(yīng)物理空間。

旋轉(zhuǎn)方向

可通過雙指或陀螺儀旋轉(zhuǎn)地圖，地圖上的文字也做出相應(yīng)調(diào)整，保持水平、沿道路方向調(diào)整，以保證可讀性。

3D的旋轉(zhuǎn)也一樣，在保持水平和沿道路方向的同時，文字保持垂直。

當(dāng)縮小到足夠遠(yuǎn)時，用戶面向的方向意義就不大了，蘋果在縮小到一定范圍時，將地圖回彈保持南北向。

雙指拖動調(diào)整視角

地圖3D視角也支持自由調(diào)節(jié)，通過雙指平行的上下滑動，可以平順調(diào)整3D視圖鳥瞰的角度。

在地圖的最低視角做回彈處理，生動不呆板。

遠(yuǎn)近也能影響鳥瞰的視角變化，視角越低越接近平視，拉進(jìn)時有俯沖的感覺。

四、可視化信息：生動呈現(xiàn)地圖動態(tài)數(shù)據(jù)

從古代開始，人們就已經(jīng)懂得通過繪制山脈、河流、海洋、建筑等對重要位置信息進(jìn)行標(biāo)記，地圖本身就是一個信息可視化工具。 互聯(lián)網(wǎng)地圖最大的優(yōu)勢，就是能提供實時的信息數(shù)據(jù)。將數(shù)據(jù)標(biāo)記在相應(yīng)位置的坐標(biāo)上，并分別歸類在不同的層級，疊加在地圖上查看。

地圖的常用數(shù)據(jù)形式可大致分為：點、線、面、熱力圖等，一個地圖可同時喚起多種類型、多個圖層的信息內(nèi)容。

點數(shù)據(jù)

點數(shù)據(jù)是單個地理坐標(biāo)上的標(biāo)記，代表該位置上的信息，是地圖上最常用的數(shù)據(jù)信息。地圖通過不同的小圖標(biāo)來區(qū)分位置類型，使用頻率越高的樣式越簡潔，地標(biāo)建筑做形象化圖形標(biāo)識。

聚合圖在地圖上呈現(xiàn)也是點數(shù)據(jù)，它實質(zhì)是顯示一定區(qū)域內(nèi)的信息聚合，但不強(qiáng)調(diào)具體的區(qū)域。聚合圖可以避免因為該區(qū)域的點數(shù)據(jù)過多，在地圖上信息過于密集。

百度的充電樁地圖就是以區(qū)域聚合充電樁數(shù)量，根據(jù)縮放調(diào)整數(shù)據(jù)的聚合。

騰訊地圖的文博地圖也是聚合圖，并根據(jù)文物的類型做了快速篩選。

線數(shù)據(jù)

線數(shù)據(jù)在地圖上呈現(xiàn)為線性，一般都沿著可行道路展示信息。導(dǎo)航路線是最常用的線數(shù)據(jù)，它提供具體行駛路線方案，并實時展示線路行駛的進(jìn)度與方向。

也有粗略表示進(jìn)度的線路數(shù)據(jù)，如快遞的物流進(jìn)度路線就不需要具體的實際線路，只需要示意大致進(jìn)程。

街景地圖則僅展示有全景圖的道路范圍，不提供進(jìn)度與方向。

面數(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)容，由于熱力圖不指向具體位置，能更好的保護(hù)用戶隱私。

熱力圖并不局限于面，路線也可以反映道路的熱度。Strava利用用戶的騎行數(shù)據(jù)，生成光點線路的熱力圖，可以看出哪些是熱門的騎行線路和必經(jīng)地點。

路況也是一種線性的熱力圖，路況使用按段測量的方式，熱力值的梯度相對跳躍。

讓數(shù)據(jù)動起來

地圖是安靜的，但真實世界是忙碌的，讓數(shù)據(jù)動起來，給地圖增添更多情感化設(shè)計，緩解用戶的等待壓力。

忙碌的商家

外賣小哥端午節(jié)雨中送餐

公交努力奔來

五、底圖：為更好呈現(xiàn)信息的色彩系統(tǒng)

手機(jī)地圖的底圖最常使用矢量瓦片地圖，因為數(shù)據(jù)體積小，在互聯(lián)網(wǎng)環(huán)境下讀取速度快。矢量地圖用幾何圖形來表達(dá)區(qū)域，不展示具體細(xì)節(jié)，因此需要通過顏色去傳達(dá)不同區(qū)域的屬性或功能。 

人們對于顏色和環(huán)境是能建立一定的聯(lián)想的，如綠色想到大自然，藍(lán)色想到水，紅色想到警示。根據(jù)人們對色彩的聯(lián)想，給矢量地圖中不同屬性的區(qū)域進(jìn)行配色，幫助用戶理解地圖。谷歌地圖就曾經(jīng)為不同類型的信息標(biāo)記出700多種顏色，最后簡化為25個顏色，形成了地圖的色彩系統(tǒng)。

工具類地圖應(yīng)用以地圖為核心基礎(chǔ)，對矢量圖形有最全面的歸類，因而擁有最豐富的配色系統(tǒng)。由于人們對區(qū)域功能的顏色聯(lián)想是相似的，各地圖廠商的標(biāo)準(zhǔn)地圖的配色都很接近。地圖用色素雅，才能讓多個顏色能和諧的同時存在，降低用戶的視覺疲勞，并能突出地圖上的信息圖層，讓用戶聚焦所關(guān)心的數(shù)據(jù)。

而一些垂直場景的應(yīng)用，地圖區(qū)域功能的描述相對次要，通常會對地圖的用色進(jìn)行大幅度精簡。以打車應(yīng)用為例，地圖用色少且色調(diào)相近，突出核心的打車狀態(tài)信息顏色，同時體現(xiàn)應(yīng)用的品牌特色。

不少運(yùn)用地圖的概念設(shè)計中，會更極致的使用單色系地圖，僅突出數(shù)據(jù)信息的顏色，充滿未來感。

六、未來的地圖

隨著網(wǎng)絡(luò)速度的提升，手機(jī)硬件的升級，順應(yīng)AR/VR技術(shù)的發(fā)展，地圖逐步進(jìn)入3D和全真時代。蘋果地圖在現(xiàn)有的地圖的3D視圖下，已對地標(biāo)建筑賦予更多細(xì)節(jié)，并在夜間模式模擬了燈光效果。

3D地圖就像是虛擬世界中的基礎(chǔ)建設(shè)一樣，蘋果地圖添加精細(xì)地標(biāo)模型后，同時應(yīng)用到Carplay的導(dǎo)航中，在駕駛時可直觀看到與現(xiàn)實世界對應(yīng)的3D地標(biāo)。

谷歌更是提出“沉浸式視圖”的高保真3D地圖，使用圖像還原一座城市的面貌，為瀏覽一座城市提供了幾乎真實的鳥瞰視角。

同時全真模擬日照和天氣系統(tǒng)，和現(xiàn)實一樣模擬東升西落的光線方向，模擬晚上和雨天下的城市面貌。

隨著地圖的立體全真化，地圖的數(shù)據(jù)也將向空間延伸。相對全真地圖而言，人們本身就身置真實的地圖場景中，未來借助AR設(shè)備，人們無需對照地圖即可完成導(dǎo)航。

結(jié)語

地圖歷來是人們借助藝術(shù)的手法，以極具想象力的方式對世界進(jìn)行再現(xiàn)，它遵循科學(xué)測量的法則，使用幾何的線條和形狀對地球的進(jìn)行抽象化。地圖反映了制作者對世界的認(rèn)知，而現(xiàn)代的科學(xué)技術(shù)讓地圖呈現(xiàn)盡可能客觀。但地圖并非單純地呈現(xiàn)地球，而是呈現(xiàn)人們眼中的世界，它寄托著人們對美好生活的想象，更好的認(rèn)識、探索和規(guī)劃世界。

其實用戶故事還是由人物故事演化而來。

傳統(tǒng)的人物故事主人公一定是一個響當(dāng)當(dāng)?shù)拿?，至少是做出了某種貢獻(xiàn)的，并且這類的內(nèi)容傳播目的并不在于轉(zhuǎn)化或“帶貨”，而是為了傳遞某種價值觀。

或許我們可以把傳統(tǒng)的人物故事稱為“名人傳記”。

到現(xiàn)在，越來越多的企業(yè)、品牌，甚至是個人IP都在做用戶案例故事，而這類內(nèi)容與傳統(tǒng)人物故事恰恰相反：

1. 主人公可能是個名不經(jīng)傳的小人物
2. 除了體現(xiàn)正向價值觀，還另有目的
3. 內(nèi)容調(diào)性更接地氣

那么，如何讓用戶幫你的產(chǎn)品講好故事，賣得更好？接下來從三點展開說說。

一、明確做用戶案例故事的目的

以目的為導(dǎo)向，在決定做用戶故事/用戶案例分享前，首先要明確：

• 為什么要做用戶案例故事的項目？
• 希望通過用戶故事達(dá)到什么目的/效果？

一般做用戶故事，我們所期望達(dá)到的效果不外乎是以下三種：

1）品牌宣傳

通過用戶故事達(dá)到品牌曝光和宣傳的效果，讓用戶知道我們的品牌、知道有這么一個產(chǎn)品。

B端產(chǎn)品，且對接客戶是比較有名的公司，會比較適合使用客戶故事來進(jìn)行品牌宣傳。

比如：影刀RPA、三維家。

內(nèi)容結(jié)構(gòu)一般是某大公司使用了我們的產(chǎn)品，解決了什么問題，達(dá)到了一個怎樣的驚人效果。

2）產(chǎn)品介紹

這類產(chǎn)品的功能或許比較多，借助用戶故事來介紹產(chǎn)品及其功能的使用場景，并根據(jù)不同的用戶使用場景來給出具體的解決方案。

比如：印象筆記、訊飛智能錄音筆。

一般內(nèi)容結(jié)構(gòu)是用戶在某類場景下遇到什么難點，如何使用產(chǎn)品，達(dá)到了什么目的/收獲了什么。

3）種草營銷

如果是為了營銷，讓用戶種草某類產(chǎn)品而輸出用戶故事，那么此類故事要深究用戶的痛點和爽點，這樣才能精準(zhǔn)打動用戶，促使用戶進(jìn)行下一步的使用、購買等轉(zhuǎn)化動作。

比如：微眾銀行（理財產(chǎn)品）、人人都是產(chǎn)品經(jīng)歷（付費(fèi)課程）。

值得一提的是，像小紅書的種草筆記也是很不錯的素材，但對于種草軟文來說篇幅略短，需要擴(kuò)寫。

一般內(nèi)容結(jié)構(gòu)是用戶使用產(chǎn)品前后的對比、反轉(zhuǎn)，給人一種出其不意的效果，讀者看了后會覺得很爽，也想達(dá)到一樣的效果。

二、如何收集用戶素材并策劃用戶故事？

用戶故事的素材來源一般有以下幾個方式：

1）用戶投稿

最簡單快捷的方式就是由用戶自行撰寫，當(dāng)然如果能提前跟用戶溝通好主題、確認(rèn)好內(nèi)容框架，并且用戶文筆還不錯，那自然是最好的。但這個方式對用戶的門檻還是比較高的。

如果用戶故事想要追求真實性、接地氣，這類素材是最合適的。要是真能遇到一個很不錯的故事，還可以由官方再次編輯再進(jìn)行傳播。

素材收集渠道：官方自有投稿渠道、用戶外部平臺分享（如小紅書、微博、豆瓣等）。

2）征稿活動

策劃征稿活動，明確內(nèi)容主題、內(nèi)容要求，由用戶輸出，再由官方進(jìn)行二次創(chuàng)作。

二次創(chuàng)作的方式一般有2種：

①一篇長文

長文形式一般是在用戶原創(chuàng)的基礎(chǔ)上（此類用戶的創(chuàng)作水平一般，文案多以流水文形式呈現(xiàn)），對排版、邏輯、結(jié)構(gòu)進(jìn)行打亂重建，讓文章結(jié)構(gòu)整體更具邏輯性及可讀性，并突出產(chǎn)品優(yōu)勢，必要時可能需要加上一些“夸張手法”。

②一個專題

從大量稿件中篩選一批有相同點的精彩內(nèi)容，由官方匯總成專題，并加上官方導(dǎo)語、前言或結(jié)語等。這種形式的工作量會輕松很多，并且豐富性更強(qiáng)。

征稿方式：公眾號、官方社區(qū)、核心用戶群等官方自有陣地發(fā)布征稿活動。

3）征集話題

以話題形式征集用戶案例素材，官方借用相關(guān)案例進(jìn)行原創(chuàng)輸出。

手段跟征稿活動的方式差不多，但活動形式較后者更輕。話題討論對用戶和運(yùn)營方的壓力都不大，并且對運(yùn)營方來說可創(chuàng)作的自由性更大。

形式同樣可以長文或?qū)ｎ}的結(jié)構(gòu)來呈現(xiàn)，如果是專題，只需要把比較精彩的內(nèi)容呈現(xiàn)出來即可；如果是長文，需要提煉主觀點，再結(jié)合產(chǎn)品進(jìn)行小觀點的闡述。

征集方式：公眾號、官方社區(qū)、核心用戶群等官方自有陣地發(fā)布話題征集活動。

4）核心用戶采訪

這類素材是最真實、最有說服力的，但同時操作難度也是比較大的，并且還有一個隱形問題，就是你辛辛苦苦做了人物采訪，好不容易輸出了一篇自認(rèn)為很優(yōu)秀的用戶故事，但讀者卻不這樣認(rèn)為，各項數(shù)據(jù)可能都不會太好看。

但這類用戶故事是最適合做品牌宣傳的。因為你做了一個很高大上的東西出來，無論是掛在公司網(wǎng)站首頁，還是用來推廣產(chǎn)品，這都可以作為一個品牌的門面。

在方式上來說，可以采用問卷的形式，最終文稿還是由官方撰寫。問卷的形式最簡單便捷也是使用互聯(lián)網(wǎng)工作風(fēng)格的。

對于使用產(chǎn)品的核心用戶，他們既不會自行撰寫，也不會參與任何的話題討論，但是典型的使用用戶，那么可以根據(jù)他們對產(chǎn)品的使用習(xí)慣，提出相關(guān)的問題，以問卷或邀約訪談的方式進(jìn)行了解他們對產(chǎn)品的使用感受。

三、我們能給到用戶什么？

對于提供案例故事的用戶，最好能由官方給與一定的獎勵，哪怕是由用戶自發(fā)輸出的內(nèi)容，也應(yīng)當(dāng)給與一定的回應(yīng)，會顯得品牌方更有人情味。

當(dāng)然獎勵不一定非要實物獎勵或金錢獎勵，有時候一個肯定或感謝也能讓用戶感到很暖心。

一般回饋用戶不過就是“老四樣”：

1）金錢獎勵

根據(jù)用戶參與的程度、提供素材的豐富度、故事的完整度等設(shè)定不同等級的金錢獎勵標(biāo)準(zhǔn)。

2）物質(zhì)獎勵

對于參與的用戶，可以獎勵一些產(chǎn)品周邊、紀(jì)念品等實物。

3）榮譽(yù)獎勵

設(shè)置一些徽章、頭銜名稱給到用戶，比如xx代言人，xx宣傳官等。

4）流量獎勵

給與一些運(yùn)營位、廣告位宣傳參與的用戶或其公司，類似異業(yè)合作，此類獎勵適用于小有名氣的kol或商家用戶；

如果是B端產(chǎn)品的用戶，還可以有“人脈獎勵”，即搭建核心用戶社群或舉辦線下交流會，定期舉辦一些課程、培訓(xùn)等，不僅能幫助用戶搭建人脈橋梁，還能讓用戶有收獲知識的快感。

“三角測量”在用戶體驗研究領(lǐng)域正在變成一個時髦用語。它究竟是什么？它可以如何幫助你提高用戶洞察的質(zhì)量呢？

一、什么是“三角測量”？

1. 定義

“三角測量”這一術(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ù)進(jìn)行研究，或使用多種方法分析數(shù)據(jù)，以提升調(diào)查研究的可信度。

研究的可信度通常包含：

• 內(nèi)部有效性（或定性研究的可信度）：我們在測量自己想要測量的東西嗎？
• 外部有效性（或定性研究的可轉(zhuǎn)移性）：我們正在測量的東西可以運(yùn)用到現(xiàn)實世界嗎？
• 可靠性（或定性研究的可靠性）：如果我們再做一次研究，是否會得出同樣的結(jié)果？

2. 類型

Denzin [1] 認(rèn)為，沒有哪一種的方法、理論或觀察員可以捕獲一項研究中所有相關(guān)或者重要事物。而三角測量法正是被提出來解決這一問題的。Denzin 在 20 世紀(jì) 70 年代確定了四種主要類型的三角測量法，如今仍舊被研究學(xué)界廣泛地認(rèn)可。

（[1]諾曼·K.鄧津，伊利諾伊大學(xué)香檳分校社會學(xué)系榮譽(yù)教授，質(zhì)性研究法終身成就獎獲得者之一）

1）數(shù)據(jù)三角測量（多數(shù)據(jù)集）

指在一項研究中使用不同的數(shù)據(jù)源。尤其是，通過不同的樣本策略收集數(shù)據(jù)，例如收集不同時間、不同環(huán)境或不同的研究對象的數(shù)據(jù)。這種方法可以用其他數(shù)據(jù)的優(yōu)點來彌補(bǔ)當(dāng)前數(shù)據(jù)存在的不足，這樣可以提升結(jié)果的有效性和可靠性。

2）研究員三角測量（多研究員）

該方法指在同一調(diào)查中采用多個調(diào)查人員 / 評估人員。為了做好三角測量，每一位評估者都會使用相同方法（例如訪談、觀察）進(jìn)行相同的實驗，之后將所有評估者的發(fā)現(xiàn)進(jìn)行比較。如果所有研究人員都得出了一樣的結(jié)論，那么其有效性就成立。

在用戶體驗研究中，同樣可以通過讓多個研究人員分析同一組定性數(shù)據(jù)來實現(xiàn)。使用不同種族、年齡、性別和階級群體的研究人員可以糾正諸如觀察者或訪談?wù)咂姷膯栴}。

3）理論三角測量（多理論）

該方法只涉及一組數(shù)據(jù)，但研究人員會采用不同的理論或替代的理論進(jìn)行詮釋。人們甚至通過一些相互矛盾的理論視角來看待數(shù)據(jù)。

4）方法三角測量（多方法）

指在使用不同的方法來研究一種情景或現(xiàn)象。其目的是用其他方法的優(yōu)點補(bǔ)足某一種方法的不足和偏差。該類型的三角測量與在社會科學(xué)研究中所使用的“混合研究方法”（mixed-method approaches）類似，用一種方法得出的結(jié)果來提升、增強(qiáng)和闡述另一種方法的結(jié)果。

二、用戶研究中的“三角測量”

不同的方法可以解答不同的問題，但同樣也有一定的局限性。在用戶研究（或者說任何一種社會研究）中沒有哪種方法是完美的。

利益相關(guān)者或初級研究員們會經(jīng)常來問我，究竟該如何解決各種研究方法的局限性，我的解答通常就是“三角測量”。即使是計劃周密、控制得當(dāng)?shù)难芯咳耘f會存在局限。但針對特定的問題采用 多個視角（方法、數(shù)據(jù)點、研究人員以及理論），可以提升我們的信心，幫助我們獲得可信度。

在用戶體驗研究中，最常用的三角測量類型就是“方法三角測量”（例如通過調(diào)查和訪談來研究同樣的問題）和“研究員三角測量”（例如多個研究員分析同一組數(shù)據(jù)）。三角測量使我們對研究數(shù)據(jù)更有信心，揭示意想不到的發(fā)現(xiàn)，對現(xiàn)象有更清晰的認(rèn)識。

用戶研究中應(yīng)用三角測量的例子

針對一個問題使用多種方法進(jì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ù)算來進(jìn)行研究。但是事實是，我們通常會發(fā)現(xiàn)我們幾乎沒有足夠時間來嚴(yán)格執(zhí)行某一種方法，且資源有限。這就使得應(yīng)用三角測量具有相當(dāng)大的挑戰(zhàn)性，它無法應(yīng)用在我們所做的每個研究中。

所以我們應(yīng)該如何決定什么時候使用三角測量呢？

• 做高度重要工作時：我們無法每次做三角測量，但是當(dāng)需要做一些可能會影響業(yè)務(wù)和用戶的重要的決策（例如重大的重新設(shè)計），我們需要優(yōu)先考慮它。
• 你的團(tuán)隊中擁有多位研究員時：組成一個小組，讓至少 2 名研究員參與數(shù)據(jù)收集和分析的工作。這可以有效幫助你控制一些偏差（例如訪談?wù)咂姡?
• 與其他團(tuán)隊合作：當(dāng)開始一個新的項目時，你可以從查看現(xiàn)有數(shù)據(jù)和產(chǎn)品分析開始。讓數(shù)據(jù)分析師和產(chǎn)品經(jīng)理參與進(jìn)來。

前言

文字是設(shè)計中的重要組成部分，就像我們平時看到的海報，里面各種被精心設(shè)計過的字體經(jīng)常會成為視覺焦點，以醒目且個性化方式傳達(dá)出內(nèi)容的精髓，最后達(dá)到的效果事半功倍。
雖然在UI設(shè)計中不需要對文字過分設(shè)計，但圖文作為主要的傳播途徑，字體的使用是否規(guī)范合理將直接影響著信息傳播的優(yōu)先級、重要程度以及用戶的接收質(zhì)量和效率。所以不管是平面設(shè)計還是UI設(shè)計，字體都是不可忽視的核心元素，做好對文字信息層級的處理，對用戶的視覺體驗有著至關(guān)重要的作用。
互聯(lián)網(wǎng)經(jīng)過多年的發(fā)展，也積累的很多的專業(yè)字體知識，設(shè)計師應(yīng)該去了解字體的性格及特征并將其合理運(yùn)用，才能將信息更清晰的傳達(dá)給用戶。本文將圍繞著字型、字號、字距、字重等幾個屬性，針對各方面深度解析，希望能夠幫到大家。

分享目錄

一、字體的基本特征
二、字體的基本屬性
三、不同場景下的屬性參考
四、字體使用基本原則
五、UI設(shè)計需注意的問題
六、結(jié)語

一、字體的基本特征

1、使用前的思考

文字是信息內(nèi)容的載體，能最直接的將信息清晰的表達(dá)出來，字體則表現(xiàn)了文字的外在特征，合理的使用這些屬性特征不僅能清晰準(zhǔn)確的傳遞信息、用于特定場景還能賦予情感表達(dá)，展現(xiàn)出獨(dú)特的魅力，例如：健身、器械類的產(chǎn)品使用的字體通常會給人一種力量、剛硬、壯實的感覺，而女性專用產(chǎn)品字體則顯的纖細(xì)、苗條。

2.為什么要使用黑體

不同類型的字體傳達(dá)出不同的氣質(zhì)，綜合來講，字體可分為黑體、宋體、圓體、書法體這四類，平時大家看到的各種形形色色的其他字體，基本是通過這幾類延伸而來。
在UI設(shè)計中，絕大多數(shù)的文字排版用的是黑體，諸如思源黑體、阿里巴巴普惠體、蘋方（ios）、微軟雅黑（PC web）等都是標(biāo)準(zhǔn)的黑體。另外，特定場景如瓷片區(qū)、卡片、banner、專題頭圖、引導(dǎo)頁、閃屏等，對于用什么字體不會有太大的限制，在避免商用侵權(quán)的前提下符合產(chǎn)品氣質(zhì)即可。
黑體字的筆畫橫平豎直、粗細(xì)均勻且字面呈正方形，一般來說，沒有襯線的字體都可以稱作黑體。黑體結(jié)構(gòu)清晰、簡潔有力，能讓界面顯得莊重還附有現(xiàn)代感，雖然氣質(zhì)上沒有太大的個性化、但可塑性很強(qiáng)，這也是在UI設(shè)計中、黑體一直很受青睞的原因，無論是標(biāo)題、正文、提示等使用場景都可以作為首選，對老設(shè)計師能多一個選擇、新手設(shè)計師也不易犯錯。

3.iOS與Android的區(qū)別

iOS與Android是移動設(shè)備的兩大系統(tǒng)，雖然很多設(shè)計師用一稿適配兩端、遇到特殊頁面也只是單獨(dú)拎出來微調(diào)即可，但對于中、大型的互聯(lián)網(wǎng)公司則很難滿足優(yōu)質(zhì)用戶體驗中的部分細(xì)微差別，例如：iOS的蘋方字體在Android設(shè)備中無法高度還原、預(yù)留的文字?jǐn)?shù)量上限位置無法顯示完整等，都會影響用戶體驗。
此外，iOS和Android都有自己獨(dú)立的設(shè)計規(guī)范，大家有時間的可自行查看，本文只對字體規(guī)范作基本了解。
iOS使用的是「蘋方」字體，提供了6個字重，英文字體為「San Francisco」；Android使用的是Google聯(lián)合Adobe發(fā)布的「思源黑體」，為充分滿足設(shè)計要求，提供了7個字重，英文字體為「Roboto」。

此外，如果界面中涉及的數(shù)據(jù)較多，數(shù)字使用DIN字體也是不錯的選擇，字體外形較長，易用且耐看，很適合數(shù)據(jù)統(tǒng)計展示，不過這款字體商用的話需要收費(fèi)的。

二、字體的基本屬性

1.字體大小

字號的大小決定信息的層次和權(quán)重，不規(guī)律的使用字號會讓頁面信息雜亂，不利于用戶閱讀。在設(shè)定字號規(guī)范時，需特別注意最小值和遞增值。
最小值決定信息的可讀性，以2倍圖為例，iOS11系統(tǒng)將最小字號規(guī)范為11pt（22px），但很多產(chǎn)品依然將最小字號設(shè)定為20px，甚至部分產(chǎn)品將18px的數(shù)字加粗運(yùn)用在標(biāo)簽中，所以最小字號的設(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ù)界面中的實際場景來決定，如下圖：

2.字符間距

字間距是指兩個字符之間的橫向間隔距離，在界面排版中，除了西文的字間距調(diào)整需求較大外，中文通常只保持默認(rèn)，只有少數(shù)場景才會手動調(diào)整，且沒有固定的規(guī)律，保持視覺舒適狀態(tài)即可。例如：banner、界面大標(biāo)題、重要數(shù)字（取件碼）顯示等。 

3.行高

行高是指包圍在字體之外的隱形邊框，一個字體元素的的行高等于文字上邊框+下邊框+字號的高度之和。
西文字體因高度的參差不齊，本身就能制造出視覺上的上下空間，通常行高為字號的1.2倍，而中文字體沒有上下間隙的延伸，行高則較大，一般在1.5倍左右，如果字號較小且折行較多，行高甚至能達(dá)到字號的2倍。

4.字重

字重指的是字體的粗細(xì)，不同的字重能體現(xiàn)出不同的層級關(guān)系，給用戶的視覺感受也截然不同。
像蘋方、思源、阿里巴巴普惠這些家族字體一般都會有極細(xì)體、細(xì)體、常規(guī)體、黑體、粗體等多個字重，在UI設(shè)計中，實用的就常規(guī)體、加粗兩個字重，再通過色彩、字號使其成為對立關(guān)系，明顯的拉開文字內(nèi)容層級后，方能保持良好的瀏覽體驗。

5.全角與半角

這種主要針對標(biāo)點符號，以英文字母為標(biāo)準(zhǔn)，半角是指一個符號占用一個標(biāo)準(zhǔn)字符（英文）的位置，全角則是占用兩個字符位置。
眾所周知，中文使用都是全角、英文使用半角，并且會隨著中/英文的切換而自動改變，但有時候難免會操作失誤讓頁面中的某處信息看著怪怪的卻不明所以、另外中文信息中的時間/日期也大多會使用半角符號，所以設(shè)計師對此有一定的了解時候、，在處理這些細(xì)枝末節(jié)就能做到收放自如。

三、不同場景下的屬性參考

在色彩規(guī)范中，除主/輔助色之外，設(shè)計師還會提供3~4個等級的配色，如通用的#333（標(biāo)題）、#666（正文）、#999（提示）、#ccc（占位符），這也是UI通用的文字色用色規(guī)范，不同的字號需用色規(guī)律。

如果想進(jìn)一步延展，可以增加一點品牌色，也可以使用#000（純黑）調(diào)整不透明度來體現(xiàn)文字色彩層級，深色模式中很常見，下面我們一起來了解幾個常見的使用場景。

1.標(biāo)題

標(biāo)題的主要作用是讓用戶以最快的速度了解界面主要信息，需要時刻吸引用戶的注意力，例如APP中的導(dǎo)航欄、模塊標(biāo)題、內(nèi)容標(biāo)題、數(shù)據(jù)統(tǒng)計等。需要簡單明了且有沖擊力，字號一般會控制在30px以上并加粗顯示，直接使用一級色值（#333）即可。
在特殊場景下，標(biāo)題也可以使用主體色值，但一定要注意容器背景與其他信息色彩的協(xié)調(diào)，不然花里胡哨的還不如用回一級色值。

2.正文

正文并不需要吸引用戶注意力，它主要是提供標(biāo)題的注釋或內(nèi)容的詳細(xì)說明。
當(dāng)白色背景文本內(nèi)容過多、在需要用戶仔細(xì)閱讀的情況下，一定要注意顏色不能太深，不然顯的主次不分，還有些刺眼，這里推薦26~30px字號使用二級文字（#666）色值。

3.提示語

提示類文字使用場景就相對較多，它除了給用戶展示當(dāng)前狀態(tài)，還能給予合理的引導(dǎo)，促進(jìn)用戶進(jìn)行下一步操作。常見使用色值為三級（#999）、四級色值（#ccc），例如界面中的操作注意事項、表單占位符等。字號一般為24px，因使用場景不同，也會有特殊的存在，例如表單中占位符的字號會跟隨輸入后的字號統(tǒng)一。

4.超鏈接

超鏈接在字號、色值上沒有一定的限制，但需要一個特定的輔助元素/屬性來提示用戶這是可點擊的。
例如APP登錄頁面，找回密碼、注冊、獲取驗證碼等，大部分都是用主體色、圖標(biāo)（右箭頭）等方式強(qiáng)化可操作入口，而PC端網(wǎng)頁中超鏈接的表現(xiàn)方式，下劃線、藍(lán)色字體、>>這三種方式幾乎能涵蓋所有。

5.其他

規(guī)范并非不可更改，它只能幫助設(shè)計師在大部分使用場景中減少設(shè)計出入并提高產(chǎn)出效率，但總有一些使用場景需特殊對待，字體也不例外，如以下場景：

◇ APP金剛區(qū)入口字體大多使用24px，一級色值（#333）；

◇ 底部Tab欄字體未激活使用淺色，激活后切換為一級色值（#333）或主體色；

◇ 重量級的提示語用紅色色值；

◇ 按鈕中的文字跟隨按鈕的等級權(quán)重變化；

◇ 深色容器標(biāo)簽的文字反白；

◇ ......

四、字體使用基本原則

1.符合產(chǎn)品氣質(zhì)

雖說黑體（蘋方、思源、阿里巴巴普惠）是UI設(shè)計中的首選字體，但這也僅僅只是建立在不出錯的的情況下、滿足基本條件而選擇，如果想表達(dá)出產(chǎn)品的類型、情感、氣質(zhì)等品牌屬性，在不影響用戶識別的前提下，可選擇一款符合產(chǎn)品氣質(zhì)的字體，打造出差異化的瀏覽體驗，對于追求完美的APP來時是一個不錯的解決方案。
例如，部分藝術(shù)、女性類的APP會選擇使用宋體，整體看起來有一種高端、時尚且優(yōu)雅的感覺。

整體界面使用特殊字體還是相對較少，為了更好的體現(xiàn)出產(chǎn)品屬性/風(fēng)格，將其融入不同的模塊及使用場景，會讓產(chǎn)品更有特色，例如banner、瓷片區(qū)、大標(biāo)題、頭圖等，對用戶的視覺吸引力能得到很大提升。 

2.使用同一家族字體

在一個APP中，堅持使用同一個家族的字體，對標(biāo)題、正文等文字信息有一個統(tǒng)一的視覺規(guī)劃，這樣有助于建立起體系化的設(shè)計思路，避免在開發(fā)落地時存在一致性問題，減少開發(fā)與設(shè)計的出入。
筆者曾見過這樣的設(shè)計師，界面中原本用了「蘋方」字體，在一個特殊場景下，「蘋方」的粗體字重?zé)o法滿足大標(biāo)題的使用需求，于是將大標(biāo)題單獨(dú)改為「阿里巴巴普惠體」的最大字重。
從表面上看，上述的設(shè)計需求是滿足了，但稍有不慎就會成為沒有價值的藝術(shù)品，首先，單獨(dú)一處使用不同家族的字體，會影響整體視覺的一致性；其次，若程序沒有嵌入另外的字體，產(chǎn)品落地后其視覺效果毫無改觀，且更沒有必要為了某個場景的使用要單獨(dú)嵌入幾十到幾百兆的家族字體，讓應(yīng)用安裝包無故加大。在設(shè)計中，有時候在解決某個問題時，解決方案并非無可替代，加粗字體亦是如此。
另外，在可用性、實用性強(qiáng)且必要的情況下，并非不能再增加一個家族字體，例如所有標(biāo)題系列使用「阿里巴巴普惠體」、數(shù)字系列都使用「DIN」，前提是一定要形成體系化，并非某一處的使用。

3.明確的信息層級

在同一個界面中，字體色值、字號、字重等，都是用于區(qū)分信息層級，盡量不要使用過多的層級，避免層級混亂影響信息瀏覽。
在信息層級處理方式的四個基本原則中，「對比」就是將復(fù)雜的信息通過元素的各種屬性以不同的視覺效果呈現(xiàn)，來體現(xiàn)信息節(jié)奏感，并非是為了好看而隨意給文字賦予各種屬性及樣式效果。

五、UI設(shè)計需注意的問題

1.避頭尾的使用

避頭尾使用在文字內(nèi)容較多的折行場景中，主要處理標(biāo)點符號剛好出現(xiàn)在一行文字的開頭或結(jié)尾時，通過自動調(diào)整單行的字符間距、在視覺上將標(biāo)點符號前移或后移。
在新聞資訊類應(yīng)用的詳情頁中，避頭尾使用的較多，用以避免頭/尾存在標(biāo)點符號造成視覺重量不一、信息參差不齊的問題出現(xiàn)。

2.反差體現(xiàn)層級

很多時候，為了區(qū)分信息層級，首先想到的是利用不同的字號、字重來體現(xiàn)，這當(dāng)然沒有問題，但如果結(jié)合字體的明暗關(guān)系（灰度色值等級）則效果更佳。
如下圖：標(biāo)題一級色值（#333）、正文二級色值（#666）、時間日期三級色值（#999）。

3.備用字體

備用字體只會運(yùn)用在web頁面中，如果網(wǎng)站需要一款特殊的字體才能彰顯其獨(dú)特的氣質(zhì)、同時又擔(dān)心用戶在某些設(shè)備中因為沒有這個字體而無法瀏覽其效果，則會另外再選擇一款相近的通用字體作為備選，以彌補(bǔ)視覺體驗上的損失。
如果字體包不大，也可以讓開發(fā)將其放在服務(wù)器端，這樣能讓所有用戶都能看到相同的效果，省去了不少麻煩。

4.確?？勺x性

可讀性應(yīng)該是選擇字體的首要元素，雖說很多文字我們都可以從前后字義、聯(lián)想詞等角度將自己的理解補(bǔ)充完整，但完全沒有必要。
UI設(shè)計不像海報那樣融入較多的藝術(shù)成分，更需要的是內(nèi)容清晰、表意明確、高效率的傳達(dá)，任何增加用戶閱讀、理解成本的做法都應(yīng)該規(guī)避掉，例如過于變形的可愛風(fēng)格、書法手寫體等都盡量少用。

六、結(jié)語

文本內(nèi)容是UI界面中占比較多的元素之一，設(shè)計師需要對其基本屬性及使用場景有一個清晰的了解，使用的是否恰當(dāng)取決于我們對字體的選擇。雖說在UI領(lǐng)域，字體模塊類的文章比較少（更多是文字、字庫的設(shè)計），但它在設(shè)計規(guī)范中的地位是舉足輕重，選好一款字體對設(shè)計來說是錦上添花。
關(guān)于UI界面中的字體，其實沒有太多的講究，也沒必要整得花里胡哨，重點在于排版過重中注意信息層級的劃分以及有足夠的視覺舒適度即可。

作者：大漠飛鷹CYSJ      來源：站酷



藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍(lán)藍(lán)設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司 

按鈕設(shè)計是我們經(jīng)常會遇到的一個類型，一個好的按鈕其最重要的就是激起點擊欲，讓人忍不住去戳戳戳。

我們來看看下面這個按鈕：

很普通，處處都很常見的一種按鈕，沒有任何點擊欲。

那我們應(yīng)該怎么做出她的點擊欲呢？

其實就是要讓按鈕更有立體感，話不多說直接上干貨！

1.層次

可以用不同的顏色，放大一圈，形成對比：

上下錯開一些讓按鈕的造型飽滿立體一些，從原來的單一一層變?yōu)閮蓪樱?

2.層次

為了讓按鈕更立體我們可以把這兩層個復(fù)制一層，往下移動幾個像素：

這樣按鈕是不是就已經(jīng)立體多了？別急，還有呢！

3.光影

這里細(xì)節(jié)就比較多，想把按鈕做到晶瑩剔透可不容易，給大家好好講一下。

先給圖形加上一個內(nèi)發(fā)光：

使用剪切蒙版，涂顏色或者再來一層內(nèi)發(fā)光，加強(qiáng)這個效果：

復(fù)制一層，選用更深的顏色，向下移動，剪切蒙版到里面去，把按鈕有一個明顯的明暗分割線，形成這種光的層次和厚度：

沿著造型刻畫高光，和邊緣有些間隔：

在白色的底座上加入按鈕的投影：

這樣一個剔透，立體感強(qiáng)的按鈕造型就完成啦！

那還能不能讓點擊欲更強(qiáng)一些呢？

4.表像圖形

放上文案看看：

就還是有點單對吧。

這種時候我們就可以從按鈕的文案出發(fā)，加入一些圖案，讓它更生動！

比如這里的文案是“發(fā)射”，就聯(lián)想到了火箭，我們可以繪制一個火箭出來。

把它加入到按鈕上：

這樣一個豐富且有點擊欲的按鈕就完成了！

并可以用同樣的邏輯去延展別的按鈕，讓他們保持統(tǒng)一性：

總結(jié)

增強(qiáng)按鈕的點擊欲的方式，其實就是讓它變得立體且豐富。

1.層次：單獨(dú)的一個色塊，會很單薄，增加層次增加其在造型上的豐富度。

2.厚度：厚度可以讓按鈕變得更立體。

3.光影：讓按鈕富有變化，更立體和吸引人。

4.表像圖形：一個關(guān)聯(lián)文案信息的點綴圖案，可以讓人更有食欲。

作者：菜心輕量文      來源：站酷



藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍(lán)藍(lán)設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司 

本文通過強(qiáng)化會員品牌、全鏈路精細(xì)化運(yùn)營和提升會員服務(wù)的設(shè)計手段闡釋如何為用戶提供更好的服務(wù)。

百度小說是百度APP內(nèi)的垂直頻道，擁有過億月活和行業(yè)最全的正版書籍。隨著著作權(quán)保護(hù)意識逐步上升，越來越多的用戶愿意為優(yōu)質(zhì)的資源和閱讀體驗付費(fèi)。2019年底，為了滿足用戶消費(fèi)升級所產(chǎn)生的一系列需求，百度小說初步建立了會員體系。經(jīng)過兩年多的打磨，我們不斷提升會員的服務(wù)體驗，并進(jìn)行了多次優(yōu)化升級，現(xiàn)在將我們的設(shè)計經(jīng)驗分享給大家。

一、設(shè)計背景

2021年我國數(shù)字閱讀用戶規(guī)模達(dá)到5.06億，同比增長2.43%，半數(shù)以上用戶愿意為電子閱讀付費(fèi)，占比最重的人群為19~25歲用戶，達(dá)到44.63%（數(shù)據(jù)來源《中國數(shù)字閱讀報告》），“Z世代”已經(jīng)成為我國數(shù)字閱讀的主要群體。隨著消費(fèi)升級，用戶對服務(wù)的需求不斷提升，更看重信息之上的附加價值，如認(rèn)同感、歸屬感和儀式感。

二、改版原因

2019年，由于時間緊、任務(wù)重，我們完成了小說會員從無到有、從0-1的基礎(chǔ)場景搭建。但隨著設(shè)計趨勢的變化，當(dāng)時小說會員的設(shè)計風(fēng)格與主流用戶的喜好不完全匹配，在使用場景中也存在易用性不足、內(nèi)容缺乏吸引力等問題。下圖是2019年小說會員的界面。

同時，我們對小說用戶進(jìn)行了視頻訪談，搜集了用戶在使用會員服務(wù)中遇到的問題，如會員福利少、找不到會員專屬內(nèi)容、購買過程有卡頓等，最終梳理為的三大核心問題：身份感知弱、購買路徑長和資源內(nèi)容少。

三、設(shè)計目標(biāo)

在小說會員亟待改版的背景下，我們結(jié)合業(yè)務(wù)目標(biāo)、舊版核心問題和用戶訴求，推導(dǎo)出了本次改版的設(shè)計目標(biāo)—品牌化、鏈路化和服務(wù)化。

1、品牌化—強(qiáng)化會員品牌

小說會員作為百度APP眾多會員之一，設(shè)計團(tuán)隊希望能帶給閱讀用戶一些不同的品牌記憶點。

1）設(shè)計關(guān)鍵詞

基于會員的主流用戶、產(chǎn)品屬性和用戶訴求，我們衍生出以下關(guān)鍵詞：年輕、品質(zhì)、尊貴、超值。年輕用戶群體的占比越來越高，新版的設(shè)計風(fēng)格力求更好滿足年輕用戶的審美需求。

2）會員符號

符號是最直觀的視覺元素之一，能夠以最快的方式傳遞產(chǎn)品記憶點。在會員品牌符號設(shè)計的草圖階段，我們從字母V、VIP、鉆石、王冠和小說IP白嘟嘟等多個方向進(jìn)行了方案發(fā)散。最終采用了白嘟嘟圖形與尊貴感的V形符號相結(jié)合的形式。該方案既延續(xù)了小說的視覺符號，又與競品的會員標(biāo)識形成差異，從而加深用戶的品牌感知和視覺記憶。

3）會員色彩

為了確定更加獨(dú)特的品牌色，設(shè)計團(tuán)隊搜集了大量的尊貴氛圍圖片，提煉出了玫瑰金，牙金，赤墨等8個具有品質(zhì)感的顏色。在視覺初稿階段，我們選擇了玫瑰金和黃金兩種主色進(jìn)行了方案嘗試。最終根據(jù)整體效果確定主色為明亮、高貴的玫瑰金，輔色為黑茶棕，深支子和漆黑的配色方案。新的配色方案讓用戶感受到新穎、現(xiàn)代，煥然一新。

4）會員圖標(biāo)

在圖形元素上，為了增強(qiáng)親和感，我們選擇了圓潤的面形圖標(biāo)樣式，通過大圓弧和小圓角的細(xì)節(jié)處理，傳遞給用戶一種年輕、品質(zhì)的品牌印記。

5）信息傳達(dá)

我們對會員購買頁和權(quán)益詳情頁進(jìn)行了布局重構(gòu)，采用深色的背景襯托卡片信息，使得產(chǎn)品框架層和內(nèi)容信息層更加明確，突出核心內(nèi)容。

在各類場景中，我們通過會員品牌色彩、圖形、符號和IP形象的滲透，強(qiáng)化會員品牌印記。

經(jīng)過分析研究和實踐，我們完成了主場景的設(shè)計升級。

2、鏈路化—精細(xì)化運(yùn)營

就會員體驗而言，我們需要關(guān)注用戶在各種時間和各類場合下的需求，因此我們將會員的全鏈路狀態(tài)分為時機(jī)、場景和人群三個維度。

1）時機(jī)

在不同的時機(jī)狀態(tài)下，我們需要傳遞給用戶不同的信息。只有深入剖析不同狀態(tài)下的用戶訴求，才能為其提供更好的服務(wù)。接下來我們從購買前、購買中、購買后和即將過期四個階段闡述：

①購買前—權(quán)益/優(yōu)惠信息引導(dǎo)

在用戶購買前，我們強(qiáng)化了低價和省錢信息，讓用戶直觀的感受到購買會員后的價格福利。為此我們從三個方向上進(jìn)行優(yōu)化，在開通購買頁，外露省錢金額，幫助用戶了解開通會員可享受的收益；在會員頻道頁，采用外露多項權(quán)益，讓用戶快速了解會員權(quán)益；在章節(jié)購買頁，采用突出會員折扣和會員優(yōu)惠價，讓用戶感受到開通會員的折扣福利。

②購買中—優(yōu)化路徑流程

在用戶購買中，我們在會員購買鏈路環(huán)節(jié)進(jìn)行簡化，采用當(dāng)前頁彈出半層面板替代跳轉(zhuǎn)至?xí)T聚合頁的方式，縮短等待加載時間；在章節(jié)付費(fèi)鏈路環(huán)節(jié)，將商品選擇區(qū)信息結(jié)構(gòu)進(jìn)行優(yōu)化，減少多章購買的頁面跳轉(zhuǎn)，使得用戶能夠更流暢的完成支付，提升付費(fèi)體驗。

③購買后—強(qiáng)化權(quán)益感知

在用戶購買后，鑒于付費(fèi)用戶對商品和服務(wù)品質(zhì)有著更高追求，為此我們通過在各類重要入口展示會員權(quán)益，包括省錢金額、去廣告次數(shù)以及各類場景VIP狀態(tài)提示等方法，以達(dá)到強(qiáng)化用戶的權(quán)益感知。

④即將過期—輕引導(dǎo)續(xù)費(fèi)

在即將過期前，為了避免對用戶造成強(qiáng)付費(fèi)的不友好感知。過期前3天，我們采用了輕量化的形式告知用戶續(xù)費(fèi)，通過各類引導(dǎo)信息的提示，讓用戶知曉會員服務(wù)期限屆滿。

2）場景

我們在入口和功能場景中也進(jìn)行了精細(xì)化設(shè)計，讓用戶更便捷地使用會員服務(wù)。為了突出會員優(yōu)質(zhì)內(nèi)容和服務(wù)，我們設(shè)置了會員專屬的頻道和書庫，方便用戶選擇。

在各類功能場景中，為了方便用戶在使用功能的過程中隨時購買，我們設(shè)置了多個功能場景的會員開通入口。讓用戶快捷享受會員服務(wù)。

3）人群

通過小說用戶數(shù)據(jù)分析，我們將用戶人群分為會員用戶、潛在用戶、新用戶和過期用戶。

為了讓會員用戶能夠體驗到區(qū)分于普通用戶的尊貴感，我們在付費(fèi)頁、批量離線、TTS播放頁和簽到頁等場景均采用了會員定制化的配色方案和引導(dǎo)提示，這樣使得會員用戶在體驗服務(wù)的各類場景中有更強(qiáng)的身份專屬性。

所謂潛在用戶，是指仍在猶豫是否購買會員的用戶。我們通過限時優(yōu)惠券、激勵視頻試用15分鐘、書架省錢提示、挽留彈窗和降級版免廣告權(quán)益等方式，讓潛在用戶不僅可以先試后買了解會員權(quán)益，而且可以通過各類信息提示通曉會員體驗，更好地判斷是否通過會員服務(wù)減少付費(fèi)金額和提升閱讀體驗。

我們針對新用戶建立了新人見面禮活動，用戶在新手福利活動期內(nèi)可享受超值折扣開通會員，低價體驗會員權(quán)益。而針對已過期的用戶，我們通過下發(fā)優(yōu)惠券、強(qiáng)化特權(quán)等形式喚醒用戶，以免錯過各類福利和特權(quán)。

3、服務(wù)化—提升會員服務(wù)

在內(nèi)容為王的時代背景下，為了增加會員產(chǎn)品的核心競爭力，我們持續(xù)擴(kuò)充會員書庫的數(shù)量和類目、拓展會員權(quán)益，讓用戶閱讀到更加豐富的小說內(nèi)容和體驗到更多權(quán)益的會員服務(wù)。小說書庫的付費(fèi)和免費(fèi)書數(shù)量大幅擴(kuò)充，且書籍類型新增了有聲書和短篇故事，增添了小說資源的多樣性。

在權(quán)益上，對內(nèi)我們持續(xù)拓展會員特權(quán)，從最初的4項擴(kuò)展為10項，新增了有聲免費(fèi)聽、免費(fèi)讀故事、整本離線、專屬字體、簽到1.5倍書幣等權(quán)益；對外我們聯(lián)合其他產(chǎn)品，推出了會員贈禮和聯(lián)合會員服務(wù)，用戶可以根據(jù)自己的需求進(jìn)行購買，享受組合購買的優(yōu)惠。

通過多個版本的迭代，我們完成了會員體系的設(shè)計升級和落地，用戶體驗得到了顯著提升。

四、未來規(guī)劃

提升付費(fèi)產(chǎn)品的用戶體驗是一個體系化的研究課題，需要各個角色通力合作，合力同行，開拓革新。將來我們還會不斷探索，通過不斷優(yōu)化體驗細(xì)節(jié)，不斷增加用戶權(quán)益感知，不斷嘗試方案創(chuàng)新，形成設(shè)計組合拳，為用戶提供更好的服務(wù)。

作者：百度MEUX      來源：站酷



藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍(lán)藍(lán)設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司 

百度酒店以比價及低價感知傳達(dá)、高效預(yù)訂低價為設(shè)計目標(biāo)，實現(xiàn)劃分為了“提升感知、建立認(rèn)知、強(qiáng)化記憶”三個階段建立用戶認(rèn)知。

百度酒店以比價為核心特色，經(jīng)歷多次設(shè)計探索，初步建立了用戶認(rèn)知。

設(shè)計中通過“核心流程分析-明確用戶關(guān)注信息-探索比價價值”的方式去制定設(shè)計策略，并在方案探索與落地階段，通過思路發(fā)散、多輪數(shù)據(jù)驗證與方案迭代，驗證了“氛圍感知強(qiáng)化、價值信息傳達(dá)、聚合比價”等設(shè)計手段的作用，希望給服務(wù)和電商等比價類產(chǎn)品的設(shè)計師一些啟發(fā)和參考。

一、項目背景

酒店住宿在線預(yù)訂市場中，各個平臺基于用戶權(quán)益、運(yùn)營補(bǔ)貼等差異進(jìn)行著激烈的價格競爭，導(dǎo)致行業(yè)存在天然的價差。而在我們進(jìn)行的一次酒店預(yù)訂訪談中發(fā)現(xiàn)，超過半數(shù)的用戶在預(yù)訂酒店時會進(jìn)行比價，而比價的用戶中多數(shù)會使用2個以上的酒店APP。因此，在市場存在價差且用戶有比價訴求的背景下，百度酒店通過接入多家供給及會員低價，旨在建立酒店聚合比價平臺，為用戶提供性價比最高的酒店搜索服務(wù)。

二、設(shè)計策略與落地觸點

1.目標(biāo)和策略制定

在上述背景下，我們與產(chǎn)品側(cè)對齊業(yè)務(wù)目標(biāo)，結(jié)合對用戶訴求的分析，確定了設(shè)計目標(biāo)。

為了達(dá)成設(shè)計目標(biāo)，需要明確比價在酒店預(yù)訂的各個觸點下對用戶的價值是什么，以探索比價如何發(fā)揮作用。下圖列出了酒店預(yù)訂的核心流程、核心模塊及用戶關(guān)注信息，由于用戶在各個環(huán)節(jié)關(guān)注的信息不同，比價所能發(fā)揮的價值也就不同，因此基于比價是否影響用戶進(jìn)行選擇和決策，我們又將核心流程分成服務(wù)報價選擇前、服務(wù)報價選擇時、服務(wù)報價選擇后。

設(shè)計目標(biāo)的實現(xiàn)也對應(yīng)上述3個環(huán)節(jié)如下圖：

• 在服務(wù)報價選擇前，比價還未對用戶決策、預(yù)訂體驗產(chǎn)生直接的影響，此時要去傳達(dá)比價的概念和價值，并盡可能的強(qiáng)化這種氛圍感知，讓用戶清晰地認(rèn)識到百度酒店可以比價，以吸引用戶使用比價。
• 在服務(wù)報價選擇時，用戶會利用比價進(jìn)行選擇和預(yù)訂，此時要突出低價、輔助用戶進(jìn)行高效的對比和預(yù)訂。
• 在服務(wù)報價選擇后的下單環(huán)節(jié)，可以進(jìn)一步強(qiáng)化比價的感知和價值，以加深用戶對百度酒店比價的印象。

2.明確落地觸點

為了找到一些好的比價概念和價值的傳達(dá)方式，以及提升比價體驗的方式，我們進(jìn)行了競品調(diào)研，競品包含酒店、商品等不同行業(yè)，調(diào)研結(jié)論歸納如下：

• 利用流程中的主要模塊，傳達(dá)比價概念以及“享低價”、“省錢”等比價價值認(rèn)知；
• 結(jié)合“產(chǎn)品縫隙”滲透比價概念，具體指“當(dāng)前內(nèi)容”到“下一個閱讀內(nèi)容”的停頓時間，包括跳轉(zhuǎn)時的過渡頁、閱讀完結(jié)的結(jié)束過程等，在用戶不排斥的狀況下，給用戶帶來一些基礎(chǔ)的認(rèn)知教育；
• “聚合比價”模式，將針對同一商品或服務(wù)的報價由低到高排列，以便用戶快速對比和選擇低價。

結(jié)合競品調(diào)研結(jié)論，我們根據(jù)百度酒店的核心流程和觸點進(jìn)行了設(shè)計策略的拆解，建立了策略和落地的映射關(guān)系。

三、方案探索與落地

1.提升感知-讓用戶知道百度酒店可以比價

這一環(huán)節(jié)的設(shè)計目標(biāo)是要讓用戶知道百度酒店可以比價，以吸引用戶在百度酒店完成下單行為，因此清晰、有吸引力的比價元素設(shè)計十分重要。基于競品調(diào)研內(nèi)容，我們進(jìn)行了設(shè)計探索。

1）酒店列表-氛圍感知強(qiáng)化及價值信息傳達(dá)

下圖所示為酒店列表比價設(shè)計的探索過程，最初的方案，為了保證酒店信息的獲取體驗，采用了與傳統(tǒng)酒店預(yù)訂平臺采用一致的結(jié)構(gòu)和信息優(yōu)先級，僅結(jié)合圖片區(qū)域和價格做了比價信息的結(jié)合，但這種設(shè)計與傳統(tǒng)酒店預(yù)訂平臺差異很小，比價感知和價值的傳達(dá)效果并不好。因此設(shè)計側(cè)轉(zhuǎn)變思路，在酒店列表中通過更強(qiáng)化的模塊來突出比價的感知，同時結(jié)合“比某平臺低xx”的文案說明比價結(jié)果，傳達(dá)“比價獲得更低價”的感知。

酒店列表覆蓋多個場景，為了建立百度酒店一致的體驗和認(rèn)知，我們將列表的設(shè)計覆蓋到了搜索結(jié)果頁和小程序的多個頁面，如圖所示。

2）房型及服務(wù)報價-基于低價推薦去強(qiáng)化比價

房型及服務(wù)報價模塊對應(yīng)酒店精準(zhǔn)需求和酒店詳情頁，與酒店列表思路一致，方案在逐漸與傳統(tǒng)酒店預(yù)訂平臺產(chǎn)生差異化，去強(qiáng)化比價、低價的感知，形成記憶點。

下圖為搜索結(jié)果頁的方案，最初外露了多個房型，以滿足用戶的選擇訴求，但從用戶行為數(shù)據(jù)來看，百度酒店的絕大多數(shù)用戶會選擇酒店的最低價房型及報價，因此我們調(diào)整設(shè)計方案，結(jié)合最低報價，用模塊式的對比方式去強(qiáng)化比價，并通過“低價立省xx”的信息去傳達(dá)低價感知。另外，這一部分的設(shè)計也和聚合比價有所結(jié)合，后面會進(jìn)行詳細(xì)的說明。

詳情頁的主要模塊設(shè)計與搜索結(jié)果頁基本一致，如下圖所示，詳情頁中將最低報價作為低價房型推薦，以建立一致的比價認(rèn)知同時便于用戶快捷預(yù)訂低價。另外，在常規(guī)的報價列表中，為了提升用戶查找報價的效率，相比于最低價房型，采用了弱化的形式。最終方案上線后，數(shù)據(jù)上也取得了正向的效果，報價展現(xiàn)到預(yù)訂點擊的轉(zhuǎn)化得到了提升。

3）“產(chǎn)品縫隙”中的比價概念滲透

“產(chǎn)品縫隙”并不像上述列表模塊那樣感知強(qiáng)烈，設(shè)計的目的是為了進(jìn)一步加深“百度酒店可以比價”的用戶印象。結(jié)合百度酒店的核心頁面，我們重新設(shè)計了酒店列表和房型報價列表的加載態(tài)，利用“多資源方交替動效+文案說明”的方式，構(gòu)建動態(tài)的比價感知，在用戶進(jìn)入頁面或者進(jìn)行篩選等場景時會出現(xiàn)。另外，我們也利用了小程序首頁和詳情頁的頁尾，在閱讀結(jié)束時去傳達(dá)全網(wǎng)比價的概念。

2.建立認(rèn)知-聚合比價模式的構(gòu)建

在競品調(diào)研部分，我們提到了聚合比價模式，百度酒店由于報價復(fù)雜，也適合用這種方式去簡化報價。

如圖所示，常規(guī)酒店預(yù)訂平臺，同一房型（如標(biāo)準(zhǔn)大床房）會存在不同服務(wù)政策（早餐服務(wù)、取消規(guī)則、支付方式）的報價，而在百度酒店中，由于又加入了預(yù)訂平臺的差異，報價會更加復(fù)雜，數(shù)量更多且同質(zhì)化嚴(yán)重，即服務(wù)政策相同，僅預(yù)訂平臺不同的報價多次出現(xiàn)，這就導(dǎo)致了報價列表的查看和選擇效率較低。

聚合比價模式就是要將這些服務(wù)政策相同的報價聚合在一起進(jìn)行比價，以簡化報價列表提升選擇效率，同時在服務(wù)相同的情況下，絕大部分用戶會更傾向于低價，在報價聚合后，可以突出低價以便用戶預(yù)訂。

我們也在探索如何讓聚合比價更簡單，初始方案采用點擊展開的形式，用戶可以保持滑動瀏覽的交互體驗，整個過程的交互體驗比較流暢，但頁面的層級關(guān)系較為復(fù)雜，用戶認(rèn)知成本高。因此我們又嘗試了調(diào)起面板展示比價詳情，讓用戶聚焦在當(dāng)前報價的對比，并通過模塊式的設(shè)計，清晰羅列了每個平臺的服務(wù)、優(yōu)惠明細(xì)等差異信息，讓信息的對比更高效，同時強(qiáng)化低價平臺，與前面的比價模塊保持認(rèn)知一致。

聚合比價模式下，存在了兩種用戶路徑，如圖所示。用戶可以直接選擇最低價資源方完成預(yù)訂，也可以通過比價詳情彈層，查看針對同一服務(wù)的所有平臺報價，對比平臺的詳細(xì)服務(wù)、優(yōu)惠差異后再選擇預(yù)訂。

這種預(yù)訂模式的目的，一方面在教育用戶建立百度酒店可以比價、可以買到低價的認(rèn)知，另一方面也提升了用戶選擇低價平臺的效率。另外，聚合比價要具有清晰的規(guī)則才能被理解和信任，在比價詳情中，為了進(jìn)一步降低認(rèn)知成本，我們通過標(biāo)題突出了聚合項，并增加了比價說明入口，讓聚合規(guī)則更明確。聚合比價的方案上線后，報價的預(yù)訂點擊到成單轉(zhuǎn)化也得到了提升。

另外，前文提到的精準(zhǔn)需求搜索結(jié)果頁和詳情頁的低價房型推薦也利用了這種模式，不過在比價感知上做了更強(qiáng)化的處理。用戶可以在詳情頁直接點擊各個平臺報價完成預(yù)訂，也可以點擊文字部分查看房型詳情，在頁面底部的比價詳情中完成報價的對比和預(yù)訂。

3.強(qiáng)化記憶-比價價值感的再次強(qiáng)化

填單場景是在預(yù)訂完成后，這個環(huán)節(jié)我們可以將比價的概念和價值再次展示給用戶，以加深用戶對比價的認(rèn)知。這里的設(shè)計手段與“提升感知”階段類似，如圖所示為一些方案探索，在用戶選擇低價平臺預(yù)訂，點擊跳轉(zhuǎn)至填單頁后，我們會強(qiáng)化用戶“預(yù)訂到最低價”以及“為用戶節(jié)省xx元”的感知。另外，在用戶提交訂單時，會存在一定的加載時間，我們也利用了這里的“產(chǎn)品縫隙”，結(jié)合加載態(tài)繼續(xù)傳遞低價、省錢的認(rèn)知。

四、結(jié)語

回顧百度酒店的比價設(shè)計過程，我們以比價及低價感知傳達(dá)、高效預(yù)訂低價為設(shè)計目標(biāo)，基于百度酒店的核心預(yù)訂流程，探索比價在各個環(huán)節(jié)如何發(fā)揮作用，進(jìn)而將設(shè)計目標(biāo)的實現(xiàn)劃分為了“提升感知、建立認(rèn)知、強(qiáng)化記憶”三個階段，并為業(yè)務(wù)帶來轉(zhuǎn)化提升。

提升感知過程結(jié)合流程中的主要模塊，通過模塊式對比形式、傳達(dá)比價價值感、基于低價推薦強(qiáng)化比價、以及利用“產(chǎn)品縫隙”等手段，去吸引用戶了解和使用比價；建立認(rèn)知過程利用“聚合比價”模式去精簡報價，同時結(jié)合對低價報價、低價平臺的強(qiáng)化，讓用戶更便捷的預(yù)訂低價；最后強(qiáng)化記憶的環(huán)節(jié)，我們進(jìn)行了一些方案嘗試，再次強(qiáng)調(diào)比價的價值。另外，為了建立一致的比價認(rèn)知，整體的設(shè)計中也堅持一致性的原則。百度酒店的比價設(shè)計也在不斷地嘗試和優(yōu)化中，希望能給用戶創(chuàng)造更好的使用體驗。

作者：百度MEUX      來源：站酷



藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍(lán)藍(lán)設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司 

前言

通知是產(chǎn)品中極其重要的一部分，它能快速將內(nèi)容的狀態(tài)及變化通過不同的方式傳達(dá)給用戶，以便用戶在收到信息后根據(jù)所傳遞的內(nèi)容及時做出應(yīng)對策略。
在這里，有一個很現(xiàn)實的問題，很多產(chǎn)品喜歡一股腦的把有效的/無效的、重要的/不重要的、用戶想知道的/不想知道的等所有信息通通推送給用戶。那么，你的推送渠道真的用對了嗎？是否做了信息優(yōu)先級區(qū)分？推送時間段是否有效？站在用戶角度，下面這些場景你肯定碰到過：

◇ 手機(jī)屏幕總是頻繁彈出信息，接二連三的震動、提示音讓你一怒之下卸載了一些不太常用的APP；

◇ 桌面圖標(biāo)99+、主頁的消息入口99+、進(jìn)入消息分類還是99+，清理起來非常麻煩，還不如關(guān)閉幾個分類通知，少一個也能緩口氣；

◇ 一天少看了幾個小視頻，好不容易節(jié)省出來的流量被通知無情的消耗，還不如關(guān)閉系統(tǒng)通知權(quán)限來得快；

◇ 每隔一段時間，都要在手機(jī)短信中回復(fù)一大堆TD（退訂），想吐的感覺；

◇ ......

在頻繁地打擾下，用戶關(guān)閉了一個個通知權(quán)限、甚至一度卸載APP。不難看出，好的消息通知能巧妙的將用戶求留住（部分用戶利用通知就能保持對微信、QQ的控制欲），做的不好就會起到負(fù)面作用、失去了消息通知的初衷，這里面最需要把控就是推送的一個“度”。
用戶可能因為一條走心的推送而轉(zhuǎn)化、也可能因為被打擾而放棄使用，站在設(shè)計角度，需盡可能打造讓用戶更喜歡的通知系統(tǒng)。那么，對于不同的業(yè)務(wù)需求及使用場景，又該如何差異化的進(jìn)行消息推送，筆者通過本文進(jìn)行分析總結(jié)，與大家一起了解。

分享目錄

一、消息推送的基本知識
二、消息通知渠道
三、讓用戶再次開啟通知權(quán)限
四、提高觸達(dá)率的小技巧
五、結(jié)語

一、消息通知的基本知識

1.什么是消息通知

消息通知是產(chǎn)品提供的一項服務(wù)，能夠及時將產(chǎn)品的期待或內(nèi)容的變化、根據(jù)其等級權(quán)重合理的通過不同渠道及時同步給用戶，常見的如互動提醒、老用戶召回、活動拉新、產(chǎn)品更新或幫助提醒等，通過站內(nèi)紅點、彈窗、短信、郵件等方式與用戶進(jìn)行信息交換。

2.消息推送的目的

用戶層面，方便及時獲取到想要知道的信息、以及對信息交換的控制權(quán)。例如：用戶發(fā)布一條新的短視頻想要對評論/點贊及時掌控、給心上人發(fā)了信息想在第一時間看到回復(fù)...等，產(chǎn)品也是借此用戶對內(nèi)容的控制欲，利用消息推送提升用戶的使用體驗。
產(chǎn)品層面，通過主動推送想讓用戶知道的信息，以達(dá)到新/老用戶轉(zhuǎn)化的目的。例如：通過手機(jī)短信形式發(fā)放優(yōu)惠券對老用戶召回、應(yīng)用內(nèi)通知或桌面推送對用戶拉新...等，以此提高產(chǎn)品收益，獲取更大的商業(yè)價值。

3.通知設(shè)計的基本原則

首先，一個好的消息系統(tǒng)首先需要將消息內(nèi)容設(shè)計的全面，以便用戶通過消息通知能準(zhǔn)確無誤的了解到對應(yīng)內(nèi)容；
其次，消息的觸達(dá)方式需合理有效，必須提供便捷的操作入口以供用戶及時反饋；
另外，為了避免過于打擾用戶，需選擇合理的推送渠道，提高用戶觸達(dá)概率及反饋效率。

二、消息通知渠道

消息通知渠道分為應(yīng)用內(nèi)通知應(yīng)用外通知。應(yīng)用內(nèi)通知主要來源于消息中心或系統(tǒng)主動觸發(fā)的彈窗來體現(xiàn)，而應(yīng)用外通知包括桌面圖標(biāo)紅點、手機(jī)短信、電子郵件、push、公眾號信息（需綁定）等渠道推送。

1.應(yīng)用內(nèi)通知

1）消息功能入口
消息功能入口提示也稱為紅點提示，主要有底部Tad欄、首頁右上角、個人中心右上角三種形式。當(dāng)有新的通知出現(xiàn)時，對應(yīng)圖標(biāo)的右上角會出現(xiàn)小紅點提示，清晰明了，關(guān)于小紅點設(shè)計，之前《小紅點篇 | 用好這招，讓用戶的觸達(dá)率大幅度提升！》這篇文章有詳細(xì)說明。
紅點提示的用戶觸達(dá)率較高，但需要用戶在登錄狀態(tài)下才能查看，比如訂單狀態(tài)變化、用戶與用戶/產(chǎn)品之間的互動消息、產(chǎn)品活動通知等。

2）消息列表

當(dāng)產(chǎn)品的消息類型較多時，點擊消息功能入口即可跳轉(zhuǎn)至二級分類列表。與上述相比，消息列表的內(nèi)容則更加清晰，通過第一次消息入口功能的引導(dǎo)觸發(fā)，這里的用戶觸達(dá)率將成倍增加。

3）彈窗通知

以彈窗的形式覆蓋在頁面內(nèi)容頂層，阻礙用戶的當(dāng)前操作并迫使用戶對彈窗做出決策，可以是系統(tǒng)主動彈出或用戶手動觸發(fā)，對用戶的干擾極大。
彈窗通知最大的優(yōu)勢在于會100%被用戶看到，無法忽略，否則將不能進(jìn)行其他操作，很適合產(chǎn)品的一些重要事件提醒，例如應(yīng)用升級、活動通知、優(yōu)惠券引流等。

4）Toast 通知

Toast通知是用戶在操作之后給出的即時反饋，與當(dāng)前頁面內(nèi)容關(guān)聯(lián)性極強(qiáng)，但不會中斷用戶的操作，出現(xiàn)的時間很短，一般持續(xù)3秒后自動消失，對用戶的干擾也比較小。
需要注意的是，Toast容易在用戶不注意的情況下被遺漏，所以適合用于操作后不影響大局、且不可二次操作、不可逆轉(zhuǎn)的輕量提示，例如刪除成功、提交成功等。

2.應(yīng)用外推送

1）桌面小紅點

小紅點通常以圓點+數(shù)字的形式出現(xiàn)在圖標(biāo)右上角，用來提示應(yīng)用內(nèi)的未讀消息數(shù)量，進(jìn)入應(yīng)用查看或清除后小紅點則會消失。桌面小紅點有一個必備前提，需要同時開啟設(shè)備和應(yīng)用內(nèi)的通知權(quán)限方能接收提醒通知。
在部分應(yīng)用中，桌面小紅點具有較大的價值，能對用戶產(chǎn)生積極的影響，使用頻率得到進(jìn)一定的提升。例如：社交類應(yīng)用中的私信、評論、點贊等；商家端的咨詢信息、下單提醒等，用戶在看到后都會有強(qiáng)烈的點擊欲望，對一些數(shù)據(jù)的提升起到推動作用。

2）PUSH推送

PUSH推送通知常見于設(shè)備頂部橫幅（幾秒后消失）、通知中心以及鎖屏后的中部區(qū)域，用戶可從卡片中的內(nèi)容獲取信息類型及重要程度，用以決策是否需要立即打開。
這種推送方式，用戶幾乎很難忽略，不處理的話會長時間浮于屏幕之上，非常適合價值及時效性較高的消息通知。除視覺提醒之外，還可通過聽覺觸達(dá)用戶，例如支付號、微信的收款信息等，不過依然要同時開啟設(shè)備和應(yīng)用內(nèi)的通知權(quán)限。

3）手機(jī)短信

短信推送是大家很熟悉的通知渠道了，畢竟現(xiàn)在都是用手機(jī)注冊賬號，手機(jī)號獲取難度幾乎為“0”，常見的有驗證碼短信（用戶請求）、營銷短信（產(chǎn)品推送）兩種：
驗證碼類似“一問一答”的互動，沒有什么特別的玩法；
營銷類短信對于拉取新用戶、老用戶召回、節(jié)日/活動促銷能起到不可替代作用，產(chǎn)品可通過短信發(fā)送圖片、文字以及超鏈接，內(nèi)容的時效性、用戶的觸達(dá)率都相對較高。
著重說明一點，因為短信通知的成本較高，在使用之前需要足夠的思考分析，細(xì)分用戶群體做到精準(zhǔn)投放，避免所花費(fèi)的成本與產(chǎn)生的價值不成正比。另外，如果需要放超鏈接，那么短信內(nèi)容一定要有足夠的說服力及吸引力，總是被用戶當(dāng)做詐騙短信刪除、舉報的話還不如不放。
為了減少對用戶的打擾，讓產(chǎn)品更人性化，一般會在短信結(jié)尾提供TD（退訂）提示，用戶回復(fù)即可取消后續(xù)的推送，但是否真的取消成功，這就得看產(chǎn)品了(???)...

4）電子郵件

電子郵件推送方式使用的并不多，一方面需要產(chǎn)品有web端服務(wù)，純粹的移動端APP郵件推送不會有什么效果；另一方面，絕大多數(shù)的用戶登錄電子郵箱并不頻繁，還容易被用戶一鍵清理或誤刪。
電子郵件唯一的好處就是用戶可通過超鏈接直達(dá)內(nèi)容出處，相比APP應(yīng)用，免去了下載等一系列操作，還可以長時間滯留，便于用戶隨時查看或添加星標(biāo)，處理時間段選擇較為靈活，很適合web端服務(wù)。針對一些商業(yè)化的郵件推送，也需要花費(fèi)一定的經(jīng)濟(jì)成本。

產(chǎn)品獲取用戶郵箱地址的難度較大（郵箱賬號除外），不難理解，使用手機(jī)號一鍵登錄、驗證碼登錄、第三方賬號登錄遠(yuǎn)比郵箱地址登錄要方便的多。除此之外，還可以通過個人設(shè)置的添加郵箱、問卷調(diào)查的郵箱地址預(yù)留來獲取，不過這就要看用戶的主動意愿了。

5）公眾號消息

公眾號背靠社交應(yīng)用，普及程度及用戶觸達(dá)率是極高的，不過這需要產(chǎn)品利用部分業(yè)務(wù)、活動為導(dǎo)向，引導(dǎo)用戶關(guān)注公眾號后方能接收到消息通知。
目前公眾號只能向用戶發(fā)送符合部分場景要求的服務(wù)通知，例如刷卡通知、物流軌跡變化、商品購買等。如果預(yù)算足夠的話，還可以購買公眾號列表、內(nèi)容詳情頁、朋友圈等產(chǎn)品廣告位進(jìn)行特定用戶群體推送，無需用戶關(guān)注也可以看到并進(jìn)行轉(zhuǎn)化。

三、讓用戶再開啟通知權(quán)限

用戶一旦關(guān)閉通知權(quán)限，對產(chǎn)品來說無疑是一個損失，這意味著沒有消息通知的推動，用戶的使用頻率以及與產(chǎn)品之間的互動顯然會減少（就連夫妻之間都需要時?；优c溝通交流，何況對于有選擇余地的產(chǎn)品），時間長了，用戶轉(zhuǎn)投其他產(chǎn)品的“懷抱”也不是不可能。
有沒有想過，用戶只是關(guān)閉通知權(quán)限而已，并沒有卸載APP，真的就沒辦法了嗎？是不是該做點什么...

1.尋找關(guān)閉原因

用戶之所以還未卸載APP，說明還有價值，歸根結(jié)底，關(guān)閉通知權(quán)限的原因都是因為消息的“狂轟亂炸”帶來的無盡騷擾，幾乎沒有例外，而產(chǎn)品還會添上一把火，用戶再次打開APP時無底線的催促用戶再度開啟，耗盡用戶最后一點耐心后，或許再也沒有機(jī)會了。
這個時候，設(shè)計師考慮的不是頻繁提醒用戶開啟，而是用戶關(guān)閉通知的真正原因（“狂轟亂炸”只是概括），細(xì)化各種可能性，然后從中找出機(jī)會點，但凡有所改進(jìn)都值得試一試，畢竟相比什么都不做不會更糟。這么解釋似乎毫無說服力，下面舉個例子：
當(dāng)產(chǎn)品中的某項免費(fèi)服務(wù)突然有一天開始收費(fèi)了，但受到了大多數(shù)用戶的抵觸，這個時候你該怎么做，是無視用戶訴求繼續(xù)收費(fèi)、還是恢復(fù)到之前的免費(fèi)？這并不是一個選擇題，繼續(xù)收費(fèi)會導(dǎo)致大量用戶流失、恢復(fù)免費(fèi)可能連維持運(yùn)營成本都難，所以不經(jīng)思索的選擇草草收場、連下下策都算不上。用戶抵觸的原因可能收費(fèi)過高或是與實際價值不符，有沒有想過利用限時折扣、附加其他增值服務(wù)（成本較?。┗蛘呓M合捆綁銷售也不失為一種策略。
那么，到底該如何做既能愉快的發(fā)送消息通知、還能能挽回用戶的心呢？

2.引導(dǎo)二次開啟

用戶關(guān)閉通知權(quán)限，并非沒有需求，最典型的就是在某寶、某東加了滿滿一“車”商品等待降價，然后抱怨消息通知太吵關(guān)掉了通知權(quán)限，最后就是無法收到折扣通知、還把問題怪在了APP身上，著實太冤。用戶只要還有需求，通知權(quán)限就還有被重新開啟的機(jī)會。

1）損失厭惡/利益引誘

首先，我們需要找出對應(yīng)的價值點，利用優(yōu)秀的文案給予用戶思考的余地，用戶每多思考一會，結(jié)果都有可能發(fā)生改變。
人們都討厭失去，對于損失的不可控很難接受，在引導(dǎo)用戶開啟通知權(quán)限時，需要強(qiáng)調(diào)不開啟會失去什么，畢竟面對“得到”和“失去”時，損失更加讓人難以忍受，例如物流產(chǎn)品告訴用戶“未開啟通知，將錯過重要的快遞信息”。還可以通過激勵等進(jìn)行利益引誘，如“開啟后能及時獲取紅包卡券、折扣通知”等，并提供快捷通道，促使用戶重新開啟通知權(quán)限。

2）消息分類/分別處理

每種類型的通知都不可能符合所有用戶的“胃口”，針對社交、電商類產(chǎn)品，可將通知類型分類處理，用戶希望接收哪種類型的消息單獨(dú)開啟即可。
例如支付寶將消息拆分為多個類型；京東還增加了午休免打擾設(shè)置，開啟后在12：30-13：30不會收到任何消息提醒；微信群過多、消息太吵時，開啟免打擾又擔(dān)心錯過重要人的信息，于是微信在去年上線了開啟群消息免打擾后、可設(shè)置群內(nèi)4個人的消息正常通知，算是比較人性化的設(shè)計了。

3）提供關(guān)閉/關(guān)不徹底

部分產(chǎn)品提供了關(guān)閉消息通知功能，但又關(guān)不徹底，這是產(chǎn)品基于妥協(xié)的基礎(chǔ)上，依然在低頻推送消息的“流氓”玩法，與用戶完全關(guān)閉相比，已經(jīng)算是不錯的結(jié)果了。
常見于PC客戶端，就像很多軟件的插件一樣，不管怎么關(guān)，總是無法徹底關(guān)閉，甚至還將開啟操作偽裝成其他內(nèi)容引導(dǎo)用戶誤觸；手機(jī)短信推送也會有這種情況，用戶回復(fù)過“退訂”后依然會收到相關(guān)短信。

這種方式需謹(jǐn)慎使用，在用戶關(guān)閉通知后，需通過后續(xù)推送內(nèi)容的質(zhì)量、頻率試探用戶底線，然后逐漸提升，切不可無視用戶操作。

四、提高消息觸達(dá)率的小技巧

1.減少重復(fù)通知

反復(fù)推送相同的內(nèi)容只會讓用戶更加反感，回復(fù)退訂、卸載應(yīng)用都可能在這一刻發(fā)生。
很明顯，消息發(fā)出后，如果用戶的觸達(dá)率較高就沒必要再次推送。反之觸達(dá)率較低，重復(fù)推送會讓用戶有種被催促、脅迫的感覺，適得其反，觸達(dá)率低有沒有可能是文案不夠友好、表達(dá)不夠清晰或者吸引力不夠？即便同一件事情，也盡量使用不同的表達(dá)方式，如何想辦法重新引起用戶的關(guān)注才是關(guān)鍵點。

2.言語得當(dāng)、避免誤會

中華文字博大精深，且有56個民族，其性格習(xí)慣各異，特別在利用當(dāng)前社會熱點、媒介進(jìn)行的營銷推送時，盡可能規(guī)避掉敏感信息，如地域/民族歧視、性暗示等。

3.細(xì)分受眾群體

很多時候，消息推送太少無法滿足產(chǎn)品目標(biāo)、太多則會惹惱用戶導(dǎo)致通知權(quán)限被徹底關(guān)閉，所以不僅要考慮消息推送頻率，更重要的是對受眾群體進(jìn)行分類、分別推送，不要每次都一股腦的將消息發(fā)給所有用戶，當(dāng)然，能做到千人千面（成本大）則會更好。

4.內(nèi)容清晰簡潔

沒有用戶愿意在不明所以的情況下來看長篇大論的內(nèi)容，需確保消息內(nèi)容簡單直接、清晰易懂，并符合用戶認(rèn)知習(xí)慣，還得保持友好的語氣以及富有創(chuàng)造力的品牌形象。
處于營銷目的時，可利用感興趣的事件/事物勾起用戶的點擊欲望，例如網(wǎng)絡(luò)熱詞、時下熱點等，筆者雖然并不提倡“標(biāo)題黨”，但不得不說，很多標(biāo)題黨都能起到不錯的效果。

5.提供“下一步”入口

消息通知需要一個有效操作入口，并且在消息內(nèi)容中有對應(yīng)的指向，點擊應(yīng)用內(nèi)通知切換APP界面、應(yīng)用外推送鏈接跳轉(zhuǎn)至web頁，從始至終都需要為用戶提供一個查看更多內(nèi)容或參與的有效途徑。

五、結(jié)語

消息通知設(shè)計的主要目的是在正確的時間、以正確的方式將內(nèi)容呈現(xiàn)給用戶，并提高產(chǎn)品的轉(zhuǎn)化率，不管用戶愿不愿意接受，這始終都是一個呈現(xiàn)信息的不錯途徑。
本文主要總結(jié)了消息的通知渠道、常見問題處理、提升用戶觸達(dá)率的方法，以幫助新手設(shè)計師快速掌握完整的消息系統(tǒng)?；蛟S最終的結(jié)果事與愿違，但不能否認(rèn)其魔力，需要做好的是確保消息內(nèi)容質(zhì)量、對應(yīng)的受眾群體及合理的推送渠道，相信總有一種方式適合你產(chǎn)品。

作者：大漠飛鷹CYSJ      來源：站酷



藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~

希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。 



分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。 



藍(lán)藍(lán)設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司