如何制作一款A(yù)PP的UI設(shè)計規(guī)范文檔

一薇芝、設(shè)計規(guī)范的撰寫時間

先說說這個設(shè)計規(guī)范應(yīng)該什么時候開始寫設(shè)計規(guī)范,一定是產(chǎn)品發(fā)展到了一定階段务傲,才會開始撰寫制作的產(chǎn)物凉当;通常是主體界面完成枣申,總進度完成大概50%的時候,才可以考慮嘗試整理設(shè)計規(guī)范看杭。

一個設(shè)計師:
一般來說忠藤,大部分企業(yè)整個部門,可能就搭配了1個啥都干的UI設(shè)計師楼雹;這時候如果你一個人需要制作規(guī)范文檔模孩,可以先簡單做一下,把標準字體贮缅、字號榨咐、色值、控件等等都快速記錄下來谴供,作為規(guī)范文檔的內(nèi)容块茁;之后等項目完成,再補全規(guī)范文檔桂肌,作為后續(xù)版本的指導(dǎo)手冊数焊。

多個設(shè)計師:
一些大型的公司和部門,可能不止一位設(shè)計師崎场,比如我目前的設(shè)計團隊一共7個人:4個UI佩耳,2個UE,1個平面谭跨。那這時候干厚,多人協(xié)作是最好也是最快的方式,由其中工作經(jīng)驗豐富的設(shè)計師作為規(guī)范制作項目的主導(dǎo)者螃宙,規(guī)劃好各個模塊蛮瞄,由其他人協(xié)助完成一份比較全面的規(guī)范文檔。

二污呼、設(shè)計規(guī)范的作用

1.對設(shè)計師而言:為后續(xù)版本迭代和多人協(xié)作提供指導(dǎo)裕坊,保持產(chǎn)品的統(tǒng)一性;
一個項目燕酷,從V1.0一直升級到2.0籍凝、3.0……,很多時候即使同一位設(shè)計師在不同版本里做出的東西也可能會因為版本久遠,記不清而不小心導(dǎo)致視覺風(fēng)格不統(tǒng)一苗缩;而一個項目有時會好幾個設(shè)計師共同參與饵蒂,甚至還有不同時間段先后參與到項目中的,每個人的設(shè)計風(fēng)格都不相同酱讶,這樣容易造成視覺界面的不統(tǒng)一退盯,導(dǎo)致體驗不佳。
所以統(tǒng)一的設(shè)計規(guī)范,能讓后續(xù)版本和不同設(shè)計師之間保持產(chǎn)品的視覺風(fēng)格統(tǒng)一渊迁。

2.對開發(fā)而言:提供標準化的組件樣式慰照,減少開發(fā)重復(fù)時間
很多標準化的頁面控件完全可以做成設(shè)計規(guī)范里的標注好的標準組件樣式,這樣就不需要每次設(shè)計師都要再標注一遍給開發(fā)琉朽。而且也可以避免有的開發(fā)粗心大意毒租,兩個頁面的同類型組件樣式都寫的不統(tǒng)一。

三箱叁、設(shè)計規(guī)范文檔的內(nèi)容

現(xiàn)在網(wǎng)絡(luò)上有非常多的知名產(chǎn)品的設(shè)計規(guī)范文檔墅垮,幾乎都可以上網(wǎng)搜到。我目前看過差不多有上百份的產(chǎn)品設(shè)計規(guī)范文檔耕漱,總結(jié)下來算色,無外乎以下幾項:

標準色:產(chǎn)品用色、字體用色螟够、背景用色灾梦、分割線用色,以及各種色值的使用場景齐鲤;

標準字:字體斥废、字號椒楣,字間距给郊、行間距,以及各類使用場景捧灰;

圖 標:圖標大小淆九、位置、樣式毛俏,以及各類使用場景炭庙;

公用控件:分級導(dǎo)航樣式、標題欄樣式煌寇、輸入框焕蹄、彈窗、按鈕阀溶、列表腻脏、toast、加載银锻、loading永品、空白頁等等各類可作為設(shè)計規(guī)范的控件;

布 局:頁面布局樣式击纬,這個對設(shè)計和開發(fā)都很重要鼎姐。

模 塊:功能模塊樣式,這個對設(shè)計和開發(fā)也很重要。

基本上所有的設(shè)計規(guī)范文檔包含但不限于上述內(nèi)容炕桨;所以你感覺毫無頭緒饭尝,可以考慮在編寫設(shè)計規(guī)范文檔時,從以上幾塊內(nèi)容著手献宫。

四芋肠、設(shè)計規(guī)范文檔的適用人群

和之前寫過的交互文檔需要人手一份一樣,設(shè)計規(guī)范文檔其實也是要傳達到團隊的每個人手中遵蚜;并不是UI設(shè)計師編寫完成后帖池,就只由UI設(shè)計師來使用的。這些人包括但不限于PM吭净、交互設(shè)計師睡汹、UI、開發(fā)寂殉、運營等等囚巴。給到UI手里,可能下個版本的視覺設(shè)計或則其他人接手都可以和前版本保持一致友扰;給到運營手里彤叉,產(chǎn)品里的廣告圖用多大的,他也可以明確知道村怪;因為對每個人的作用都不一樣秽浇,所以最好的方式依舊是人手一份。

五甚负、設(shè)計規(guī)范文檔的更新迭代

設(shè)計規(guī)范文檔是為了更好的幫助設(shè)計師和開發(fā)完成工作柬焕,而不是限制發(fā)揮;

對人來說:
UI有時候根據(jù)新的業(yè)務(wù)需求設(shè)計的東西梭域,和原有的設(shè)計規(guī)范文檔的內(nèi)容并不合適斑举;而開發(fā)在實際開發(fā)中,也會出現(xiàn)一些文檔中規(guī)定的內(nèi)容病涨,因為技術(shù)問題無法達成的情況富玷;

對產(chǎn)品來說:
隨著版本一代一代的更新,設(shè)計規(guī)范中的內(nèi)容也逐漸會不適合現(xiàn)有的設(shè)計風(fēng)格和技術(shù)既穆。要根據(jù)實際情況赎懦,合理的更新迭代設(shè)計規(guī)范文檔的內(nèi)容,而不是一成不變循衰。

轉(zhuǎn)至UI中國铲敛。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市会钝,隨后出現(xiàn)的幾起案子伐蒋,更是在濱河造成了極大的恐慌工三,老刑警劉巖,帶你破解...
    沈念sama閱讀 219,039評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件先鱼,死亡現(xiàn)場離奇詭異俭正,居然都是意外死亡,警方通過查閱死者的電腦和手機焙畔,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,426評論 3 395
  • 文/潘曉璐 我一進店門掸读,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人宏多,你說我怎么就攤上這事儿惫。” “怎么了伸但?”我有些...
    開封第一講書人閱讀 165,417評論 0 356
  • 文/不壞的土叔 我叫張陵肾请,是天一觀的道長。 經(jīng)常有香客問我更胖,道長铛铁,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,868評論 1 295
  • 正文 為了忘掉前任却妨,我火速辦了婚禮饵逐,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘彪标。我一直安慰自己倍权,他們只是感情好,可當我...
    茶點故事閱讀 67,892評論 6 392
  • 文/花漫 我一把揭開白布捐下。 她就那樣靜靜地躺著账锹,像睡著了一般萌业。 火紅的嫁衣襯著肌膚如雪坷襟。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,692評論 1 305
  • 那天生年,我揣著相機與錄音婴程,去河邊找鬼。 笑死抱婉,一個胖子當著我的面吹牛档叔,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蒸绩,決...
    沈念sama閱讀 40,416評論 3 419
  • 文/蒼蘭香墨 我猛地睜開眼衙四,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了患亿?” 一聲冷哼從身側(cè)響起传蹈,我...
    開封第一講書人閱讀 39,326評論 0 276
  • 序言:老撾萬榮一對情侶失蹤押逼,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后惦界,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體挑格,經(jīng)...
    沈念sama閱讀 45,782評論 1 316
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,957評論 3 337
  • 正文 我和宋清朗相戀三年沾歪,在試婚紗的時候發(fā)現(xiàn)自己被綠了漂彤。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,102評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡灾搏,死狀恐怖挫望,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情狂窑,我是刑警寧澤士骤,帶...
    沈念sama閱讀 35,790評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站蕾域,受9級特大地震影響拷肌,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜旨巷,卻給世界環(huán)境...
    茶點故事閱讀 41,442評論 3 331
  • 文/蒙蒙 一巨缘、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧采呐,春花似錦若锁、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,996評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至煤率,卻和暖如春仰冠,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背蝶糯。 一陣腳步聲響...
    開封第一講書人閱讀 33,113評論 1 272
  • 我被黑心中介騙來泰國打工洋只, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人昼捍。 一個月前我還...
    沈念sama閱讀 48,332評論 3 373
  • 正文 我出身青樓识虚,卻偏偏與公主長得像,于是被迫代替她去往敵國和親妒茬。 傳聞我的和親對象是個殘疾皇子担锤,可洞房花燭夜當晚...
    茶點故事閱讀 45,044評論 2 355