一. 切圖命名英文縮寫的三個(gè)要求
1.較短的單詞可通過去掉“元音”形成縮寫
2. 較長(zhǎng)的單詞可取單詞的頭部幾個(gè)字母形成縮寫
3.還有一些特定的英文單詞縮寫
二. 命名規(guī)則
切圖命名以模塊為前綴,如:模塊_類別_功能_狀態(tài).png
模塊:
登陸頁面(login) 公共(common) 需求a(need) 需求b(demand) 發(fā)現(xiàn)(discover) 消息(message) 我(me)
類別:
導(dǎo)航欄(nav) 菜單欄(tab) 按鈕(btn) 圖標(biāo)(icon) 背景圖片(bg) 默認(rèn)圖片(def)
狀態(tài):
selected(選中) disabled(不可點(diǎn)) pressed(按下) normal(一般)
舉例說明:
IOS:
以750*1334為基稿設(shè)計(jì),按實(shí)際項(xiàng)目開發(fā)為標(biāo)準(zhǔn),需切出@2x和@3兩套圖,把在公共頁面中的導(dǎo)航欄里面有一個(gè)按鈕(40x60px)的選中狀態(tài)切圖,直接輸出的切圖為@2x圖,@2x的1.5倍圖為@3x。
輸出成果為:
common_nav_btn_back_s@2x.png(40x60)和common_nav_btn_back_s@3x.png(80x120);
意思為:公共_導(dǎo)航_按鈕_返回_選中
Android:
以720*1280為基稿設(shè)計(jì),由于尺寸不同且多樣,需要切多套圖適配不同機(jī)器,分別為mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi,直接輸出的切圖為xhdpi;它們分別對(duì)應(yīng)的倍數(shù)關(guān)系為1、1.5、2、3、4。
輸出成果為:
common_nav_btn_back_s_mdpi.png(20x30)、
common_nav_btn_back_s_hdpi.png(30x45)、
common_nav_btn_back_s_xhdpi.png(40x60)、
common_nav_btn_back_s_xxhdpi.png(60x90)、common_nav_btn_back_s_xxxhdpi.png(80x120);
命名示列:
啟動(dòng) (default):
default.png 啟動(dòng)圖片;
default_logo.png 啟動(dòng)logo
登陸(login):
login_bg.png 登陸背景圖片
login_logo.png 登陸logo
login_input_n.png 輸入框
login_input_s.png 輸入框選中狀態(tài)
login_btn_n.png 登錄按鈕
login_btn_s.png 登錄按鈕選中狀態(tài)
注冊(cè)(register):
login_register_rb_n.png 單選框按鈕
login_register_rb_s.png 單選框按鈕選中狀態(tài)
導(dǎo)航欄(nav):
common_nav_btn_menu_n.png 菜單按鈕
common_nav_btn_menu_s.png 菜單按鈕選中狀態(tài)
common_nav_btn_back_n.png 返回按鈕
common_nav_btn_back_s.png 返回按鈕選中狀態(tài)
common_nav_btn_close_n.png 關(guān)閉按鈕
common_nav_btn_close_s.png 關(guān)閉按鈕選中狀態(tài)
common_nav_btn_eidt_n.png 編輯按鈕
common_nav_btn_eidt_s.png 編輯按鈕選中狀態(tài)
common_nav_btn_delete_n.png 刪除按鈕
common_nav_btn_delete_s.png 刪除按鈕選中狀態(tài)
common_nav_btn_message_n.png 消息按鈕
common_nav_btn_message_s.png 消息按鈕選中狀態(tài)
common_nav_btn_search_n.png 搜索按鈕
common_nav_btn_search_s.png 搜索按鈕選中狀態(tài)
列表(list):
hpcollege_list_collect.png 列表頁收藏按鈕
左側(cè)導(dǎo)航欄(leftbar):
leftbar_info.png 個(gè)人中心
菜單(tab):
common_tab_need_n.png 需求a按鈕
common_tab_need_s.png 需求a按鈕選中狀態(tài)
common_tab_find_n.png 發(fā)現(xiàn)按鈕
common_tab_find_s.png 發(fā)現(xiàn)按鈕選中狀態(tài)
common_tab_demand_n.png 需求b按鈕
common_tab_demand_s.png 需求b按鈕選中狀態(tài)
common_tab_me_n.png 我的按鈕
common_tab_me_s.png 我的按鈕選中狀態(tài)
首頁(home):
home_bg.png 首頁背景
home_banner.png 首頁廣告圖
點(diǎn)9圖(.9):
rounded rectangle.9.png 圓角矩形
常用詞語:
selected:選中/s
pressed:按下/pre
disabled:不可點(diǎn)/d
normal:正常/n
common:公共
default:登錄頁
discover:發(fā)現(xiàn)
message:消息
me:我
navigation bar:導(dǎo)航欄/nav
tab:菜單欄
button:按鈕/btn
icon:圖標(biāo)
background-image:背景圖片/bg
default-image:默認(rèn)圖片/def
cut-off rule:分割線/cor
login:登陸
register:注冊(cè)
list:列表
home:首頁
banner:廣告
browse:瀏覽
details:詳情
like:喜歡
dislike:不喜歡
search:搜索
content:內(nèi)容
collect:收藏
eidt:編輯
comment:評(píng)論
message:提示信息/msg
ranked:排名
location:定位
tags:標(biāo)簽
left:左
right:右
center:中
popup:彈出/pop
image:圖片/img
viedio:視頻/vd
audio:音頻/ad
title:標(biāo)題/tit
address:地址/add
number:人數(shù)
time:時(shí)間
sustem:系統(tǒng)
refresh:刷新
user:用戶
more:更多
border:邊框
next:下一步
sign:簽到
code:密碼
clear:清除
scroll:滾動(dòng)條
hover:鼠標(biāo)停留
common:公共
hot:熱點(diǎn)
zoomin:放大
zoomout:縮小
service:服務(wù)
presonal data:個(gè)人資料/Pdata
male:男性
female:女性
report:舉報(bào)
input:輸入/ip
dropdown menu:下拉菜單/ddm
radio button:?jiǎn)芜x框/rb
check box:復(fù)選框/cb
progressbar:進(jìn)度條/pbar
download:下載
arrow:箭頭
share:分享
upload:上傳
release:發(fā)布
tabbar:標(biāo)簽欄
autonym:實(shí)名