2020年8月21日下午4點(diǎn)50分?黃河公園

通常我們?cè)诮缑嬖O(shè)計(jì)完成之后要切圖給到前端開(kāi)發(fā)。初做UI設(shè)計(jì)時(shí)，把重點(diǎn)都放在設(shè)計(jì)效果圖上，對(duì)之后的切圖命名規(guī)范沒(méi)有很注重。當(dāng)時(shí)我會(huì)有一些疑惑，切圖命名的原則是什么？直接命名為能表達(dá)清楚的名稱不就可以嗎？后來(lái)做的項(xiàng)目多了也知道了切圖命名規(guī)范的重要性。如果你直接命名為中文或者拼音給到開(kāi)發(fā)，會(huì)無(wú)形之中給開(kāi)發(fā)同事增加工作量，可能開(kāi)發(fā)同事對(duì)你的命名沒(méi)有嚴(yán)格要求，但是在他們進(jìn)行開(kāi)發(fā)時(shí)都是自己去更改切圖名稱，這樣就很浪費(fèi)時(shí)間，也顯得設(shè)計(jì)師不是很專業(yè)。所以在設(shè)計(jì)效果圖完成之后，我們?cè)谇袌D時(shí)直接把切圖命名好，這樣極大節(jié)省程序員開(kāi)發(fā)的時(shí)間成本，有助于團(tuán)隊(duì)協(xié)同，也是對(duì)設(shè)計(jì)師自身的嚴(yán)格要求，讓我們對(duì)設(shè)計(jì)保持嚴(yán)謹(jǐn)性，專業(yè)性。

幾種切圖命名規(guī)則

控件_類別_功能_狀態(tài)

舉例：nav_icon_search_normal

對(duì)應(yīng)中文：導(dǎo)航欄_圖標(biāo)_搜索_正常

類別_功能_狀態(tài)

舉例：icon_search_normal

對(duì)應(yīng)中文：圖標(biāo)_搜索_正常

模塊_類別_功能_狀態(tài)

舉例：home_icon_search_pressed

對(duì)應(yīng)中文：主頁(yè)_圖標(biāo)_搜索_按下

注意事項(xiàng)

1.命名用英文

2.命名中不能含有空格

3.用下劃線連接

如果一個(gè)圖標(biāo)的英文是由2個(gè)或者更多的詞匯組成，那也需要用下劃線連接，不要用空格或者其他符號(hào)

4.較長(zhǎng)的單詞可取單詞的頭部幾個(gè)字母形成縮寫(xiě)

例如：bg(background)、pic(picture)、tab(tabbar)

5.不要有重復(fù)的名字，會(huì)被覆蓋

命名中不要有重復(fù)的英文名，如果有重復(fù)的名字，上傳時(shí)會(huì)被其中一個(gè)覆蓋，如果有相同命名的圖標(biāo)，我們要想辦法區(qū)分，可以換個(gè)表達(dá)方式或者功能后面加上數(shù)字1、2、3、區(qū)分開(kāi)

常用英文單詞表

控件名稱：

狀態(tài)欄：status bar? ?

搜索欄：search bar? ?

導(dǎo)航欄：nav bar/nav_? ?

標(biāo)簽欄：tab bar/tab_? ?

彈窗：popup ??

開(kāi)關(guān)：switch ??

選擇器：pickers? ?

工具欄：tool bar? ?

單選框：radio? ?

復(fù)選框：checkbox? ?

背景：background? ?

標(biāo)志：logo? ?

蒙版、遮罩：mask

功能命名：

添加：add??

卸載：uninstall? ?

查看：view? ?

搜索：search? ?

關(guān)閉：close? ?

下載：download? ?

取消：cancel? ??

刪除：delete? ?

暫停：pause? ?

導(dǎo)入：import? ?

繼續(xù)：continue? ?

等待：waiting? ?

后退：back? ??

導(dǎo)出：export? ?

安裝：install

常見(jiàn)狀態(tài)：

普通：normal? ?

默認(rèn)：default? ?

按下：pressed? ?

選中：selected? ?

禁用：disabled? ?

已訪問(wèn)：visited? ?

懸停：hover

總結(jié)

切圖命名不是一成不變的，在實(shí)際工作當(dāng)中，還是需要多思考和靈活使用。其實(shí)命名規(guī)范主要就是為了程序員更好的進(jìn)行開(kāi)發(fā)工作，節(jié)約前端開(kāi)發(fā)的時(shí)間成本。所以有什么不懂的地方要和開(kāi)發(fā)同事多溝通，這樣才能使團(tuán)隊(duì)協(xié)作更高效，也能凸顯出設(shè)計(jì)師的專業(yè)性，豈不是一舉兩得～

總結(jié)

以上是生活随笔為你收集整理的svgaps绘制时不能用中文命名吗_设计师需要了解的切图命名规范的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。