如何形成自己的原型方法論
不管是剛剛?cè)胄械漠a(chǎn)品小白,還是久經(jīng)職場的產(chǎn)品大神,畫原型是每個產(chǎn)品人必不可少的職業(yè)技能。本文同樣以一個初入行的產(chǎn)品人的角度,淺析如何形成畫原型的自我方法論。
初入職場,尤其是互聯(lián)網(wǎng)職場,不必要在一開始就醉心于人脈的積累以及職位的晉升,因為這不屬于一個新人應(yīng)該主要考慮的方向。大多數(shù)新人都希望把提升自己的業(yè)務(wù)能力放在首位要素,而作為新人產(chǎn)品,畫原型無疑是基本技能。很多人都覺得畫原型是非常簡單的操作,無非就是擺弄一個控件的位置,然而要總結(jié)個畫原型流程,卻說不出各所以然來。重視原型,重視思維在原型上的體現(xiàn),形成自己的原型方法論,可以大大提高自己的工作效率。
掌握使用路徑,繪制產(chǎn)品流程線框圖
原型又被叫做產(chǎn)品demo,但更主要的是體現(xiàn)想法在思考后體現(xiàn)在產(chǎn)品上的主要功能和交互流程。畫原型之前一定是在腦海中構(gòu)思了無數(shù)次產(chǎn)品使用路徑,所以最好一開始用線框圖理清使用路徑,從宏觀上把握產(chǎn)品的基本架構(gòu)。思維邏輯能力也往往在這一步得到最大程度的鍛煉。對于流程圖繪制,我給各位新司機們幾點建議:
工具不重要,邏輯最重要
市場上繪制原型的工具一抓一大把,常用的一般有Visio,processon,draw.io等等,推薦processon,不僅使用簡單,對新手友好,關(guān)鍵是云端存儲,不用存儲文檔。但正如小標題所說,工具不重要,關(guān)鍵還是是否自己已經(jīng)走通了產(chǎn)品的使用邏輯,從注冊到登出,從瀏覽到編輯,從編輯到預(yù)覽,做到心中有數(shù),繪制原型自然能做到通暢無阻。
美觀或許也要放在心上
大部分人做自己的產(chǎn)品都能走通邏輯,卻很少有人能把線框圖畫的美觀,因為對大部分人來說,邏輯自己理清了就行。實際上,
- 流程圖美觀能夠方便以后自己再次看時,能迅速復(fù)現(xiàn)當時的思維路徑
- 畫個美觀的流程圖,給其他人講解時也能迅速理解你的思路
說服別人前先說服自己
人做事總是立足于當時。畫流程圖的時候,往往只關(guān)注當時路徑是否是正確的,卻往往忽略某些特殊情況下的特殊處理,因此,畫完流程圖后不要急著說完成,交給別人看之前先檢查一下,試著復(fù)現(xiàn)使用場景,注意產(chǎn)品在某些特殊情況下的展現(xiàn)。
某個產(chǎn)品的簡單流程圖
繪制原型:最大程度還原線框圖
原型圖的使用對象是設(shè)計師,所以好的原型評價標準是設(shè)計師能迅速理解產(chǎn)品框架。目標原型圖應(yīng)當具有成熟產(chǎn)品的具體功能,并且能解決預(yù)設(shè)的相關(guān)需求。原型圖是產(chǎn)品的核心,是作為產(chǎn)品的部分價值體現(xiàn),也是一個產(chǎn)品人的基礎(chǔ)技能,我不認同“人人都是產(chǎn)品經(jīng)理”這個觀點的一個重要依據(jù)就是“不是人人都能畫原型”,所以需要重視原型在產(chǎn)品工作中的比重。
都說產(chǎn)品是生孩子,那么畫原型大概是基因的交流,是未來產(chǎn)品的雛形。產(chǎn)品到了這一步已經(jīng)到了具體落地的步驟,那么你需要一定的工具來做這件事。大多數(shù)人推薦Axure,作為畫原型的基礎(chǔ)工具,它的作用大概之于office的word一般,但我還是推薦有想法的產(chǎn)品可以試一試墨刀。相比Axure,墨刀在制作交互和成果展示上,有著天生的優(yōu)勢,盡管Axure能畫出更漂亮,更加高保真的原型。
收集素材,做好準備
正所謂“工欲善其事,必先利其器”,做好準備工作總是沒有錯的。元件就像搭建房屋的磚塊,除了Axure自帶的元件,網(wǎng)上素材往往是一個原型必不可少的組成成分。
(1)元件庫
Axure往往會自帶一部分元件庫,但僅靠自帶的元件庫遠遠不能滿足日常工作的需要,除了網(wǎng)上搜索Axure元件庫出來一大堆元件庫外,我這里推薦兩個常用的ios規(guī)范的元件庫(來自網(wǎng)絡(luò),樂于當搬運工)http://pan.baidu.com/s/1c21tdhm,希望能起到一丁點作用
(2)Icon素材
為什么看別的產(chǎn)品畫的原型都那么好看,那么豐富,那么飽滿?你觀察過么,可能只是你的原型少了一些icon和顏色的填充。其實icon不僅只在UI稿中出現(xiàn),同樣可以出現(xiàn)在你的原型圖中。
① 裝飾填充
加入icon的原型往往更加生動,相比死板的用框圖繪制的原型更加具有活力,在需求評審時更加便于拉近與技術(shù)和設(shè)計的距離
② 解釋說明
Icon作為圖形語言,在人機交互中具有重要的作用,但是在原型中最好能配合文字使用,得讓對象知道icon的意思,畢竟原型的使用對象是設(shè)計師,產(chǎn)品最終的icon得由設(shè)計師設(shè)計。
目前網(wǎng)絡(luò)上已經(jīng)有很多icon在線庫可下載,例如easyicon以及阿里的iconfont等都是不錯的選擇。
阿里開放的icon平臺
優(yōu)化細節(jié),嚴格根據(jù)之前的流程圖步驟繪制原型
按照流程圖的使用路徑繪制原型圖的好處在于能保持邏輯的連貫性,繪制過程一氣呵成,工作效率便能得到極大提升。待框架和基本功能完善后,再去優(yōu)化細節(jié),針對每個按鈕、每個功能嚴格按照“增查改刪算顯傳,異常情況也要盤”的口訣,增加不同情形下的頁面。這樣一個完整的原型圖就大致完成了。
某頁原型
但需要說明的是,我不是鼓勵各位新司機們畫的原型要足夠好看,也不是鼓勵花足夠的時間做一個完美的原型,而是希望各位在盡量完整表達產(chǎn)品框架的同時,兼顧到原型的可讀性,畢竟設(shè)計師們體現(xiàn)在最終產(chǎn)品上的審美也會受原型的影響。
至于一部分人反駁好看的原型會限制設(shè)計師的設(shè)計想法,那我只能說,這不是產(chǎn)品的鍋,畢竟專業(yè)的人只做專業(yè)的事!
最后,還是希望和各位新老司機們互相學(xué)習(xí),多多交流。
以上。
作者:Joe_吉,公眾號:一周互聯(lián)網(wǎng)冷知識
本文由 @Joe_吉 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,歡迎勾搭。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自 Pexels,基于 CC0 協(xié)議
- 目前還沒評論,等你發(fā)揮!