項(xiàng)目5 簡約風(fēng)格客服區(qū)的設(shè)計(jì)_第1頁
項(xiàng)目5 簡約風(fēng)格客服區(qū)的設(shè)計(jì)_第2頁
項(xiàng)目5 簡約風(fēng)格客服區(qū)的設(shè)計(jì)_第3頁
項(xiàng)目5 簡約風(fēng)格客服區(qū)的設(shè)計(jì)_第4頁
項(xiàng)目5 簡約風(fēng)格客服區(qū)的設(shè)計(jì)_第5頁
已閱讀5頁,還剩28頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡介

項(xiàng)目五

簡約風(fēng)格客服區(qū)的設(shè)計(jì)網(wǎng)店美工項(xiàng)目實(shí)戰(zhàn)教程CONTENTS目錄項(xiàng)目導(dǎo)入5.1知識與技術(shù)引導(dǎo)5.2項(xiàng)目實(shí)現(xiàn)5.3拓展項(xiàng)目5.4課后思考5.55.1.1項(xiàng)目情景5.15.1.2項(xiàng)目目標(biāo)5.1.3效果展示項(xiàng)目導(dǎo)入曼曼在網(wǎng)上開了一家女裝專賣店,主要銷售各種適用于年輕女性的高品質(zhì)、時尚服裝,由于服裝質(zhì)地優(yōu)良,價格合理,她的店鋪有了很多回頭客,生意越做越大,原來的客服已經(jīng)無法滿足現(xiàn)今的需求,她決定擴(kuò)大網(wǎng)店經(jīng)營規(guī)模,特地新招了多個客服來更好的服務(wù)顧客,為此,原來的店鋪客服區(qū)也需求做相應(yīng)的調(diào)整,她需要重新設(shè)計(jì)店鋪的客服區(qū)域。5.1.1項(xiàng)目情景5.1.2項(xiàng)目目標(biāo)了解網(wǎng)店店鋪客服的作用與設(shè)計(jì)思路。掌握常見的客服區(qū)設(shè)計(jì)要求。能夠根據(jù)商品特點(diǎn)及店鋪特色進(jìn)行定位構(gòu)思,設(shè)計(jì)制作出風(fēng)格一致的客服區(qū)。5.1.3效果展示簡約風(fēng)格店鋪客服區(qū)的效果圖5.2.1店鋪客服區(qū)的概述5.25.2.2賞析店鋪客服區(qū)知識與技術(shù)引導(dǎo)客戶在選購商品時,對寶貝或是活動有疑問時,可以通過客服進(jìn)行咨詢解答。網(wǎng)店客服的分工已經(jīng)達(dá)到相當(dāng)細(xì)致的程度,有專門進(jìn)行導(dǎo)購的售前客服;有專門推廣、解釋活動內(nèi)容的營銷客服;還有處理客戶投訴及售后服務(wù)的售后客服等等。擁有優(yōu)質(zhì)的客服,可以幫助提升銷量,降低退貨、退款率,提高好評度,增加回頭客。那么,一張優(yōu)秀的客服區(qū)圖片,也會方便買家尋求客戶服務(wù),并且給買家展示出認(rèn)真負(fù)責(zé)的賣家態(tài)度。5.2.1店鋪客服區(qū)的概述常見的網(wǎng)店客服區(qū)主要有兩種。一種位于側(cè)邊欄,與寶貝排行、搜索框等相鄰,如右圖所示。5.2.1店鋪客服區(qū)的概述根據(jù)店鋪裝修風(fēng)格的提升需要,一部分商家將客服區(qū)放置在首頁的中間或是底部,如下圖所示。當(dāng)用戶瀏覽了一會兒網(wǎng)店首頁后,及時出現(xiàn)的客服區(qū),可以方便客戶詢問相關(guān)的商品和活動,從而提升網(wǎng)店的銷量。5.2.1店鋪客服區(qū)的概述目前還有一部分店鋪使用懸浮客服區(qū),一般情況下如左圖所示折疊懸浮在頁面右側(cè)且能跟隨畫面進(jìn)行移動;當(dāng)鼠標(biāo)移動到客服圖標(biāo)上方,會如右圖所示展開顯示詳細(xì)的客服信息。這樣,不僅節(jié)約了頁面空間,也能方便顧客與客服溝通。5.2.1店鋪客服區(qū)的概述客服區(qū)的設(shè)計(jì)中,多見于直接使用網(wǎng)店的聊天圖標(biāo)作為客服頭像的圖片,簡潔直觀,且符合客戶的使用習(xí)慣。也有個別極具風(fēng)格的店鋪,會使用一些卡通頭像或是真實(shí)的人物頭像,如圖所示,能凸顯店鋪特色,也能提高顧客與客服交流的興趣。5.2.1店鋪客服區(qū)的概述店鋪客服區(qū)在頁面上出現(xiàn)的位置非常的靈活,它的設(shè)計(jì)需要與周圍的設(shè)計(jì)元素相互融合,且風(fēng)格一致,不能影響整體視覺美觀。同時,必須要清晰地羅列出客服圖標(biāo),方便顧客快速點(diǎn)擊咨詢。5.2.2賞析店鋪客服區(qū)店鋪客服區(qū)在頁面上出現(xiàn)的位置非常的靈活,它的設(shè)計(jì)需要與周圍的設(shè)計(jì)元素相互融合,且風(fēng)格一致,不能影響整體視覺美觀。同時,必須要清晰地羅列出客服圖標(biāo),方便顧客快速點(diǎn)擊咨詢。5.2.2賞析店鋪客服區(qū)還有的店鋪將收藏區(qū)和客服區(qū)設(shè)計(jì)在一起,如圖所示,向顧客展示出店鋪完善的售前、售后服務(wù),增加顧客對店鋪的信任度,對日后的成交量產(chǎn)生較大地影響。5.2.2賞析店鋪客服區(qū)5.3.1設(shè)計(jì)理念5.35.3.2工具方法5.3.3實(shí)現(xiàn)過程項(xiàng)目實(shí)現(xiàn)5.3.1設(shè)計(jì)理念本店鋪經(jīng)營的是高品質(zhì)、時尚女裝,銷售人群為年輕女性,所以設(shè)計(jì)的主色調(diào)為粉色,且與旺旺頭像的藍(lán)色協(xié)調(diào)搭配。在客服區(qū)分類設(shè)計(jì)多個客服位置,分類售前、售后,體現(xiàn)店鋪的專業(yè)與實(shí)力。店鋪優(yōu)勢的文字結(jié)合小圖標(biāo)一起呈現(xiàn),既能增強(qiáng)客戶的信任感,又為畫面增添了設(shè)計(jì)感。簡約風(fēng)格店鋪客服區(qū)的效果圖5.3.2工具方法使用鋼筆工具組繪制流暢曲線,搭配“描邊”圖層樣式,制作出線條的層次感。使用絲綢素材,結(jié)合圖層混合模式的調(diào)整和圖層蒙版,制作富有質(zhì)地感的背景。使用形狀工具繪制店鋪特色圖標(biāo)。5.3.3實(shí)現(xiàn)過程在Photoshop中新建一個文檔,并填充顏色。使用“鋼筆工具”繪制并修改得到“弧形”形狀。再添加“描邊”圖層樣式。加入“絲綢紋”素材,并調(diào)整圖層混合模式,編輯圖層蒙版,調(diào)整不透明度,使其與背景融合。5.3.3實(shí)現(xiàn)過程使用“鋼筆工具”在弧形左側(cè)繪制三個形狀,使用“橫排文字工具”輸入對應(yīng)的文字。將形狀與文字編組,并添加圖層樣式進(jìn)行統(tǒng)一修飾。在弧形右側(cè)輸入文字并修飾。使用“橫排文字工具”結(jié)合“矩形工具”,完成“客服中心”文字的制作。5.3.3實(shí)現(xiàn)過程加入“旺旺頭像”素材,并輸入客服類型及客服名稱。使用“直線工具”繪制立體分隔線,并輸入工作時間文字。5.4.1黑白風(fēng)格客服區(qū)的設(shè)計(jì)5.45.4.2收藏區(qū)與客服區(qū)相結(jié)合的設(shè)計(jì)拓展項(xiàng)目5.4.1拓展黑白風(fēng)格客服區(qū)的設(shè)計(jì)設(shè)計(jì)理念本案例中在色彩搭配上使用黑白配色,客服圖標(biāo)采用真彩照片設(shè)計(jì),清新簡潔,吸引眼球。為客服圖片配上花朵外框,呈現(xiàn)清新可愛的風(fēng)格。通過多個客服的排列凸顯出店鋪的大氣與實(shí)力。效果如下圖所示。5.4.1拓展黑白風(fēng)格客服區(qū)的設(shè)計(jì)實(shí)現(xiàn)過程在Photoshop中新建一個文檔,620*250像素,使用自定義形狀工具,選擇橫幅2,垂直翻轉(zhuǎn),添加黃色圓角矩形,刪格化圖層,鎖定透明度,使用自然筆頭繪制橫幅,添加字體輸入文字。使用自定義工具,選擇花1,置入頭像素材,與花1創(chuàng)建剪貼蒙板,將頭像欠入花形狀中,使用橢圓工具,制作邊上的旺旺小圖標(biāo)。5.4.1拓展黑白風(fēng)格客服區(qū)的設(shè)計(jì)實(shí)現(xiàn)過程參照上步驟,添加其他客服圖標(biāo)。5.4.2拓展收藏區(qū)與客服區(qū)相結(jié)合的設(shè)計(jì)設(shè)計(jì)理念本案例是為歐式家裝網(wǎng)店設(shè)計(jì)的一款將收藏區(qū)與客服區(qū)結(jié)合起來的服務(wù)區(qū)域。使用棕色和米色為主要色彩搭配,再點(diǎn)綴藍(lán)色,呈現(xiàn)出家裝網(wǎng)的歐式風(fēng)情。圖片素材選用歐式城堡剪影,加入花紋裝飾,同時也為客服的名字作了協(xié)調(diào),整體風(fēng)格協(xié)調(diào)統(tǒng)一。效果如右圖所示。5.4.2實(shí)現(xiàn)過程在Photoshop中新建一個文檔,填充深棕背景色。加入素材圖片,結(jié)合使用“顏色疊加”圖層樣式、矩形選框工具修飾背景。拓展收藏區(qū)與客服區(qū)相結(jié)合的設(shè)計(jì)5.4.2實(shí)現(xiàn)過程使用“圓角矩形工具”繪制所需基本形狀,使用“橫排文字工具”輸入文字并設(shè)置格式,再加入素材圖片,制作店鋪客服區(qū)。拓展收藏區(qū)與客服區(qū)相結(jié)合的設(shè)計(jì)5.4.2實(shí)現(xiàn)過程使用“矩形工具”繪制收藏底板,利用“橫排文字工具”輸入文字并設(shè)置各個格式,再使用“橢圓工具”、“鋼筆工具”等繪制英文收藏標(biāo)簽,編輯素材圖片并加入來制作出裝飾邊框。拓展收藏區(qū)與客服區(qū)相結(jié)合的設(shè)計(jì)5.5.1思政思考5.55.5.2技能思考課后思考目前,市面上的電商平臺日益增多,各個平臺的功能、品類大致相同,但在布局、細(xì)節(jié)上又各有不同。這就對網(wǎng)店美工們提出了更進(jìn)一步的要求,一定要細(xì)心觀察、深入研究各平臺的差異。為了滿足客戶不斷追求更好的購物體驗(yàn),主流的幾家大型電商平臺,不斷進(jìn)行頁面更新與優(yōu)化,那么網(wǎng)店美工們,也要不斷與時俱進(jìn),保持時刻學(xué)習(xí)的態(tài)度,練就較強(qiáng)的應(yīng)變能力,好讓自己跟得上時代的發(fā)展而不被淘汰??头^(qū)的設(shè)計(jì),能對頁面起到錦上添花的作用。所以,在設(shè)計(jì)之前務(wù)必對所服務(wù)的店鋪?zhàn)骱谜{(diào)查研究,從功能方面、設(shè)計(jì)風(fēng)格方面等,都要與店鋪頁面協(xié)調(diào)起來。這就要求我們從事網(wǎng)店美工的小伙伴們,必須具備良好的溝通協(xié)調(diào)能力和團(tuán)隊(duì)合作意識,與團(tuán)隊(duì)其他成員積極

溫馨提示

  • 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)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論