回歸體驗(yàn)—我喜歡網(wǎng)頁(yè)設(shè)計(jì)小結(jié)
2012-10-25 藍(lán)藍(lán)設(shè)計(jì)的小編
轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(
www.lzhte.cn
)是一家專(zhuān)注而深入的設(shè)計(jì)機(jī)構(gòu) ，為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的 BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
來(lái)源：
http://www.uimaker.com/uimakerhtml/uistudy/2012/0928/46664.html
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中，
請(qǐng)點(diǎn)這里
富媒體內(nèi)容豐富的web時(shí)代，互聯(lián)網(wǎng)已經(jīng)是獲取內(nèi)容和收集內(nèi)容的一個(gè)必然途徑。通過(guò)圖片、文章等等…的內(nèi)容資源，如何能實(shí)現(xiàn)更好的收集與分享將變的更加重要。在每一位UGC用戶(hù)貢獻(xiàn)內(nèi)容的同時(shí)，他們也在相互消費(fèi)著其他的用戶(hù)內(nèi)容，基于興趣內(nèi)容的互動(dòng)就這樣產(chǎn)生了。依托于碎片化的內(nèi)容收集，可以清晰的看到到我們的興趣圖譜。讓豐富的興趣內(nèi)容吸引更多的相關(guān)用戶(hù)，使發(fā)現(xiàn)好內(nèi)容、發(fā)現(xiàn)興趣相投用戶(hù)變的更簡(jiǎn)單。作為一個(gè)以瀏覽器為基礎(chǔ)延伸出的創(chuàng)新產(chǎn)品，基于web用戶(hù)瀏覽收藏網(wǎng)頁(yè)內(nèi)容的強(qiáng)需求，我喜歡網(wǎng)通過(guò)與瀏覽器的深度結(jié)合，努力為用戶(hù)提供更有價(jià)值的互聯(lián)網(wǎng)服務(wù)。創(chuàng)新和探索正在使得這個(gè)產(chǎn)品不斷趨于完善，很多功能和體驗(yàn)都需要進(jìn)一步的優(yōu)化。努力為億萬(wàn)用戶(hù)提供最好的web體驗(yàn)是我們的責(zé)任。
在接觸我喜歡項(xiàng)目的這段時(shí)間里，從自身使用、數(shù)據(jù)分析以及用戶(hù)反饋中總結(jié)了一些設(shè)計(jì)中的感悟，在這里我們一起聊聊如何在設(shè)計(jì)上優(yōu)化產(chǎn)品體驗(yàn)。
一、新視覺(jué)形象Logo設(shè)計(jì)：
我喜歡-基于興趣的內(nèi)容分享社區(qū)，通過(guò)融合網(wǎng)站核心功能，以及極富情感化色彩的網(wǎng)站名稱(chēng)“我喜歡”，設(shè)計(jì)了更符合產(chǎn)品定位的Logo視覺(jué)形象。
新Logo緊緊圍繞用戶(hù)互動(dòng)行為（核心功能點(diǎn) – 收集），以及帶有強(qiáng)烈情感導(dǎo)向的網(wǎng)站名稱(chēng)“我喜歡”為設(shè)計(jì)思路，將抽象的用戶(hù)行為和情感因素具象化。以詮釋收集行為的回形針與情感化表述的心形icon做為設(shè)計(jì)元素相結(jié)合，設(shè)計(jì)了這版心形回形針的logo。在整體的造型上 又做了一些規(guī)范化的處理，以適合不同環(huán)境下的標(biāo)準(zhǔn)化應(yīng)用。
二、ICON風(fēng)格統(tǒng)一化：
通過(guò)在logo上的延展，設(shè)計(jì)了風(fēng)格相符的icon，不僅在視覺(jué)元素風(fēng)格上達(dá)到高度統(tǒng)一，也提升了品牌形象感。
三、主導(dǎo)航優(yōu)化：
在之前的版本中，導(dǎo)航冗余信息太多，頻道名稱(chēng)相對(duì)較長(zhǎng)。對(duì)于我喜歡網(wǎng)這樣的一個(gè)響應(yīng)式網(wǎng)站，在不同分辨率下頁(yè)面寬度是自動(dòng)適應(yīng)的，這樣就會(huì)產(chǎn)生導(dǎo)航在小分辨率下的顯示效果極為臃腫。
在多次的調(diào)整和嘗試中，最終決定使用如下版本。介于網(wǎng)站展示內(nèi)容以圖片為主，深色導(dǎo)航更能夠壓住頁(yè)面內(nèi)容，同時(shí)logo的形象的展示會(huì)更充分。新的導(dǎo)航采用了吸頂式設(shè)計(jì)，將分類(lèi)選擇融入到導(dǎo)航中，在頁(yè)面瀏覽的任何時(shí)候都可以做快速切換，優(yōu)化了網(wǎng)站瀏覽體驗(yàn)。
四、瀏覽器擴(kuò)展程序優(yōu)化：
在這一版的改進(jìn)中，我們?cè)趪@功能點(diǎn)優(yōu)化的同時(shí)提升了用戶(hù)體驗(yàn)。優(yōu)化的內(nèi)容如下：
收集內(nèi)容在插件中實(shí)時(shí)預(yù)覽查看；
興趣電臺(tái)“隨便翻翻“ ，在這里可以發(fā)現(xiàn)更多精彩內(nèi)容，你也可以點(diǎn)按“收集icon”隨手收集起來(lái)，稍后查看。
興趣頻道也讓這個(gè)擴(kuò)展程序變的更有活力與情境，伴有一絲的意外與驚喜。讓原本生硬的內(nèi)容推薦變的更有情調(diào)，更易于接受。
整個(gè)擴(kuò)展程序面板在視覺(jué)上做了較大的優(yōu)化。系統(tǒng)化的梳理了面板交互結(jié)構(gòu)，調(diào)整了tab視覺(jué)樣式、icon風(fēng)格統(tǒng)一化調(diào)整，以及圖片展示和交互效果。
小結(jié)：
