重新設計 Louisa 點餐軟體,改善線上點餐體驗
專案背景
Louisa 在 2021 年時與「你訂」線上點餐平台合作,欲藉由線上點餐來向多元的客群提供更快速且個人化的點餐服務。透過統一的模板介面能更快速且低成本的完成系統建立,而這樣的介面卻不一定適合 Louisa 的顧客。因此我的目標便是希望透過重新設計 Louisa 點餐軟體,針對線上點餐的流程優化,進而提升顧客的線上點餐體驗
專案時程
我的角色
UI & UX 設計師
工作範圍
使用者訪談、wireframe & UI flow 設計、mock up
使用者研究
聚焦使用者流程中,造成阻礙的問題點
使用者旅程體驗斷點:
用戶想要看餐點必須先選擇門市
菜單上只有文字,瀏覽上較為費力
體驗洞察
❶. 首頁無法直接瀏覽餐點,必須先選擇門市
若用戶不確定所在的門市正確名稱,需要先花費許多心力,反覆確認門市的位置、門市區域才能知道門市名稱。甚至需要跳出軟體,自行上網搜尋
❷. 菜單不易辨識
Louisa 的品項眾多,菜單只有文字敘述,不便用戶快速瀏覽餐點
設計策略
專注協助使用者完成最重要任務,讓點餐流程更順利
加強產品選購引導
移除導致用戶跳出的資訊
降低用戶在流程前期的任務困難度,將複雜任務移到流程後期
提升餐點資訊的瀏覽體驗
提高餐點的辨識度減少記憶負擔
首頁重新設計
刪去非必要元素,突顯重要資訊,留給使用者簡潔的閱讀空間
使用者造訪的主要目的為訂餐,因此拿掉不必要的資訊。
根據十大易用性設計中的「減少使用者需要記憶的事情」,新增顯示用戶最近下單的品項以及推薦餐點,提示訊息能減少使用者記憶負擔。
減少原先使用者從首頁到菜單頁面的點擊次數,加快使用者的點餐流程。
菜單瀏覽體驗
提高餐點的辨識程度與資訊層級
一目瞭然的菜單頁面,提升使用者辨識產品的容易程度。
把其餘功能收入Top bar ,為減少與餐點不相關的訊息,去除不必要的資訊,突出重點的餐點訊息。並保留大塊的瀏覽空間。
結帳頁面設計
當只差一步就能完成點餐,用戶更傾向將流程完成
調整排版讓餐點明細與取餐門市一目瞭然,供使用者再次確認,減少錯誤的發生。
據十大易用性設計中的「減少使用者需要記憶的事情」,使用者不須自行選擇,系統會先自動填入了鄰近的門市,或是填入近期曾下訂單的門市,減少使用者的記憶負擔。
設計之後
反思與學習
⦿ UX 優化對象不只要考慮到顧客, 還有 Louisa coffee 的加盟主們
在實際使用點餐軟體時,我注意到菜單有些品項會因為不同的加盟店與直營店,所提供的餐點會有差異。因此未來若在菜單的介面設計勢必要為各門市考慮到足夠的可擴展性,來因應餐點的差異性並得以不斷推陳出新。
⦿ 思考分店間存在的多樣性與會員平台整合問題
在走訪各區 Louisa 分店後,我發現有些加盟店主甚至會透過第三方軟體來建立各自的會員制度,以此管理各自的常客。若與品牌方的制度衝突,這也容易讓顧客會在門市之間疑惑該使用哪些平台。因此未來若能深入了解各店家的會員制度,並進一步與目前直營門市的黑卡會員制度結合,相信能夠確實向每一位光臨 Louisa 的顧客推出更為個人化的線上點餐體驗,建立起品牌與體驗的一致性。
⦿ 以品牌方的角度思考,提升線上點餐體驗的好處
在重新設計的過程中,我也研究了其他競爭品牌; Cama cafe, Starbucks, 壹咖啡等。我認識到各品牌為因應不同的門市需求,也會將點餐軟體結合會員系統、虛擬錢包、限定優惠推播等功能,推出更個人化的使用體驗。透過點餐軟體,品牌方能夠引導用戶建立起固定的消費習慣,或協助門市進一步地管理顧客關係等。在設計過程中能同時以商業策略角度思考,理解使用者的同時也釐清各方需求,相信更能設計出真正協助用戶解決問題的設計方案。