前言:本文主要講解關于瓷片區(qū)的一些認知,以及設計手法。
導讀:什么是瓷片區(qū)?瓷片區(qū)有哪些類型?瓷片區(qū)有哪些適用場景?如何設計好瓷片區(qū)?本文主要為大家解決這些問題。
一、什么是瓷片區(qū)
1.瓷片區(qū)是以圖片加文字方式呈現的運營位
視覺外觀看上去就像一塊塊瓷片貼在版面上,故名“瓷片區(qū)”。
例如淘寶下方的運營位,美團外賣APP的優(yōu)惠專區(qū),小米有品APP的有品推薦。
這類模塊的排列方式,和家里地面鋪的瓷磚很像,所以后文暫且將這一模塊統稱為瓷片區(qū)
二、瓷片區(qū)有哪些適用場景
運營內容區(qū),適合于:平臺、電商、泛娛樂、屬于流量的入口,不適合用于工具類產品。
瓷片區(qū)位于用戶最容易點擊的區(qū)域,通過各類促銷模式,具有較高的轉化率,并能提升整個產品留存。
三、瓷片區(qū)有哪些類型
1.圖片實物類
? 優(yōu)點:圖片識別度高,代入感強,可復用,提高效率
? 缺點:對圖片素材要求高
? 使用場景:對實物圖需求較大的產品類型,外賣、家具、服裝等產品使用較多
2.插圖類
? 優(yōu)點:可以高度概括瓷片區(qū)的運營含義,風格可控
? 缺點:一對一,難以復用,時間成本較高
? 使用場景:金融,教育等產品,對風格有明顯要求
? 注意點:繪制時注意對關鍵信息的提煉以及識別度
3.千人千面
? 優(yōu)點:根據用戶反饋數據高頻輸出內容,符合用戶心智,轉化率更高
? 缺點:通過大數據反饋內容,具有較高的技術壁壘。
? 使用場景:電商類、大數據、私人訂制類。
四、如何設計好瓷片區(qū)
1.圖片細節(jié)點
? 注意圖片的素材質量
? 圖片色調明亮,飽和度高
? 配圖簡潔,呼吸感強,摳圖干凈
? 統一圖片高度于視覺大小
2.插圖細節(jié)點
? 風格保持一致
? 視覺大小保持一致
? 形式簡潔,不影響整體風格
? 概括性強,圖文表意一致
3.文字
非標簽類文字:
主副文案通過大小、粗細和顏色進行區(qū)分,不同業(yè)務板塊可采用不同顏色,但顏色不要超過4種;主文案字號建議在30~34px,副文案字號建議在24~26px;圖文排版方式有對角線分布、上下分布和左右分布。
標簽類文字:
常用于旅游類、外賣類產品,標簽分為主副文案兩個板塊,標簽分為彩色標簽和黑色透明標簽,結合業(yè)務屬性和想突出的文案,分別對應不同的標簽;文案一般位于瓷片區(qū)域的左上角和左邊垂直居中的位置。
4.背景
白色背景:
畫面整潔干凈
純色背景:
背景色盡可能跟圖片或插圖的主色調鄰近
漸變背景:
使用插圖主色調設計
5.排版
對角線排版:
文字和圖片呈對角線上布局。一行顯示兩到三塊瓷片,單個瓷片形狀接近方形,此種文字的信息較多
左右排版:
一般在配圖為插畫、圖標時候適用。此時單個瓷片形狀狹長,一行顯示一塊或兩塊瓷片
上下排版:
采用上文下圖的形式,一般在界面的功能入口較多時適用。此時單個瓷片形狀瘦高,一行顯示不少于3塊瓷片。
為了使版面更加豐富,建議是適當場合,盡量選擇兩種排版組合使用,這樣能夠在排版上有所變化,提升設計美感的同時能夠對需求的優(yōu)先級做出變化,做出更符合產品需求的設計。
總結
對關于瓷片區(qū)的設計要點:
1.排版——左右、上下、對角線(兩種排版,突出優(yōu)先級)
2.文字——層級拉開;突出重點(大小、顏色、字重等形式區(qū)分)
3.配圖——精致;大小、整體統一
4.插圖——表意一致;大小、風格統一
5.背景——淡色取色畫板范圍左上角;漸變明色明度或者明度色相產生變化。