ibon雲端列印網

從使用者出發,打造數位新體驗

執行時間

2023.02 - 2023.08

專案類型

Web Design|RWD

專案角色

UI Designer、Research Observer

負責項目

UI Design、Design Guideline

專案背景&目標

背景現況

ibon 目前以「提升服務品質」為平台的核心目標。然而,他們觀察到近年用戶滿意度調查呈現逐年下滑趨勢,其中「雲端列印平台體驗不佳」為負面回饋來源之一,因此委托我們進行平台數位體驗的優化。

數據與洞察

經分析滿意度調查後,發現負面回饋集中於「雲端列印」與「卡片編輯」功能,而這兩項功能也是平台使用頻率最高的功能。也因此,我們認為核心功能的體驗不佳是導致整體滿意度下降的主因之一。

專案目標

聚焦優化「雲端列印」與「卡片編輯」的數位體驗,解決核心功能痛點,以點帶面提升平台整體的用戶滿意度。

專案成果&效益

SUS 量表分數優化後提升

+

0.00
0.00
0.00

%

成功取得後續專案合作

客戶對海棠信任度提升

為了避免作品集篇幅過長為了避免作品集篇幅過長
為了避免作品集篇幅過長為了避免作品集篇幅過長
為了避免作品集篇幅過長為了避免作品集篇幅過長
以下僅展示「雲端列印」的部份以下僅展示「雲端列印」的部份
以下僅展示「雲端列印」的部份以下僅展示「雲端列印」的部份
以下僅展示「雲端列印」的部份以下僅展示「雲端列印」的部份

使用者研究

透過易用性測試與深度訪談,挖掘真實使用者痛點

為了了解使用者在「雲端列印」與「卡片編輯」的使用者旅程中遭遇到的主要痛點,本次專案我們使用「易用性測試」的方式來了解雲端列印平台的現況,一方面能直觀對比用戶的「主觀意圖」與「實際操作行為」,另一方面則是在測試後能夠延伸收集用戶的深度回饋,獲取更多質化建議。

定義主要痛點

在測試與訪談完成後,我們將使用者回饋以及測試過程中的行為進行標籤化的收斂,藉此找出雲端列印功能的主要痛點。

主要痛點

1.

填寫個人資料引起使用者反感

使用者對於填寫個人資料感到排斥或覺得麻煩,並且將其視爲多餘的操作。

2.

檔案上傳限制容易被使用者忽略

雖然在頁面下方有明確寫出檔案上傳限制,但使用者們並不會特別去查看。

3.

使用者對於上傳流程並不滿意

所有使用者對於檔案上傳流程都提出了優化改善的建議,並且也分享了他們過去在上傳過程中失敗的經驗。

1.

填寫個人資料引起使用者反感

使用者對於填寫個人資料感到排斥或覺得麻煩,並且將其視爲多餘的操作。

2.

檔案上傳限制容易被使用者忽略

雖然在頁面下方有明確寫出檔案上傳限制,但使用者們並不會特別去查看。

3.

使用者對於上傳流程並不滿意

所有使用者對於檔案上傳流程都提出了優化改善的建議,並且也分享了他們過去在上傳過程中失敗的經驗。

接下來接下來
接下來接下來
接下來接下來
來看我們如何解決來看我們如何解決
來看我們如何解決來看我們如何解決
來看我們如何解決來看我們如何解決
  1. 填寫個人資料引起使用者反感

針對填寫個人資料引起使用者反感的問題,我們分析深度訪談的反饋後得出,原因主要來自於以下兩點:

• 使用者並「不清楚填寫 Email 以及 姓名 的用途是什麼」,導致他們對於為何需要填寫資料並不理解
• 使用者並「沒有預期檔案上傳列印會包含填寫資料,因此無法建立資料填寫與檔案上傳之間的關聯性」,將其視為多餘的阻礙

因此,我對資料填寫欄位進行了以下兩項的調整:

1

與客戶確認姓名欄位無實際用途後,透過移除欄位的方式避免多餘的操作步驟,藉此提升整體的任務流程效率

2

利用明確的欄位提示文字與詳細的用途說明,主動告知使用者搜集 Email 的用途,來消除他們的疑慮,降低他們對於填寫資料的反感

額外補充:原先我與UX討論共識是將 Email 以及 姓名 欄位一併移除,但基於客戶希望 Email 作為行銷用途,才選擇保留。

  1. 檔案上傳限制容易被使用者忽略

針對檔案上傳限制容易被使用者忽略的問題,我們從現有的檔案上傳頁面以及使用者的反饋判斷這個問題與資訊架構以及版面佈局有高度關聯性,因此對目前現有上傳頁面進行了易用性評估 ,總共歸納出以下三點問題可能是導致上傳限制容易被使用者忽略的原因:

• 「頁面結構缺乏規劃且資訊層級模糊不清」,使用者無法辨認資訊的主次以及重要程度
• 「上傳限制說明被排除在上傳操作的核心區域之外」,導致使用者無法建立有效的資訊關聯認知
• 「當前頁面必須同時處理檔案上傳與資料填寫的步驟」,導致使用者認知負荷過重

基於上述問題,我採用以下三項做法來對頁面進行調整:

1

建立資訊與操作區塊明確區分的頁面結構,並透過清楚明確的資訊層級,搭配 F 型瀏覽動線,提升頁面整體易讀性

2

利用接近性法則將關聯資訊群組化,幫助使用者建立有效的資訊關聯認知,並將上傳說明的位置放置在瀏覽動線上,針對重要資訊(如檔案大小、格式)進行 higlight 強調

3

將檔案上傳跟資料填寫步驟拆分為兩步驟,透過單一頁面專注單一任務的引導方式來降低使用者的認知負荷,讓使用者能專注在檔案上傳操作上

  1. 使用者對於上傳流程並不滿意

針對使用者對於上傳流程並不滿意的問題,我們選擇將原有流程重新還原進行檢視,並且同時也一併比對使用者出錯的環節,發現當前流程存在以下三點問題可能是導致使用者對於上傳流程並不滿意的原因:

• 「先填資料再上傳」的上傳流程與使用者的行為模式「先上傳再填資料」互相衝突
• 「資料格式錯誤後清除填寫資料跟檔案」的機制對使用者造成困擾
• 目前系統在「上傳後才會對資料進行驗證,導致使用者在提交後才能得知格式錯誤」,嚴重影響上傳效率

基於上述問題,我們對上傳流程進行了以下三項的調整:

1

改採符合使用者行為模式的先上傳後填資料的上傳流程,來避免使用者在任務執行過程中產生「預期外」的錯誤

2

移除錯誤時的自動清空機制,保留已填資料,讓使用者在出錯時無需重新填寫,提升上傳流程容錯率

3

將資料格式驗證由點擊上傳後才通知錯誤改為即時錯誤提示,讓使用者能夠即時修正格式錯誤,避免需要重複填寫的情況,提升上傳效率

最後,在以上解決方案完成 Prototype原型 之後,我們也隨即進行了易用性測試的後測,得到以下結果以及使用者的反饋:

Before

平均任務完成時間

0.00
0.00
0.00

S

Before

錯誤率

0.0
0.0
0.0

%

After

平均任務完成時間

0.00
0.00
0.00

S

After

錯誤率

0
0
0

%

User I:

「有種煥然一新的感覺,而且用起來不會覺得卡卡的。」

User H:

「我覺得新版的介面很清楚,然後很乾淨,而且上傳後還能看得到我上傳的格式誒,還蠻不錯。」

User M:

「新版的介面還蠻簡單的,而且稍微看一下就知道下一步要做什麼動作。」

User I:

「有種煥然一新的感覺,而且用起來不會覺得卡卡的。」

User H:

「我覺得新版的介面很清楚,然後很乾淨,而且上傳後還能看得到我上傳的格式誒,還蠻不錯。」

User M:

「新版的介面還蠻簡單的,而且稍微看一下就知道下一步要做什麼動作。」

從以上數據可以得知,優化後的平均任務完成時間顯著下降,錯誤率也從原本的 83.3% 降低到 0%,並且使用者對於優化後的版本皆給予正向反饋,在測試過程中沒有遭遇到任何錯誤。由此可見,我們提出的解決方案已被驗證具備落地執行的價值。

原型展示

Design Guideline

Design Guideline

專案目標驗證

在平台全面優化完成後,我們也透過 SUS 量表進行成效驗證。分數由原先低於平均的 62 分,大幅提升至 80 分的優良水準,順利達成預期的專案目標。

Before

SUS量表分數

0
0
0

After

SUS量表分數

0
0
0

專案總結|接續合作 🎉

在專案上線後,「客戶反饋成效超乎他們的預期,所以決定與我們繼續合作其他專案!」。然而,在過程中,由於專案時程的限制,前端實現的部份細節和精緻度我認為尚未達到品質標準。儘管最終產品滿足了基本需求並得到客戶的認可,但在體驗方面仍有許多可以優化的空間。透過這個專案,我也深刻體會到「以人為本」的設計是如何落地的。我們從早期的研究出發,將蒐集到的用戶痛點轉化為具體的設計方案。在這個過程中,不僅磨練了我的設計邏輯與決策精準度,也讓最終的落地成果不只是美觀的介面,而是能確切解決實際問題、有跡可循的使用者體驗。