如何開(kāi)展產(chǎn)品詳細(xì)設(shè)計(jì)?–來(lái)理理思路
在產(chǎn)品的設(shè)計(jì)階段,我們需要做的是哪些工作?不是常規(guī)的需求分析、產(chǎn)品設(shè)計(jì),本文作者給到了另一種答案:業(yè)務(wù)數(shù)據(jù)建模、界面流轉(zhuǎn)圖和界面設(shè)計(jì)等。
產(chǎn)品方案設(shè)計(jì),我一般會(huì)分成2大步,第一步是產(chǎn)品整體方案設(shè)計(jì)(可見(jiàn)文章-如何開(kāi)展產(chǎn)品整體方案設(shè)計(jì)?),第二步是產(chǎn)品詳細(xì)設(shè)計(jì),本問(wèn)針對(duì)產(chǎn)品詳細(xì)設(shè)計(jì)和大家一起探討。
將抽象的用戶需求轉(zhuǎn)化為具象化的產(chǎn)品需求階段開(kāi)始了。對(duì)業(yè)務(wù)整體方向、產(chǎn)品框架等均定位清楚后,就要開(kāi)始詳細(xì)的產(chǎn)品設(shè)計(jì)了,開(kāi)始前也不用著急馬上投入到原型設(shè)計(jì)中,我一般習(xí)慣從業(yè)務(wù)數(shù)據(jù)框架開(kāi)始,再細(xì)化一次業(yè)務(wù)流程和關(guān)鍵角色,最后再進(jìn)行頁(yè)面流轉(zhuǎn)圖與原型圖的設(shè)計(jì)。
一、業(yè)務(wù)數(shù)據(jù)建模
我一般先確認(rèn)業(yè)務(wù)中的關(guān)鍵內(nèi)容(可從業(yè)務(wù)組織架構(gòu)層級(jí)出發(fā))、每個(gè)內(nèi)容的關(guān)鍵屬性、再梳理內(nèi)容之間的關(guān)聯(lián)關(guān)系,這個(gè)思路下來(lái)基本可以梳理的大差不大,呈現(xiàn)形式可以用ER圖。
案例:小紅集團(tuán)需要一款輔助工程施工進(jìn)度管理的軟件
現(xiàn)主要業(yè)務(wù)情況如下:
- 工程進(jìn)度管理方法一般是項(xiàng)目通過(guò)周會(huì)向分公司定期匯報(bào)工程情況、分公司通過(guò)月會(huì)向集團(tuán)定期匯報(bào)工程情況(如進(jìn)度、風(fēng)險(xiǎn)等),匯報(bào)后對(duì)相應(yīng)問(wèn)題下發(fā)整改措施等;
- 工程進(jìn)展在項(xiàng)目部辦公室或公司管理人員辦公室內(nèi),通過(guò)打印施工圖紙上墻、手工勾選的方式進(jìn)行查看與管理;
- 每個(gè)項(xiàng)目的工程計(jì)劃為獨(dú)立文件存儲(chǔ),訪問(wèn)者可隨意變更,經(jīng)常出現(xiàn)因修改異常影響了項(xiàng)目進(jìn)度的情況,又很難追溯到責(zé)任人。
進(jìn)而梳理該企業(yè)的主要業(yè)務(wù)架構(gòu)與系統(tǒng)賬號(hào)的關(guān)系如下:
圖1-客戶進(jìn)度業(yè)務(wù)組織機(jī)構(gòu)樹(shù)
圖中存在三種對(duì)象:
- 組織機(jī)構(gòu)對(duì)象:用來(lái)描述客戶的行政管理層級(jí)結(jié)構(gòu),自己公司總部位于最上層的根節(jié)點(diǎn)上;
- 計(jì)劃對(duì)象:是管理的目標(biāo),掛在某個(gè)組織機(jī)構(gòu)下;
- 賬號(hào)對(duì)象:代表系統(tǒng)的用戶,賬號(hào)掛在組織機(jī)構(gòu)下,在本公司總部下的賬號(hào),是工程進(jìn)度業(yè)務(wù)后臺(tái)的管理賬號(hào),可以管理整棵組織機(jī)構(gòu)樹(shù)中的所有數(shù)據(jù)。
每個(gè)組織機(jī)構(gòu)對(duì)象都有一個(gè)“上級(jí)機(jī)構(gòu)”,每個(gè)賬號(hào)或計(jì)劃都只能隸屬于一個(gè)項(xiàng)目或機(jī)構(gòu),每個(gè)計(jì)劃中都有幾百甚至上千個(gè)任務(wù),將這幾種對(duì)象通過(guò)ER圖來(lái)呈現(xiàn)如下:
圖2-客戶模型ER圖
ER圖中可以清晰的看出各對(duì)象之間的數(shù)據(jù)關(guān)系,在接下來(lái)的詳細(xì)需求設(shè)計(jì)或研發(fā)同學(xué)進(jìn)行數(shù)據(jù)庫(kù)設(shè)計(jì)時(shí),均提供了清晰的關(guān)系說(shuō)明。
這樣的模型保留了一定的可拓展性,比如項(xiàng)目前期時(shí)間較緊張時(shí),完整的組織機(jī)構(gòu)樹(shù)的開(kāi)發(fā)復(fù)雜度很高,為了降低開(kāi)發(fā)成本與滿足一期客戶的上線時(shí)間要求,與客戶溝通后可暫不支持復(fù)雜的行政層級(jí)管理,只需要為客戶實(shí)現(xiàn)若干個(gè)賬號(hào)可管理多份計(jì)劃即可,根據(jù)以上情況,簡(jiǎn)化組織樹(shù)如下:
圖3-簡(jiǎn)化版組織機(jī)構(gòu)樹(shù)
基于簡(jiǎn)化版的組織樹(shù)層級(jí),每個(gè)客戶需要有一個(gè)管理員賬號(hào),可以創(chuàng)建子賬號(hào)和計(jì)劃,子賬號(hào)可以設(shè)置為生產(chǎn)部人員,能夠?qū)﹃P(guān)聯(lián)的計(jì)劃進(jìn)行工作處理等。
簡(jiǎn)化后的ER圖如下:
圖4-簡(jiǎn)化版客戶模型ER圖
該模式與上方圖2模型相比,只是在賬號(hào)與計(jì)劃兩個(gè)對(duì)象之間建立了關(guān)聯(lián)關(guān)系,這樣處理保持了模型的可擴(kuò)展性,將來(lái)需要實(shí)現(xiàn)全面的組織機(jī)構(gòu)管理時(shí),將賬號(hào)、計(jì)劃之間的對(duì)應(yīng)關(guān)系打斷,整個(gè)數(shù)據(jù)底層基本不需要調(diào)整,在業(yè)務(wù)系統(tǒng)中實(shí)現(xiàn)相關(guān)技術(shù)算法和組織機(jī)構(gòu)樹(shù)管理維護(hù)功能即可。
注意:在賬號(hào)與計(jì)劃的關(guān)系中,一般是生產(chǎn)部門(mén)的1個(gè)人負(fù)責(zé)對(duì)應(yīng)的1份計(jì)劃,若某個(gè)項(xiàng)目在前期準(zhǔn)備時(shí),發(fā)現(xiàn)本次工程很復(fù)雜,也可能需要多個(gè)人一同編制工程計(jì)劃,所以賬號(hào)與計(jì)劃的關(guān)系設(shè)計(jì)為多對(duì)多,這是實(shí)際情況中經(jīng)常出現(xiàn)的業(yè)務(wù)場(chǎng)景。我在設(shè)計(jì)模型時(shí)通常會(huì)盡量讓自己多想一步,使產(chǎn)出的模型擴(kuò)展性盡可能強(qiáng)一些,也是降低以后由于業(yè)務(wù)復(fù)雜度的增加需開(kāi)發(fā)新功能,但系統(tǒng)底層無(wú)法支持,只能重構(gòu)的風(fēng)險(xiǎn)。
二、流程與角色
流程圖我一般采用自頂向下的思路梳理,先梳理主干流程,再填補(bǔ)關(guān)鍵支線流程,將流程中涉及到的角色,均列舉出來(lái),進(jìn)一步明確系統(tǒng)角色及業(yè)務(wù)崗位之間的安排。整個(gè)流程設(shè)計(jì)的過(guò)程中,我會(huì)不斷提醒自己謹(jǐn)慎思考各環(huán)節(jié)的依賴(lài)關(guān)系、先后順序,避免邏輯混亂。
根據(jù)以上案例,調(diào)研時(shí)與客戶溝通確認(rèn)的主要業(yè)務(wù)流程如下:
圖5-線下進(jìn)度管理主流程圖
根據(jù)流程圖思考系統(tǒng)具體拆分,大致思路與結(jié)果為:本公司管理客戶時(shí),需要客戶管理后臺(tái);客戶管理分公司/項(xiàng)目時(shí),需要運(yùn)營(yíng)管理后臺(tái);客戶進(jìn)行工程進(jìn)度管控時(shí),需要進(jìn)度管理前臺(tái)。
進(jìn)而梳理出如下不同角色:
1)進(jìn)度管理業(yè)務(wù)在本公司內(nèi)部包含如下角色:
- 本公司-銷(xiāo)售人員:本公司內(nèi)部的銷(xiāo)售人員,負(fù)責(zé)本公司的客戶開(kāi)發(fā)與合約簽訂(溝通確認(rèn)后仍采用線下作業(yè)方式);
- 本公司-運(yùn)營(yíng)人員:本公司內(nèi)部的運(yùn)營(yíng)人員,負(fù)責(zé)具體的客戶創(chuàng)建、維護(hù)等業(yè)務(wù)性工作;
2)進(jìn)度管理業(yè)務(wù)客戶包含如下角色:
- 客戶-管理員:客戶公司的管理員,維護(hù)并管理公司內(nèi)人員賬號(hào)、項(xiàng)目等;
- 客戶-生產(chǎn)部人員:客戶公司生產(chǎn)部人員(泛指項(xiàng)目/分公司/公司相關(guān)職位),負(fù)責(zé)工程計(jì)劃增刪改、風(fēng)險(xiǎn)糾偏、工作匯報(bào)等;
- 客戶-生產(chǎn)部負(fù)責(zé)人/總監(jiān):客戶公司生產(chǎn)部中高層(泛指項(xiàng)目/分公司/公司相關(guān)職位),負(fù)責(zé)工程計(jì)劃相關(guān)的審批與監(jiān)管工作;
- 客戶-工程部負(fù)責(zé)人/總監(jiān):客戶公司生產(chǎn)部中高層(泛指項(xiàng)目/分公司/公司相關(guān)職位),負(fù)責(zé)工程計(jì)劃相關(guān)的審批與監(jiān)管工作;
基于上述分析,繪制出更詳細(xì)的業(yè)務(wù)流程圖如下:
圖6-創(chuàng)建維護(hù)客戶到進(jìn)度管理主流程圖
上圖清晰的描述了從客戶開(kāi)發(fā)到進(jìn)度管控的關(guān)鍵流程節(jié)點(diǎn),以及不同的角色在不同的系統(tǒng)中各完成了哪些操作,最終完成整個(gè)流程。通過(guò)跨職能分系統(tǒng)流程圖,可以清晰的看出誰(shuí)(操作角色)在哪(那個(gè)系統(tǒng)/模塊)做什么(完成哪些工作),一般這個(gè)流程圖梳理完成后,對(duì)整體系統(tǒng)就會(huì)有個(gè)很清晰的認(rèn)識(shí)。
三、頁(yè)面流轉(zhuǎn)圖
接下來(lái)就是頁(yè)面流轉(zhuǎn)圖,一般常用來(lái)描述用戶完成某項(xiàng)工作需要訪問(wèn)的頁(yè)面及頁(yè)面跳轉(zhuǎn)順序,包括系統(tǒng)中總共需要哪些頁(yè)面,哪些頁(yè)面可以重復(fù)使用。通常我會(huì)選定主要的某單一角色,繪制某個(gè)特定場(chǎng)景下的頁(yè)面訪問(wèn)和跳轉(zhuǎn)邏輯,從用戶視角梳理一遍所有相關(guān)頁(yè)面,往往在這個(gè)過(guò)程中會(huì)檢查到一些遺漏或有問(wèn)題的內(nèi)容,可進(jìn)行查缺補(bǔ)漏。
舉例:項(xiàng)目生產(chǎn)部人員,創(chuàng)建并填報(bào)計(jì)劃的過(guò)程中,涉及到哪些頁(yè)面?創(chuàng)建計(jì)劃后中高層進(jìn)行審批時(shí)涉及哪些頁(yè)面?
1)項(xiàng)目生產(chǎn)部人員首先需要登錄到系統(tǒng),進(jìn)入首頁(yè),因?yàn)橐獎(jiǎng)?chuàng)建計(jì)劃、填報(bào)計(jì)劃,所以需訪問(wèn)計(jì)劃列表頁(yè),在列表頁(yè)中有導(dǎo)入計(jì)劃按鍵、填報(bào)進(jìn)度按鍵,點(diǎn)擊某一按鍵,分別進(jìn)入導(dǎo)入/編輯計(jì)劃頁(yè)、進(jìn)度填報(bào)頁(yè);
2)計(jì)劃創(chuàng)建好后,生產(chǎn)部負(fù)責(zé)人/總監(jiān)登錄到系統(tǒng),進(jìn)入首頁(yè),因?yàn)樾枰獙徟a(chǎn)部人員上傳的計(jì)劃,所以需訪問(wèn)審批列表頁(yè),此時(shí)要思考一下,是否需要一個(gè)新頁(yè)面,能否與計(jì)劃列表頁(yè)共用一個(gè)頁(yè)面?因負(fù)責(zé)人審批的可能不止一個(gè)項(xiàng)目計(jì)劃且更主要關(guān)注審批狀態(tài),將待審批的計(jì)劃進(jìn)行查閱審批,需要一個(gè)列表查看全局情況;而計(jì)劃列表主要關(guān)注計(jì)劃的進(jìn)度、風(fēng)險(xiǎn)情況等,且每個(gè)項(xiàng)目一份,鋪開(kāi)展示計(jì)劃詳細(xì)內(nèi)容即可,便于管理;所以審批記錄需要單獨(dú)新增一個(gè)頁(yè)面,負(fù)責(zé)人進(jìn)入審批列表頁(yè),點(diǎn)擊“審批”按鍵,進(jìn)入計(jì)劃審批頁(yè)。
頁(yè)面流轉(zhuǎn)圖如下:
圖7-頁(yè)面流轉(zhuǎn)圖示例
通過(guò)業(yè)務(wù)主流程、頁(yè)面流轉(zhuǎn)圖的梳理后,對(duì)系統(tǒng)的頁(yè)面情況有了一定的評(píng)估,需要注意的是,不是所有頁(yè)面都會(huì)在頁(yè)面流轉(zhuǎn)圖中體現(xiàn),比如我們的財(cái)務(wù)部門(mén),他們所需要的一些報(bào)表頁(yè)、對(duì)賬查詢(xún)頁(yè)等。我經(jīng)常提醒自己,凡事都盡量多維度思考一下,可以幫自己發(fā)現(xiàn)一些未考慮到的問(wèn)題。
四、界面設(shè)計(jì)
到這步基本已經(jīng)將大框架梳理的差不多了,可以為每個(gè)頁(yè)面設(shè)計(jì)具體的交互功能了,即頁(yè)面設(shè)計(jì)。原型圖的設(shè)計(jì)工具比較多,比如Axure、墨刀、Mockplus等,可根據(jù)個(gè)人習(xí)慣靈活選擇。
界面設(shè)計(jì)的時(shí)候,有一些基礎(chǔ)原則可以了解一下,對(duì)產(chǎn)品整體的統(tǒng)一性、可用性、友好性都有一定幫助,我起初剛做產(chǎn)品的時(shí)候,聽(tīng)到比較多的是尼爾森十大可用性原則,主要考慮用戶在這個(gè)頁(yè)面上會(huì)進(jìn)行哪些交互、怎樣設(shè)計(jì)能達(dá)到最好的交互效果等。
尼爾森十大可用性原則包括:
- 反饋原則:比如安裝程序時(shí)顯示進(jìn)度條,并預(yù)估還需要多久結(jié)束,系統(tǒng)需要告知用戶發(fā)生了什么,預(yù)期是什么;
- 隱喻原則:比如音樂(lè)播放器的功能鍵,不加文字說(shuō)明,也知道每個(gè)圖標(biāo)想表達(dá)的含義,符合真實(shí)世界認(rèn)知的方式;
- 回退原則:比如編輯類(lèi)軟件的撤銷(xiāo)功能,例如Word、美圖秀秀等,用戶會(huì)不小心操作錯(cuò)誤,系統(tǒng)需要支持恢復(fù)到錯(cuò)誤發(fā)生之前的狀態(tài);
- 一致原則:比如在App底部的導(dǎo)航圖標(biāo)中,“首頁(yè)”永遠(yuǎn)排在第一個(gè),個(gè)人中心“我的”永遠(yuǎn)排在最后,大家都已經(jīng)習(xí)慣的一些規(guī)范最好遵循慣例,不盲目標(biāo)新立異,保持系統(tǒng)的一致感;
- 防錯(cuò)原則:比如有時(shí)為了防止用戶重復(fù)提交或重復(fù)點(diǎn)擊,第一次點(diǎn)擊按鈕后就將按鈕置灰,直到處理完成才恢復(fù),盡量避免錯(cuò)誤發(fā)生,影響客戶接下來(lái)的流程使用;
- 記憶原則:比如幾乎所有的App和PC端的搜索引擎都會(huì)記錄用戶的搜索歷史并呈現(xiàn)給用戶,減輕用戶的記憶負(fù)擔(dān);
- 靈活易用原則:比如Word的自定義功能,提供了非常強(qiáng)的配置能力,用戶可以對(duì)Word的界面實(shí)現(xiàn)顛覆性的重新設(shè)置,當(dāng)然也不是說(shuō)系統(tǒng)一定要做到這種自定義配置程度,但要支持大部分用戶的需求,讓他們用起來(lái)得心應(yīng)手,同時(shí)也要提供必要的幫助,協(xié)助剛?cè)腴T(mén)的用戶順利上手;
- 簡(jiǎn)約設(shè)計(jì)原則:比如下圖所示一份停機(jī)通知,左側(cè)只突出了停機(jī)這件事和停機(jī)時(shí)間,右側(cè)突出標(biāo)記了更多內(nèi)容,但用戶反而無(wú)法一下子抓住真正的重點(diǎn),重點(diǎn)太多相當(dāng)于沒(méi)有重點(diǎn),要掌握好突出標(biāo)記的“度”;
- 容錯(cuò)原則:比如訪問(wèn)網(wǎng)站時(shí),若頁(yè)面不存在,服務(wù)器提供的標(biāo)準(zhǔn)錯(cuò)誤提示是404錯(cuò)誤,很多用戶并不理解404是什么意思,需將其優(yōu)化為如:抱歉,網(wǎng)站維護(hù)中,請(qǐng)稍后訪問(wèn);錯(cuò)誤信息應(yīng)該用通俗易懂的語(yǔ)言說(shuō)明,并且在提出錯(cuò)誤信息時(shí)要給出解決建議;
- 幫助原則:比如數(shù)據(jù)服務(wù)(API)管理類(lèi)的B端產(chǎn)品,存在一定的技術(shù)門(mén)檻、有些業(yè)務(wù)流程較復(fù)雜,需要通過(guò)幫助文檔查詢(xún)明確的使用說(shuō)明,引導(dǎo)用戶解決問(wèn)題,幫助信息應(yīng)該易于搜索,不要太復(fù)雜,便于閱讀理解;
大家如果感興趣,可以詳細(xì)查詢(xún)下尼爾森十大原則,這里僅做了簡(jiǎn)單舉例。
以上就是我在產(chǎn)品詳細(xì)設(shè)計(jì)時(shí),常用的思路流程,希望對(duì)你有幫助,歡迎大家一起交流學(xué)習(xí)呀~
本文由 @不知名產(chǎn)品露 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)作者許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
該文觀點(diǎn)僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺(tái)僅提供信息存儲(chǔ)空間服務(wù)
杭州的嘛
產(chǎn)品設(shè)計(jì)除了大框架要立得住以外,感覺(jué)細(xì)節(jié)也需要注意。