聯(lián)想首頁
用一個(gè)個(gè)實(shí)際的、活生生的案例來說明 & 展現(xiàn) —— 設(shè)計(jì)細(xì)節(jié)拆分,還原真實(shí)的產(chǎn)品設(shè)計(jì)、開發(fā)等場景。
這一系列文章,好的設(shè)計(jì),如何一步一步來的,從開始的 “呃~” 到最后的 “哇~”,相信作為教學(xué)例子,也實(shí)不為過。
聯(lián)想電腦管家2.0,首頁交互與視覺設(shè)計(jì):
用 PC 端軟件為例子,因?yàn)檫@是我最近做的,記憶尤新,各種小細(xì)節(jié)、各種選擇原因都還歷歷在目,講述起來更通俗易懂,并且 UX Design 的本質(zhì)是一樣的,設(shè)計(jì)流程也大同小異,無論在電腦端、移動端、還是別的設(shè)備上。
目的:干凈簡潔,完全區(qū)別于市場上已有的電腦管家的首頁設(shè)計(jì)設(shè)計(jì)團(tuán)隊(duì):PeoPeo Design設(shè)計(jì)評估并改進(jìn):作者本人
下圖為終稿版(當(dāng)然現(xiàn)在的管家產(chǎn)品已經(jīng)又迭代了很多很多版,但左側(cè)三環(huán)主體的設(shè)計(jì)依然沒變,并且它拿到了設(shè)計(jì)專利):
1. 開始交互設(shè)計(jì)
a) 第一版提稿,感覺太簡單,頁面布局太像當(dāng)時(shí)的騰訊電腦管家,沒內(nèi)容沒創(chuàng)新,要求重新再想想:
b) 第二版設(shè)計(jì)稿,非常有想法,界面也清爽明朗。但是導(dǎo)航從底部改到左邊恐怕對技術(shù)開發(fā)的難度不是一般的大,因?yàn)樗麄円募夹g(shù)架構(gòu),工作量和風(fēng)險(xiǎn)評估不通過。內(nèi)容區(qū)域的左側(cè)兩個(gè)圖表,恐怕技術(shù)和數(shù)據(jù)都是個(gè)難點(diǎn),非常有可能出現(xiàn)兩條直線水平線的圖表,實(shí)在 “不好看”。于是放棄。
c) 第三版設(shè)計(jì)稿,干凈清爽,只是稍嫌散亂,沒有特色。也暫時(shí)沒有特別好的想法,于是只要求在這稿基礎(chǔ)上改進(jìn)一些,以便開始2.0新的視覺設(shè)計(jì),任務(wù)艱巨繁重!
d) 第四稿,好似沒有特色,但似乎也挑不出毛病,交互設(shè)計(jì)暫定為它。
2. 開始視覺設(shè)計(jì)
a) 第一版初稿,背影底圖不是藍(lán)得奇怪耀眼,就是 copy 百度電腦管家或騰訊電腦管家的….. 但左側(cè)圓環(huán)……
原創(chuàng)文章,作者:Admin,如若轉(zhuǎn)載,請注明出處:http://m.cxzzxj.cn/146354.html