UI 設計中，你們的圖層命名規則是怎樣的？

12-13

說說自己的習慣。

一般以「控制項位置 &> 控制項類別 &> 控制項詳情描述 &> 控制項狀態」的順序命名。

例如：在「微信」聯繫人頁面中，頭部的按鈕，我可能會命名為header_icon_add_nor(或pressed).png 如果不是在頭部，而是在這個頁面內容區域，我會命名為contacts_icon_（這個icon的英文縮寫）.png 如果是一個統一化的通用控制項，例如複選框，我會命名為common_checkbox.png

一些控制項的拼法取決自己的習慣，因人而異

按鈕 btn 輸入框 textfeild 列表 list 頭部 header 底部 bottom 內容區域 content 菜單 menu 標籤頁 tab 按下狀態 pressed 普通狀態 nor ......

諸如此類, 希望有幫助。:D

每一個設計師基本有自己命名的一套規則，這套規則主要是為:方便自己（或隊友、工程師）記憶與查找相應的圖層；調整稿件時，提高修改的效率。

說說自己的規則的話，大概是：

1、按照交互層級的結構來命名與分組。這樣的好處是，一是即使交互發生改變，視覺隨著的調整也比較方便；二來視覺在做稿時，可以培養對交互結構的理解。
比如模塊&>列表&>控制項就是一種常見命名分類方法。一看圖層分組與命名，整個視覺稿的交互結構也瞭然一心。

2、按照控制項或模塊的復用性來命名。這樣再添加或刪除一行列表等重複性的調整時，會更加效率。比如：

當然，做動效的同學應該會吐槽我，一般做動效時，更習慣把同一個屬性的控制項集中在一塊命名歸類，方便做動效。比如按鈕都是相同命名，在同一個分組下；文字都是相同命名，又在同一個分組下。

3、命名盡量用英文。因為不想每次中文打字完又切英文來使用快捷鍵，影響作圖效率；另外可以順便練習了解控制項英文名稱。以後看英文專業文檔就會更加方便。用中文命名的話，小心被前端干...

附日常命名拋磚引玉：

標題欄 titlebar
狀態欄 statusbar
列表 list {1，2，3...}
表格 sheet
圖片 pic
推廣圖 banner
背景 bg
按鈕 btn
指示器 indicator
啟動器 launcher
圖標 icon
標籤 tab
內容區域 content
線條 line 2px
多選 checkbox
單選 radio
提示 tips
進度 process
信息 info
頭像 head
返回 back
點 point

多麼好的問題關注很久沒人回答怕沉了，我來拋磚引玉吧。
常常下到高人的psd，看他們的圖層基本以比較規範的英文，是我學習的榜樣。但因為種種原因，目前我的命名習慣是這樣的：

1，中英文混合，大家都熟悉的控制項名字就直接英文，什麼navigationbar. checkbox. 之類。這樣程序員一目了然，拿去用基本都不用改名字。至於有的為什麼要用中文呢，因為用英文好難表達，比如照片多選狀態上面的對勾怎麼說？也許查查也明白。但我查出來估計程序員（我同學）拿到也要多問我一遍。中文命名就無需多說了，a欄目就叫a欄目的b控制項，我知道這樣肯定是偷懶，正在改正中。

2，涉及到控制項多種狀態時，我依賴這個插件切圖，CutSlice me。所以在btn或input控制項各種狀態中符合它的命名規則。

Organise your elements in groups, as if they were objects.

Add @ at the end of the layer name you want to export, the content will be exported as a png trimming all transparent pixels.

If you want your file to be a particular size, then create a rectangular vector as first layer and name it #. Your group will be exported at that size.

Include "_BTN" to export all states in your buttons. Add groups containing your button states and name them as follows:

normal

hover

clicked / pressed

selected

disabled

3，第2點也有例外，如果是一個虛擬鍵盤控制項，按照插件的規範每個按鈕都要打包，造成很多重複工作，所以碰到類似控制項，就吧btnbg打個包就叫btnbg，按鍵上的內容就放外邊，切圖時選中所有btnbg然後alt+L+B建立切片導出（這樣導出的切圖尺寸自己心中沒有數，只圖快速），讓程序員去重命名吧。

以上死美工的破習慣，希望不要教壞人。還求眾大神在此問題不奢賜教啊！！！

-- 2013-10-17 補充

回答此問題過了半年多了.這段時間我養成了我覺得很成熟的命名方式.特意補充出來.
現在切圖不再依賴cuthttp://slice.me了.換到mac後使用了spicy:MacRabbit - Slicy,不過win平台的同學也可以參考下.

我現在所在的公司目前使用cocosbuilder來搭建遊戲UI,這個工具會以每個頁面場景為單位.為了避免重複命名和分辨,命名的規則是「出現的頁面+類型+名稱+狀態」,例如:

ScencePause_btn_continue_normal.png
然而如何通過slicy來實現最終這樣命名呢,如圖

這樣slicy會在指定目錄下聲稱ScencePause的文件夾,在在裡面放下這養命名的圖片.這個在包後面加「/」生成文件夾的方法slicy在官網也沒有說.他們是郵件偷偷告訴我的.嘿嘿.然後再使用PS動作,或者這裡有個小app
iOS and Android Photoshop Actions Workflows
批量加個前綴即可.

命名規則跟程序員與策劃溝通制定，硬性規定是命名與路徑必須是字母組成，因為漢字在程序軟體中有時候會出錯。