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