優(yōu)秀網(wǎng)頁設計師須了解的UI設計規(guī)范（二）

三、命名規(guī)范

成都創(chuàng)新互聯(lián)公司提供高防服務器、云服務器、香港服務器、德陽機房托管等

很多網(wǎng)頁設計師對于“命名”是沒什么概念的，他們都是隨隨便便地用一些沒有特定意思的字母去給頁面命名，這是不好的。因為統(tǒng)一的、規(guī)范的命名對我們自己的文件整理有很大的幫助，后期修改文件、圖層的時候更加方便快捷，而且規(guī)范的命名也顯得我們自身比較專業(yè)。而且，如果如果命名不統(tǒng)一，團隊之間的成員很難達成共識，任務交接時需要很大的學習成本。

而更重要的是，有規(guī)范的命名可以極大的節(jié)省程序開發(fā)的時間成本，減少很多不必要的溝通與重復切圖的概率，程序員完全可以直接使用的我們切片而不更改切片的名稱，后期我們更換切圖，只要切片名稱不變，開發(fā)看都不用看直接替換就可以了。

1、 所有命名全部為小寫英文字母

在程序員的代碼里只有小寫的英文字母，如果你給出的命名全是中文的，那么他們是一定會更改的，所以命名全部用小寫的英文字母是最基本的規(guī)則。有些人會覺得寫這么多英文太麻煩，但其實為了自己專業(yè)能力的提高，這種規(guī)范的命名方式是必須要經(jīng)歷的過程，當你習慣了這樣的命名方式后，你的成就感會油然而生。

2、 命名格式

一個大型項目會分很多模塊，每個模塊由不同的設計師來獨立完成，還有人會專門管理公共的組件，如tabbar、navbar等等，這種情況下就會分為兩種切圖，一種是通用類型的切圖，還有一種就是各個模塊特有的切圖。

通用切片命名格式：

組件_類別_功能_狀態(tài)@2x.png

舉例：tabbar_icon_home_default@2x.png（對應中文：標簽欄_圖標_主頁_默認@2x.png）

模塊特有切圖命名規(guī)則：

模塊_類別_功能_狀態(tài)@2x.png

舉例：mail_icon_search_pressed@2x.png（對應的中文為：郵件_圖標_搜索_默認@2x.png）

我們的原則就是清晰的表達出切片的具體內(nèi)容并且沒有重復的名稱。（要注意，命名中不能含有空格）

3、 常用英文單詞

如果所有命名都寫為全稱，名字就會特別長，所以我們可以將一些常用的英文單詞進行縮寫，減少工作成本與開發(fā)代碼資源。至于怎么縮寫，只要整個團隊能夠達成共識并且輸出一份縮寫清單，任何縮寫規(guī)則都是可以的。

下面提供一些命名時常用的英文單詞列表：

bg（backgrond 背景）

nav（navbar 導航欄）

tab（tabbar 標簽欄）

btn（button 按鈕）

img（image 圖片）

del（delete 刪除）

msg（message 提示信息）

pop（pop up 彈出）

icon（圖標）

selected（選中）

disabled（不可點擊）

default（默認）

pressed（按下）

back（返回）

edit（編輯）

content（內(nèi)容）

四、交互規(guī)范

以下幾點交互常識：

簡化操作：能一步完成的交互就不要分兩步。

用戶習慣：大部分用戶都有固化思維，我們作為設計師應該尊重數(shù)據(jù)，尊重用戶選擇。

減少干擾：減少界面元素的不確定因素，方便用戶快速找到自己想要的。

快速響應：加快用戶讀取的響應速度，能夠避免從遠程取數(shù)據(jù)的，就盡量避免。

界面友好：除了根據(jù)需求提供視覺解決方案以外，在設計的過程中適當?shù)丶尤胍恍┬〖毠?jié)使交互界面更加友好是設計師的職責所在。

網(wǎng)站名稱：優(yōu)秀網(wǎng)頁設計師須了解的UI設計規(guī)范（二）
網(wǎng)站鏈接：http://muchs.cn/article2/eejhic.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供搜索引擎優(yōu)化、網(wǎng)頁設計公司、App設計、虛擬主機、微信小程序、網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)