1、視覺規(guī)劃及一期提案百度知道用戶體驗(yàn)部 石爽 2009.04.30目錄 產(chǎn)品視覺現(xiàn)狀評(píng)析 視覺發(fā)展趨勢(shì)及規(guī)范化道路 知道產(chǎn)品視覺細(xì)分思路草案 一期提案說明1百度知道產(chǎn)品視覺現(xiàn)狀評(píng)析A.色彩體系 web各元素色彩使用，色彩情感上，不統(tǒng)一：冷暖混搭，產(chǎn)品取向不明確。 色彩在信息分層顯示上有優(yōu)化的空間。 品牌色彩沒有過于隱晦。B.圖標(biāo)體系 未統(tǒng)一色彩范圍。 制作方法不一致，無(wú)法延展，升級(jí)。 圖標(biāo)的使用不規(guī)范，造成頁(yè)面點(diǎn)元素過多，頁(yè)面繁星點(diǎn)綴。（例如知識(shí)掌門人）C.樣式體系 對(duì)已經(jīng)形成的統(tǒng)一的樣式庫(kù)進(jìn)行規(guī)范整理。 從產(chǎn)品角度，規(guī)范和升級(jí)樣式體系。D.排版體系 對(duì)各種信息總結(jié)歸納排版規(guī)范，對(duì)應(yīng)到頁(yè)面的樣式

2、中去，方便修正與升級(jí)。 從產(chǎn)品角度，規(guī)范和升級(jí)排版樣式。E.專題體系 沒有很好的體現(xiàn)用戶瀏覽心理。 沒有形成品牌化的視覺風(fēng)格 欄目模板有待統(tǒng)一規(guī)范（可擴(kuò)展易更新）。2百度知道視覺發(fā)展趨勢(shì)規(guī)范化升級(jí)道路A. Web產(chǎn)品視覺趨勢(shì) 規(guī)范化迭代的視覺升級(jí) 增強(qiáng)品牌對(duì)用戶的影響 視覺為品牌服務(wù) 視覺為引導(dǎo)信息服務(wù) 視覺為功能服務(wù)B.知道產(chǎn)品的操作方式第一步色彩體系圖標(biāo)體系樣式體系排版體系專題體系產(chǎn)品現(xiàn)狀B.知道產(chǎn)品的操作方式第一步色彩體系圖標(biāo)體系樣式體系排版體系專題體系分步進(jìn)行個(gè)體系的視覺優(yōu)化（基于現(xiàn)有的設(shè)計(jì)）統(tǒng)一 可操作 可延展 可升級(jí)輸出優(yōu)化設(shè)計(jì)稿 和 細(xì)分規(guī)范 （不是改版）B.知道產(chǎn)品的操作方式第

3、一步第二步色彩體系圖標(biāo)體系樣式體系排版體系專題體系第三步第四步分版本 階段升級(jí)視覺系統(tǒng) 為產(chǎn)品創(chuàng)新提供可能3百度知道視覺細(xì)分思路草案色彩體系圖標(biāo)體系樣式體系排版體系專題體系一、圖標(biāo)體系圖標(biāo)體系的第一步，是基于先在的圖標(biāo)，進(jìn)行微調(diào)，使之統(tǒng)一規(guī)范。最終效果，將是無(wú)形中的一種設(shè)計(jì)升級(jí)，不會(huì)帶來(lái)突變效果。A.知道圖標(biāo)分類 欄目符號(hào) 點(diǎn)綴提示 榮譽(yù)等級(jí) 系統(tǒng)功能B.設(shè)計(jì)嘗試嘗試圖標(biāo)來(lái)自：知道首頁(yè)問題頁(yè)面B.知道圖標(biāo)嘗試圖標(biāo)來(lái)自：1.保留舊版的符號(hào)和基本的色彩體系。2.統(tǒng)一圖標(biāo)尺寸、色彩體系、符號(hào)體系、設(shè)計(jì)制作方法。C. 設(shè)計(jì)說明1.規(guī)范取色范圍：圖標(biāo)色彩的統(tǒng)一，為設(shè)計(jì)成套的圖標(biāo)提供視覺前提。2.色彩選擇

4、取向暖色包括藍(lán)色和綠色在內(nèi)的冷色系色彩，在應(yīng)用的時(shí)候都會(huì)適當(dāng)增加暖色傾向，創(chuàng)造愉悅的氛圍。C. 設(shè)計(jì)說明2.細(xì)化設(shè)計(jì)方案，明確圖標(biāo)的UI取向1）45度高光，呈現(xiàn)柔和的凸起2）統(tǒng)一內(nèi)發(fā)光3）反白符號(hào)4）統(tǒng)一圖標(biāo)的大小（針對(duì)不同類別的圖標(biāo)進(jìn)行大小規(guī)范統(tǒng)一）5）增加陰影效果，創(chuàng)造頁(yè)面層次。舊新C. 設(shè)計(jì)說明2.細(xì)化設(shè)計(jì)方案，明確圖標(biāo)的UI取向1）柔和造型處理，升級(jí)圖標(biāo)親和力，更有利于圖標(biāo)融入界面設(shè)計(jì),創(chuàng)造親和的表現(xiàn)力。舊新按照上面的思路和方法，在項(xiàng)目確定后，可以更完整的實(shí)施，設(shè)計(jì)方案可以繼續(xù)優(yōu)化和篩選。二、知道掌門人頁(yè)面特點(diǎn)：繁星點(diǎn)綴。通過優(yōu)化解決信息傳遞混亂的局面。創(chuàng)造愉悅寬松的瀏覽空間。舊1.淡化了右側(cè)的交互興趣，讓該模塊失去了頭條的功能。1.綠色取色與圖標(biāo)改版的取色趨勢(shì)一致取暖。2.交互更明確，激活用戶對(duì)信息的切換瀏覽。新1.突出欄目，而非單個(gè)標(biāo)注。2.突出知識(shí)信息，淡化框框線線。1.色彩取向偏暖，讓閱讀更加輕松愉悅。2.信息更清晰突顯，讓信息有層次的進(jìn)入視線。知道掌門人模板;知道掌門人模板舊新知道掌門人模板舊新知道掌門人模板舊新1.基于原有的設(shè)計(jì)，