Android iOS

蝦拍

專為 Facebook 直播銷售打造的收單工具,可在直播中透過競標拍賣、直購來銷售商品,並透過 Chatbot 自動引導買家結單,讓賣家得以順利賣貨並完成訂單的解決方案。

  • TImeline

    2018 - 2019

  • My Role

    Product Designer

  • Devices

    iOS, Android

Responsibilities

規劃流程、UI 設計、動效設計、使用者訪談、易用性測試

Background

在 Facebook 直播功能上線後,台灣出現商家透過直播進行競標、貼文賣商品的風潮,賣家在缺乏工具的情況下,直播必須準備碼表顯示倒數、全程緊盯留言、用文字訊息傳遞的方式來處理後續訂單的處理,不僅耗時也不易管理,且過程中需要跨多個工具協助工作,難以有效管理。

為此,我們想開發一個給社群直播賣家的收單工具來解決他們面臨的問題。

Design Process

Research

透過訪談幾位有在直播競標的台灣賣家,並以買家的身份實際參與直播,我們歸納出賣家在直播競標時的使用者旅程:

問題痛點
  1. 直播過程需要很多的人工處理,包括在留言中辨識哪些是出價留言、確認目前最高價並將此留言置頂,而在留言多的時候也容易漏掉,遇到重複出價的狀況小邊也要確認好第一個出價的買家是誰。
  2. 手寫紀錄訂單內容難以管理與追蹤,要花很多時間查找再一一回覆買家處理進度。
  3. 如沒有在當下處理回覆,就容易遇到買家事後不回應、棄單的狀況。
專案目標

讓賣家透過社群銷售做得更少、賣得更多:
減少賣家例行重複的動作,讓買賣方在直播銷售購買的體驗變得順暢,並加速賣家完成訂單的進程。

面臨的挑戰
  1. Facebook 無提供留言置頂的 API,須用別的方式即時更新競標、搶購最新資訊。
  2. 直播畫面到買家端時會有延遲的問題,要避免因為延遲而影響到拍賣公正性。

Solution

初版 Wireframe

我們依研究結果討論出初版設計,並以 Wireframe 進行使用者測試訪談,從中了解買家最優先的需求後,調整第一版功能與流程:

賣家使用蝦拍開播後可建立競標

直播中可建立競標活動,設定商品名稱、起標價與競標時間,競標資訊將會同步顯示於直播畫面上,讓直播主與觀眾都能看到所剩時間與目前最高價。

主播可以看到所有出價留言,並手動移除出價留言,以防有買家出錯金額或防止亂入。

系統也會自動傳訊到聊天室廣播競拍開始、結標時間線與競標結果的資訊,而在結標時也會顯示恭喜得標的動畫通知主播與觀眾。增加趣味與互動。

Chatbot 發送訊息引導買家於 Messenger 結帳

買家一旦得標,也會立即收到由系統發送的訊息,讓買家直接在 Messenger 結單,透過 Chatbot 一步步引導填入收件資訊,讓賣家可以透過訂單系統儘速獲取收件資訊與款項進行出貨,完成訂單。

Outcome

我們不改變買賣家同樣在 facebook 曝光商品與溝通的管道,簡化了賣家必要的訊息:

  • 直播中賣家或小編無需手動操作,買賣雙方就能透過直播畫面知道目前的最高出價、商品銷售狀況
  • 透過聊天機器人,讓買家在留言的當下就知道自己的留言已被處理,並引導得標者/訂購買家結帳,加速買賣進程,有效減少買家後續不易聯絡買家、造成棄單情況。

Full User Flow

產品在上線後持續透過訪談、測試進行迭代,在直播競標功能釋出後,後續也持續加入貼文留言導購、直播搶購、跑馬燈與抽獎等功能,並支援小編模式,讓多人作業也能使用服務,主播可以專心直播。

直播&貼文銷售收單

貼文與直播留言紀錄可在平台上瀏覽,除了偵測成功的留言自動轉單以外,賣家也可以查看其他留言,以手動的方式轉成訂單。

orders
訂單管理

訂單分成幾種狀態·:在 Chatbot 已加入購物車但尚未完成結帳時會歸類在潛在訂單,讓賣家有機會能跟買家溝通,提高成單率。

每張訂單會搭配目前訂單狀態變更可執行的動作,讓買賣家可以清楚知道目前處理進度,讓訂單順利完成。

小編模式

小編與主播幾乎都會在同一個場域協助直播,也會遇到賣家一人直播的情境。我們簡化邀請流程,無論是小編還是主播本人,只要透過另一個裝置進入同場直播,即可負責控場,管理銷售活動。


為了管理方便,小編的介面會更加利用裝置空間來呈現資料。

抽獎活動

銷售的同時也可以舉辦抽獎活動,建立後即會顯示跑馬燈,讓後續加入的觀眾也能參與抽獎。

主播/小編可在活動中隨時抽獎抽出幸運兒。抽出後 Chatbot 也會發送訊息到聊天室,並請幸運兒回覆訊息。

直播抽獎、貼文銷售流程

Paper Sketch & Mockup

wireframe

針對不同的需求,我會透過 Wireframe 與 PM 討論解決方案與流程,並與工程師確認技術可行性與評估工時,達成內部共識後會以此再發展成 Mockup。

mockup for testing

在設計高保真 Mockup 後,也會透過紙上 prototype 進行易用性測試與訪談,確認用戶對功能與畫面的理解,並以觀察結束來優化設計。

Design System

design system
Back