交互設(shè)計(jì)文檔，也叫 DRD，是交互設(shè)計(jì)師將抽象的產(chǎn)品需求，轉(zhuǎn)化為具體的界面方案、展示頁(yè)面細(xì)節(jié)的說(shuō)明文檔。一個(gè)好的 DRD 不僅能幫助團(tuán)隊(duì)了解需求背景、設(shè)計(jì)方案等，還能極大提升交互或產(chǎn)品經(jīng)理的專(zhuān)業(yè)性。

所以老和這次為各位提供一個(gè)「超強(qiáng)交互設(shè)計(jì)文檔」參考，幾乎涵蓋了整個(gè)需求/項(xiàng)目過(guò)程，幫助你在面試或者工作輸出時(shí)有一個(gè)好幫手。大致目錄如下：

文檔說(shuō)明

1. 封面

大概繪制一下文檔簡(jiǎn)介，好讓同事打開(kāi)后 知道是 xxx 項(xiàng)目的交互文檔。

2. 圖例說(shuō)明

讓瀏覽者對(duì)文檔的介紹模式/細(xì)節(jié) 有一個(gè)大概的總覽，特別是新手接入時(shí)，能知道你列這些圖例是什么意思。

包括：頁(yè)面跳轉(zhuǎn)圖例、標(biāo)簽圖例、流程圖圖例、操作手勢(shì)圖例等等

3. 更新日志

記錄每次修改的頁(yè)面和地址，并做好頁(yè)面鏈接。并建議有最新修改的地方打上 "新"的標(biāo)志，方便同事感知是哪個(gè)頁(yè)面。

項(xiàng)目說(shuō)明

1. 項(xiàng)目簡(jiǎn)介

大致寫(xiě)下項(xiàng)目背景，我們?yōu)槭裁匆M(jìn)行此次設(shè)計(jì)。以及簡(jiǎn)單說(shuō)下項(xiàng)目范圍：要實(shí)現(xiàn)哪些功能或優(yōu)化點(diǎn)，甚至是下一版本的規(guī)劃與發(fā)展。

2. 項(xiàng)目進(jìn)度

加分項(xiàng)：自己記錄或找產(chǎn)品/項(xiàng)目經(jīng)理了解當(dāng)前的項(xiàng)目進(jìn)度。在工時(shí)計(jì)算、人力安排等給予更直觀的完成度和進(jìn)展概覽。如某一周里進(jìn)行了哪些事項(xiàng)，如果有重點(diǎn)會(huì)議內(nèi)容也可同步上去。

3. 評(píng)審記錄

這個(gè)也是加分項(xiàng)：可記錄一下每次評(píng)審的進(jìn)程與重點(diǎn)內(nèi)容，再附上重點(diǎn)參會(huì)人員，進(jìn)一步提升的項(xiàng)目的了解和熟悉程度。包括：產(chǎn)品/設(shè)計(jì) 組內(nèi)評(píng)審、多方參與等情況

需求解析過(guò)程

1. 用戶(hù)調(diào)研

若有涉及到相關(guān)數(shù)據(jù)、結(jié)論可以展示出來(lái)（調(diào)研/競(jìng)品/線上等），以提供更強(qiáng)有力的數(shù)據(jù)證明。

2. 需求分析

基于項(xiàng)目、用戶(hù)、設(shè)計(jì)這 3 個(gè)維度梳理出詳情分析過(guò)程。

A. 項(xiàng)目

項(xiàng)目目的：為某些人提供某種產(chǎn)品或服務(wù)，從而獲取某種價(jià)值。

項(xiàng)目目標(biāo)：預(yù)期可衡量?jī)r(jià)值的指標(biāo)，多為產(chǎn)品數(shù)據(jù)的反饋，如轉(zhuǎn)化率。

B. 用戶(hù)

用戶(hù)類(lèi)型：包括用戶(hù)類(lèi)型、基礎(chǔ)信息、特征信息。

用戶(hù)痛點(diǎn)：包括行為訴求點(diǎn)、操作動(dòng)機(jī)、阻礙點(diǎn)。

用戶(hù)場(chǎng)景：包括場(chǎng)景類(lèi)型、場(chǎng)景描述。

C. 設(shè)計(jì)

設(shè)計(jì)目標(biāo)：如統(tǒng)一操作認(rèn)知、縮短交互流程等方案概括。

設(shè)計(jì)方案：如可復(fù)用平臺(tái)組件、或運(yùn)用 xx 達(dá)到 xx 效果。

如果有涉及到其他方面的條件或限制，如時(shí)間/人力資源、業(yè)務(wù)限制、技術(shù)限制等，也可附加說(shuō)明出來(lái)。

頁(yè)面交互方案

1. 任務(wù)流程圖

基于需求分析后發(fā)設(shè)計(jì)方案，梳理其中所涉及到的流程節(jié)點(diǎn)。特別是關(guān)聯(lián)不同用戶(hù)角色、場(chǎng)景下的梳理。

2. 頁(yè)面流程圖

待頁(yè)面設(shè)計(jì)完成，可根據(jù)需要/團(tuán)隊(duì)習(xí)慣，決定是否輸出一份整體頁(yè)面的流程預(yù)覽縮略圖（ 只針對(duì)核心/重點(diǎn)流程），以便整體感知整個(gè)頁(yè)面流轉(zhuǎn)走向。

3. 信息架構(gòu)圖

梳理設(shè)計(jì)方案下所涉及到功能模塊、層級(jí)，有利于理解不同功能模塊之間的關(guān)聯(lián)性。

4. 交互原型

這個(gè)好理解，基于任務(wù)流程、信息架構(gòu)下設(shè)計(jì)相關(guān)頁(yè)面方案，注意區(qū)分層級(jí)即可。

全局通用說(shuō)明

這一 part 主要展示整個(gè)交互原型中所涉及到共性?xún)?nèi)容 or 補(bǔ)充說(shuō)明，以便有一個(gè)整個(gè)認(rèn)知或方便調(diào)取。如：

用戶(hù)權(quán)限說(shuō)明，展示不同用戶(hù)角色下的功能

時(shí)間/數(shù)據(jù)格式說(shuō)明，整理整個(gè)方案中所設(shè)計(jì)到的字段格式

復(fù)用頁(yè)面匯總，包括頁(yè)面、組件等

常用組件匯總：如一些按鈕/列表/導(dǎo)航欄等控件的整合

其他特殊說(shuō)明，如 AndROId 上的區(qū)別點(diǎn)需要強(qiáng)調(diào)一下的。

飛機(jī)稿，集中存放被 pass 的方案，以便后續(xù)可回溯、再次調(diào)用。

好了，以上就是交互文檔的一些內(nèi)容點(diǎn)，不一定全部都要嵌用，根據(jù)自己實(shí)際需要靈活參考合適的內(nèi)容即可。

作者：和出此嚴(yán)