在線客服

電話①:189 6508 9135(張先生)
電話②:134 0599 8886(何小姐)
電話③:0591-83489135

品牌設(shè)計(jì)


瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法


前言:本文主要講解關(guān)于瓷片區(qū)的一些認(rèn)知,以及設(shè)計(jì)手法。

導(dǎo)讀:什么是瓷片區(qū)?瓷片區(qū)有哪些類型?瓷片區(qū)有哪些適用場景?如何設(shè)計(jì)好瓷片區(qū)?本文主要為大家解決這些問題。

一、什么是瓷片區(qū)

1.瓷片區(qū)是以圖片加文字方式呈現(xiàn)的運(yùn)營位

視覺外觀看上去就像一塊塊瓷片貼在版面上,故名“瓷片區(qū)”。

例如淘寶下方的運(yùn)營位,美團(tuán)外賣APP的優(yōu)惠專區(qū),小米有品APP的有品推薦。

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

這類模塊的排列方式,和家里地面鋪的瓷磚很像,所以后文暫且將這一模塊統(tǒng)稱為瓷片區(qū)

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

二、瓷片區(qū)有哪些適用場景

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

運(yùn)營內(nèi)容區(qū),適合于:平臺、電商、泛娛樂、屬于流量的入口,不適合用于工具類產(chǎn)品。

瓷片區(qū)位于用戶最容易點(diǎn)擊的區(qū)域,通過各類促銷模式,具有較高的轉(zhuǎn)化率,并能提升整個產(chǎn)品留存。

三、瓷片區(qū)有哪些類型

1.圖片實(shí)物類

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

? 優(yōu)點(diǎn):圖片識別度高,代入感強(qiáng),可復(fù)用,提高效率

? 缺點(diǎn):對圖片素材要求高

? 使用場景:對實(shí)物圖需求較大的產(chǎn)品類型,外賣、家具、服裝等產(chǎn)品使用較多

2.插圖類

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

? 優(yōu)點(diǎn):可以高度概括瓷片區(qū)的運(yùn)營含義,風(fēng)格可控

? 缺點(diǎn):一對一,難以復(fù)用,時(shí)間成本較高

? 使用場景:金融,教育等產(chǎn)品,對風(fēng)格有明顯要求

? 注意點(diǎn):繪制時(shí)注意對關(guān)鍵信息的提煉以及識別度

3.千人千面

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

? 優(yōu)點(diǎn):根據(jù)用戶反饋數(shù)據(jù)高頻輸出內(nèi)容,符合用戶心智,轉(zhuǎn)化率更高

? 缺點(diǎn):通過大數(shù)據(jù)反饋內(nèi)容,具有較高的技術(shù)壁壘。

? 使用場景:電商類、大數(shù)據(jù)、私人訂制類。

四、如何設(shè)計(jì)好瓷片區(qū)

1.圖片細(xì)節(jié)點(diǎn)

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

? 注意圖片的素材質(zhì)量

? 圖片色調(diào)明亮,飽和度高

? 配圖簡潔,呼吸感強(qiáng),摳圖干凈

? 統(tǒng)一圖片高度于視覺大小

2.插圖細(xì)節(jié)點(diǎn)

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

? 風(fēng)格保持一致

? 視覺大小保持一致

? 形式簡潔,不影響整體風(fēng)格

? 概括性強(qiáng),圖文表意一致

3.文字

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

非標(biāo)簽類文字:

主副文案通過大小、粗細(xì)和顏色進(jìn)行區(qū)分,不同業(yè)務(wù)板塊可采用不同顏色,但顏色不要超過4種;主文案字號建議在30~34px,副文案字號建議在24~26px;圖文排版方式有對角線分布、上下分布和左右分布。

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

標(biāo)簽類文字:

常用于旅游類、外賣類產(chǎn)品,標(biāo)簽分為主副文案兩個板塊,標(biāo)簽分為彩色標(biāo)簽和黑色透明標(biāo)簽,結(jié)合業(yè)務(wù)屬性和想突出的文案,分別對應(yīng)不同的標(biāo)簽;文案一般位于瓷片區(qū)域的左上角和左邊垂直居中的位置。

4.背景

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

白色背景:

畫面整潔干凈

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

純色背景:

背景色盡可能跟圖片或插圖的主色調(diào)鄰近

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

漸變背景:

使用插圖主色調(diào)設(shè)計(jì)

5.排版

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

對角線排版:

文字和圖片呈對角線上布局。一行顯示兩到三塊瓷片,單個瓷片形狀接近方形,此種文字的信息較多

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

左右排版:

一般在配圖為插畫、圖標(biāo)時(shí)候適用。此時(shí)單個瓷片形狀狹長,一行顯示一塊或兩塊瓷片

瓷片區(qū)基本認(rèn)知與設(shè)計(jì)手法

上下排版:

采用上文下圖的形式,一般在界面的功能入口較多時(shí)適用。此時(shí)單個瓷片形狀瘦高,一行顯示不少于3塊瓷片。

為了使版面更加豐富,建議是適當(dāng)場合,盡量選擇兩種排版組合使用,這樣能夠在排版上有所變化,提升設(shè)計(jì)美感的同時(shí)能夠?qū)π枨蟮膬?yōu)先級做出變化,做出更符合產(chǎn)品需求的設(shè)計(jì)。

總結(jié)

對關(guān)于瓷片區(qū)的設(shè)計(jì)要點(diǎn):

1.排版——左右、上下、對角線(兩種排版,突出優(yōu)先級)

2.文字——層級拉開;突出重點(diǎn)(大小、顏色、字重等形式區(qū)分)

3.配圖——精致;大小、整體統(tǒng)一

4.插圖——表意一致;大小、風(fēng)格統(tǒng)一

5.背景——淡色取色畫板范圍左上角;漸變明色明度或者明度色相產(chǎn)生變化。


相關(guān)文章

首頁  電話  咨詢  頂部