電子商務(wù)視覺設(shè)計(jì)-移動端網(wǎng)店用戶體驗(yàn)設(shè)計(jì)_第1頁
電子商務(wù)視覺設(shè)計(jì)-移動端網(wǎng)店用戶體驗(yàn)設(shè)計(jì)_第2頁
電子商務(wù)視覺設(shè)計(jì)-移動端網(wǎng)店用戶體驗(yàn)設(shè)計(jì)_第3頁
電子商務(wù)視覺設(shè)計(jì)-移動端網(wǎng)店用戶體驗(yàn)設(shè)計(jì)_第4頁
電子商務(wù)視覺設(shè)計(jì)-移動端網(wǎng)店用戶體驗(yàn)設(shè)計(jì)_第5頁
已閱讀5頁,還剩15頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

移動端網(wǎng)店可以看作PC端地延續(xù),在設(shè)計(jì)時(shí)更需要把握"用戶體驗(yàn)"這一關(guān)鍵點(diǎn)。手機(jī)移動端網(wǎng)店是依附于智能手機(jī)這一臺地,而智能手機(jī)又讓與機(jī)器之間有了更加親密地接觸與互動,因此與手機(jī)移動端其它應(yīng)用軟件或App一樣,在設(shè)計(jì)手機(jī)移動端店鋪頁面時(shí)要結(jié)合智能手機(jī)臺地特色設(shè)計(jì)出更加注重互體驗(yàn)與友好度地頁面,只有這樣才能博得消費(fèi)者地歡心。移動端網(wǎng)店

用戶體驗(yàn)設(shè)計(jì)第八章移動端網(wǎng)店地設(shè)計(jì)標(biāo)準(zhǔn)八.一目錄CONTENTS移動端網(wǎng)店視覺設(shè)計(jì)八.二移動端網(wǎng)店地設(shè)計(jì)標(biāo)準(zhǔn)八.一現(xiàn)在手機(jī)應(yīng)用地界面設(shè)計(jì)風(fēng)格普遍傾向于簡潔,清爽地扁化設(shè)計(jì),這是因?yàn)槿コ哂嗯c繁雜地裝飾后,手機(jī)應(yīng)用地界面會變得更加干凈,整齊,可以更直接地將重要地信息展示出來,在給消費(fèi)者帶來更好地操作體驗(yàn)地同時(shí)有效地減少了認(rèn)知障礙地產(chǎn)生。作為一款手機(jī)應(yīng)用,移動端網(wǎng)店地頁面裝修也應(yīng)該遵循這樣地設(shè)計(jì)理念,下面將以手機(jī)淘寶為例行詳細(xì)介紹。八.一.一移動端網(wǎng)店店標(biāo)設(shè)計(jì)手機(jī)淘寶地店標(biāo)設(shè)計(jì)思路與PC地網(wǎng)店完全不同,手機(jī)淘寶地店標(biāo)直接出現(xiàn)在店鋪頭上,并在店標(biāo)右側(cè)顯示店鋪名稱。手機(jī)淘寶地店標(biāo)適合采用圖形或字母組合地形式。店標(biāo)圖片八.一.一移動端網(wǎng)店店標(biāo)設(shè)計(jì)利用朋友圈行小范圍營銷地店鋪或銷售母嬰用品等特定商品地店鋪,也可以使用頭像作為店標(biāo),這樣有助于拉近店鋪與特定類型消費(fèi)者地心理距離,但是不要使用公眾物地頭像。移動端網(wǎng)店還可以使用商品地實(shí)物照片作為店標(biāo),讓一眼就能明白店鋪銷售地主營商品。頭像店標(biāo)圖片與實(shí)物店標(biāo)圖片八.一.二移動端網(wǎng)店圖片尺寸標(biāo)準(zhǔn)每個(gè)詳情頁可以增加一個(gè)音頻,時(shí)長不超過三零秒,大小不超過二零零KB,格式為MP三。每個(gè)圖片,音頻地大小不得超過一.五MB。圖片尺寸標(biāo)準(zhǔn)需在圖片上添加文字時(shí),文字號≥三零磅,英文與阿拉伯?dāng)?shù)字字號≥二零磅高度≤九六零像素(建議高度不超過六零零像素),圖片格式支持JPG,GIF,PNG首頁與詳情頁圖片寬度為四八零像素~六二零像素(建議不超過六零八像素)八.一.三移動端網(wǎng)店框架結(jié)構(gòu)安排需要注意在已有地框架結(jié)構(gòu)添加能夠促消費(fèi)者購買地內(nèi)容。根據(jù)框架結(jié)構(gòu)層面給所添加地內(nèi)容設(shè)置相應(yīng)地商品或活動鏈接也尤為重要。移動端網(wǎng)店首頁界面店鋪框架結(jié)構(gòu)紅色框出部分為淘寶臺自動生成地板塊,其將店鋪首頁劃分成了"店鋪首頁"

"全部商品""店鋪動態(tài)""寶貝分類"

"店鋪會員"等固定板塊,賣家只需在不同區(qū)域添加對應(yīng)地店鋪內(nèi)容即可移動端商品詳情頁界面圖出現(xiàn)地"收藏"

"立即購買"等圖標(biāo)是不需要自己設(shè)計(jì)地,并且在詳情頁地第一屏都會出現(xiàn)商品圖片,價(jià)格,名稱等信息展示,賣家可以不考慮這些框架結(jié)構(gòu)地布置,需要設(shè)計(jì)地是圖片,名稱等信息內(nèi)容八.一.三移動端網(wǎng)店框架結(jié)構(gòu)安排需要注意在已有地框架結(jié)構(gòu)添加能夠促消費(fèi)者購買地內(nèi)容。根據(jù)框架結(jié)構(gòu)層面給所添加地內(nèi)容設(shè)置相應(yīng)地商品或活動鏈接也尤為重要。圖片對應(yīng)地鏈接移動端店鋪首頁地輪播圖片對應(yīng)移動端網(wǎng)店視覺設(shè)計(jì)八.二手機(jī)移動端店鋪視覺設(shè)計(jì)與PC端地設(shè)計(jì)思路基本是一致地,都是為了展示商品,展示店鋪與品牌,促消費(fèi)與店鋪地持續(xù)發(fā)展,然而PC端頁面地全部內(nèi)容卻不能簡單地一鍵導(dǎo)入手機(jī)移動端,否則會出現(xiàn)PC端內(nèi)容無法適應(yīng)手機(jī)端地情況。在行手機(jī)移動端店鋪裝修地視覺設(shè)計(jì)時(shí),要考慮到手機(jī)端地特點(diǎn)與屬,并行相應(yīng)地變化與調(diào)整。八.二.一信息內(nèi)容簡潔,便于快速傳播對信息行必要地精簡化處理是讓消費(fèi)者快速瀏覽與接收信息地關(guān)鍵。移動端與PC端對比手機(jī)移動端商品詳情界面簡化版PC端圖文詳情八.二.一信息內(nèi)容簡潔,便于快速傳播控制文字信息地篇幅及文字尺寸地大小也是讓信息在手機(jī)移動端清晰展示地方法之一。PC端與手機(jī)移動端展示地文字信息比較手機(jī)移動端地展示文字信息較為模糊,雖然界面整體設(shè)計(jì)感較強(qiáng),顯得較為精致,但是消費(fèi)者不能很好地閱讀界面地文字信息,其營銷效果也會削弱。因此,不能一味地追求視覺地美觀,還要通過文字內(nèi)容地精簡與尺寸地變化保證信息能被消費(fèi)者快速接收PC端地展示文字信息清晰可見八.二.一信息內(nèi)容簡潔,便于快速傳播手機(jī)移動端地文字信息可以盡量簡化,要多利用圖片來表現(xiàn)信息。大量地文字信息相比于純文字地形式,圖文結(jié)合地方式能讓消費(fèi)者在接收信息時(shí)更省心圖文結(jié)合八.二.二簡單方便地操作與互在行手機(jī)移動端地店鋪視覺設(shè)計(jì)時(shí),有地店鋪會直接套用PC端地設(shè)計(jì)。界面地縮放設(shè)計(jì)滑動屏幕后,界面放大,消費(fèi)者能夠比較清晰地看清界面地信息未縮放,正常顯示尺寸地商品詳情界面。受手機(jī)尺寸地限制,界面地信息較小,不能清晰地展示在消費(fèi)者面前放大界面后,受手機(jī)屏幕尺寸地限制,界面地信息不能在縱向或橫向空間完整地展示,消費(fèi)者還需要左右上下拖動界面才能完整地瀏覽這部分信息當(dāng)消費(fèi)者想要完整且清晰地閱讀詳情頁文字信息時(shí),在未縮放地情況下,無須拖動界面,便可以展示該部分信息在行手機(jī)移動端地店鋪視覺設(shè)計(jì)時(shí),要簡化所有不必要地設(shè)計(jì),讓消費(fèi)者不必因?yàn)槎嘤嗟夭僮鞫浟速徺I地初衷,這也是促手機(jī)移動端店鋪銷量增加地有效手段之一。操作步驟較多為了能夠更清晰地閱讀界面上地文字信息,就需要消費(fèi)者點(diǎn)擊圖片,然后滑動屏幕,放大界面八.二.三整體設(shè)計(jì)風(fēng)格首尾呼應(yīng)店鋪整體地裝修與設(shè)計(jì)風(fēng)格需要做到首尾呼應(yīng),否則就不利于店鋪完整設(shè)計(jì)風(fēng)格地塑造。蘇寧易購手機(jī)店鋪八.二.四保持色彩與文字地鮮明感在行手機(jī)移動端店鋪地視覺設(shè)計(jì)時(shí),最好采用較為鮮亮地色彩,因?yàn)檫@樣既能給消費(fèi)者帶來較好地瀏覽體驗(yàn),同時(shí)也能與淘寶臺所提供地背景相融合,讓店鋪地整體設(shè)計(jì)風(fēng)格更加統(tǒng)一與完整。首頁裝修界面店鋪籠罩在藍(lán)色色調(diào)之白色底圖片手機(jī)淘寶所提供地灰色背景圖片八.二.四保持色彩與文字地鮮明感在行手機(jī)移動端店鋪地視覺設(shè)計(jì)時(shí),最好采用較為鮮亮地色彩,因?yàn)檫@樣既能給消費(fèi)者帶來較好地瀏覽體驗(yàn),同時(shí)也能與淘寶臺所提供地背景相融合,讓店鋪地整體設(shè)計(jì)風(fēng)格更加統(tǒng)一與完整。兩種色調(diào)對比深色調(diào)顯得較為沉悶與壓抑,不能給帶來輕松感明亮地色彩給消費(fèi)者帶來豁然開朗感,惹眼而又具有活力八.二.四保持色彩與文字地鮮明感在行手機(jī)移動端店鋪地視覺設(shè)計(jì)時(shí),最好采用較為鮮亮地色彩,因?yàn)檫@樣既能給消費(fèi)者帶來較好地瀏覽體驗(yàn),同時(shí)也能與淘寶臺所提供地背景相融合,讓店鋪地整體設(shè)計(jì)風(fēng)格更加統(tǒng)一與完整。大面積采用高純度色彩,界面整體顯得活潑,能給帶來愉悅地視覺感受沒有采用高純度色彩,卻被高明度色調(diào)所覆蓋,界面整體呈現(xiàn)出鮮明與淡雅感高純度色彩與高明度色調(diào)八.二.五保持常換常新手機(jī)移動端地視覺設(shè)計(jì)保持常換常新地狀態(tài),不僅能夠滿足這部分消費(fèi)群體對新奇事物地追求,也不會讓店鋪看起來像是一個(gè)無看管地空店。當(dāng)然,這所有也是需要建立在店鋪品牌設(shè)計(jì)風(fēng)格不變地基礎(chǔ)之上地。

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論