同一個頁面標簽在不同設計師手中，會有千萬種變化?？吹絼e人新設計的標簽，有時你腦中就會閃現(xiàn)：“噢，原來標簽還有這種樣式，為什么我沒想到呢？”而筆者就關注到了這一點，并進一步介紹了UI中的標簽使用方法。

為什么我們自己就想不到新的標簽設計樣式呢？用了這么久的標簽，你真的了解“它”嗎？

我們在設計某一個頁面的時候，同時需要給頁面提取賣點增加標簽。這時，很多設計同學可能會出現(xiàn)下面這幾種情況：

• 借鑒：別人加什么標簽，咱就加什么標簽
• 順從：產(chǎn)品說啥就是啥，老板說啥就是啥，開發(fā)說啥就是啥
• 腦殘粉：某文章某設計說過某產(chǎn)品適合某種標簽，這就是圣旨
• 顏控：一切原因只因為好看
• 霸道：別問為什么，我現(xiàn)在只能想到這類樣式

一個小小的標簽就可以映射出設計領域里面的很多門道。想要做好標簽，首先要正確認識標簽。

一、標簽

標簽是信息集合的一種方式，他給目標確定關鍵詞，便于用戶查找與定位。而在UI中，它作為事物抽象的定義，用于用戶標記和算法識別。

1. 傳達信息，建立操作預知

在視覺層面上標簽常用于傳達產(chǎn)品基本信息、優(yōu)惠信息、產(chǎn)品賣點等。

對產(chǎn)品而言，它能優(yōu)化信息層級，又能簡單明確地傳達產(chǎn)品特點；對用戶而言，可以第一時間獲取關鍵信息，降低用戶閱讀門檻。

此外標簽也用于建立用戶操作預知，例如音頻標簽、視頻標簽等，讓用戶在點擊前預知點擊后的效果。

2.?方便分類

標簽廣泛用于用戶區(qū)分產(chǎn)品內(nèi)容，進行分類，進而確定關鍵詞，優(yōu)化搜索。為用戶打上不同的標簽，用于區(qū)分不同用戶群體，分類精準定向推送產(chǎn)品，例如：考拉的搜索發(fā)現(xiàn)。

3.?營銷引流

標簽還可用于吸引用戶注意，建立好感，直擊對應痛點，提升用戶購買欲，提高點擊率與轉(zhuǎn)化率，最終促使用戶下單。

例如電商類型的限時搶購、京東自營、美團專送等。

4.?交互（交互減步長）

標簽也可作為搜索和關鍵字的存在，方便用戶跳轉(zhuǎn)到下級頁面，進行流量分發(fā)，也方便用戶快速、直接地找到自己想要的相關產(chǎn)品，做到交互減步長。

二、場景

標簽樣式千千萬萬，各式標簽要怎樣運用到我們的產(chǎn)品中？下面一個案例，我們將一一為大家講解析。

美團外賣是我們經(jīng)常使用的一款促銷型 APP，在美團外賣 Feed 流頁面，美團用不同樣式的標簽將文字層級清晰的分級，讓用戶能立刻得到自己想看到的信息，從而達到首頁的分流，促使下單。

問：

• 為什么美團外賣會有不同類型的標簽？
• 在標簽的樣式中這些層級如何劃分？

1. 不同類型的標簽樣式都能很好的區(qū)分信息層級，降低用戶的閱讀門檻。
2. 從視覺上，我們可以解答出來，色塊占比越大、飽和度明度越高的標簽層級越高，所以可以得知：

當我們得到這些模塊后，憑什么來給這些信息評判等級？

我們是否可以隨便將提取的信息進行層級劃分呢？當然不是。

下面我們將從用戶層面、產(chǎn)品層面、視覺層面 3 個方面為大家講解：

1.?需求拆解

產(chǎn)品的角度：產(chǎn)品需要用戶能快速篩選信息，促使用戶下單。

用戶的角度：用戶需要商品與自身相匹配，能快速找到需要的信息。

2.?需求分析

當我們得到需求后，要如何去分析需求的重要程度？

這里我們可以從用戶層面與產(chǎn)品層面分別去了解需求對用戶與產(chǎn)品的重要程度，在配合著KANO模型對需求進行評分，根據(jù)最后分值對需求進行視覺的層級排序。

從用戶層面去了解：

（1）大品牌（干凈健康、口碑可靠“3分”）

大品牌的入駐意味著平臺具備較強的可靠性，而且大品牌更注重口碑，食物一般會比較干凈、健康，用戶會放心的下單購買

（2）優(yōu)惠（優(yōu)惠力度的強弱“3分”）

當我們確定平臺的可靠時，食蔬的干凈健康后，那么價格是否能接受，是否能最低的價格享受最好的食物也是吸引用戶下單的一點。

如果一個大品牌的店鋪你可以用 60 元享受 8 斤小龍蝦，健康的食材、優(yōu)惠的價格也是決定著用戶下單的重要因素。

（3）評論（優(yōu)質(zhì)的評論能很好的吸引用戶嘗試“2分”）

當然不是所有的商戶都是比較知名的品牌，當用戶撇開品牌去了解一個新的店鋪，之前顧客的留言點評就起著很大一部分決定的因素。

菜品是否新鮮干凈、口味是否美味，這都可以從之前顧客的評論中得出。

（4）特色（保證用戶需求的前提下提供的驚喜服務“1分”）

特色意味著一些小的服務，比如：今日過生日，下單后老板多送一個小蛋糕一張小賀卡。之前抖音曾經(jīng)火過一段時間的視頻：點一份外賣，老板會按照用戶的需求畫一個動漫小人物之類的。

如果在口味相差不多，價格差別不大的情況下，這些小的驚喜服務也是顧客喜愛的一點。

從產(chǎn)品層面去了解：

（1）大品牌（流量、提高用戶信任感“3分”）

大品牌入駐可以引入品牌的流量，也提升了用戶對平臺的信任感，提高用戶下單率。

（2）評論（優(yōu)惠力度的強弱“3分”）

優(yōu)質(zhì)的評論對用戶來講真是真實可靠的，對于產(chǎn)品而言，優(yōu)質(zhì)的評論可以提高用戶的購買率，提升店鋪的曝光度與店鋪對平臺的依賴度。良性的評論圈能讓平臺用最少的成本獲取最大的收入。

（3）特色（提升用戶的重復購買“2分”）

對產(chǎn)品而言，店鋪的特色服務能很好的挽留用戶，提升用戶的重復購買率。

（4）優(yōu)惠（平臺商家獲利少“1分”）

對于平臺商家而言越大的優(yōu)惠獲利越少，雖然用優(yōu)惠來吸引用戶是比較高效的，但是也是最下下之選。

當我們從用戶層面和產(chǎn)品層面詳細的分析了需求后，在 KANO 模型上為需求打上分值，這樣我們就能在提升用戶滿意度的同時，完成產(chǎn)品的需求。

3.?視覺展示

得到標簽的成績區(qū)分后，我們需要在視覺層面上直接展示給用戶，讓用戶能直接的接受重要的信息。

當然，標簽樣式不僅僅是簡單的色塊、描邊的疊加，它還可以用樣式的疊加來表現(xiàn)。

比如為了更應景，在旅游類APP、購票類APP中，我們是否可以將標簽樣式設計成實體票務的樣式，讓用戶有更有代入感，更能理解呢？

三、總結(jié)

好的設計可以驅(qū)動著數(shù)據(jù)，一個小小的標簽也可以在無形中給用戶驚艷的感覺。本篇文章從認識標簽到需求分析，從信息分級到視覺設計進行了統(tǒng)一的講解。

1.?認識標簽

標簽可以用于信息的傳達、建立操作預知，也可以幫用戶及產(chǎn)品進行分類，也可以進行營銷分流與智能場景的運用。

2.?標簽視覺層級的劃分

色塊占比越大，飽和度明度越高的標簽層級越高，越能吸引用戶的注意；反之純文字型標簽與灰色線框標簽層級較低，用于點綴于輔助信息的傳遞。

3.?標簽信息層級的劃分

拿到需求后，不隨便的臨摹競品，有理有據(jù)的使用 KANO模型進行需求分析，得到用戶與產(chǎn)品想要的效果。

4. 視覺設計

融入彩蛋型設計如：票務型圖形標簽設計、飛豬品牌元素標簽設計等等，讓設計更貼近品牌與生活。

生活是多元的，設計是也多元的，它不會朝著一個方向持續(xù)發(fā)展，它會發(fā)展成各種各樣的樣式。設計來源于生活，且豐富生活多彩的一面。

如何讓設計更為出彩，要看你站在什么角度去審視自己的設計。

最后，希望本篇文章對你在標簽設計上或者生活上有更多的幫助。

作者：EDC設計研究中心，公眾號：EDC設計研究中心

來源：https://mp.weixin.qq.com/s/HnroU_etM5UP-MPoOibaoA

本文由 @EDC設計研究中心 授權發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議