我有一個(gè) App 創(chuàng)意:經(jīng)歷8個(gè)階段,將其實(shí)現(xiàn)

6 評(píng)論 21602 瀏覽 164 收藏 10 分鐘

不同的項(xiàng)目管理模式或許會(huì)有完全不同的流程步驟。但是專業(yè)性幾乎是保證產(chǎn)品質(zhì)量的唯一準(zhǔn)則。

App 的開發(fā)過程主要分為以下階段,本文會(huì)按順序?yàn)榇蠹液?jiǎn)單地說明:

  1. 需求梳理、分析
  2. 產(chǎn)品原型圖繪制
  3. UI 設(shè)計(jì)
  4. 項(xiàng)目經(jīng)理 & 技術(shù)負(fù)責(zé)人對(duì)接需求
  5. 技術(shù)方案 & 架構(gòu)設(shè)計(jì)
  6. 項(xiàng)目排期 & 任務(wù)分解
  7. 產(chǎn)品研發(fā)階段
  8. 交付測(cè)試階段
  9. 最后,按原計(jì)劃上線

第一步:需求梳理、分析

針對(duì)這個(gè)idea來一場(chǎng)從內(nèi)到外的洗禮,在此假設(shè)用戶需求分析已經(jīng)確定 , 接下來根據(jù)提煉的真實(shí)用戶需求來確定產(chǎn)品需求。

產(chǎn)品經(jīng)理將會(huì)根據(jù)溝通中的相關(guān)資料的word、ppt、jpg等等東西翻譯成邏輯語言,最簡(jiǎn)單的就是產(chǎn)出一張產(chǎn)品功能腦圖或者一份功能列表。

1

產(chǎn)品功能腦圖

2

一份功能列表

第二步:產(chǎn)品原型圖繪制

初步產(chǎn)品功能需求梳理清楚之后,產(chǎn)品經(jīng)理持續(xù)跟進(jìn),反復(fù)溝通確定產(chǎn)品原型圖。

PS:我們出一般是全局流的圖,程序員哥哥們比較喜歡(白眼)

3

產(chǎn)品原型圖

同時(shí)根據(jù)具體的項(xiàng)目需求,會(huì)搭配一套產(chǎn)品業(yè)務(wù)流程的泳道圖:

4

產(chǎn)品業(yè)務(wù)流程的泳道圖

常規(guī)的是用axure出一份帶簡(jiǎn)單交互的原型:

5

簡(jiǎn)單交互的原型

簡(jiǎn)單點(diǎn),用墨刀做一份帶交互的原型。

6

墨刀帶交互的原型

第三步:UI設(shè)計(jì)

UI設(shè)計(jì),包含風(fēng)格稿和內(nèi)頁設(shè)計(jì)。

風(fēng)格稿會(huì)根據(jù)產(chǎn)品需求提供的目標(biāo)用戶類型、客戶傾向、LOGO等信息,以及確定做風(fēng)格稿的2-3個(gè)頁面的原型圖,來進(jìn)行風(fēng)格稿設(shè)計(jì)。

待風(fēng)格稿確認(rèn)后進(jìn)行內(nèi)頁設(shè)計(jì),包括設(shè)計(jì)效果、頁面元素、彈出頁面等等

7

風(fēng)格稿

8

風(fēng)格稿

所有頁面設(shè)計(jì)完后會(huì)統(tǒng)一發(fā)給客戶做進(jìn)一步溝通,然后統(tǒng)一修改優(yōu)化。

9

Zeplin

Zeplin能夠幫助前端更好地理解設(shè)計(jì)師意圖,而設(shè)計(jì)師又能快速得到前端反饋的協(xié)作,從而減少設(shè)計(jì)師與前端的溝通錯(cuò)位,使得兩者在“界面元素”和“交互動(dòng)作”上形成一致。

10

Zeplin

invision用于設(shè)計(jì)先行能減少后端技術(shù)工程問題,設(shè)計(jì)的迭代越快,軟件開發(fā)就越能在時(shí)間點(diǎn)的把控上做到極簡(jiǎn)。

11

invision

設(shè)計(jì)定稿后并不是設(shè)計(jì)師的工作結(jié)束了,之后還有一段周期的切圖、標(biāo)注工作 。

12

標(biāo)注

13

切圖

14

sketch

多維度運(yùn)用zeplin、sketch、invision等等協(xié)作工具從細(xì)節(jié)上詮釋產(chǎn)品開發(fā)的每一個(gè)產(chǎn)品需求,在時(shí)間上保證高效,在結(jié)果上保證了產(chǎn)品技術(shù)層面與設(shè)計(jì)層面的完美融合以及項(xiàng)目的高效進(jìn)度和最后的優(yōu)質(zhì)呈現(xiàn)。

第四步:項(xiàng)目經(jīng)理&技術(shù)負(fù)責(zé)人對(duì)接需求

項(xiàng)目經(jīng)理對(duì)接上這些需求,第一個(gè)工作是細(xì)化需求,將這些翻譯成技術(shù)能更好理解地語言,搭配著原型圖或設(shè)計(jì)稿來召開技術(shù)會(huì)議,統(tǒng)一講解新項(xiàng)目的需求。

15

細(xì)化需求

第五步:技術(shù)方案 & 架構(gòu)設(shè)計(jì)

技術(shù)負(fù)責(zé)人在清楚了解整個(gè)項(xiàng)目的需求之后會(huì)開始構(gòu)思整個(gè)項(xiàng)目的技術(shù)方案,根據(jù)產(chǎn)品需求,提供易擴(kuò)展、可持續(xù)迭代的技術(shù)框架方案。

16

整個(gè)項(xiàng)目的技術(shù)方案

17

可持續(xù)迭代的技術(shù)框架方案

第六步:項(xiàng)目排期 & 任務(wù)分解

同時(shí),項(xiàng)目經(jīng)理在和研發(fā)團(tuán)隊(duì)溝通確認(rèn)后對(duì)項(xiàng)目進(jìn)行分解以及排期,以此來保證項(xiàng)目進(jìn)度和質(zhì)量。

18

項(xiàng)目管理

第七步:產(chǎn)品研發(fā)階段

這個(gè)階段就是各端技術(shù)按照排期規(guī)劃開始編碼,期間各種對(duì)接、調(diào)試以及撕逼。我不是程序猿,這塊就不多寫了,貼幾張他們技術(shù)wiki的截圖吧。

19

Wiki對(duì)接

20

Wiki對(duì)接

21

Paw 讓測(cè)試 API 變得輕松愉悅,可以構(gòu)建內(nèi)部和外部的資源。它可以在不同的環(huán)境下進(jìn)行測(cè)試,也可以引用來自其他請(qǐng)求響應(yīng)的數(shù)據(jù)。

PAW

它可以定義不同的環(huán)境,于是可以輕松地在開發(fā)、臨時(shí)和生產(chǎn)環(huán)境中進(jìn)行切換,而無需重新配置任何端點(diǎn)(endpoint)。并且還可以在一個(gè)請(qǐng)求的消息體中引用另一個(gè)請(qǐng)求中返回的值,這能夠節(jié)省大量時(shí)間。

第八步:交付測(cè)試階段

測(cè)試工程師基本全程跟進(jìn),從最早期對(duì)接完詳細(xì)產(chǎn)品需求之后就開始編寫測(cè)試用例

22

測(cè)試用例

然后配合項(xiàng)目各個(gè)里程碑節(jié)點(diǎn)進(jìn)行功能測(cè)試和性能測(cè)試,將問題按優(yōu)先級(jí)劃分統(tǒng)一反饋

23

測(cè)試過程

最后,按原計(jì)劃上線

以上均是理想情況下,一個(gè)App必經(jīng)的幾個(gè)階段的簡(jiǎn)潔步驟說明,具體執(zhí)行依然會(huì)根據(jù)需求穿插進(jìn)行。

不同的項(xiàng)目管理模式或許會(huì)有完全不同的流程步驟。但是專業(yè)性幾乎是保證產(chǎn)品質(zhì)量的唯一準(zhǔn)則。

 

作者:惲磊,風(fēng)澤科技有限公司運(yùn)營(yíng)總監(jiān),他帶領(lǐng)團(tuán)隊(duì)經(jīng)歷了產(chǎn)品從 0 到百萬用戶的全過程。相信他的經(jīng)驗(yàn)心得,能對(duì)各位有不一樣的啟發(fā)。

來源:微信公眾號(hào)【 fenzotech2014】

本文由 @惲磊 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 小姐姐,產(chǎn)品原型圖有清晰的嗎 ??

    來自廣東 回復(fù)
  2. ??????

    回復(fù)
  3. 感謝分享,這篇文章是我們上半年整理的,目前一些流程上有了進(jìn)一步的優(yōu)化,如果有機(jī)會(huì)的話,明年會(huì)再更新一篇!

    回復(fù)
  4. 這個(gè)產(chǎn)品從0到1花了多久啊,其中產(chǎn)品策劃的時(shí)間大概是多久?

    回復(fù)
  5. 密密麻麻的設(shè)計(jì)稿

    來自浙江 回復(fù)