http://www.woshipm.com/pmd/935516.html
文章結(jié)構(gòu):
目錄結(jié)構(gòu)規(guī)范;
原型設(shè)計規(guī)范产镐;
注釋規(guī)范佛纫;
關(guān)于“秩序(規(guī)范)和混亂”的一些思考残吩。
一、目錄結(jié)構(gòu)規(guī)范
0歲的產(chǎn)品同學(xué)很多對Axure的定位就是一個畫原型的工具捧杉,經(jīng)常拿起Axure就開始畫頁面陕见,一打開.rp文件目錄第一頁就是產(chǎn)品首頁。
一個好的原型設(shè)計不僅僅是畫出滿足業(yè)務(wù)需求的原型頁面味抖,而是讓瀏覽者清晰的明白這個項目的背景和業(yè)務(wù)邏輯以及整個產(chǎn)品結(jié)構(gòu)评甜,而這些基本都是通過目錄來引導(dǎo)的,所以拿起Axure
不是一開始就畫頁面非竿,而是完善目錄結(jié)構(gòu)蜕着。
需求規(guī)格說明書 & 產(chǎn)品結(jié)構(gòu)導(dǎo)圖
通常介紹整個項目背景以及產(chǎn)品形態(tài)等,通常以《需求規(guī)格說明書》的形式展示:
產(chǎn)品結(jié)構(gòu)導(dǎo)圖相當于移動端產(chǎn)品的功能結(jié)構(gòu)圖红柱,一般用思維導(dǎo)圖和架構(gòu)圖來展示說明承匣,以上兩個頁面主要告訴閱讀者項目背景,產(chǎn)品功能形態(tài)锤悄。
項目開發(fā)流程&基本流程圖
項目開發(fā)流程圖主要介紹整個項目開發(fā)過程中各部門角色之間的協(xié)作流程韧骗,有的公司偏向于敏捷開發(fā),有的公司走傳統(tǒng)的需求零聚,評審袍暴,設(shè)計&開發(fā),測試隶症,驗收政模,上線的路線,相關(guān)流程都應(yīng)該體現(xiàn)在流程圖里蚂会,方便閱讀者知曉淋样。
產(chǎn)品設(shè)計過程中每一個涉及到業(yè)務(wù)邏輯和功能邏輯的流程都需要在基本流程圖里提現(xiàn),當遇到復(fù)雜的業(yè)務(wù)邏輯的時候胁住,流程圖往往比原型頁面更加直觀趁猴。
原型封面 & 版本控制
原型封面主要介紹作簡要的產(chǎn)品描述和歸屬標識刊咳,作為原型設(shè)計完整性的一部分,不是必要的儡司。
版本控制主要作為產(chǎn)品更新迭代記錄以及設(shè)計周期的一個時間標識娱挨。
全局框架設(shè)計規(guī)范 & 全局控件設(shè)計規(guī)范 & 原型注釋規(guī)范
不僅是專業(yè)的UI設(shè)計需要遵守設(shè)計規(guī)范,產(chǎn)品設(shè)計也需要定義一定的設(shè)計規(guī)范捕犬,方便自己設(shè)計產(chǎn)品隨時復(fù)用跷坝,也方便其他人接手時能盡可能的在保持設(shè)計樣式整體一致的前提下,快速上手或听。
二探孝、產(chǎn)品設(shè)計規(guī)范
保持整個系統(tǒng)所有頁面結(jié)構(gòu)的一致性和所有控件元素的統(tǒng)一性是我們定義設(shè)計規(guī)范最初的目的。
產(chǎn)品設(shè)計規(guī)范具體體現(xiàn)在:全局框架設(shè)計規(guī)范誉裆,全局控件設(shè)計規(guī)范顿颅,原型注釋規(guī)范這三個方面。
全局框架設(shè)計規(guī)范
后臺系統(tǒng)框架主要分為三個部分:① 系統(tǒng)功能區(qū) ② 菜單區(qū) ③ 數(shù)據(jù)/功能區(qū)
當然三個區(qū)域可以進行很多靈活的設(shè)計足丢,無論選擇哪種都需要保持所選框架下所有頁面的整體一致性粱腻。
全局控件設(shè)計規(guī)范
上文提到剛開始設(shè)計原型的同學(xué)經(jīng)常會出現(xiàn)不同的頁面同樣的信息不同大小的字體,同樣的功能按鈕用不同的顏色斩跌,結(jié)果導(dǎo)致整個原型看起來像是很多個人設(shè)計出來的绍些,沒有一致性,原因就在于開始的時候沒有定義好一套控件設(shè)計規(guī)范耀鸦。
平時的產(chǎn)品設(shè)計過程中可以參考一些優(yōu)秀的UI框架柬批,例如:Bootstrap,F(xiàn)lat UI 袖订,jQuery UI 等氮帐。
在設(shè)計原型前定義好這些控件以及樣式的規(guī)范后,所有的頁面都引用一套樣式洛姑,不僅使整個原型保持一致性上沐,而且能大大的提高設(shè)計效率。
這里要提到Axure 的兩個很實用的功能:一個是母版楞艾,一個是控件樣式
把后面可能要多次復(fù)用的控件做成母版以及把需要多次復(fù)用的控件樣式設(shè)置成主題樣式會大大的提高設(shè)計效率参咙。
全局注釋規(guī)范
當然這里指的注釋規(guī)范是基于Axure 的,并非借助于PRD文檔硫眯。對于PC端的原型設(shè)計蕴侧,我更傾向于用Axure
原生的注釋功能來描述。分別為:業(yè)務(wù)邏輯两入,需求說明净宵,功能邏輯,視覺(交互)邏輯,技術(shù)邏輯塘娶,備注等。
在保證整個產(chǎn)品設(shè)計統(tǒng)一性和一致性的前提下痊夭,每個人都可以根據(jù)自己的喜好定義自己的原型設(shè)計規(guī)范刁岸。
四、關(guān)于“秩序(規(guī)范)和混亂”的一些思考
秩序和混亂一直是指導(dǎo)我學(xué)習(xí)和工作的第一性原理她我,下面我用畢加索畫牛的過程來解釋這個道理虹曙,也解釋了為什么我會覺得“規(guī)范”是一件很重要的事情,以至于要用一篇文章來強調(diào)番舆。
這是畢加索1934年12月5日畫的一張牛酝碳,看起來很正常,惟妙惟俏恨狈。
過了幾天疏哗,他又畫了一張圖,看起來也不錯禾怠,比較正常返奉。
這張也不錯,有點小頑皮吗氏。
這張更頑皮了
接下來的幾張越來越頑皮了
你可能看到過畢加索畫的很抽象的幾何牛芽偏,也可能只看過他筆下惟妙惟肖的仿真牛,但是連貫起來看畢加索畫牛的過程弦讽,從最開始的仿真牛污尉,不斷的被結(jié)構(gòu)化,幾何化往产,最后畫出了很抽象的幾何牛被碗。
普通人完全可以畫出一個一模一樣的幾何牛,但是為什么畢加索畫出的牛就這么牛捂齐,這是一個值得思考的問題蛮放。畢加索是建立在仿真牛的基礎(chǔ)上,通過解構(gòu)奠宜,抽象出來的幾何牛包颁,這是建立在某種“秩序”上引入的藝術(shù)性“混亂”,而不是直接去通過簡筆畫畫出一個幾何牛压真,這就是大師和普通人的本質(zhì)差別娩嚼。
“我們的混亂,是逃避秩序前無力掌控的毀滅性混亂”這讓我想到幾個月前的自己滴肿,對工作的熱愛和對產(chǎn)品的追求以及處女座的性格岳悟。總是希望畫原型的時候每一個頁面讓它好看,炫酷贵少,以至于過度發(fā)揮呵俏。這樣做導(dǎo)致的結(jié)果是可能一個頁面很好看,整體會很混亂滔灶,看起來像是很多人畫出來的普碎。
后來我明白了建立在秩序上的混亂這樣的道理之后,每次畫原型都會定義好設(shè)計規(guī)范和UI框架录平,第一次感覺得到秩序和規(guī)范帶來的美麻车,以及遵守規(guī)范帶來的簡潔,流暢和高效斗这,我更相信在框架和規(guī)范下再去引入混亂和創(chuàng)新才是有價值的动猬。
以前太自我,不屑于已經(jīng)被定義好的東西表箭,不屑于規(guī)范性的東西赁咙。后來認識到,越自我的東西免钻,距離產(chǎn)品越遠序目,距離藝術(shù)越遠,距離人性越遠伯襟。如果你想在一個領(lǐng)域成為大師猿涨,至少應(yīng)該先遵守這個領(lǐng)域內(nèi)的某種規(guī)范,駕馭了規(guī)范之后姆怪,再去創(chuàng)造叛赚,那樣才是可被掌控的有價值的創(chuàng)造。