如何為電子商務創建用戶流

已發表: 2021-06-01

想像一下,您正在為您的在線商店建立一個新網站。 您進入 WordPress 之類的頁面構建器並開始向頁面添加部分,決定導航欄應該居中還是您的 About 剪輯應該放在首位。

或者,也許您已經有一個網站,並且您認為它可以看起來更好,所以您開始重新定位圖像、文本和 CTA。

無論如何,已經犯了錯誤:在這兩種情況下,都沒有策略或用戶流。 設計是隨意選擇的,像真正的傑克遜波洛克畫一樣飛濺。

不管他是否是波洛克的粉絲,他的畫作從來不需要從漏斗的一個階段引導到下一個階段。

在新的在線購物時代,擁有一個電子商務網站至關重要——一個應用程序,可能是有益的。

但是擁有一個漂亮的網站是不夠的,同樣吸引大量流量是一種浪費,除非它轉化(即購買您的產品)。 您需要一個旨在引導您的潛在客戶實現轉化的網站。

一個精心設計的網站不是從選擇你最喜歡的字體和動畫開始的。 它從映射您的用戶流開始。

什麼是用戶流程圖?

用戶流程圖(也稱為用戶流程圖、任務流程圖和用戶界面流程圖)展示了用戶通過您的網站或應用程序完成目標或任務的路徑。 通過說明用戶在完成任務(如購買產品)之前從一頁流到下一頁所採取的步驟,您可以了解如何鼓勵任務完成。

用戶流程圖示例
來自 UX Collective 的示例用戶流程圖。

用戶流在 UX 設計中的作用

用戶體驗設計(UX 設計)是關於創建以用戶為中心的設計。 通過將您的用戶(即潛在客戶)置於您的設計選擇的中心,您可以增強他們的體驗並增加他們導航到銷售結束的機會。

用戶流揭示了用戶如何與您的產品設計進行交互,同時考慮到創建轉換所需的用戶操作和產品功能。

在開始設計過程之前創建用戶流程圖以告知您的網站需求。 策略師、設計師和 Web 開發人員使用 UX 流程來發現產品缺陷並了解項目的範圍,包括頁面數量、每個組件的組件以及所有項目的信息架構。

您還可以在網站開發後創建用戶流,以發現需要簡化和改進的區域。

用戶任務流程圖示例 來自 Creately 的示例用戶流程圖。

高級與詳細的用戶流

高級用戶流程快速而簡短,旨在提供對想法或流程的快速概覽。

詳細的用戶流或任務流更有用,詳細說明了完成任務所涉及的所有步驟和決策。 詳細的流程圖是您要創建的內容,以告知您的電子商務網站的設計和內容。

一些將用戶流與任務流區分開來,因為用戶流強調用戶可以根據角色和入口點以不同的方式完成任務。

用戶流與用戶旅程

用戶流程不同於概述用戶對產品的端到端體驗的用戶旅程地圖。 在流程純粹基於操作的情況下,用戶旅程會考慮用戶情緒等因素。

用戶旅程地圖和客戶旅程地圖有時可以互換使用,但這僅在用戶和客戶是同一個人時才有效,但並非總是如此。 例如,雇主(客戶)可以購買在線工具供其員工(用戶)使用。

如何構建用戶流程圖

1. 確定圖表的用途

您的用戶流程圖包含的內容取決於您的目標和您正在跟踪的任務。 限制每個圖表的目標或任務數量; 最好一次只繪製一張圖表。 查看多個可能會使圖表過於復雜和擁擠,從而降低效率。

根據用戶流的用途,給用戶流一個清晰的標題,以供將來參考。

2. 了解你的典型用戶

了解您的用戶將有助於告知最有效的任務流導航以及要包含在每個頁面上的內容。

進行用戶研究以收集用戶的:

  • 目標
  • 動機
  • 所需功能
  • 經驗/知識水平
  • 障礙

這些因素可能會隨著購買過程中的不同受眾群體和階段而改變,但您將使用它們來確定每個網頁上的內容、如何設計每個頁面以及鏈接到哪裡。

用戶和業務目標應該保持一致,以便您可以設計同時滿足兩者的電子商務網站流程。

研究競爭對手的流程也可以提供洞察力。

3. 創建任務流鍵

只要您保持一致並為使用的顏色和形狀提供一個關鍵,以便其他人可以理解它,您的任務流程圖應該是什麼樣子沒有硬性規則。

常見的用戶流符號包括:

用戶流符號鍵

有時使用的其他形狀包括三角形、傾斜的平行四邊形和虛線形狀(而不是實心輪廓)。 您可以隨心所欲地獲得特定的形狀,為系統任務、輸入元素或選擇/點擊等其他項目切換形狀。

使用的任何顏色都應有助於用戶流程圖的含義和可讀性。 考慮顏色如何幫助對物品進行分組、識別元素和揭示圖案。

其他類型的用戶流程圖

由於用戶流程圖對您的網站來說是獨一無二的,因此並非所有人都遵循使用形狀和顏色的常見做法。

另一種用戶流風格是根據計算機科學中使用的狀態圖建模的。 狀態圖的外觀各不相同,但您可以將它們寫成一系列帶有箭頭的分數來指導電子商務流程。 分數包括用戶在分數線上方看到的內容以及用戶在其下方執行的操作,如下所示:

其他類型的用戶流程圖

還有一些以站點地圖為模型的用戶流。 除了採取的行動之外,他們還為用戶流程中涉及的每個網頁提供了這些頁面上所有部分和子部分的列表。 然後,箭頭或線條顯示哪些頁面部分和 CTA 將用戶引導至流程的下一步。

電子商務用戶流示例
來自 Behance 上 Salinthip Kaewkerd 的用戶流程示例。

4. 概述您的用戶流程圖

確定格式後,您可以開始繪製任務流程。 從為您的特定圖表選擇的入口點開始,並列出入口點和任務完成之間的所有步驟。

入口點可以是引導用戶訪問您網站的任何來源,包括廣告、社交媒體、自然搜索結果、外部鏈接、電子郵件活動等。 應用程序的入口點往往比網站少。

接下來的步驟(用戶界面流程圖的核心)將取決於您選擇映射的任務。 它們可能包括登錄和註冊表單、產品瀏覽、結帳流程或入職等項目。 考慮用戶如何訪問每個頁面、他們可能在該頁面上執行的所有操作以及他們從該頁面到哪裡去朝著他們的目標前進。

用戶流程的最後一步不應該是完成任務的用戶操作,而是確認用戶完成的功能。

如果您正在升級當前的電子商務網站,您可以使用 Google Analytics(分析)行為流報告來了解您的用戶來自哪裡、他們如何瀏覽您的網站以及他們從哪裡退出。

在映射用戶流時,您會注意到用戶可以採用多種路徑來完成一項任務。 分支或節點將在這些點斷開以繼續映射主要路徑。

創建流程圖時,您可以通過限制它們移動的方向數量來提高可讀性。如果最終箭頭指向各個方向,您的圖表開始看起來更像迷宮。 有許多用戶流程工具可用於創建功能圖。

5. 減少流量

一旦你創建了你的用戶流程圖,就該拿出你的剪刀了。 此步驟涉及三個重要的編輯:

  1. 刪除對可視化流程不重要的信息
  2. 將純用戶導航之外的詳細信息移至旅程地圖
  3. 識別多餘或不必要的步驟

最後一步不太用於可視化導航流程,而更多的是用於您正在改善其體驗的用戶。 用戶為完成一項任務必須採取的決定和行動越多,他們這樣做的可能性就越小。 盡可能簡化您的用戶流程,以增加轉化的機會。

6. 有意圖的標籤

清楚地標記用戶流程圖的所有元素。 應該清楚每個形狀、頁面、部分或操作所指的內容。 如果有損含義,請避免使用速記。 完成後,讓一些同事檢查您的用戶流,看看他們是否能解釋它們。

使用數據優化您的用戶流

在創建新網站或測試新設計或內容時,請考慮檢查現實生活中的用戶流,並將其與流程圖中描繪的期望進行比較。 如果出現差異,您可以使用它們來更正流程圖或編輯用戶界面本身以按照您計劃的方式引導用戶。 幾種 UX 研究方法測試用戶流程,包括可用性測試、任務分析和樹測試。

您還可以使用來自 Google Analytics 或研究的數據來查看可以優化用戶流以增加銷售額的地方。 在構建電子商務網站時,用戶流與電子商務銷售渠道相關聯。 用戶在他們進入的漏斗中越往下走是很自然的(因此是漏斗形狀),但劇烈的下落點表明有待改進的地方。

通常,改進意味著優化您的用戶流程,無論是通過使導航更自然、編輯設計還是添加定向副本。

業務選擇也可能導致流量下降:潛在買家看到運費後跳出率的增加表明高運費可能是問題所在。

分析跳出率的步驟,並假設問題(和解決方案)可能是什麼。 A/B 測試您的解決方案,直到用戶流失減少並且更多用戶流向下一步。

區分您的電子商務網站流程

電子商務流程圖往往遵循類似的模式:從外部發現頁面、進入頁面、查看產品、將產品添加到購物車、結帳、接收確認。

雖然這些都是電子商務本質上涉及的步驟,但在設計用戶流時,值得考慮您獨特的價值主張和受眾。

你能提供更多嗎? 您的用戶能否從附加功能中受益?

一些電子商務商店通過包括個性化測驗或試穿功能來混合用戶旅程和任務流。 例如,絲芙蘭的虛擬藝術家允許用戶在在家購買之前模擬他們的妝容。

電子商務中另一個在設計用戶流時經常被遺忘的差異化地方是售後。 確認客戶購買絕不是客戶旅程的結束。 現在他們必須追踪他們的包裹,焦急地等待它的到來,興奮地拆箱並可能將其退回。 值得考慮如何通過運輸、感謝頁面和追加銷售來改善用戶體驗。

在為電子商務網站和應用程序創建流程時,請記住電子商務渠道的所有階段:

  • 考慮
  • 評估
  • 購買
  • 售後

通過高效的用戶體驗流程推動銷售

用戶體驗不僅僅是用戶喜歡看的漂亮設計。 它正在設計信息架​​構和內容,以引導潛在客戶完成電子商務的轉化之旅。

它是關於構建一個用戶可以輕鬆導航的網站或應用程序,從一個階段移動到下一個階段,找到他們正在尋找的產品並在時機成熟時單擊正確的 CTA。

在他們的入口點和銷售點之間塞進太多的步驟意味著要求他們做更多的工作; 太少的步驟可能不足以解決他們的猶豫,這意味著要求他們承擔更大的風險。 在網上購物時,沒有人喜歡工作或冒險。

為您網站上的每項任務繪製一個高效的用戶流程是發現消費者摩擦點的有效方法,因此您可以設計一種數字產品,提供更好的用戶體驗,從而推動銷售。