時(shí)間:2024-03-08 09:46作者:下載吧人氣:17
首先分享一個(gè)比較好用且快捷的切圖軟件.....................
Cutterman;
這是一個(gè)photoshop擴(kuò)展功能切圖插件,它支持IOS、Android、WEB切圖,一鍵切圖,方便快捷。
它在Photoshop中是這個(gè)樣子的;
大家可以試一下,畢竟軟件只是工具,適合自己的軟件才是最好的。
好了,言歸正傳,下面開始分享切圖基本命名規(guī)范;
這是網(wǎng)易考拉海購(gòu)的啟動(dòng)頁(yè),首先確定需要切圖的內(nèi)容有幾塊,
1、啟動(dòng)頁(yè)LOGO;
2、啟動(dòng)頁(yè)背景;
3、登錄按鈕;
4、登錄的輸入框;
首先第一個(gè)啟動(dòng)頁(yè)LOGO命名
命名規(guī)范是:login_logo.png(登錄LOGO)
第二個(gè)是啟動(dòng)頁(yè)背景命名規(guī)范:login_bg.png(登錄背景)
第三個(gè)和第四個(gè)是登錄按鈕及輸入框
命名規(guī)范:login_btn.png(登錄的按鈕)
login_input.png(登錄輸入框)
這個(gè)界面中主要介紹三處命名規(guī)范:導(dǎo)航欄按鈕、菜單按鈕、主頁(yè)面icon
導(dǎo)航欄按鈕命名規(guī)范:nav_(能功描述).png
如:anv_menu.png/nav_menu_pre.png(統(tǒng)一按鈕選中前后的兩種狀態(tài))
ps:同一區(qū)域按鈕切圖大小一致。
菜單按鈕命名規(guī)范:tab_(功能描述).png
如:tab_set.png/tab_set_pre.png
主頁(yè)面icon命名規(guī)范:Home_(功能屬性)_(描述).png
如:Home_icon_share.png
ps:描述可用英文或者拼間開頭字母組合
部分功能屬性簡(jiǎn)寫:
按鈕:btn 按鈕文字:btntext 復(fù)選框:chb
背景:bg 單選框:rb 下拉:cbb
輸入:ip
列表頁(yè)命名規(guī)范:list_(功能屬性+描述).png
如:list_icon_like.png(我喜歡的)
可重復(fù)使用按鈕:btn_(功能屬性或色彩均可).png
如:btn_black.png(黑色按鈕)
網(wǎng)友評(píng)論