專案團隊
Design Lead - Jessica (Me)
產品設計師 - 司, Ivy, Alicia
UX 設計師 - Cathy
負責項目
專案管理與對外發表
功能流程與 IA 設計
UI 主風格設計與定調
設計 QA 管理
專案時程
2025年 6 月 - 8 月
（歷時 5 週）
我的角色與參與範圍
這是 AAPD 第三屆 UI 設計實戰營的畢業製作。我以組長與 UI Lead 的身份帶領四位設計師，從競品研究到完整 UI 設計，產出一款主題型交友 App。負責收斂決策、維持視覺一致性，並建立讓團隊能快速前進的協作機制。最終從 35 組中獲評為三組優秀專案之一，賽後與六角學院前端合作開發。
我的核心貢獻包含：
1
主導研究方向與產品流程設計
定義產品的核心問題、整體 UX 流程與資訊架構， 是後續所有功能設計的判斷基準。
2
建立產品視覺語言與首頁設計基準
從世界觀定調、IP 角色設計到首頁 UI 設計， 為團隊建立後續所有頁面的視覺延伸基礎。
3
專案管理、簡報設計與對外發表
有效率地切分任務、並依專長分配執行，負責簡報設計與對外發表，代表團隊呈現完整的設計策略。
專案成果
35 組中 Top3 的優秀專案
（*此實戰營無區分名次，選擇 3 組作為年度優秀專案）
以下為評審及助教的部分回饋：
UI 視覺風格強烈且一致，整體呈現細膩
設計系統架構完整，確保跨頁面視覺一致性
善用 AI 工具創造角色與場景，成功建立產品的世界觀與辨識度
Prototype 細緻度高，動畫與轉場設計為整體體驗加分
產品脈絡定調清楚，MVP 範圍聚焦明確
設計起點
配對很多但聊不起來，問題可能不在個別使用者，而在產品的互動設計邏輯
市面上主流交友 App 都在做同一件事：把配對流程做得越來越短，門檻越來越低。Tinder、Bumble、CMB、Pikabu 等等，每一款都在優化「讓你更快找到人」。但我們更好奇的是：配對成功之後，對話為什麼這麼容易斷掉？
我們以 AI 工具系統性整理各平台的公開用戶評論，發現一個反覆出現的模式：「配對了但不知道怎麼開口」、「聊了幾句就消失了」、「感覺對方隨時可以離開」。這些評論多集中在「互動發生的當下」，而非配對前的推薦品質。
我們觀察到一個傾向：配對越容易，對話反而越容易中斷。
這讓我們有理由懷疑，問題不只在個別使用者，而可能與主流交友產品常見的互動邏輯有關。為了確認，我們將進一步拆解四款主流產品的設計邏輯。
前期研究
拆解市面產品的設計邏輯，歸納出三個核心痛點
這四款不同產品分別從配對效率、開場機制與情境設計切入，試圖改善使用者的互動體驗。然而，這些設計大多集中在如何開始一段關係，而「關係如何被延續」仍缺乏明確的解決方式。
我們透過 AI 輔助整理這些 APP 的公開評論反覆出現的論述，將核心痛點歸納如下：
痛點 1
配對很多，但聊不起來
用戶滑了很多人，配對後卻不知道怎麼開口，對話很快冷場或直接消失。
痛點 2
開口本身就是壓力
一配對就被期待馬上聊天，對慢熟的用戶來說，「自動開聊」的設計反而讓人想退出。
痛點 3
推薦邏輯不透明，信任感低
用戶不理解為什麼被推薦這些人，覺得平台只在推熱門帳號，降低了對配對結果的信任。
另一個有意思的發現是：過多的配對選項也容易引發選擇疲勞，降低用戶對每一次互動的投入；而配對後模糊的消失（ghosting）會損害用戶對平台的信任感與情緒安全感。雖然這個階段還不足以驗證因果，但已足夠作為我們建立設計方向的依據。
資料來源與處理方式
App Store 與 Google Play 上四款產品的公開用戶評論，以近一年內、中英文為主。整理方式：以 AI 工具依關鍵字聚類，再由團隊人工複核，排除純情緒宣洩內容，保留有描述互動場景的評論。本專案以桌面研究與評論分析為主要依據，尚未進行深度訪談，主要用於辨識方向與建立初步假設。
收斂
問題不在配對不夠精準，而在配對之後的互動被設計成了高壓行為
初期我們也曾考慮是否應該優化配對精準度，但聚焦「配對後互動」時發現，即使成功配對，對話仍然很容易在幾句之內結束。
假設 1
配對效率越高，成功率越高
主流產品假設人可以被快速理解與選擇，因此把配對流程設計得越短越好。
⇣ 衍生的真實問題
人被迫變成可快速比較的素材，外貌與簡化標籤成為唯一訊號。
假設 2
一配對即開聊，即時互動能拉近距離
主流產品預設使用者隨時準備好進入社交狀態，配對成功就是聊天的開始。
⇣ 衍生的真實問題
初次互動被設計成高壓行為。一旦開始就被期待持續，不回覆變成失禮。
假設 3
曝光最大化能提升媒合準確性
主流產品假設只要被看見就有機會建立連結，因此推薦演算法以曝光為首要目標。
⇣ 衍生的真實問題
推薦成為黑盒子，使用者無法理解曝光依據，動搖了對平台的信任。
我們總結了以下洞察：社交壓力不是來自互動本身，而是產品把「即時、主動、可被評價」設定成了預設的互動模式。想慢慢來的人，在這套邏輯裡沒有位置。因此我們決定不在現有邏輯上加功能，而是重新選擇要服務的互動模式。
設計立場與取捨
捨棄配對效率，讓 Meelo 成為「關係培養工具」而非「快速配對工具」
— 我們選擇捨棄
曝光最大化、即時互動。接受配對數與 DAU 可能偏低的代價。
— 我們選擇換取
可選擇、可自然退出的交流空間。保留人的模糊性，讓連結有機會真的發生。
這意味著產品在成長策略上需要依賴關係留存與長期互動，而非短期活躍指標。Meelo 更適合追蹤的，是「限時聊天室到期後的好友轉化率」，用戶有沒有在三天後選擇繼續，才真正說明這段交流有沒有價值。
這個取捨，也定義了我們的使用者輪廓
急著配對、追求效率的用戶，本來就不在 Meelo 的設計目標裡。我們刻意聚焦一群在現有平台中最容易流失、但需求最被忽略的族群：18 到 35 歲、對同好社群和價值觀契合有更高期待的慢熟型使用者。Elly 和小芸是這個族群裡兩種典型的樣子。
Elly｜30 歲｜行銷專員
用過多款交友 APP，覺得滑卡文化太淺，希望有一個能慢慢觀察、再決定要不要深入的空間。
小芸｜22 歲｜大學生
曾用交友 App，但配對後聊不出共同話題而放棄。想找到以興趣為起點的交流方式。
設計原則
降低壓力、建立信任、讓人願意慢下來
基於前面收斂出的三個核心痛點（聊不起來、開口有壓力、推薦不信任），我們定出三條設計原則，作為後續所有功能決策的判斷基準：
原則 1
降低「開始」的心理成本
每一個讓用戶感覺「被逼著做決定」的設計，都是在消耗信任。互動的起點應該是可選擇的、不需要交代理由的。
原則 2
興趣是入口，不是終點
興趣提供了第一句話的依據，讓人有理由開口。但設計能做的是移除讓連結無法開始的障礙。連結能不能走深，取決於對話本身，不是演算法。
原則 3
視覺語言服務「安心感」
大多社群產品的 UI 都是刺激用戶持續滑動。我們希望反其道而行，以柔和、留白及溫暖的視覺語言讓用戶放慢下來。
從洞察到設計回應
每一個設計決策，都對應一個具體的使用者痛點
洞察
設計回應
預期影響
追蹤指標
即時開聊讓開口變成高壓行為
邀請函 × 雙向同意： 雙方同意才開啟聊天室
降低無效開聊，提升對話延續性
邀請函接受率、首日回覆率
模糊的結束傷害信任與安全感
三天限時聊天室： 到期凍結，雙方加好友才解鎖
把模糊消失變成明確結束條件
好友轉化率（北極星指標）
選擇過多導致決策疲勞
每日限量 10 張咪卡： 依興趣推薦，需 80% 完成度
提升滑卡思考密度與推薦信任感
單張瀏覽時間、每日完成率
外貌為配對起點，忽略內在共鳴
Onboarding 心理測驗 × 虛擬角色
降低外貌先行心態，提升標籤填寫完整度
Onboarding 完成率
在這些指標中，我們最重視的是「聊天室到期後的好友轉化率」，因為它最直接對應 Meelo 想驗證的核心命題：降低互動壓力，是否真的能提升關係延續的可能性。
設計驗證與迭代
透過兩輪快速驗證，重新校正產品定位與視覺方向
驗證 1
產品定位不清，使用者無法建立行動預期
初期進行 UX 規劃時，我刻意降低抽卡的優先度，並將首頁重心放在興趣串文，希望使用者先透過內容建立連結，再進一步互動。我以早期 Wireframe 進行快速驗證，觀察首次接觸者是否能理解產品定位與首頁意圖。
測試版本
首頁缺少可被辨識的行動入口
多數測試者把首頁誤認為內容平台或部落格
進站後找不到明確的下一步行動
降低抽卡層級，讓首頁失去了交友 APP 該有的辨識度
調整後
首頁重構為任務導向的集合入口
三層結構：頂部任務區 / 中段話題流 / 底部阿咪助理
進站第一眼就有明確的「今天可以做什麼」
抽卡重新成為首頁的進入點之一，提升產品辨識度
驗證結果顯示，使用者無法快速判斷這是一款交友 App，也不清楚首頁的下一步行動。因此，我重新定義了首頁的資訊架構，將單一串流轉為任務導向的集合入口：我在頂部設計兩個明確的行動任務（抽卡與探索話題），中段保留依興趣分類的串文流，底部加入阿咪助理作為操作入口，讓使用者一進入產品即可理解可以做什麼，以及從哪裡開始。
驗證 2
視覺語言未能支撐產品定位
在產品方向確立後，我們針對視覺風格進行多輪探索，嘗試了將近十種配色方案。透過與使用者及助教的回饋指出，整體雖然偏向療癒，但視覺辨識度不足，主題性與情境感都不夠明確（助教的原話是「看起來快睡著了」）。
將近十種配色方案反覆比對後，團隊仍然無法達成視覺共識。
把抽象的方向變成具體的選擇
我們意識到問題不在執行，而在「療癒」這關鍵字太抽象。每個成員對它的解讀都不同，持續討論只會讓方案越來越發散。
為了打破這個循環，我以前一輪確立的首頁結構為基礎，結合貓咪 IP 風格提供三個不同的配色方案供團隊有明確的討論方向，最後透過投票收斂出視覺方向。
團隊延伸比對後，選擇以方向 3 作為視覺定調的起點。
調整後
「貓咪咖啡廳」作為視覺核心
最終由我主導首頁的 UI 視覺定調，並以「貓咪咖啡廳」作為核心語境，讓整體互動建立在具體的場景與角色之中，使使用者能更直覺地理解產品氛圍。這個視覺方向也進一步成為後續設計決策的依據，讓配色、元件與互動語言得以維持一致。
接下來，讓我們走進 Meelo 的核心功能
設計產出
核心功能設計
由於頁面數眾多，以下以呈現產品特色為主的頁面來介紹。
設計特色 1
Onboarding｜用心理測驗取代勾選，讓第一印象從對話開始
我負責 UX flow 與互動節奏策略，隊友負責 UI 視覺執行。
不同於多數交友 APP 以勾選標籤建立個人檔案，Meelo 用心理測驗引導用戶逐步被理解。每步只問一件事，文案保持對話語氣，動畫節奏柔和。測驗結束生成專屬虛擬角色，作為後續所有互動的起點。
設計特色 2
邀請函 × 限時聊天室｜把「要不要聊」的選擇還給用戶
在 Meelo 中，用戶不是直接對人發出配對請求，而是在興趣話題中閱讀串文、留言互動後，對有共鳴的發文者寄出邀請函。每一封邀請都建立在「已經有共同話題」的前提上，對方同意才開啟聊天室。
聊天室限時三天，到期自動凍結，雙方都點加好友才解鎖。不想繼續就讓它自然結束。我們希望每一段關係的開始與結束都有清楚的交代，而不是模糊地消失。
平台初期用戶少時，發出邀請沒人回應，可能讓用戶覺得「這個 App 沒人用」而流失。這是冷啟動階段需要特別關注的問題。
設計特色 3
每日咪卡｜給不想主動出擊的人一個低壓力入口
邀請函是主動路徑，每日咪卡是被動路徑。系統每天依據興趣標籤推薦 10 位有共同興趣的使用者，用戶不需要主動搜尋，只需要在推薦中選擇。需完成 80% 個人資料才能參與，確保每張卡片都是「有輪廓的人」。
兩條路徑服務不同性格的用戶：主動型透過話題找人，內向型透過每日推薦被找到。
設計系統與視覺語言
以貓咪 IP 延伸，讓視覺有一致的準則規劃
在視覺方向確立後，我以首頁作為基準頁面完成 UI 設計，定出整體的設計風格指標（配色比例、元件圓角、圖文節奏），再讓其他頁面依此基準延伸。
團隊成員則依據設計原則與角色 IP 制定了 Design Token 與所有 UI 元件、配色與間距等規範。上線前，我與組員進行了 UI 一致性校對，逐頁確認每個元件的視覺邏輯是否對齊。
（以下為部分揭露設計系統設定規範）
Meelo 角色家族
以 AI 快速打造療癒世界觀的角色互動
我以 Lovart 作為角色視覺產出工具，設計了 Meelo 的五隻 IP 角色。每隻貓都有自己的個性與代表風格，對應不同類型的使用者特質，使用者會透過心理測驗被分配到最符合個性的角色。
角色不只是靜態頭像，而是一套完整的視覺系統。我針對每一個興趣分類為每隻角色生成對應場景的變體圖，確保角色在不同頁面出現時都有符合情境的視覺表現。
Takeaway
在時間與協作的限制下，組長的核心是推進設計
如果產品要繼續，我會優先驗證...
降低互動壓力，是否真的能讓關係被延續
先透過用戶訪談，理解興趣導向的互動是否真的降低了「開口的心理負擔」，還是只是延後了壓力的發生；同時以「聊天室到期後的好友轉換率」作為北極星指標，判斷這段互動是否具有延續價值；並進一步分析 Onboarding 的流失節點，確認心理測驗是否在建立連結之前就已經造成負擔。
