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

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

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

一、搭建好文件目錄

1）文檔修改記錄

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

2）原型說明

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

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

3）流程

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

4）原型

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

二、畫好原型并做好注釋

1. 分模塊

頁面可以按照功能分成幾個模塊。

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

當然每個人也可以有自己的劃分思路和想法。

2. 做好注釋

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

1）信息元素描述

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

2）規(guī)則

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

3）狀態(tài)

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

4）異常情況

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

三、不遺漏異常情況

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

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

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

tips： 推薦幾個原型的組件庫：

1、Ant Design 螞蟻設計 ：https://link.zhihu.com/?target=https%3A//ant.design/docs/resources-cn（包括移動端、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