給設計師和工程師的 Figma – Dev Mode 開發模式使用指南(下)
2023 年 8 月 21 日
想拿到完美設計稿？「合理修改與最適合設計」才是常態
2023 年 11 月 10 日
產品體驗不佳而留不住新用戶？UX 流程優化讓用戶離不開你！
「在設計稿後面，你不知道的那些事」系列文章編號 4
看著設計師最終交付的設計稿，品質不錯、內容ok、色彩排版也有達到要求，整體而言成果是滿意的。 但實在不懂為什麼設計師要做這麼久，才幾頁的設計稿，但每次的工時都比預估的還要長…
付給設計師的費用，到底都去哪了？
前言
在數位銀行還不普及的年代，普遍大家還小的時候，似乎會有一個爸媽幫忙開的帳戶（我的是中華郵政），長大後開始工作，就會配合公司開一個薪資戶（公司幫我開了華南銀行帳戶），如果還有投資需求，可能還會再開證券戶 (我自己又開了元大銀行戶頭)……
以上幾個帳戶，都必須臨櫃辦理。
突然有一天，有人跟我說使用手機就可以開戶囉！不用趕銀行的三點半、轉帳時不用特別找 ATM，查帳時不需要找銀行特地刷本子……
整個使用者習慣被改變了，趁著這波浪潮的台新銀行 ，主打線上開戶，且整個使用體驗簡單易懂又可愛，瞬間吸引無數年輕粉絲，且黏著度超大，成為2022年台灣市佔第一的數位帳戶。
UX 邏輯架構
其實台新銀行提供的服務本質，完全沒有改變，他們只是換了一個媒介、換了一個說明方式，然後換了一個更親民接地氣的風格，把生硬難懂的規章規則簡化再簡化，讓使用者在手機上就能簡單完成操作。
其實銀行的體系和制度這麼龐大，能夠全部塞到一個 App 裡嗎？當然不行！
所以取捨、簡化、制定優先順序，同時考慮使用者在短中長期，以及使用頻率高低的功能有哪些，逐漸制定出整個 App 的邏輯架構。
這個邏輯架構需要符合使用者的操作習慣，因此我們可以看到台新 Richart App 的 tab menu 包含「首頁、總覽、收付、明細、我的」。
台新把大眾最常使用的「收付和明細」拉出來，放在最主要的欄位中，而換匯、基金、保險等這些功能，則是收在另一個 menu 鍵裡。這樣的設計方式，就可以讓大部分的使用者，一登入就可以立刻轉帳和查帳，不用點個好幾個按鈕尋找想使用的功能。
這樣，就是一個好的 UX 邏輯設計。
至於架構到底怎麼樣才是對的？除了可以搜集舊用戶的使用習慣，也可以發問卷、進行訪談、與其他關係人討論等，獲得足夠的資訊後再進行研究與規劃。
當然，一般發案的案主，不太可能會需要設計開發一個銀行 App，所以可以參考我們之前分享的文章：專業 UIUX 的價值！UIUX 設計師幫你發揮網站和服務的最大效益
這篇文章的第一個主題是「用戶中心設計」，裡面就有提及 UX 設計師在設計的時候需要考慮的面向，包含了資訊架構以及其他設計重點。
UX 功能設計
MVP (最小可行性產品)
一個拍賣網站，基本功能應該需要包含：登入登出、上架商品、投標、棄標、重新出價、維護個人檔案、串金流。
輔助功能可能包含：商品篩選器、商品目錄、賣家評價、買家評價、Q&A、正品認證機制......
吸睛功能可能包含：賣家稱號、買家稱號、客製化排版、折價券、點數積分……
如果這個設計案需要從 0 開始，那麼 UX 設計師會協助案主把他提出的功能進行重要性劃分：
1. 哪些是一定要有的功能（沒有就無法讓使用者完成整個主要流程）
2. 哪些是有會更好的功能（讓使用者體驗更好）
3. 哪些是加分的功能 (有機會贏過競爭對手)。 不論是做什麼產品或服務，都必須先求有再求好。
若還不能順利下標，就已經在規劃點數積分可以換什麼獎品，可以說是完全的本末倒置。
認清目前的狀況、盤點現在有的資源、將資源投資在目前最重要的部分、設定短期里程碑、定期追蹤進度、隨時動態調整…… 這些都會是 UX 設計師的工作 (若團隊夠大，部分會由 PM 負責)。
這些工作內容和「設計稿的產出」沒有直接關係，但會算在開會、討論、寫文件等的工作時間裡面。
UX 持續優化
當產品的 MVP 釋出之後，就可以開始考慮增加優化的功能，例如加上商品篩選器。
有足夠經驗的 UX 設計師會在設計 MVP 的時候，就已經考慮到未來可能會要加入哪些新功能，所以在排版上就應該會先預留可以擴充功能的空間，例如之前就考慮到篩選功能，所以在標題的右側就已經預留空位，可以放入篩選器、加入我的最愛、加入書籤等等的功能。
另一方面，就算上架前已經檢查很多次，MVP 釋出後一定還是會有 bug ，修正這些 bug 基本上是工程師的工作，但有時設計師也需要加入。例如有使用者反應投標之後，沒有辦法修改最高金額限制，工程師檢查之後，發現少了修改金額的彈出式視窗，此時設計師就需要補上設計稿，讓工程師進行開發。
UX 流程設計
大家有線上搶過演唱會門票嗎？我這輩子有搶到聖誕夜的五月天演唱會門票！！(不是重點)
第一次要搶票前，我有請教過幾個朋友，他們說在開始之前，需要先摸熟整個操作流程，記住每個頁面要點擊哪裡、預先在記事本上打好要輸入的資料、把輸入法調整成需要的樣式。 然後，快開始時候不停刷新，進去之後趕快完成所有流程，送出訂單之後如果有藍圈圈在轉，就讓他轉！千萬不要重新整理！（這句也不是重點）
以上的做法，就是自己在幫自己優化整個使用流程，務必做到「快速、無腦、沒有阻礙」，而這就是 UX 設計師的主要工作。
對於 UX 設計師來說，最理想的使用狀態，就是讓使用者覺得「欸？結束了？這麼快？」
我近期有這樣的感覺，是在使用蝦皮的時候，找到商品後，基本上點兩個鍵就購買完成了，簡直是不能再更快！
為了達到這樣的目標，UX 設計師需要知道整個使用流程，並盡量做到簡化，以及減少步驟，例如用戶第一次使用時已經輸入過的基本資訊，系統就應該要自動記憶，減少下一次使用時需要花費的時間。
再者，UX 設計師需要精簡內容與欄位，例如可以的話，姓和名不要分兩欄，盡量在一欄內結束；或是商品數量預設就是 1，不要預設為 0，盡量減少使用者需要編輯的可能性。
最後，UX 設計師需要預測使用者有什麼需求、會有什麼樣的操作模式、會遇到什麼問題等，然後在真實發生之前，把這些可能性都考慮進去。例如使用者有可能在還沒有把商品加入購物車的時候，就打開購物車，所以購物車在沒有商品的時候，應該要出現一個圖示，告知使用者目前購物車內沒有商品，並顯示一個前往賣場的按鈕；使用者也有可能輸入錯誤的信用卡卡號後點擊結帳，所以只要有欄位內容錯誤，都應該跳出提示，並說明哪些欄位需要修正；使用者在購買商品的時候，可能不了解為什麼價格會浮動，所以設計師在價格旁邊加上一個「？」的標誌，使用者把游標移到上方，就會自動開啟 tooltip 說明內容。
如同我們上一篇文章「好想被顧客記住？設計師幫你打造無可取代的記憶點！(下)」 中所提及的：UX 設計師需要考慮到的情境比單純的 UI 設計還要多上許多，有的時候情境還多到需要用表格管理，或是用樹狀圖解釋，所以 UX 設計絕對會比 UI 設計還要花時間。
結語
商品或服務在開發之後，永遠都有優化進步的空間，就像現在很多服務都想導入 AI 來協助生成內容，目的就是盡量讓需要被填寫的欄位，都可以用更短的時間完成。例如 LinkedIn 個人簡介，就可以請 AI 幫忙寫！
隨著科技進步，服務也更趨精緻化。風行多年的手機 App，也許接下來都得重新開發成 Vision Pro 相容的版本，這樣的優化當然也包含 UX (以及其他開發技術)。
想要持續留住客戶，持續的優化就是勢在必行。
拍拍設計有著多年設計實戰經驗
從 0 到 1 的產品上市開發，或是從 1 到 100 分的產品迭代過程，讓我們助你一臂之力！！
