發(fā)現(xiàn)每一個(gè)聲音的價(jià)值

2018-08-10 1200 0

43bd5696090c32f87574bed04a94.jpg


 

d354569609b032f87574be738bdf.jpg
 

網(wǎng)站產(chǎn)品客戶聲音收集通道分散,不易聚集。Pd難以收集優(yōu)質(zhì)客戶需求,ued無(wú)法獲得一手用戶聲音??蛻魶]有統(tǒng)一的提建議的概念及更加有效的反饋機(jī)制,1688需要更加完整的建議系統(tǒng)。

前臺(tái)用戶:面對(duì)1688網(wǎng)站全體用戶


用戶性別/年齡分析:以30歲上下的男性為主


 

d8a1569609c332f87574beaff6c4.jpg
 


1 色彩制定


首先來(lái)平臺(tái)提建議的用戶往往是在使用網(wǎng)站時(shí)遇到問題或不滿,可能是帶有情緒的,這個(gè)建議平臺(tái)在顏色的運(yùn)用方面就希望能起到一些安撫作用,綠色往往給 人視覺感受通常是心情平靜、舒適、健康、希望,也有優(yōu)化產(chǎn)品的含義,對(duì)于30歲左右的主要用戶而言,這個(gè)顏色也比較能表現(xiàn)活力、明快的視覺感受。同時(shí)又不 希望給人過冷的感覺,所以和一些黃色搭配設(shè)計(jì),頁(yè)面的底色并非簡(jiǎn)單的淺灰,而是飽和度較低的米黃色。


 

原生關(guān)鍵詞收集:


 

99a0569609f532f87574be8c1b2b.jpg


 

51ab56960a086ac725af23f566af.jpg


 

2 質(zhì)感設(shè)定


質(zhì)感上希望有一些紙張/卡片的感覺,因?yàn)槭翘峤ㄗh的平臺(tái),可以給用戶更多的代入感。另外就是簡(jiǎn)潔、干凈,這樣主要信息才能更好的展示。
 


 


 

3 版式風(fēng)格

為了便于用戶更好專注建議文字內(nèi)容,所以弱化頁(yè)面中的分割線,同時(shí)對(duì)于版塊與版塊也用不同底色進(jìn)行區(qū)分,簡(jiǎn)潔明了。因?yàn)榻ㄗh平臺(tái)中有大量用戶建議展示,所以特別注重文字行于行之間的距離,避免排布過于緊密,用戶在瀏覽時(shí)會(huì)產(chǎn)生疲勞感。


 

f10956960aa132f87574bea5eaca.jpg

ac1456960abe32f87574be8f2e7a.jpg


 

d94f56960ad16ac725af2324a732.jpg
 


 

6e8456960ade32f87574bedc648d.jpg


 

1 色彩方面


考慮到前后臺(tái)的呼應(yīng),所有顏色上仍然想保持一些關(guān)聯(lián)性。這是視覺方面的定位希望體現(xiàn)簡(jiǎn)潔、清爽和后臺(tái)感。采用了飽和度比較低的灰藍(lán)、灰色和綠色進(jìn)行搭配使用,而強(qiáng)調(diào)色采用紅色進(jìn)行凸顯。


 

2 質(zhì)感與版式


這里也參考了國(guó)內(nèi)外一些競(jìng)品,偏后臺(tái)工具類的頁(yè)面??梢钥吹交旧隙际潜馄交L(fēng)格,弱化線條,整體用色方面飽和度較低,大的版塊用底色進(jìn)行區(qū)分,當(dāng)前狀態(tài)、行動(dòng)點(diǎn)及重要內(nèi)容用比較醒目的顏色進(jìn)行突出。文字上面基本采用不同深度的灰色進(jìn)行區(qū)分,突出不同重要級(jí)及頁(yè)面的前后層次感。為了增加簡(jiǎn)潔、輕松的視覺感受,多處采用了圓角的運(yùn)用,包括用戶頭像,搜索框,tab等。
 


 

b0bc56960b046ac725af23423ed4.jpg


 


 

1 頭部為什么有那些圖形? 源于最初人們對(duì)“回聲”的印象:那些來(lái)自山谷的回聲。所以把“山谷”的形象用幾何三角形抽象出來(lái),這樣作為修飾圖案運(yùn)用于背景,這樣既可以使頭部不顯得那么單調(diào),又對(duì)產(chǎn)品主題有一定映射聯(lián)系。


 

3f3456960b426ac725af23c4aa01.jpg


 

2 不同產(chǎn)品對(duì)應(yīng)不同背景圖片 每個(gè)產(chǎn)品對(duì)應(yīng)不同的背景圖片,當(dāng)用戶關(guān)注了多個(gè)產(chǎn)品,在不同產(chǎn)品之間進(jìn)行切換時(shí),對(duì)應(yīng)的產(chǎn)品頁(yè)面背景圖也隨之變化,背景圖片與產(chǎn)品線特點(diǎn)相關(guān),起到一些詮釋作用,同時(shí)讓用戶更好地感受到類目切換的感覺。
 


 

46d356960b6e6ac725af2334bf40.jpg


 

3 報(bào)錯(cuò)頁(yè)面 11 報(bào)錯(cuò)頁(yè)面為什么用了二娃,不說(shuō)你也知道吧……


 

c35d56960b9a6ac725af2333b392.jpg


 

回聲項(xiàng)目現(xiàn)在仍在進(jìn)行中,也歡迎大家給予關(guān)注,給我們一些更好的建議和意見,謝謝!

 


 


24
評(píng)論區(qū)(0)
正在加載評(píng)論...