電商設(shè)計(jì),超全面的電商網(wǎng)站商品頁設(shè)計(jì)指南
商品詳情頁是電子商務(wù)網(wǎng)站中最容易與用戶產(chǎn)生交集共鳴的頁面,詳情頁的設(shè)計(jì)極有可能會(huì)對(duì)用戶的購買行為產(chǎn)生直接的影響。因此,商品詳情頁面的設(shè)計(jì)會(huì)涉及到運(yùn)營層面,在美觀實(shí)用的基礎(chǔ)上,將要表達(dá)的信息盡可能用直觀的視角展現(xiàn)出來,再有意識(shí)的避免設(shè)計(jì)與運(yùn)營之間的沖突。
一、商品展示圖不宜過大,鼠標(biāo)懸停展示細(xì)節(jié)商品詳情頁中的圖片展示是用戶進(jìn)入該頁面后的第一個(gè)視覺點(diǎn),有設(shè)計(jì)師可能會(huì)因此認(rèn)為這張圖片的尺寸應(yīng)該盡可能放大,讓用戶對(duì)商品概況一目了然。但作為設(shè)計(jì)師也應(yīng)該考慮到右側(cè)文字信息對(duì)于用戶的重要性,兩者之間的比例要避免很大的偏差,減輕用戶在視覺上產(chǎn)生的不適。
IKEA的網(wǎng)站就因?yàn)閳D片與文字之間的比例問題,讓整體看起來輕重不明確,圖片周圍的留白更是與右邊擁擠的文字形成了鮮明的對(duì)比。
鼠標(biāo)在圖片上懸停時(shí),圖片右側(cè)會(huì)出現(xiàn)關(guān)于商品的細(xì)節(jié)展示,這是一個(gè)在商品詳情頁中很常見的功能。但使用過程中會(huì)發(fā)現(xiàn),就算用戶的鼠標(biāo)無意識(shí)的劃過圖片,細(xì)節(jié)展示依然會(huì)馬上呈現(xiàn),這或多或少會(huì)影響到用戶體驗(yàn),而IKEA的網(wǎng)站則很自然地解決了這一問題。
IKEA的細(xì)節(jié)展示在點(diǎn)擊后才會(huì)體現(xiàn),不讓“說來就來”的圖片打擾用戶的瀏覽體驗(yàn)。
二、滿足用戶的比價(jià)心理“價(jià)比三家”是網(wǎng)絡(luò)購物群體的消費(fèi)習(xí)慣,因此,商品詳情頁的設(shè)計(jì)中也應(yīng)該融入并滿足用戶選價(jià)的心理狀態(tài)。在消費(fèi)心理學(xué)中會(huì)提到,顧客買東西大多基于個(gè)人感受,可能并不是真正價(jià)格上的便宜,而是商家能讓顧客覺得便宜。
折扣或是優(yōu)惠額度的顯示能讓消費(fèi)者心理產(chǎn)生微妙變化,正如當(dāng)當(dāng)網(wǎng)的做法,讓原價(jià)和折后價(jià)產(chǎn)生對(duì)比,再直接表明折扣,這種重復(fù)表達(dá)能加深用戶對(duì)優(yōu)惠的力度的感受。
三、增加分享按鈕社交媒體的力量在如今的營銷中絕對(duì)不容小覷,所以分享按鈕就變得必不可少。在大多數(shù)電子商務(wù)網(wǎng)站中我們可以看到:
分享按鈕被設(shè)置在展示圖片或文字的下方,主要分享當(dāng)前頁面的商品。但其實(shí),真正用于營銷推廣的分享并不應(yīng)該僅限于商品本身。
學(xué)習(xí) · 提示
相關(guān)教程
推薦教程
- 用戶體驗(yàn),分享20個(gè)有影響力的包裝設(shè)計(jì)
- 顏色管理,讓自己的照片在網(wǎng)上正確地顯示
- 移動(dòng)設(shè)計(jì),移動(dòng)應(yīng)用導(dǎo)航模式設(shè)計(jì)方法
- 圖片畫冊平面設(shè)計(jì)排版ps理論教程
- UI知識(shí),尺寸對(duì)UI設(shè)計(jì)的影響
- 設(shè)計(jì)界面最常用最舒服的12種顏色(含色
- 色彩知識(shí),講解顏色基礎(chǔ)知識(shí)和配色理論
- Photoshop初級(jí)教程-命令的技巧
- 用戶體驗(yàn),如何讓用戶心動(dòng)?
- 調(diào)色知識(shí),簡單實(shí)用的調(diào)色原理