電商視覺(jué)設(shè)計(jì)第4章店鋪首頁(yè)視覺(jué)設(shè)計(jì)課件

學(xué)習(xí)目標(biāo)

?了解首頁(yè)視覺(jué)水平的四大指標(biāo)

?掌握店招的設(shè)計(jì)規(guī)范及技巧

?掌握首焦輪播區(qū)的設(shè)計(jì)技巧

?了解商品陳列區(qū)的布局方式

?掌握商品陳列區(qū)的布局技巧

PPT課件

1目

錄

4.1首頁(yè)視覺(jué)水平的四大指標(biāo)

4.2店招視覺(jué)設(shè)計(jì)

4.3首焦輪播區(qū)視覺(jué)設(shè)計(jì)

4.4商品陳列區(qū)視覺(jué)設(shè)計(jì)

4.5化妝品店鋪首頁(yè)視覺(jué)設(shè)計(jì)案例

PPT課件

2首頁(yè)視覺(jué)水平的四大指標(biāo)

1首頁(yè)跳失率

2首頁(yè)點(diǎn)擊率

3首頁(yè)人均點(diǎn)擊次數(shù)

4首頁(yè)平均停留時(shí)間

PPT課件

34.14.1首頁(yè)視覺(jué)水平的四大指標(biāo)

1首頁(yè)跳失率

首頁(yè)跳失率，指買家通過(guò)某種渠道進(jìn)入店鋪，只訪問(wèn)了一個(gè)首頁(yè)就離開(kāi)的訪問(wèn)次數(shù)占該入口總訪問(wèn)次數(shù)的比例。

進(jìn)入店鋪首頁(yè)的渠道

PPT課件

44.1首頁(yè)視覺(jué)水平的四大指標(biāo)

2首頁(yè)點(diǎn)擊率

首頁(yè)點(diǎn)擊率是寶貝在首頁(yè)展現(xiàn)后的被點(diǎn)擊比率，即：首頁(yè)點(diǎn)擊率=首頁(yè)點(diǎn)擊量÷首頁(yè)展現(xiàn)量）。

兩類店鋪首頁(yè)排版

PPT課件

54.1首頁(yè)視覺(jué)水平的四大指標(biāo)

3首頁(yè)人均點(diǎn)擊次數(shù)

首頁(yè)人均點(diǎn)擊次數(shù)，指在一段時(shí)間內(nèi)人均點(diǎn)擊了多少次，如下圖所示。假設(shè)某日點(diǎn)擊該網(wǎng)店的唯一訪問(wèn)者數(shù)為150人，在此期間內(nèi)點(diǎn)擊本店鋪首頁(yè)的總訪問(wèn)數(shù)為600次，那么首頁(yè)人均點(diǎn)擊次數(shù)為：600次÷150人=4次/人。

人均點(diǎn)擊次數(shù)

PPT課件

64.1首頁(yè)視覺(jué)水平的四大指標(biāo)

4首頁(yè)平均停留時(shí)間

首頁(yè)平均停留時(shí)間=訪店鋪首頁(yè)的所有訪客總的停留時(shí)長(zhǎng)÷訪客數(shù)（單位：秒），多天的平均停留時(shí)間為各天人均停留時(shí)長(zhǎng)的日均值。和首頁(yè)人均點(diǎn)擊次數(shù)一樣，首頁(yè)平均停留時(shí)間也可以用來(lái)判斷一個(gè)店鋪首頁(yè)是否能留住訪客。

PPT課件

7店招視覺(jué)設(shè)計(jì)

店招視覺(jué)設(shè)計(jì)規(guī)范

01店鋪名稱的藝術(shù)化處理

02圖層樣式的應(yīng)用

03PPT課件

84.24.2店招視覺(jué)設(shè)計(jì)

1店招視覺(jué)設(shè)計(jì)規(guī)范

店招高度設(shè)計(jì)規(guī)范

淘寶后臺(tái)的店招高度為120像素，建議設(shè)計(jì)時(shí)設(shè)定店招尺寸為950×120像素，加上導(dǎo)航條高度30像素，共150像素，可避免發(fā)布后導(dǎo)航不顯示的問(wèn)題

PPT課件

94.2店招視覺(jué)設(shè)計(jì)

1店招視覺(jué)設(shè)計(jì)規(guī)范

店招元素設(shè)計(jì)

品牌宣傳語(yǔ)

移動(dòng)端二維碼

PPT課件

104.2店招視覺(jué)設(shè)計(jì)

1店招視覺(jué)設(shè)計(jì)規(guī)范

店招和導(dǎo)航條風(fēng)格統(tǒng)一

風(fēng)格的統(tǒng)一及修飾元素的設(shè)

計(jì)，突出店鋪的品牌形象

PPT課件

11店招視覺(jué)設(shè)計(jì)

2店鋪名稱的藝術(shù)化處理

1用不同字體和字號(hào)的組合營(yíng)造藝術(shù)感

2添加特效突出特殊性和醒目度

3

使用修飾元素提升觀賞性

PPT課件

4.2124.2店招視覺(jué)設(shè)計(jì)

2店鋪名稱的藝術(shù)化處理

1用不同字體和字號(hào)的組合營(yíng)造藝術(shù)感

將店鋪名稱的首個(gè)英文字母放大，并使用

不同于其他字體風(fēng)格的手寫(xiě)體，讓店鋪名稱文字的版式更加醒目、更具藝術(shù)感

不同字體字號(hào)的組合

PPT課件

134.2店招視覺(jué)設(shè)計(jì)

2店鋪名稱的藝術(shù)化處理

2

添加特效突出特殊性和醒目度

為了將店鋪名稱與導(dǎo)航條的顏色區(qū)分開(kāi)，使用了發(fā)光效果來(lái)修飾店鋪名稱，營(yíng)造出的層次感，也貼合了店鋪中銷售的照明設(shè)備的特點(diǎn)

PPT課件

144.2店招視覺(jué)設(shè)計(jì)

2店鋪名稱的藝術(shù)化處理

3使用修飾元素提升觀賞性

使用帽子的圖案來(lái)修飾店鋪名稱，文字與圖案在外形上的契合讓店鋪名