從事ui設(shè)計工作3年多，近期部門轉(zhuǎn)行成產(chǎn)品經(jīng)理，在這里簡單書寫ui設(shè)計的一些經(jīng)驗總結(jié)

1.圖標(biāo)設(shè)計

圖標(biāo)設(shè)計分為：線性圖標(biāo)和面性圖標(biāo)，以及線面混合圖標(biāo)（填充圖標(biāo)），手繪圖標(biāo)

線性圖標(biāo)：舉個例子

注意事項：要注意線條粗細(xì)要保持統(tǒng)一，

面性圖標(biāo)：舉個例子

視覺上比較醒目，但不容易刻畫細(xì)節(jié)。

線面混合圖標(biāo)：舉個例子

根據(jù)設(shè)計風(fēng)格，選擇性的填充色塊，比較個性，有更多的設(shè)計發(fā)揮空間。

手繪圖標(biāo):舉個例子

一般做游戲界面較多，還有就是主題風(fēng)格圖標(biāo)

2.當(dāng)我們在做設(shè)計稿時，注意事項

2.1  不使用虛假文字，不要為了所謂的節(jié)約時間就要使用虛假文字，這是使App特別沒有代入感。真實的文字內(nèi)容也會協(xié)助觀看者理解你的作品。

2.2  圖片選取規(guī)范，該放頭像的地方就放頭像，別放插畫或是風(fēng)景照 。比如要做XX醫(yī)院的App，某主治醫(yī)師是中國人叫張大偉，就不要使用白種人的照片，（記得圖片清晰圖要夠，圖片要好看，但不能太完美，否則也會產(chǎn)生虛假感）

舉個例子：看示例圖，明明是個中國人，還用一個外國人的醫(yī)生照片。

3.當(dāng)頁面出現(xiàn)一個需要跳轉(zhuǎn)的入口時，且這個入口屬于三級操作時，可直接使用萬金油色，藍(lán)色。

4.定義字體顏色：常用的三種灰度的色值：282828，  656565，  989898，

   分割線段：eoeoeo,   分割線：  efefef.

4.1 關(guān)于字體的商用文字，Adobe公司出了一款思源黑體，用思源宋體，可完美商用，

5.  謹(jǐn)慎地使用高飽和度顏色、大差別漸變，一些醒目出跳的顏色和漸變使用起來要小心，否則很容易產(chǎn)生“俗氣”的感覺。

6.設(shè)計稿尺寸

   只推薦750*1334的尺寸來做設(shè)計稿，這是向上向下都最容易適配的尺寸，包括用這個尺寸去適配Android版。

6.1 標(biāo)注使用藍(lán)湖，現(xiàn)在主流的一種標(biāo)注工具，同時還提供切圖功能，超級方便使用，還提供插件下載。

6.2 專業(yè)切圖我一般使用的是cutterman，對于無實際功能的圖標(biāo)，要按照統(tǒng)一規(guī)格求，要保證是偶數(shù)尺寸

舉個例子，像界面里標(biāo)紅的圖標(biāo)，尺寸切一樣大就行了，比如：48X48

命名方式盡量清晰，推薦采用：種類_位置_功能_狀態(tài)

示例說明：btn_homepage_seach_normal@2x.png

開發(fā)看到就會明白：這是位于首頁，處于正常狀態(tài)的搜索按鈕2倍切圖。（英文不好的小伙伴，可直接用中文，程序猿們會自行命名滴）

7.常見的設(shè)計圖片比例尺寸

1:1，  4:3       16:9  (常見于影視app)   16:10 , 還有一種就是瀑布流式頁面。

先寫到這里，這些僅僅是我個人從業(yè)來的一些經(jīng)驗總結(jié)，歡迎大家留言交流哦