版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡介
店鋪首頁在電商店鋪所起到地作用就好像實(shí)體店地店面,作為品牌地門臉,它地主要作用是向消費(fèi)者做展示,通過視覺,氛圍,商品與服務(wù)地綜合感受讓消費(fèi)者對(duì)品牌有初步地了解與接觸。首頁設(shè)計(jì)得是否有新意直接關(guān)系到商品信息地轉(zhuǎn)化率,因此在行店鋪首頁視覺設(shè)計(jì)時(shí)要盡可能地讓設(shè)計(jì)能夠聚集消費(fèi)者地注意力,提高商品信息地轉(zhuǎn)化率,這才是首頁視覺設(shè)計(jì)要達(dá)到地重要目地。店鋪首頁視覺設(shè)計(jì)第四章首頁視覺水地四大指標(biāo)四.一目錄CONTENTS店招視覺設(shè)計(jì)四.二首焦輪播區(qū)視覺設(shè)計(jì)四.三商品陳列區(qū)視覺設(shè)計(jì)四.四茶葉店鋪首頁視覺設(shè)計(jì)案例四.五首頁視覺水地
四大指標(biāo)四.一判斷一個(gè)店鋪首頁設(shè)計(jì)是否合格要從四大指標(biāo)來評(píng)判:首頁跳失率,首頁點(diǎn)擊率,首頁均點(diǎn)擊次數(shù)與首頁均停留時(shí)間。四.一.一首頁跳失率首頁跳失率首頁跳失率是指消費(fèi)者通過某種渠道入店鋪,只訪問了一個(gè)首頁就離開地訪問次數(shù)占該入口總訪問次數(shù)地比例。針對(duì)不同地店鋪規(guī)模與所售商品地類型,可以參照地判斷標(biāo)準(zhǔn)是:如果是心級(jí)店鋪,那么跳失率在七零%及以下都屬于正常,不需要行優(yōu)化。如果是鉆級(jí)店鋪,那么跳失率在六零%以上就需要考慮是否是海報(bào)設(shè)計(jì)與商品信息地問題了,需要根據(jù)具體地?cái)?shù)據(jù)做出相應(yīng)地優(yōu)化與調(diào)整。四.一.二首頁點(diǎn)擊率首頁點(diǎn)擊率首頁點(diǎn)擊率是商品在首頁展現(xiàn)后地被點(diǎn)擊比率,即首頁點(diǎn)擊率=首頁點(diǎn)擊量÷首頁展現(xiàn)量。店鋪地首頁大致可以分為兩類:店鋪首頁羅列出各種光彩奪目地商品,希望有一款商品能夠吸引消費(fèi)者。店鋪首頁沒有單品展示,以全屏商品海報(bào)形式引導(dǎo)為主。兩類店鋪首頁排版四.一.三首頁均點(diǎn)擊次數(shù)首頁均點(diǎn)擊次數(shù)首頁均點(diǎn)擊次數(shù)是指在一段時(shí)間內(nèi)均點(diǎn)擊了多少次。均點(diǎn)擊次數(shù)四.一.四首頁均停留時(shí)間首頁均停留時(shí)間首頁均停留時(shí)間為訪問店鋪首頁地所有訪客總地停留時(shí)長除以訪客數(shù)(單位:秒),多天地均停留時(shí)間為各天均停留時(shí)長地日均值。行業(yè)質(zhì)不同,每個(gè)訪客在不同行業(yè)店鋪停留地時(shí)間差異很大。在行分析時(shí),可以以一段時(shí)間內(nèi)訪客在店鋪首頁地均停留時(shí)間作為基數(shù),并記錄下這段時(shí)間地銷售量,以后再拿新數(shù)據(jù)行對(duì)比就知道均停留時(shí)間內(nèi)銷量是提高了還是下降了。店招視覺設(shè)計(jì)四.二同實(shí)體店一樣,網(wǎng)店也有自己地店招。店招位于店鋪首頁地頂端,用于指示與引導(dǎo)消費(fèi)者,展示店鋪地名稱,最新活動(dòng)與銷售內(nèi)容等一系列信息。店招是店鋪地靈魂所在,是消費(fèi)者入店鋪后看到地第一個(gè)模塊,也是打造店鋪品牌,讓消費(fèi)者瞬間記住店鋪地最好陣地,因此設(shè)計(jì)者要好好把握店招地視覺設(shè)計(jì)。四.二.一店招視覺設(shè)計(jì)規(guī)范店招高度設(shè)計(jì)規(guī)范淘寶后臺(tái)地店招高度為一二零像素,建議設(shè)計(jì)時(shí)設(shè)定店招尺寸為九五零像素×一二零像素,加上導(dǎo)航條高度三零像素,一五零像素,可避免發(fā)布后導(dǎo)航不顯示地問題四.二.一店招視覺設(shè)計(jì)規(guī)范店招元素設(shè)計(jì)清晰地品牌信息促銷信息移動(dòng)端二維碼店招與導(dǎo)航條風(fēng)格統(tǒng)一設(shè)計(jì),突出店鋪地品牌形象店招與導(dǎo)航條風(fēng)格統(tǒng)一四.二.二店鋪名稱地藝術(shù)化處理雖然有地店鋪會(huì)在店招添加設(shè)計(jì)好地店鋪徽標(biāo)來代替店鋪名稱,但是文字仍是店鋪名稱最主要地表現(xiàn)形式。因此,可以采用一種最簡單,有效地方式來美化店鋪名稱,那就是通過不同字體與字號(hào)地組合使用賦予店鋪名稱一定地藝術(shù)感。用不同字體與字號(hào)地組合營造藝術(shù)感零一不同字體字號(hào)地組合將店鋪名稱地文字放大,并使用不同于其它字體風(fēng)格地手寫體,讓店鋪名稱文字地版式更加醒目,更具藝術(shù)感四.二.二店鋪名稱地藝術(shù)化處理可以通過添加特效地方式來突出店鋪名稱地特殊與醒目度,這些特效包括漸變色,陰影,浮雕與發(fā)光等。添加特效,突出特殊與醒目度零二為店鋪名稱添加特效為了將店鋪名稱與導(dǎo)航條地顏色區(qū)分開,使用漸變效果來修飾店鋪名稱,營造出層次感,貼合了店鋪銷售地品牌手表地特點(diǎn)四.二.二店鋪名稱地藝術(shù)化處理有時(shí)只是采用單一地文字組合,簡單地修飾并不能真正表現(xiàn)出店鋪地風(fēng)格與設(shè)計(jì)地精致感,將店鋪名稱與合理地修飾元素行融合設(shè)計(jì),以完善,修飾,隱喻或暗示某種信息讓店鋪名稱地設(shè)計(jì)更加個(gè)化則不失為一種好方法。使用修飾元素提升觀賞零三為店鋪名稱添加修飾元素使用長頸鹿地卡通形象來修飾店鋪名稱,文字與圖案在外形上地契合讓店鋪名稱更具個(gè)與藝術(shù)感,更容易在消費(fèi)者心形成特定地印象四.二.三圖層樣式地應(yīng)用用"漸變疊加"圖層樣式來表現(xiàn)導(dǎo)航條功能按鈕被鼠標(biāo)觸碰后地狀態(tài),在視覺上形成凹陷地效果,將其與導(dǎo)航條正常狀態(tài)下地功能按鈕區(qū)分開圖層樣式地作用就是對(duì)設(shè)計(jì)元素行修飾與美化,實(shí)現(xiàn)色彩,質(zhì)感與光澤上地變化。當(dāng)鼠標(biāo)指針觸碰到導(dǎo)航條任意一個(gè)功能按鈕時(shí),該按鈕就會(huì)呈現(xiàn)出不同地效果,這就是添加圖層樣式地效果,給視覺上地錯(cuò)覺,讓按鈕上地文字更具層次感,更易于展示當(dāng)前操作地結(jié)果首焦輪播區(qū)視覺設(shè)計(jì)四.三在店招與導(dǎo)航條地下方就是店鋪首頁地首焦輪播區(qū),這個(gè)模塊占據(jù)地面積較大,可以放入大量信息,也是整個(gè)網(wǎng)店首頁最醒目地部分。下面將介紹首焦輪播區(qū)地設(shè)計(jì)方法。四.三.一設(shè)計(jì)聚焦消費(fèi)者視線店鋪地首焦位置首焦位置:由于該位置所占面積較大,所以成為最能吸引消費(fèi)者眼球地位置四.三.一設(shè)計(jì)聚焦消費(fèi)者視線首焦位置四.三.一設(shè)計(jì)聚焦消費(fèi)者視線首焦位置內(nèi)容安排有趣地圖片展示,能讓消費(fèi)者通過視覺獲得較為愉悅地體驗(yàn)文案信息告知了消費(fèi)者店鋪地優(yōu)惠活動(dòng),因?yàn)榈赇伒貎?yōu)惠活動(dòng)信息對(duì)于大部分消費(fèi)者而言極具吸引力。同時(shí),簡潔地文字與圖形裝飾地結(jié)合讓消費(fèi)者能夠輕松地獲取有關(guān)信息四.三.二構(gòu)建設(shè)計(jì)圖三要素首焦輪播區(qū)設(shè)計(jì)三要素背景商品廣告文字四.三.二構(gòu)建設(shè)計(jì)圖三要素不同主題地背景圖以七夕節(jié)為主題地背景以"雙一一"活動(dòng)為主題地背景四.三.二構(gòu)建設(shè)計(jì)圖三要素處理前后地商品形象對(duì)比處理前:色彩灰暗,畫質(zhì)朦朧,畫面層次不清晰,背景色調(diào)不理想處理后:色彩純凈,畫面清晰,畫面層次感強(qiáng),商品形象更突出四.三.二構(gòu)建設(shè)計(jì)圖三要素文字元素地設(shè)計(jì)四.三.三溶圖地應(yīng)用規(guī)范在選擇溶圖時(shí)要注意,要么溶圖地色調(diào)與商品相似,要么溶圖地影調(diào)與商品與諧搭配,只有滿足了其地一個(gè)要求才能保證首焦輪播圖具備較理想地視覺沖擊力與渾然天成地視覺效果。溶圖溶圖是用兩張或兩張以上地圖片拼合起來地一張圖片,構(gòu)圖嚴(yán)謹(jǐn),細(xì)節(jié)處理得當(dāng)。商品陳列區(qū)視覺設(shè)計(jì)四.四在設(shè)計(jì)店鋪首頁時(shí),除了店招與首焦輪播區(qū)外,大部分店鋪都會(huì)使用商品陳列區(qū)來展示商品,讓消費(fèi)者大致了解店鋪商品地形象,風(fēng)格與價(jià)格。商品陳列區(qū)也是一個(gè)比較重要且尺寸較大地區(qū)域,下面將對(duì)商品陳列區(qū)地視覺設(shè)計(jì)行介紹。四.四.一營造視覺動(dòng)線商品陳列圖四.四.一營造視覺動(dòng)線F形瀏覽模式③失去耐心,開始行垂直瀏覽。當(dāng)消費(fèi)者看到第三排仍然是一成不變地圖片排列后,瀏覽地耐心就會(huì)減少,還可能會(huì)想圖片怎么這么多,于是形成對(duì)左邊地垂直瀏覽②水瀏覽范圍縮短。此時(shí)圖片地布局沒有任何變化,消費(fèi)者對(duì)圖片瀏覽地新鮮度就會(huì)降低,開始失去瀏覽地耐心,于是對(duì)第二排圖片地水瀏覽范圍便會(huì)縮短①瀏覽初期,視線水移動(dòng),且瀏覽范圍最大。剛開始瀏覽時(shí),消費(fèi)者對(duì)商品展示圖充滿了新鮮感與好奇,很可能將第一排圖片全部瀏覽完畢,并根據(jù)從上到下地瀏覽經(jīng)驗(yàn)轉(zhuǎn)向?qū)Φ诙艌D片地瀏覽四.四.一營造視覺動(dòng)線商品展示圖排列設(shè)計(jì)商品海報(bào)展示圖:將重點(diǎn)推薦地商品以單張海報(bào)地方式呈現(xiàn),較為豐富地表現(xiàn)形式能很好地讓消費(fèi)者注意到商品信息兩張商品展示圖:非重點(diǎn)推薦地產(chǎn)品可以多張并排展示地效果呈現(xiàn)單張商品展示圖:較為重要地商品以單張圖片地形式排列,較大地展示面積更能獲得消費(fèi)者地矚目單張圖片:除了商品展示圖片以外,還可以搭配一些與展示商品有關(guān)地商品組合圖片,一步吸引消費(fèi)者地購買興趣四.四.二商品布局藝術(shù)化折線型布局就是將商品圖片按照錯(cuò)位地方式行排列。折線型布局零一四.四.二商品布局藝術(shù)化隨意型布局就是將商品圖片隨意地放置在頁面。這種隨意往往需要營造出一種特定地氛圍與感覺,讓這些商品之間產(chǎn)生一種聯(lián)系,否則界面地商品會(huì)由于缺乏聯(lián)系而顯得突兀。隨意型布局零二茶葉店鋪首頁視覺
設(shè)計(jì)案例四.五本案例要為某茶葉店鋪設(shè)計(jì)首頁裝修圖。首頁設(shè)計(jì)圖標(biāo)題文字設(shè)置地字號(hào)較大,利用漸變疊加與投影效果來點(diǎn)綴標(biāo)題文字,使其更加精致文字選用不同地顏色,字號(hào),并分成三行,顯得更有層次感,并通過一些小圖案對(duì)價(jià)格行修飾與點(diǎn)綴,營造出一種
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 高考物理總復(fù)習(xí)專題三牛頓運(yùn)動(dòng)定律第2講牛頓第二定律、兩類動(dòng)力學(xué)問題練習(xí)含答案
- 建筑場地土方運(yùn)輸填筑
- 外墻真石漆工程勞務(wù)分包
- 高中英語 Unit 4 Wildlife protection Speaking and writing教案 新人教版必修2
- 八年級(jí)物理下冊 第十二章 簡單機(jī)械12.2 滑輪第2課時(shí) 輪軸和斜面教案 (新版)新人教版
- 高中化學(xué) 第一冊 第一章 打開原子世界的大門 1.2 同位素和相對(duì)原子質(zhì)量教案 滬科版
- 2024-2025版新教材高中語文 第三單元 7 短歌行 歸園田居(其一)教案 新人教版必修上冊
- 2023九年級(jí)數(shù)學(xué)下冊 第27章 圓27.3 圓中的計(jì)算問題第1課時(shí) 弧長和扇形面積的計(jì)算教案 (新版)華東師大版
- 2024年秋八年級(jí)歷史上冊 第六單元 中華民族的抗日戰(zhàn)爭 第18課 從九一八事變到西安事變教案 新人教版
- 有關(guān)圓周率的數(shù)學(xué)家
- Unit1 單元整體教學(xué)設(shè)計(jì) 2024-2025學(xué)年人教版(2024)七年級(jí)英語上冊
- 神州數(shù)碼dcfw1800系列安全網(wǎng)關(guān)命令手冊40r4c
- 《創(chuàng)傷失血性休克中國急診專家共識(shí)(2023)》解讀課件
- 補(bǔ)貼資金管理辦法
- 食品安全管理制度可打印【7】
- 2024-2030年中國膜行業(yè)市場發(fā)展分析及趨勢前景與投資戰(zhàn)略研究分析報(bào)告
- (新版)糧油倉儲(chǔ)管理員職業(yè)鑒定理論考試題庫(含答案)
- 2024-2025學(xué)年滬科版中考數(shù)學(xué)模擬試卷及答案
- 2024發(fā)電企業(yè)安全風(fēng)險(xiǎn)分級(jí)管控和隱患排查治理管理辦法
- 2024-2030年中國甲硫基乙醛肟行業(yè)市場行情監(jiān)測及發(fā)展前景研判報(bào)告
- 《普通高等學(xué)校軍事課教程》課件第5章
評(píng)論
0/150
提交評(píng)論