進階經驗!如何系統的進行改版設計。做改版設計大體思路很簡單,只需要做好兩件事:發現問題與解決問題。今天我們先來搞定第一件事:發現問題。
給你下面這樣的網站首頁,讓你找視覺層面的問題,你會怎麼闡述?(注意:本文只討論視覺層面問題。)
我個人覺得會有三種不同類型的設計師:
1.感覺型
他說:我感覺這個頁面太亂。
你問他亂在哪裡,他說不出來,僅僅是感覺!這種設計師可能剛剛踏入設計行業,或者做了很久但每天混日子的那種。
2.混亂型
他說:這個圖標重心不穩,頁面顏色有點臟,banner有點丑,圖標描邊粗細不一致。
這種設計師有一定的經驗與見解,但是不善於總結與梳理,所以你會發現他們雖然能夠說出問題,但都是零散的點,沒有邏輯。
3.體系型
他說:問題出現在以下幾個方面:顏色、圖標、布局等等,其中顏色問題有....、圖標問題有.....
他們能夠先從大的方向將問題歸類,然後再闡述細節問題,思路非常清晰。
大家應該都希望成為第三種類型的設計師,但如何能成為體系型的設計師呢?
其實無非就是將結構化思維用好,找問題也一樣,不要上來就說一推零散的點,這樣會讓人覺得你毫無邏輯。
如果別人讓你挑毛病,首先我們要禁止說「憑感覺"三個字,其次即使你能說出問題所在,說之前也要先思考一下,你所說的問題夠不夠系統,是否先從大的方向將其歸類,然後才具體闡述。
例如就拿上面這個網站來說,我會從以下 5 個方面來挑出視覺層面的問題(僅供參考),大綱如下:
1.布局
2.文字
3.顏色
4.圖標
5.控制項
1. 1 關於柵格分欄
我會挑戰整個網站的柵格系統, 5 等分欄的布局方式使整體內容過於密集,並且很多內容並沒有按照柵格來布局(比如中部的 5 個圖標),如下圖:
1.2 布局層級問題
很多需求方希望傳遞很多內容信息,並且每一個都是重點,最後就會導致用戶根本不知道看什麼,我們的這個網站就存在這個問題,重點應該是課程的導航,然而個人信息和快捷入口的圖標區已經完全搶走的我們的視線。
我覺得布局層級一定要清晰,該收的應該收起來,比如個人信息;該輕的應該輕一點,比如快捷入口的圖標區,如下圖:
2.1 文字規範
文字的大小及顏色的種類太多,個別還出現加粗情況,例如僅首頁的字體大小有12、14、16、18、20、 24 這麼多種,根本沒有統一的規範與邏輯,如下圖:
2.2 文字層級
文字層級區分不明顯,我們看下圖:
仔細觀察,我們的卡片,標題與輔助信息視覺層級很接近,幾乎看不出主次,而競品的卡片,標題與輔助信息對比很強烈,很容易就知道要突出標題。