怎么用原型寫需求文檔？這篇文章里，作者以小紅書APP為例做了相應(yīng)的步驟和案例分享，想了解的同學(xué)，不妨來看一下。

用原型寫需求文檔，最大的優(yōu)點(diǎn)就是簡潔直觀。

本文以小紅書APP為例，說說如何用原型寫需求文檔。

一、搭建好文件目錄

1）文檔修改記錄

記錄下每次修改，做好文件版本迭代記錄

2）原型說明

① 全局說明 將適用于全局的規(guī)則、交互等信息進(jìn)行前置說明，方便統(tǒng)一管理。

② 頁面結(jié)構(gòu) 理清各頁面之前的層級(jí)結(jié)構(gòu)，就像畫樹一樣，先畫出主干，再進(jìn)行分支的補(bǔ)充。

3）流程

梳理出流程，理清業(yè)務(wù)邏輯?？梢越Y(jié)合泳道圖說明在實(shí)際業(yè)務(wù)場(chǎng)景中各角色的任務(wù)職能。

4）原型

畫出產(chǎn)品的基本框架構(gòu)思。有哪些信息要素？信息的表現(xiàn)優(yōu)先級(jí)？等等。后面會(huì)詳細(xì)展開描述。

二、畫好原型并做好注釋

1. 分模塊

頁面可以按照功能分成幾個(gè)模塊。

小紅書的個(gè)人主頁頁面，我分成了基本信息、附屬信息、活躍信息三部分。

當(dāng)然每個(gè)人也可以有自己的劃分思路和想法。

2. 做好注釋

分好模塊之后，需要對(duì)每個(gè)模塊的具體信息進(jìn)行詳細(xì)說明。一般會(huì)有信息元素描述、規(guī)則、狀態(tài)、異常情況。

1）信息元素描述

• 可以從這幾個(gè)維度展開：數(shù)據(jù)、類型、操作、優(yōu)先級(jí)、數(shù)據(jù)來源、備注。
• 數(shù)據(jù)：將信息進(jìn)行結(jié)構(gòu)化梳理，羅列信息字段。
• 類型：信息有不同的表現(xiàn)形式，可以是圖片也可以是文本等等。
• 操作：進(jìn)行什么操作會(huì)產(chǎn)生什么樣的效果。
• 優(yōu)先級(jí)：有些信息需要高亮顯示，比如文本顯示為顯眼的紅色；有些文本需要加粗顯示；而有些就是正常顯示，這就代表著不同的信息會(huì)有不同的表現(xiàn)形式，也就代表了不同的表現(xiàn)優(yōu)先級(jí)。
• 數(shù)據(jù)來源：寫明數(shù)據(jù)從何而來。
• 備注：額外說明。

2）規(guī)則

即限制條件。比如：表格每頁最多顯示幾行，按鈕的多次點(diǎn)擊需要間隔多久等等。

3）狀態(tài)

區(qū)分狀態(tài)。舉個(gè)例子：文本鏈接有已點(diǎn)擊、未點(diǎn)擊、鼠標(biāo)懸浮幾個(gè)狀態(tài)，他們可以有不同的表現(xiàn)形式，已點(diǎn)擊鏈接顯示為藍(lán)色，未點(diǎn)擊顯示為黑色，懸浮出現(xiàn)說明文檔氣泡。

4）異常情況

除正常流程外的異常情況，也屬于功能的一部分。做好異常情況兼容，產(chǎn)品才會(huì)運(yùn)行地更穩(wěn)健，具有更好的容錯(cuò)性。

三、不遺漏異常情況

大家如果跟測(cè)試打過交道的話，應(yīng)該知道“冒煙測(cè)試”這個(gè)概念，在產(chǎn)品上線前回歸下主流程，避免大的缺陷。

一個(gè)產(chǎn)品需要涉及到很多邊界條件，也就會(huì)有很多的異常情況。比如文本輸入時(shí)超出了限制長度，多次點(diǎn)擊同一個(gè)按鈕，寫錯(cuò)了內(nèi)容想要撤銷修改等等，產(chǎn)品經(jīng)理需要盡可能多的聯(lián)想到會(huì)發(fā)生的各種情況并做好對(duì)應(yīng)處理。

拋開上帝視角，實(shí)實(shí)在在去體驗(yàn)一把產(chǎn)品，可能就會(huì)發(fā)現(xiàn)一些意想不到的場(chǎng)景和情況。

tips： 推薦幾個(gè)原型的組件庫：

1、Ant Design 螞蟻設(shè)計(jì) ：https://link.zhihu.com/?target=https%3A//ant.design/docs/resources-cn（包括移動(dòng)端、pc 端）

2、餓了么：https://element.eleme.cn/#/zh-CN/resource（pc端）

參考鏈接：

up主斯前想后來：https://www.bilibili.com/video/BV1264y1V7pp/?spm_id_from=333.999.0.0&vd_source=618ed4fde6a60aef6cf49edd31dc737a