4月15日參加了一個(gè)設(shè)計(jì)分享的線下活動(dòng)，其中一位分享的老師是攜程UED高級(jí)視覺經(jīng)理吳佳敏老師，講了視覺設(shè)計(jì)層面的一些技巧和方法，作為小白的我感覺受益匪淺，于是回家便下單了她寫的書《視覺鏈》。
今天剛剛看完一遍，感覺內(nèi)容分類細(xì)致，干貨滿滿，能為剛?cè)胄械囊曈X設(shè)計(jì)師打下一個(gè)比較好的基礎(chǔ)。不過也有些一帶而過的內(nèi)容，大概是因?yàn)闀械膬?nèi)容太多不便于詳細(xì)講解，不過也是給閱讀者打開了一扇大門，不是都說師傅領(lǐng)進(jìn)門，修行在個(gè)人嘛。
下面是對(duì)本書中對(duì)我最有幫助的內(nèi)容的一個(gè)記錄，這樣也算有輸入有輸出啦。
一、視覺信息層級(jí)
當(dāng)用戶在瀏覽一個(gè)頁(yè)面時(shí)，設(shè)計(jì)師的理想狀態(tài)是讓用戶按照頁(yè)面設(shè)計(jì)的順序來讀取內(nèi)容信息。而對(duì)用戶來說，讀取內(nèi)容的方式和順序只會(huì)按照他個(gè)人的喜好，如閱讀新聞、看美圖或者查找他需要的信息等。在這種情況下，就要求界面能抓住主流用戶特征，將重點(diǎn)“推送”給他。而這也就是視覺設(shè)計(jì)師要建立良好的視覺層級(jí)給用戶的原因。
界面的層級(jí)布置是由功能、操作、內(nèi)容等按照需要的優(yōu)先級(jí)進(jìn)行排列組合的。
建立信息層級(jí)的方法
位置：當(dāng)眼睛偏離中心時(shí)，在偏離距離相等的情況下，人眼對(duì)左上的觀察最優(yōu)，依次為右上、左下、右下，因此左上部和上中部被稱為“最佳區(qū)域”。
眼睛沿水平方向運(yùn)動(dòng)比垂直方向運(yùn)動(dòng)快且不易疲勞。 因此如果想要體現(xiàn)并列關(guān)系，左右排列更合適。
大?。褐匾脑卮笠恍?，并且要與不重要的信息的大小拉開差距。
距離：降低背景透明度，拉開視覺距離，產(chǎn)生空間層次感?；蛟黾油队?，使重要元素好像與其他內(nèi)容不在同一個(gè)平面。
內(nèi)容形式：圖片比文字更易吸引人的視線。
色彩：暖色比冷色給人距離更近的感覺。高反差的顏色比低反差的顏色更吸引人的視線。
二、視覺稿的自我審查方法
將設(shè)計(jì)稿在PS中進(jìn)行去色-反相-高斯模糊可以制作一個(gè)簡(jiǎn)單的界面熱點(diǎn)效果，從而檢查界面的層次是否合適，布局是否平衡，從而改進(jìn)設(shè)計(jì)。
三、圖標(biāo)
1.圖標(biāo)類型分為表意功能性icon和標(biāo)志性icon。
表意功能性多用于標(biāo)簽、標(biāo)題、按鈕、導(dǎo)航、信息提示等。以線性圖標(biāo)和面性圖標(biāo)為主。
線性圖標(biāo)的層級(jí)稍弱，不會(huì)搶了其他內(nèi)容的風(fēng)頭，且用在導(dǎo)航上能讓用戶快速識(shí)別內(nèi)容。
面性圖標(biāo)層級(jí)較高，能讓用戶一眼看到每個(gè)功能的不同。
層級(jí)：彩色面性圖標(biāo)＞單色面性圖標(biāo)＞線性圖標(biāo)
標(biāo)志性icon多用于手機(jī)桌面、電腦桌面、移動(dòng)應(yīng)用的標(biāo)志。
2.圖標(biāo)的繪制需要統(tǒng)一體量感
即在同樣寬高的情況下，在這個(gè)面積里占有的比重大的icon會(huì)比比重小的icon在感覺上更大，因此為了感官一致則需要稍微縮小比重大的icon。
四、競(jìng)品分析的方法
1.選擇核心功能相同的目標(biāo)作為競(jìng)品
2.從界面層級(jí)分析競(jìng)品，通過對(duì)比以及前面提到的設(shè)計(jì)自審方法改進(jìn)界面。
3、從界面風(fēng)格分析競(jìng)品。從色彩數(shù)量、色彩占比分布、層級(jí)、字體、字號(hào)數(shù)量、icon和按鈕風(fēng)格，整體視覺設(shè)計(jì)風(fēng)格分析。取長(zhǎng)補(bǔ)短。
最終目的是通過競(jìng)品分析提高產(chǎn)品自身的核心競(jìng)爭(zhēng)力，而核心競(jìng)爭(zhēng)力往往體現(xiàn)在差異性。
以上就是今天的筆記，更多內(nèi)容請(qǐng)閱讀《視覺鏈》~
