中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

用一個個實際的、活生生的案例來說明 & 展現(xiàn) —— 設計細節(jié)拆分，還原真實的產(chǎn)品設計、開發(fā)等場景。

這一系列文章，好的設計，如何一步一步來的，從開始的 “呃～” 到最后的 “哇～”，相信作為教學例子，也實不為過。

聯(lián)想電腦管家2.0，首頁交互與視覺設計：

用 PC 端軟件為例子，因為這是我最近做的，記憶尤新，各種小細節(jié)、各種選擇原因都還歷歷在目，講述起來更通俗易懂，并且 UX Design 的本質(zhì)是一樣的，設計流程也大同小異，無論在電腦端、移動端、還是別的設備上。

• 目的：干凈簡潔，完全區(qū)別于市場上已有的電腦管家的首頁設計
• 設計團隊：PeoPeo Design
• 設計評估并改進：作者本人

下圖為終稿版（當然現(xiàn)在的管家產(chǎn)品已經(jīng)又迭代了很多很多版，但左側三環(huán)主體的設計依然沒變，并且它拿到了設計專利）：

1. 開始交互設計

a) 第一版提稿，感覺太簡單，頁面布局太像當時的騰訊電腦管家，沒內(nèi)容沒創(chuàng)新，要求重新再想想：

b) 第二版設計稿，非常有想法，界面也清爽明朗。但是導航從底部改到左邊恐怕對技術開發(fā)的難度不是一般的大，因為他們要改技術架構，工作量和風險評估不通過。內(nèi)容區(qū)域的左側兩個圖表，恐怕技術和數(shù)據(jù)都是個難點，非常有可能出現(xiàn)兩條直線水平線的圖表，實在 “不好看”。于是放棄。

c) 第三版設計稿，干凈清爽，只是稍嫌散亂，沒有特色。也暫時沒有特別好的想法，于是只要求在這稿基礎上改進一些，以便開始2.0新的視覺設計，任務艱巨繁重！

d) 第四稿，好似沒有特色，但似乎也挑不出毛病，交互設計暫定為它。

2. 開始視覺設計

a) 第一版初稿，背影底圖不是藍得奇怪耀眼，就是 copy 百度電腦管家或騰訊電腦管家的….. ?但左側圓環(huán)的設計很棒，比較特別，保留。

b) 第二版設計提稿，確定左側圓環(huán)的設計，“開始體檢” 按鈕的位置不夠聚焦，并且右側顯得到處都是按鈕，很奇怪。建議入到圓環(huán)下方，讓其非常突出，吸引用戶點擊。

c) 第三版設計稿，背景底圖重新設計，右側文字按鈕的布局嘗試小變化。

3. 設計中的爭吵

會議討論方案，鑒于時間緊等因素，老大暫定就下面左圖方案，細節(jié)再微調(diào)。

結束會議，我自己想了很久，還是決定跟所有人說出想法：這個設計方案我個人不同意，原因是與騰訊電腦管家（當時）的首頁太像了，頁面布局基本一樣，只是換了大小圖標文字描述而已……

幸而，得到了同事的支持和peopeo設計師們的理解，再次大家努力做出新的設計，讓聯(lián)想電腦管家有完全不同于市場已有產(chǎn)品的設計，有它自己的品牌感覺。

4. 全新的首頁設計方案

都非常、非常棒！peopeo 的設計師們特別棒！化壓力為動力！

下面各圖，左側為初提稿，右側為 review 改進稿：

方案1，2，蜂巢設計，展示數(shù)據(jù)一流，且有很多可擴展空間。review 改進主要移動 “體檢” 按鈕，讓整體不散亂，又有更多留白，更簡潔。

方案3，三環(huán)主體初現(xiàn)，界面干凈，功能區(qū)分清晰，重點突出。review 改進將左大側定為視覺主區(qū)，右小側為副功能，右小下為廣告區(qū)，且各設計統(tǒng)一性強。因為人的視線通常從屏幕/界面的左上角開始，右下角其實是視線的 “小盲區(qū)”，那么重點突出的部分應該在左側區(qū)域。

5. 定下首頁交互與視覺設計

繼續(xù)調(diào)整細節(jié)。這個過程非常冗長，甚至直到產(chǎn)品上線前夕都還在微調(diào)。比如：

• 背景圖流星、月亮太耀眼，淡化些。
• “開始體檢” 按鈕可以再大些。
• 大圓環(huán)左右的兩個小圓圈，不夠明顯，加強些。
• 背景圖那幾片荷花很奇怪啊，看不出來有水，它為什么在那兒？
• 鼠標移到可點擊圖標或按鈕，動畫是什么樣，嘗試效果。
• 背景圖是深紫藍色，看起來有點邪魅啊，改改顏色，也不要那么深色～ ?我本人已經(jīng)非常不好意思讓 peopeo 設計師一直改了…… 但還是厚臉皮做了…..
• 快上線了，大圓環(huán)不顯示數(shù)據(jù)的部分，青藍色很亮很突出，似乎不太好，改淺試試看。
• 快上線了，大圓環(huán)及數(shù)據(jù)的動畫不夠好，應該是指示圓 & 環(huán)按照軌跡上升，到點了因為慣性還要 “顫一顫”，同時數(shù)據(jù)從0開始一路攀升，直到當前是什么數(shù)據(jù)，最好也 “左右搖擺” 以更真實的感覺，遂要求開發(fā)改進…… ?開發(fā)怒視我，但還是默默改了，最后結果很贊！

6. 最后

呈現(xiàn)出接近完美的設計，有中國山水畫的意境，安寧祥和，界面簡潔獨特，重點突出，與市場上已經(jīng)類似產(chǎn)品完全不一樣的首頁設計，正是我們想要的：

后記：當然這個界面也是有缺點的，后續(xù)文章會具體討論。

寫這樣的文章，一是想還原真實產(chǎn)品的設計，與開發(fā)的合作，現(xiàn)在重憶，也是一份美好；二是想表達，一個好設計不是隨便一做就有的，有無數(shù)版的改進，花費無數(shù)時間與精力，結合了團隊大家的智慧，請看到文章的人們尊重設計師，及他們的勞動成果，“隨便幫忙設計一個界面，設計一個 logo” 這樣的請求還須慎重。

謝謝大家！ ??

作者：Juner UX，微信公眾號：君樂UX，個人設計網(wǎng)站：www.junerdesign.cn

本文由 @Juner UX 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉載

題圖來自 Unsplash ，基于 CC0 協(xié)議