看到過這么一句話:“移動UI設計切圖是UI設計師最重要的設計輸出物,切圖資源輸出是否規(guī)范直接影響到工程師對設計效果的還原度。”設計師的切圖輸出是體現(xiàn)一個設計師專業(yè)水準的重要標準,同時也是設計師表達自己對設計態(tài)度的最有力的語言。合適、精準的切圖可以最大限度的還原設計圖,其次完整規(guī)范的切圖標注會極大的提升團隊的工作效率。在不同的崗位協(xié)作之間,交流不明白的地方就會有誤差。之前因為切圖標注的問題造成了一些無法百分百還原設計圖的相關問題,所以一直想對切圖規(guī)范做一些總結,搜集了許多資料:
切圖原則
1. 切圖資源尺寸必須為雙數(shù)
2. 圖標切圖輸出應根據(jù)標準尺寸輸出,并且考慮手機適配
3. 為了提升APP使用速度,盡量降低圖片文件大小
4. 可點擊部件應當注意其點擊區(qū)域不小于88px
5. 可點擊部件要把相關狀態(tài)都切圖輸出,比如正常狀態(tài)、點擊狀態(tài)。
Ios和Android圖標應用命名的區(qū)分
1. Ios以一倍兩倍三倍切圖(@1X,@2X,@3X命名)(現(xiàn)基本只需要兩倍和三倍的切圖)

2. Android是以drawable-hdpi drawable-mdpi drawable-xhdpi drawable-xxhdpi drawable-xxxhdpi文件夾來命名,(切圖可以是一套也可以是多套,視安卓開發(fā)工程師情況而定)

3. Android.9切圖(.9基于java環(huán)境運行)

Icon圖標素材等命名規(guī)范
1.不可以使用中文命名 例: 藍色按鈕.png(錯)
2.不可以使用字母鏈接符 例:blue-button(錯)
3.但blue_button(正確)
4.可以使用純數(shù)字(開發(fā)工程師不易識別)
5.可以用拼音,(英文不好的時候可使用)
6.使用相關的英文單詞是最好的方法。

掃二維碼關注諾千科技
19909697910 / 15656989941
0551-65285599 / 0551-65428099
330592165
http://www.fscomfort.com.cn/
地址:安徽省合肥市高新區(qū)創(chuàng)新大道2700號路歌大廈A座6樓
CONTACT NUOQIAN
如果你認同“術業(yè)有專攻”的理念,請給我們留言,告知你的需求,
我們會提供專業(yè)的互聯(lián)網(wǎng)解決方案。