產品的三種流程圖,你都知道嗎?

66 評論 368823 瀏覽 2112 收藏 8 分鐘

關于流程設計,有三種流程圖……了解了業務、確定了需求,會梳理出產品的信息架構。

剛入行的時候,我會火急火燎地畫原型圖,因為畫原型圖的時候成就感最大,這畢竟是真正意義上的輸出物?。〗K于畫完美美的原型圖了,拿給評審或和開發溝通,才發現存在很多邏輯漏洞,不是缺少分支流程,就是沒考慮異常狀態,就這樣來來回回修改原型圖,被開發同學鄙視和效率低下不說,自己都開始懷疑自己了。

隨著項目經驗的增加和方法論的逐步完善,終于知道在需求和原型圖之間存在著兩道墻,一個是信息架構,另一個則是流程設計。只有按照相應的設計原則跨過這兩道墻才能在畫原型圖時做到心中有數,考慮周全,而不是跟著感覺走。

什么是流程圖?

你是不是會覺得跟一些人沒有共同語言,并不是因為我們說著不同的語言,而是彼此知道的概念不一樣,或者對同個概念的理解不同,所以導致了溝通困難,你明明在說A,對方理解成B,這種雞同鴨講的溝通真是難以忍受。既然概念如此重要,當學習新知識時,第一件事就是透徹的了解概念,在理解概念的前提下再去擴展方法論和踐行,才能學好新知識。流程圖,絕大多數人三個字都認識,但當它們組合在一起,表達了什么意義呢?

流程圖:用圖示的方式反映出特定主體為了滿足特定需求而進行的有特定邏輯關系的一系列操作過程。精簡一下,就是流程圖是用圖示來表示某一系列的操作過程。這個操作過程有特定的主體,是為了滿足特定的需求且有特定邏輯關系的。例如:京東的購物流程,特定主體是用戶、特定需求是購物、特定邏輯關系是用戶購物過程中的邏輯。

產品設計中涉及的流程圖有三種,業務流程圖、任務流程圖、頁面流程圖。

1111

三種流程圖

1. 業務流程圖

凡事都是有流程的,包括最簡單的吃飯睡覺刷牙,刷牙時,你要先拿起牙刷牙膏、擠牙膏、刷牙、漱口、洗牙刷、放好牙膏牙刷。

2222

刷牙流程

 

你發現了用戶的一個痛點,想要去解決它,進行產品定位和需求分析之后,你需要對整個業務模式進行分析,需要考慮一下幾個問題①涉及到哪些主體?②每個主體都有哪些任務?③各個主體之間怎么聯系的?

3333

業務流程(泳道圖)

 

這是網上關于購物支付的泳道圖,用來反映業務流程。上述的泳道圖涉及到賣家、買家、第三方支付、銀行等主體;每個主體都有其相應的任務;并用箭頭來表示各個任務之間的先后次序。

3. 任務流程圖

泳道圖從戰略層分析了整個業務流程,接下來要去分解到各個任務層具體是如何操作的,例如上面買家選購商品這個任務就涉及到搜索商品、瀏覽搜索結果、查看商品詳情、若滿意則進入訂單任務,若不滿意則返回到搜索結果或者重新搜索,這就是具體的某個任務的流程。

4444

選購商品的流程

 

畫具體任務流程的時候要注意從整體流程到局部流程,從主干流程到分支,從正常流程到異常流程。對于交互設計師來說,任務流程的主體一般是產品的用戶,任務流程圖反映的則是用戶的行為。

拿滴滴和易到來說,打車就是主干流程,查看行程、查看優惠券、設置就是分支流程,做設計時應該先考慮打車流程,再去完善其它流程;用戶正常打到車是正常流程,網絡異常、高峰期打不到車等屬于異常流程,先考慮正常流程、再考慮異常流程,而且異常流程一定要思考的全面。產品的邏輯漏洞多半是由于異常流程沒有考慮清楚,所以畫任務流程圖能有效的減少產品原型圖的邏輯漏洞。

雖然流程圖簡單,但也有一套規則。按照規則來畫,才不會被笑話。

5555

流程圖繪制規則

頁面流

通過泳道圖和流程圖,把業務流程和各個功能的任務流程用圖示的方式梳理清楚。其中任務流程圖直觀的告訴我們整個業務模型是怎樣的、涉及到哪些主體,這些主體下面都有什么任務要完成;任務流程圖展示了主干任務和分支任務,描述了一個任務的大致流程。

而頁面流程圖的對象是頁面,頁面是互聯網產品設計最基本的單元,不管APP也好、H5也好、PC端也好,這些產品由一個個頁面組成。頁面流描述了用戶完成一個任務需要經過哪些頁面。也就是我在哪,經過什么操作,能去哪。頁面流有三個要素:頁面、行動點、連接線。下面拿購物的頁面流舉例說明:

6666

購物頁面流

 

畫頁面流時一般只考慮用戶的正常路徑就行,如果需要指出異常流程,在正常流程附近畫出異常流程就行。產品設計從需求分析到信息架構、再到業務流程——任務流程——頁面流、再到最后的原型圖(線框圖)是一個從抽象到具象的過程,也是從概況到細分的過程。經過一步步的分析,逐步將想法變成實實在在的產品,這就是產品設計的魅力所在。而這其中流程設計起到舉足輕重的作用,不可忽視。

 

本文由 @鄒志楠 原創發布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 業務流程(泳道圖)中的創建訂單動作應該是買家的任務吧

    來自北京 回復
    1. 嚴格來說,賣家或賣家只是發起了創建訂單的請求,實際訂單的創建是由系統完成的。

      來自四川 回復
  2. 如果要說流程圖的話,真應該應該了解一下UML。做產品經理有必要去學一下。懂UML才算得上是科班出身的B端產品,否則就別說什么是B端產品。

    來自河北 回復
    1. UML語言好幾種圖,最從常用的也就是狀態圖,像類圖啥的我認為產品經理沒必要搞

      來自北京 回復
  3. 看了半天,終于有一個比較標準的解釋了,受教

    來自北京 回復
  4. 公司都要有收據么:cgkc.com

    來自廣東 回復
  5. 文章的基點都是錯誤的,流程只是一種特征,不是類型,建議你去學習UML。

    來自浙江 回復
    1. 文章沒有定義流程是類型,流程不能分類嗎?反復刷評論??有意思??

      來自湖北 回復
    2. 不懂就別誤人子弟

      來自北京 回復
    3. 而且打消作者,是何居心,快快報上名來

      來自北京 回復
  6. 畫頁面流時一般只考慮用戶的正常路徑就行,如果需要指出異常流程,在正常流程附近畫出異常流程就行。

    “在正常流程附近畫出異常流程”的意思是 “在正常流程周圍 再單獨畫一個異常流程,不跟正常流程發有連線的連接”

    來自四川 回復
  7. 還差一個數據流程圖。

    來自四川 回復
  8. 補充一下,還有個信息架構圖,不過不算是流程了哈。

    來自四川 回復
    1. 文章的基點都是錯誤的,流程只是一種特征,不是類型,建議你去學習UML

      來自浙江 回復
  9. 淺顯易懂,都是干貨!

    來自日本 回復
    1. 文章的基點都是錯誤的,流程只是一種特征,不是類型,建議你去學習UML。

      來自浙江 回復
  10. 受教了,感謝!

    來自山西 回復
    1. 文章的基點都是錯誤的,流程只是一種特征,不是類型,建議你去學習UML。

      來自浙江 回復
  11. 文章雖然短,但是寫的很好!把業務流程圖、任務流程圖、頁面流程圖解釋的很清楚!很棒。值得一看。 拿到一個方案,首先是明白需求,在理解了產品經理的需求文檔之后,也切不可直接著手畫原型圖,應該根據產品定位、用戶需求等將信息構架、任務流程、頁面流程等整理出來之后,然后在畫設計草圖、最后輸出標準原型稿。心中有一個完整的設計流程,才不至于來來回回反復修改原型。

    來自四川 回復