UX術語詳解:任務流,用戶流,流程圖以及其它全新術語

如下內容由Mockplus(摹客)團隊翻譯整理,僅供學習交流,Mockplus是更快更簡單的原型設計工具app

 

用戶體驗擁有一長串專業的術語和可交付內容。當在線查看UX相關職位描述時,所羅列的這類術語更是全面繁多。並且,隨着時間的流逝和它們自身的不斷演變,其中很大一部分甚至出現了定義上的重複和交疊。因此,爲方便設計師,Web/app開發者以及用戶等更加簡單的理解這些術語和可交付內容,我認爲是時候該從新整理和定義它們了。工具

打破它佈局

任務流和用戶流是多年來常聽到的用戶體驗術語。雖然我嘗試經過Google搜索等方式搜尋其「官方」權威定義,但結果倒是,現存的不少UX術語表並未集中過定義它們。學習

儘管如此,不管如何,這類「流」都是在描述Web或軟件的「運動」狀況。設計師須要考慮如何設計和引導用戶瀏覽一個網站或軟件。建立這類網頁或軟件「流」可以幫助設計師思考和預估用戶在瀏覽一個頁面以前或以後可能發生的狀況,並集中處理其中重要的部分。並且,此外,做爲建立可運行原型的第一步,這類「流」的設計也可以幫助開發人員瞭解,軟件或網頁在交替狀態下是如何運做的。優化

流程圖網站

流程圖是一張展現一個複雜系統或活動中人或物動做或行爲的順序圖。而,應用到軟件或Web設計中,則表示一張展現用戶一系列頁面活動或行爲的順序圖。ui

任務流與用戶流.net

任務流和用戶流並不是徹底不一樣。由於它們目的都是爲了以最小的阻力,幫助用戶完成某項任務。它們都可以幫助你在設計開發具體軟件或網頁功能以前,深思熟慮一些設計問題。若是你但願可以更簡單具體地區分它們,也能夠如此定義它們:插件

任務流翻譯

任務流是全部用戶爲實現某特定操做所完成的單一流程,全部用戶所經歷流程都是類似的,好比網頁或軟件註冊。任務流是一條單一的流程,毫無分支。

用戶流

用戶流則是用戶所遵循的軟件或網頁執行路徑。能夠視做是用戶在瀏覽軟件或網頁所經歷的一個個迷你旅程。用戶流不必定是線性的,還能夠有分支。經過定義或設計軟件或網頁路徑,你可以發現其中可能的轉變點和提高點,從而優化用戶體驗。

用戶流能夠很是簡單,僅用以幫助設計網頁或軟件的「紅色路徑」——即網頁或軟件主路徑。當涉及和添加更多相關條件和要求時,用戶流也能夠變得極其的複雜。總之,在開發產品以前,用戶流能夠幫助設計師和開發人員有效地分解複雜的流程,從而加深理解,提高工做效率。

Morgan Brown曾經說過:

「用戶流設計能夠爲用戶和企業帶來更多實效。」

頁面流程圖

世界聞名的37 signals軟件公司曾對用戶流進行速記,並認爲它們存在如下不足:

*在設計過程當中,用戶流有時很難解釋並用以交流。

*繪製出流程細節,會很是費時。

*並且隨着界面設計的更迭變化,流程設計很快就不在適用。

雖然用戶流以及頁面流程圖之類「流」存在不足,你也能夠在實際的Web或軟件中嘗試使用它們。由於做爲一種Web或軟件設計的快速入門方式,它們可以在時間有限的狀況下,知足你的設計需求。

並且,隨着設計需求的不斷變化,爲方便設計師展現和交流其設計理念,一些原型工具,例如簡單快捷的Mockplus, 提供了專業的頁面流程圖功能。設計師一鍵點擊便可生成所需Web或軟件頁面流程圖,並根據設計須要設置其顏色,背景以及鏈接線,添加頁面備註以及導出爲圖片等。可以幫助設計師極大的提高設計和交流效率。

Wireflows

多年來,我經過建立流程圖來演示和交流Web或軟件中的交互設計。並且爲了囊括更多的設計情景,這些流程圖已演變成包含線框圖的「流」設計。而全球知名的用戶體驗研究機構Nielsen Norman Group最近提出了一個全新的術語「Wireflows」來描繪此類用戶體驗的可交付內容。

Nielsen Norman Group這樣定義Wireflows:

Wireflows是一種結合了線框圖風格的頁面佈局格式,採用了一種簡化的流程圖來展現Web或軟件的各類交互設計。

只有線框圖是遠遠不夠的。由於線框圖經常僅僅展現Web或軟件的頁面佈局或靜態內容,並未包含任何動態交互。而流程圖則囊括了Web或軟件的交互細節,但卻忽略了可能發生的應用情景。而Wireflow則可以幫助設計師存儲複雜的交互設計,並展現這些交互設計中變化的內容和佈局。

Wireflow元素

*入口和出口

*步驟:例如用戶操做,系統操做以及替代路徑

*鏈接:指示所需的路徑和可能的不一樣流程

*決策點:用戶必須從兩個或多個選項中選擇。

總結

瞭解和預估這些「流」可能的應用場景,可以有效地優化設計體驗。以上所描述的任何「流」都可以幫助設計師更好的展現和交流各類設計理念,從而提升協做效率。

資源

如下是一些能夠加速UX工做流設計的資源,但願能對你有所幫助:

界面工具包資源

*FREEBIE — Flowchart kit for Sketch

——來自Greg Dlubacz設計師的流程圖工具包

這是一個精心製做的Sketch流程圖工具包,能夠幫助你輕鬆快捷的建立簡潔直觀的站點地圖。包含的全部元素,包括箭頭等,都是可編輯,可定製的。

*Flowchart Kit Sketch Resource

——來自 Arthur Guillermin Hazan設計師的流程圖工具包

這是一個展現了網頁界面之間交互設計的流程圖工具包。你可使用它輕鬆地爲你的界面添加箭頭以及圖標等元素,自定義你的界面,甚至在其幫助下建立更加精確的站點地圖。

*User Flow Diagram Template

——來自Jarosław Ceborski設計師的用戶流程圖模板

這個用戶用戶流程圖模板可以幫助你簡單地製做美觀吸睛的圖表。其中包含的全部方塊和箭頭都是便於直接使用的Sketch符號。

*13+ Productive UX Flowchart Templates

——來自Template.net網頁的UX流程圖

Sketch插件資源

*Sketch plugin — AEFlowchart

——來自Marko Tadic的AEFlowcharts插件

Sketch提供了多種可以幫助設計師常見Web或軟件流程圖的插件。而在簡單查看這些插件以後,小編髮現,AEFlowcharts是全部這些插件中最易用的。

做者:Naema Baskanderi

原文地址:https://uxplanet.org/ux-glossary-task-flows-user-flows-flowcharts-and-some-new-ish-stuff-2321044d837d

相關文章
相關標籤/搜索