作為用戶體驗的實踐者，我們經(jīng)常被潛在客戶和其他設(shè)計師問到類似的問題:

“在設(shè)計項目結(jié)束時，你會提供什么可交付成果？”

“這對我們的開發(fā)團隊來說是否足夠執(zhí)行？”

“我們的設(shè)計團隊是否能夠維護你的設(shè)計？”

“在未來添加新功能有多難?"

等等...

為了解決所有這些問題，并為設(shè)計過程提供一些線索，這里簡要描述每個交付品及其目的。

什么是 UX 可交付？

讓我們從最基本的開始ーー什么是可交付的？ 簡單地說，用戶體驗可交付物是一個包含設(shè)計思維以及研究結(jié)果的設(shè)計文檔，并為設(shè)計和開發(fā)團隊提供指導(dǎo)。 不管是哪個行業(yè)或平臺，不管是小型初創(chuàng)企業(yè)還是全球性企業(yè)，一個標準的用戶體驗設(shè)計項目的可交付成果清單或多或少是相同的，主要取決于產(chǎn)品需求、預(yù)算和時間表。

這份清單通常包括以下文件:

研究階段

* 用戶調(diào)研文檔

* 用戶界面/用戶體驗研究文檔

用戶體驗設(shè)計階段

* 信息架構(gòu)思維導(dǎo)圖

* 用戶流程文件

* 線框圖

* 交互式原型

* 用戶測試報告

界面設(shè)計階段

* 視覺設(shè)計原型

* 用戶界面動畫

* 設(shè)計系統(tǒng)

* 設(shè)計規(guī)范

下面我們來詳細來看一下每一個問題：

用戶調(diào)研文檔

用戶研究是任何項目不可分割的一部分。 通過利用各種方法，例如個人訪談、實地研究和在線調(diào)查，我們獲得了關(guān)于客戶需求、情感、行為和動機的額外洞察力。 除了采訪用戶，我們也進行其他方法分析，如卡片分類，思維導(dǎo)圖，協(xié)作線框，等等。 這些訪談和方法的結(jié)果被整合在一份研究文件中，其中包括主要的發(fā)現(xiàn)、人物角色和高層次的建議。 本文檔幫助我們獲得關(guān)鍵利益相關(guān)者對用戶目標和期望特性的認可。?

除了最后的調(diào)研文檔，我們還提供了所有的原始材料，包括用戶研究計劃、帶有結(jié)果矩陣的電子表格、音頻或視頻記錄、訪談中的筆記等等。

用戶界面 / 用戶體驗研究文檔

競品分析是一個很有價值的研究方法，它可以幫助我們找出競爭對手的優(yōu)勢和劣勢。 通常，我們挑選5-7個最具吸引力的直接競爭對手，并評估他們的解決方案，以解決我們在用戶研究和項目發(fā)現(xiàn)過程中發(fā)現(xiàn)的問題。 我們還注意到它們使用的術(shù)語，以確保我們的解決方案利用了行業(yè)標準語言和命名約定。

?

但是我們并沒有止步于此，也沒有將我們的研究擴展到與項目沒有直接關(guān)系的產(chǎn)品上。 畢竟，最終用戶體驗更加多樣化，而不僅僅局限于單一產(chǎn)品。 在研究階段，我們可能會關(guān)注諸如導(dǎo)航、使用體驗、最常見的工作流和設(shè)計模式、使用的可視化類型等等。 因此，我們創(chuàng)建了一個最終的研究文檔，其中包含了主要的調(diào)查結(jié)果，并作為指導(dǎo)和支持我們的設(shè)計決策的手冊在整個項目中使用。

信息架構(gòu)思維導(dǎo)圖

一旦主要的研究階段完成，我們使用所有收集到的數(shù)據(jù)為未來的產(chǎn)品建立一個信息架構(gòu)，或者修改現(xiàn)有的架構(gòu)以更好地適應(yīng)用戶的需求和工作流程。 它通常是以一種思維導(dǎo)圖的形式創(chuàng)建的，這種思維導(dǎo)圖可以鳥瞰整個系統(tǒng)，并顯示各個部分之間的關(guān)系。 事實證明，當與利益相關(guān)者合作時，這種思維導(dǎo)圖練習(xí)是非常有效的。 通過可視化整個項目結(jié)構(gòu)，可以更容易地理解范圍和定義特性優(yōu)先級。

思維導(dǎo)圖幫助我們更準確地規(guī)劃設(shè)計工作，以有效和可持續(xù)的方式組織內(nèi)容，并創(chuàng)建一個更深思熟慮的導(dǎo)航。 多年來，我們嘗試了很多在線和離線工具來創(chuàng)建思維導(dǎo)圖，最終以 MindNode 作為我們的首選工具而告終。

用戶流程文件

用戶流程是一系列用戶操作或系統(tǒng)狀態(tài)，用戶需要通過這些操作或系統(tǒng)狀態(tài)來實現(xiàn)一個有意義的目標。 我們創(chuàng)建了一個設(shè)計規(guī)范格式，它將屏幕布局設(shè)計與用戶和系統(tǒng)交互的流程圖樣的表示分解為簡單的場景。 本文檔的主要目標是為開發(fā)人員提供所有可能的用戶流的詳細描述，包括邊緣案例、錯誤和各種狀態(tài)。

它是一個迭代的文檔---- 在項目的整個生命周期中，我們不斷地更新它。 這一切都是從空白的模版和箭頭開始的，它們勾勒出核心工作流。

一旦我們有了初始的線框圖，我們就把它們添加到文檔中，一旦視覺設(shè)計生產(chǎn)階段開始，我們就用最終的視覺效果替換它們。

這個過程使我們能夠更有效地迭代用戶流程，根據(jù)文檔的完整性不斷監(jiān)控項目的進度，并在早期識別任何令人沮喪或混亂的點。

線框圖

線框圖本質(zhì)上是一個網(wǎng)站或應(yīng)用程序的框架。 它們被設(shè)計用于固化項目需求并定義主要的布局、用戶體驗工作流和內(nèi)容。 它們很容易創(chuàng)建和維護，允許我們快速迭代各種想法，獲取利益相關(guān)者和最終用戶的反饋。

在設(shè)計界有一個永無止境的爭論，是否應(yīng)該創(chuàng)建低保真度或高保真度的線框圖。 雙方都有自己的論點，但我們更傾向于后者。 根據(jù)我們的經(jīng)驗，利益相關(guān)者和用戶傾向于更好地理解他們。 我們不需要解釋"這個灰色模塊以后會被復(fù)制取代"，當線框圖更加詳細，看起來更像是一個成品而不是一個草圖時，許多問題就自己解決了。

然而，在用戶體驗階段的開始，當我們剛剛開始整體布局和導(dǎo)航時，低保真度的線框圖被證明是更有效的。 我們可以快速生成一組選項來與客戶討論，一旦我們同意某個解決方案，我們就轉(zhuǎn)向高保真的線框圖，這需要更多的時間來創(chuàng)建，但從長遠來看對項目更有利。

交互式原型

一張照片勝過千言萬語。 一個交互式原型的價值是它的10倍。 我們創(chuàng)建交互式原型作為線框圖和視覺設(shè)計過程的一部分。 它們幫助我們識別設(shè)計中的弱點，在內(nèi)部迭代設(shè)計，驗證假設(shè)，測試假設(shè)。 通常情況下，我們會使用像 InVision 這樣的簡單工具。 它提供了全方位的功能來進行用戶測試，向客戶展示我們的工作，或者收集涉眾的反饋。 當我們想要測試一個更復(fù)雜的交互或者工作流時，我們可以使用類似于 Framer 的東西或者直接用 html / css 創(chuàng)建原型。

使用 InVision 制作的交互式原型。 參見完整版本的 https://invis.io/j7s72jy8z4e

用戶測試報告

在進行設(shè)計項目時，在設(shè)計過程中停下來驗證假設(shè)和設(shè)計決策總是很有用的。 其中一站是可用性測試。 在交互式原型的幫助下(使用線框圖或最終視圖創(chuàng)建) ，我們進行了一系列的用戶測試會話。 作為這個練習(xí)的結(jié)果，我們創(chuàng)建了一個用戶測試報告，其中包含對我們的發(fā)現(xiàn)的總結(jié)和對下一步的建議。 它還通過概述總體測試目標、設(shè)置和參與者人口統(tǒng)計特征為測試提供背景。 我們還分享音頻和視頻錄音以及其他輔助材料。

視覺設(shè)計原型

隨著我們最終確定核心特性的線框圖和工作流程，我們開始在項目的視覺方面工作。 無論是使用品牌指南(如果提供的話) ，還是從頭開始設(shè)計風(fēng)格，我們總是從視覺探索開始。 我們創(chuàng)造了一套視覺設(shè)計理念伴隨著情緒板，以說明我們的愿景，未來的風(fēng)格的產(chǎn)品。

一旦我們同意了進入開發(fā)階段的方向ーー對所有需要的頁面應(yīng)用樣式，并創(chuàng)建所有必要的規(guī)范，這樣開發(fā)人員就可以開始從事他們這一邊的項目。

用戶界面動畫

作為生產(chǎn)階段的一部分，我們還提供了短視頻剪輯，展示了主要的用戶界面交互和動畫，為用戶體驗增加了愉快的時刻，并引導(dǎo)用戶沿著這條路走下去。 然后，開發(fā)人員將視頻和動畫規(guī)范用作將這些交互實現(xiàn)到最終產(chǎn)品的指南。

設(shè)計系統(tǒng)

設(shè)計系統(tǒng)是一套設(shè)計說明文件，為客戶的內(nèi)部設(shè)計團隊或第三方機構(gòu)提供強大的工具包。

風(fēng)格指南形式化的關(guān)鍵設(shè)計原則，描述視覺識別，并設(shè)置排版，顏色，響應(yīng)行為，產(chǎn)品照片和可視化風(fēng)格的基本規(guī)則。

組件庫是不同狀態(tài)的 UI 元素的集合。 它以草圖文件或任何其他由項目需求設(shè)置的軟件的形式出現(xiàn)。

用戶體驗指南文檔提供了關(guān)于導(dǎo)航的建議，描述了使用的用戶體驗設(shè)計模式，以及如何使用組件庫應(yīng)用它們。

設(shè)計系統(tǒng)幫助維護產(chǎn)品的設(shè)計和體驗的一致性，并被用作創(chuàng)建新頁面和添加新功能的構(gòu)建塊。

設(shè)計規(guī)范

當涉及到開發(fā)時，確保設(shè)計按預(yù)期的方式實現(xiàn)總是很重要的。 通常情況下，開發(fā)者自愿或不情愿地忽略一些看起來不是很重要的小事情，但是設(shè)計和實現(xiàn)之間的這些小差異會產(chǎn)生滾雪球效應(yīng)，最終可能會極大地影響最終的用戶體驗。

在過去，我們的團隊會提供一個詳細的、靜態(tài)的 PDF 文檔，其中描述了所有 UI 元素的度量、邊距、填充等。 由于在整個項目中不斷進行設(shè)計更新，這個文檔的制作非常耗時，而且很難維護。 開發(fā)人員經(jīng)常抱怨很難快速找到所需的信息并在文檔中進行導(dǎo)航。

為了解決這些問題，我們決定轉(zhuǎn)向在線解決方案ーー zeblin.io。 我們現(xiàn)在有了一個多功能的交互式工具，為開發(fā)人員提供了一種方便的方式，在他們需要的時候得到他們需要的東西。 除了大小和頁邊距，Zeplin 還提供代碼片段，允許快速將資產(chǎn)導(dǎo)出到 PNG 或 SVG 格式，擁有評論系統(tǒng)來支持開發(fā)和設(shè)計團隊之間的交流，并且在整個項目中易于維護。

總結(jié)

創(chuàng)建這些資產(chǎn)的過程并不總是線性的，并且取決于項目的優(yōu)先級和進度。 文檔的某些部分可以并行完成，某些部分可以比其他部分更早開始。 在項目結(jié)束時，我們通過共享 Google Drive 或 Dropbox 文件夾提供所有最終可交付成果。 我們還將所有在 Zeplin 和 InVision 創(chuàng)建的項目的所有權(quán)轉(zhuǎn)讓給客戶。

一切完成后，我們可以通過提供設(shè)計支持來繼續(xù)我們的合作伙伴關(guān)系。 這可能類似于監(jiān)控開發(fā)以確保一切都得到正確實施，充當內(nèi)部設(shè)計團隊并提供不斷的設(shè)計更新，或者組織與客戶團隊的研討會以教育他們關(guān)于新的設(shè)計系統(tǒng)。

作者：Alex Khmelevsky

原文鏈接： https://clay.global/news/ux-design-agency-deliverables/?ref=heydesigner