新產品
填補操作斷點以打造最小可行性商品
時間
2024.07 - 2024.12
技能
產品路線圖、使用者經驗設計、設計系統
公司
Flikshop
團隊
1位設計師、1位專案經理、2位開發人員
我的貢獻
建立基於 Bootstrap 框架的設計系統
為 Flikshop Neighborhood 此新產品建立完整架構與使用者流程
製作可互動的MVP並執行3輪使用者測試以蒐集使用者回饋
背景
連結受刑人與家庭 — 持續擴大的影響力
新產品
一個資源共享的社區
在與超過85,000名受刑人與其親友建立聯繫後，Flikshop的下一個目標是利用長年累積的信任，擴大影響範圍，將社區、教育機構和公民團體也納入Flikshop打造的「Neighborhood 社區」。在社區中人們可以互相分享資源與工作機會，讓受刑人的社會回歸之路走得更安穩。
這樣的關係並不是單向的，對於機構團體而言，Flikshop的名單也能幫助他們找到更精準的客群來服務。在 Flikshop Neighborhood 中，關係是互相扶持的。
挑戰
初版原型的問題
CEO討論多次後，我們決定採用 MVP (最小可行性商品) 策略，優先聚焦於編輯卡片、寄送資訊及帳單等核心功能以確保產品快速落地。針對其餘延伸需求，我則與後續加入的產品經理共同梳理出開發優先級，並撰寫成 Product Roadmap (產品開發路線圖)。因此，我在此專案的首要目標轉化為：
我們如何
「建立一個最小可行產品，讓使用者可以建立活動、完成付款，並看到寄送結果。」
01
省略前期訪談，借鏡設計典範
由於開發時程緊湊，我評估與其花時間進行使用者研究，不如先參考業界已有的設計典範 (design pattern) 以快速建立基礎功能。這項策略讓我們能用MVP蒐集更真實的使用回饋。因此，我深入研究Mailchimp 與 Mailjoy 等客戶關係管理及活動管理工具，在「活動建立、信件寄送、聯絡人管理、付款」四個核心流程的設計，以期將操作流程中的斷點補上。
02
整理出網頁架構與線框稿
初步了解競品後，我將上述四個流程彙整為 Flikshop Neighborhood 的流程圖 (flowchart)，這讓我能更清晰地盤點出所有需要補足的頁面。同時為了讓流程更具象化，我也依此繪製了線框稿。這個步驟大大消除了前一版設計有諸多斷點、頁面銜接不順，以及指引不清晰的問題。此外，這份流程圖與線框稿，在後續與執行長討論設計細節和確認方向時，發揮了大大功效。
03
與PM協力打造MVP
專案進行到一半時，我開始與一位新加入且具設計能力的 PM 合作。我們共同建立了一套可重複使用的元件庫，並將線框稿轉化為高擬真模型。除了定期討論優化彼此的設計方案以外，我們也在過程中整理出其餘各項功能間的關聯，以及各自的開發優先級。
競品分析
除了操作流程以外，我也發現了許多視覺和體驗上值得參考的小細節。這些小巧思讓操作更直覺，也讓使用者多了份信任。對身為小公司的 Flikshop 而言，提升使用者對產品的信任度尤其重要，不能因為產品是 MVP 而忽視這塊。
提供確認機會
支援批次操作
讓使用者掌握局面
設計迭代案例
分批寄送
將分批寄送拆解成更清楚的小步驟
設計合作案例
在使用者需求與商業考量間取得平衡
身為產品設計師，我在整個專案過程中與 CEO 密切合作，確保設計方案在滿足使用者需求的同時，也能達成商業目標。在設計首頁 (Dashboard) 時，維持這種平衡尤其重要，因為它是使用者登入後看到的第一個畫面。
前任設計師起初的版本，在 CEO 要求下側重於展現 Flikshop 的數據能力，卻忽略考慮使用者想要的內容。為了避免重蹈覆轍，我們帶著設計原型與幾位種子用戶 (Pilot Users) 進行訪談，並從中得知哪些資訊對他們而言更有價值。最終我們綜合考量了兩方需求，重新調整了首頁各板塊的佈局優先級與資訊佔比。
反思與收穫
不要放棄尋找與使用者對談的機會
雖然桌面研究 (Desk Research) 提供了不少幫助，但我仍深感我們缺乏來自使用者的真實想法。即便開發時程緊湊，我依然極力爭取進行測試與訪談的機會，並向團隊說明使用者回饋對於打造成功產品的重要性。直至專案中旬，我終於成功說服 CEO 協助我們聯繫上一位 NGO 工作者。
那次談話為我們帶來了單憑競品無法獲得的寶貴洞察。不僅幫助我們優化了設計，也讓我們更好排序未來的開發藍圖。這次經驗教導我：即使困難重重，也永遠不要放棄尋找與使用者接觸的機會。
