學(xué)習(xí)文件命名的目標(biāo)

輸出專(zhuān)業(yè)規(guī)范的命名，建立有效的設(shè)計(jì)文件命名系統(tǒng)。

各階段的命名規(guī)則

1. 項(xiàng)目文件命名

項(xiàng)目之初大家都會(huì)建立文件夾系統(tǒng)，用來(lái)存放項(xiàng)目資源。這時(shí)大家可以運(yùn)用杜威十進(jìn)制的命名方式來(lái)管理文件命名，方便排序，讓我們的項(xiàng)目文件足夠清晰，在長(zhǎng)期的項(xiàng)目管理中養(yǎng)成一種良好的命名習(xí)慣。

項(xiàng)目命名規(guī)則

• 項(xiàng)目文件夾：產(chǎn)品名稱(chēng) + 版本號(hào) + 簡(jiǎn)要迭代描述
• 項(xiàng)目資源文件：NO._文件類(lèi)型名稱(chēng)

下面以 用戶(hù)端 V2.1.0_新增直售展位 虛擬項(xiàng)目為例，創(chuàng)建各資源的子文件夾，初步完成文件管理：

00_需求文檔（PRD）

01_交互設(shè)計(jì)（原型）

02_設(shè)計(jì)文件（設(shè)計(jì)）

• 00_GUI 過(guò)程稿
• 01_GUI 定稿
• 02_設(shè)計(jì)說(shuō)明
• 03_切圖文件

04_競(jìng)品分析

05_動(dòng)效設(shè)計(jì)

06_應(yīng)用素材

07_參考資料

08_會(huì)議記錄

大家可以根據(jù)不同項(xiàng)目的性質(zhì)和流程進(jìn)行增刪，選擇最適合自己的項(xiàng)目文件管理方式。

2. 畫(huà)板及圖層命名

在設(shè)計(jì)文件中，我們最經(jīng)常接觸的就是畫(huà)板、圖層，少則幾十，多則幾百，我們需要更輕松的命名排序方式來(lái)查找我們的目標(biāo)，保證團(tuán)隊(duì)命名風(fēng)格統(tǒng)一，清晰的場(chǎng)景命名更便于設(shè)計(jì)輸出和協(xié)作，也可以支持后期測(cè)試用例的填寫(xiě)。

此時(shí)的命名目標(biāo)在于清楚展示頁(yè)面的從屬關(guān)系，以及流程上的交互關(guān)系。

畫(huà)板&圖層命名規(guī)則

• 畫(huà)板命名：功能模塊 ；
• 圖層命名：NO._NO.子模塊_NO.類(lèi)型_NO.狀態(tài)；

每個(gè)畫(huà)板和圖層需要根據(jù)功能模塊/類(lèi)型/狀態(tài)結(jié)合數(shù)字來(lái)進(jìn)行命名，方便我們對(duì)頁(yè)面進(jìn)行排序。數(shù)字可根據(jù)項(xiàng)目文件的操作順序和權(quán)重的具體情況來(lái)取舍。

00首頁(yè)

• 0_1新增廣告位_1單個(gè)
• 0_1新增廣告位_2多個(gè)
• 0_1新增廣告位_3組合
• 0_2無(wú)商品占位
• …

01詳情頁(yè)

02購(gòu)物車(chē)

03我的

…

在 Sketch 中我們會(huì)經(jīng)常用到一個(gè)批量重命名的工具插件 Rename It，這個(gè)工具可以快速批量對(duì)畫(huà)板、組、圖層進(jìn)行重命名。文末有一篇震震張關(guān)于這個(gè)插件的介紹，大家可以學(xué)習(xí)一下。

畫(huà)板和畫(huà)布的命名規(guī)范，是為了讓每個(gè)項(xiàng)目參與者都能快速找到目標(biāo)，對(duì)于設(shè)計(jì)師而言，可以主動(dòng)思考頁(yè)面之間的關(guān)系。

3. 切圖命名

一個(gè)應(yīng)用通常需要導(dǎo)出的切圖包含眾多類(lèi)型：

• 背景圖
• 插畫(huà)素材
• 動(dòng)畫(huà)素材
• 圖標(biāo)
• Logo
• …

對(duì)于切圖文件夾，可以通過(guò)通用文件、控件歸納等方法進(jìn)行歸納管理。

對(duì)于切圖命名，可以無(wú)需考慮自己的英文命名具有普適性，記得命名最初的目標(biāo)是：便于團(tuán)隊(duì)檢索定位，因?yàn)殚_(kāi)發(fā)人員有自己的命名習(xí)慣和命名體系。

切圖命名原則

標(biāo)準(zhǔn)命名原則：模塊_名稱(chēng)_狀態(tài) ，如導(dǎo)航欄_按鈕_點(diǎn)擊；

全局命名規(guī)則：模塊_全局_名稱(chēng)_狀態(tài)，如導(dǎo)航欄_按鈕_全局_點(diǎn)擊（全局使用必須加全局標(biāo)識(shí)）

• 導(dǎo)航欄_購(gòu)物車(chē)_高亮.png
• 詳情_(kāi)分享.png
• 登錄按鈕_點(diǎn)擊.png

注意事項(xiàng)

如果產(chǎn)品使用了兩個(gè)平臺(tái)的獨(dú)立設(shè)計(jì)，需要 iOS 和 Android 兩個(gè)手機(jī)系統(tǒng)的切圖單獨(dú)建兩個(gè)文件夾，切圖文件分別導(dǎo)出，便于前端工程師檢索應(yīng)用。

小結(jié)

以上是對(duì)設(shè)計(jì)項(xiàng)目過(guò)程中的文件管理及命名規(guī)范的一些筆記總結(jié)，持續(xù)優(yōu)化~

養(yǎng)成一個(gè)好的習(xí)慣從現(xiàn)在開(kāi)始。\（ツ）/

文章來(lái)源：優(yōu)設(shè)    作者：木子的小千世界