国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

編輯導語：圖片標簽我們并不陌生，只要仔細觀察，產品中圖片標簽的位置和樣式各有不同，那么它到底有多重要呢？什么位置、何種樣式的標簽設計才是更合適的設計？圖片標簽背后的設計邏輯又是什么？本文作者為我們回答了以上問題，并且總結出了圖片標簽設計的3步曲。

一、緣起

最近組內設計評審，視頻和小說兩個業(yè)務都涉及到在圖片上顯示標簽（Tag）的設計，但是Tag的樣式和位置卻不完全不同，如下圖所示：

加之對其他產品中圖片上Tag的位置和樣式各異的印象，不由得引發(fā)了我的思考，到底什么位置，何種樣式的標簽設計才是更合適的設計？這背后的設計邏輯又是什么？

二、競品分析

帶著這樣的疑問，我打開了手機中Top3的視頻和小說App，通過分析整理，發(fā)現(xiàn)競品主要采用了以下4種圖片Tag樣式。

注：孤立式標簽設計，是指標簽與背景圖片的邊緣都有一定的距離。半貼邊式標簽則是指標簽和背景圖片某一條邊重合。全貼邊式標簽則是指標簽的兩條邊與背景圖片都重合。

從設計效果上來看，孤立式標簽的醒目度要明顯高于貼邊式設計。

在《想象力-構圖與創(chuàng)作思維》一書中，黃朝貴老師曾指出：孤立會起到強調作用，就像太陽和月亮懸掛在高空一樣，孤立元素的重量感會因此增強。

而貼邊式的標簽，因為和圖片邊緣直接相連，更容易與圖片背景融為一體。

從方位上看，Tag靠左會比靠右更為醒目，因為符合用戶自然的視線流動規(guī)律，畢竟多數(shù)用戶都是從左向右瀏覽的。所以當標簽位于左上角位置時，會加劇標簽的視線聚焦效應。

三、設計分析

分析完競品的視覺呈現(xiàn)效果以后，我們再回來接著探討：Tag之于小說或視頻的意義？思考到底應該以什么形式，在什么位置展示標簽呢？

對于視頻或小說而言，圖片封面是信息的主體，Tag信息是對主體信息某一維度的強調，目的是為了更好的凸顯主體的關鍵特性，輔助用戶決策。

既然Tag是輔助用戶決策的因素，那我們可以從Tag的重要性、出現(xiàn)頻率、背景圖片大小3個維度來展開分析：

四、重要性

根據(jù)重要性，我們把標簽分為三大類：

1. 首要決策因素

指用戶主要根據(jù)這個因素來進行決策，比如熱度、評分、排行榜等。當Tag用于展示首要決策因素時，Tag的醒目度在少遮擋內容的前提下越醒目越好。

如榜單：所有App無一例外都放置在了圖片的左上角，以凸顯排名信息。

2. 重要決策因素

指雖然并非用戶的首要決策因素，但用戶會因此而選擇or放棄此對象，所以有必要把這個決策因素以醒目的方式呈現(xiàn)給用戶，比如直播、廣告、VIP、預告、完本、更新等。

避免用戶選擇進入詳情后，才發(fā)現(xiàn)不符合訴求，還要退出后重新選擇，影響決策效率。對于重要決策因素的Tag，根據(jù)Tag出現(xiàn)的頻率，可以靈活的決定其位置。

3. 刺激性決策因素

指通常不是用戶的固有決策因素，但在某些情況下，會刺激用戶進行臨時決策，比如限免、獨播、自制、熱映等。

這些標簽是產品側希望傳達給用戶，提升轉化的一種刺激手段，對于產品運營來說比較重要，但對于用戶來說，重要性相對較低，所以一般建議放置在右側，采用全貼邊的設計形式。

4. 頻率

首要決策因素不受頻率影響，可以始終位于比較醒目的左上角區(qū)域突出顯示。

重要性決策因素和刺激性決策因素，和出現(xiàn)頻率直接相關：如果出現(xiàn)頻率低，為了凸顯Tag可以考慮居左強化顯示，如果出現(xiàn)頻率非常高，則要考慮降低對主體信息的干擾，盡量靠右且弱化顯示。

此外，還有一類與內容主體密切相關的基本信息，它始終伴隨內容主體而出現(xiàn)，比如視頻時長、劇集集數(shù)、綜藝期數(shù)、觀看數(shù)等，因為它是主體的基本信息，出現(xiàn)頻率接近100%。

所以一般出現(xiàn)時會建議置于內容底部，并以更弱化的視覺形式展示（此類基本信息Tag不在我們本次討論的范圍之內）。

5. 背景圖片大小

此外，還有一個考慮因素是背景圖片的大小。

因為標簽的大小一般相對固定，當背景圖片越大，同一位置和樣式的標簽醒目度就會越低。所以如果只在某些大圖上有標簽，可以根據(jù)標簽的重要性，適當強化其顯示效果。

五、結論

綜上所述，我們可以總結出圖片Tag設計的3步曲：

1. 梳理Tag類型及優(yōu)先級

根據(jù)Tag的重要性、出現(xiàn)頻率和背景圖片大小，決定各類Tag的優(yōu)先級：首要決策因素Tag＞重要決策因素Tag＞刺激性決策因素Tag。

2. 對照Tag醒目度量表，決定Tag位置及形式

• 標簽位置醒目度：左上＞右上；
• 標簽形式醒目度：孤立式標簽＞半貼邊式標簽＞全貼邊式標簽；
• 首要決策因素的Tag：一般建議采用左側全貼邊式標簽（在不遮擋內容的前提下，也可以考慮孤立式和半貼邊式標簽）；
• 重要決策因素的Tag：可左可右，看是否會與首要決策因素沖突，以及其出現(xiàn)的頻率高低（若與首要決策因素沖突，則建議居右，出現(xiàn)頻率很高也建議居右）；
• 刺激性決策因素的Tag：一般建議采用右貼邊的標簽設計，減少用戶的視覺干擾（如果不存在首要及重要決策因素，刺激性決策因素也可以適當升級其醒目度）。

3. 設計具體Tag樣式

根據(jù)前面的推導，探索Tag具體的視覺效果，除了中規(guī)中矩的圓角矩形外，常見的Tag樣式還有以下形式：

當然，設計師也可以根據(jù)標簽的屬性，或者產品的品牌符號，自定義適合的Tag樣式，以滿足產品個性化的訴求。

本文由@悅有所思 原創(chuàng)發(fā)布于人人都是產品經理，未經許可，禁止轉載。

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