五、圖片處理規范

1、圖片統一性

1）圖片色調色溫需統一，例如一個(gè)嬰兒產(chǎn)品的首頁(yè)，整體需要搭配暖色調的圖片，這樣看上去整體才比較統一舒服。

2）圖片比例需統一，例如一個(gè)賣(mài)貨的產(chǎn)品詳情頁(yè)，在同一屏的欄目中（頁(yè)面）所出現的產(chǎn)品或者人物，比例就需要有一個(gè)統一的大小比例，這樣看上去才比較統一舒服。

2、圖片細節處理

1）圖片精度不夠（這里所說(shuō)的精度不是說(shuō)DPI分辨率需要300哦，那是做高精度印刷輸出時(shí)才需要的，而在電腦及手機上的圖片DPI分辨率為72即可，另外輸出圖片時(shí)需適當壓縮一下圖片的大小）、雜色太多可以使用PS內置的CR濾鏡處理。

2）圖片尺寸建議統一為偶數值，方便前端技術(shù)人員開(kāi)發(fā)。

3）圖片邊緣避免與白色背景融合，可以在邊緣位置加色。

4）為了配合標題字體，圖片可以局部調亮或調暗。

六、動(dòng)效規范

無(wú)論是現在經(jīng)常看到的企業(yè)/品牌H5宣傳頁(yè)面、移動(dòng)端啟動(dòng)頁(yè)，還是曾經(jīng)紅極一時(shí)的首頁(yè)動(dòng)畫(huà)，都需要用到動(dòng)效效果。會(huì )做點(diǎn)動(dòng)效會(huì )給我們加分不少，尤其是做一些加載動(dòng)畫(huà)，這是我們經(jīng)常會(huì )遇到的需求。

做動(dòng)效時(shí)，我們需要注意以下幾點(diǎn)：

1）不論你的動(dòng)畫(huà)有多好看、多吸引眼球，如果成本太高或者過(guò)于復雜都是無(wú)法落地的，所以我們要遵循簡(jiǎn)單實(shí)用的原則來(lái)進(jìn)行設計，千萬(wàn)不要過(guò)度設計。

2）任何交互動(dòng)作所導致的狀態(tài)都需要考慮正常狀態(tài)與異常狀態(tài)。拿加載動(dòng)畫(huà)來(lái)說(shuō)，我們需要考慮加載成功的反饋與加載失敗的反饋，并將之注明在輸出規范中。

3）動(dòng)效使用的工具：可以PS做一些動(dòng)態(tài)表情，用AE做一些加載動(dòng)畫(huà)，頁(yè)面之間的交互動(dòng)效可以使用Flinto、Principle等。

http://ezekroy.com/wangzhansheji/3363.html 優(yōu)秀網(wǎng)頁(yè)設計師須了解的UI設計規范（二）