Leading Finance Design at Gate

金融產品難設計，是因為同一個名稱底下，可能藏著風險完全不同的東西。到職後的頭幾週，我把產品線分成四塊：賺幣、借貸、量化，以及其他（例如支付和返佣）。每個產品我都寫下它是給誰用的：剛接觸加密貨幣的新手、中階投資者，還是進階投資者。

接著我用使用者的身分，在 Web、iOS 和 Android 上把每個產品走過一遍，把看到的問題記下來。

1. 活期理財有文案錯誤、多餘的資訊，Web 和 App 的資訊架構也不一樣。
2. 結構性理財的用色和 icon 不一致，也看不出交易紀錄要去哪裡找。
3. 一個較早的理財產品沒有響應式版面，內容大多和新的賺幣頁重複。

我拿四家交易所的 Header，從資訊最多排到最精簡來比較。Gate 的 Header 有 11 個一級選項、6 個重複的入口、同一個頁面用不同名稱，還有一堆長得差不多的標籤：綠火、紅火、低費率、0 手續費、Hot、New。

其他幾家各有值得學的地方。OKX 把 Header 精簡到 8 項。Bybit 的交易浮層可以直接帶到交易對。Bitget 用下拉浮層放運營位。

我把方向整理成四點：把相關產品重新分組，例如結構性理財和雙幣放在一起，定投收進策略；拉齊 Web 與 App 的金融 Tab；浮層預設展開主要操作，並保留彈性的運營位；另外評估交易頁與一般頁是否需要不同的 Header。

第一個問題是，使用者怎麼找到產品。一種邏輯從幣種出發：你持有 USDT，就顯示 USDT 最高的利率，點進去看到這個幣所有的產品。另一種邏輯完全不管產品名稱，直接依風險排序：低風險、依利率排序的高收益，以及結構性產品。我們看了競品怎麼處理這兩種做法，尤其是 OKX。

我們是依自己的數據和競品比較來決定，不是憑偏好。上線的頁面兩種都用：上方是幣種推薦，下方是依產品類型分的分頁。

提案裡有三個選擇直接來自數據：

1. 快捷入口。上方哪些產品放快捷入口，依頁面瀏覽量和不重複訪客決定。
2. 縮小 Banner。我看了首頁和理財頁的運營位表現，把 Banner 縮小，讓垂直空間更有效率。
3. 排序。產品依業務重要性、數據表現和進入門檻的高低排序。

3.1 版本把 App 改用 Flutter 開發，所以規格不能留下任何需要猜的地方。下方的規格板涵蓋首頁、可滑動或點擊切換的 Banner、三種只在需要時使用的標籤、三個產品分頁與它們的溢出和預上線狀態、載入骨架、分頁轉場、列表捲動時吸頂的分頁列、搜尋，以及深色模式。

搜尋一開始顯示推薦幣種和搜尋紀錄，輸入後逐步縮小範圍。展開一個幣種，就能看到可以買的產品。

抵押借幣和 Startup 的頁面由我的組員設計，我負責定方向和審稿。

抵押借幣的頁面依使用者目前的位置來設計：從沒借過、借過、或現在持有倉位。我們簡化了倉位列表、把質押率放到最前面、新增倉位詳情頁，並依行為數據把最常用的功能移到前面。Startup 則是精簡頭部、放大認購按鈕、替卡片降噪，讓主要操作更突出。

我負責寫金融組的週報，也寫每條產品線的月度比較。功能上線後，我拿相同長度的期間來比，每一個變動都寫下來，判斷最可能是行情、運營活動還是設計造成的。

雙幣申購是一個好例子，雖然那個流程是組員設計的。新流程上線兩週後，兩個平台的轉化率都上升了。我們把原因分成兩類，並且分開看：體驗面，是把流程拆成步驟，並改用新的 Flutter 版本；產品面，是可選的幣種變多，還新增了複投功能。

報告也寫下了我們無法判斷的部分。3.1 版 App 上線時，App 的流量看起來下降了，一部分是因為還沒更新的使用者暫時無法被統計，埋點也還在補。我沒有把這段下滑歸因給設計，也不宣稱賺幣頁有前後對比的成果。

除了設計工作，我也替團隊建立了幾個習慣。

1. 每月一次的競品分享。團隊每個月分享一次賺幣、量化和跟單的競品，從三件事看：機會點、體驗優化，以及功能變化。例如四月那次就看到，有一家預設展開第一列產品、並以 USDT 的產品為主；另一家把金剛區的圖示從滾動改成點擊展開。
2. 一張合作對象的地圖。我整理出每條產品線背後的產品經理與工程師是誰，並替每一條線排出第二季的計畫：賺幣、借貸、跟單、量化、Startup、支付、返佣和機構 VIP。
3. 團隊的檔案結構。我檢視設計檔案原本的放法，比較了兩種整理方式，最後採折衷的做法，並訂一條命名規則：平台或檔案類型、需求、再加版本或日期。

離職前，我也在做 App 的 VIP 費率頁。它要讓 VIP 0 到 VIP 16 的各個等級有明顯差異，又不能讓頁面變重，也要讓最高等級的機構用戶感覺到自己被特別對待。

方向是傳統而有質感的：特權、等級、社會地位。每一段等級有自己的材質：一開始是銀色，接著是金色、玫瑰金、藍色，最頂端是黑色搭配金色皇冠。

權益我畫了兩種做法：表格，等級之間比較清楚，但頁面很長；小卡片，螢幕使用效率比較好。升級的那一刻，我考慮該發站內信，還是跳出彈窗。評審的回饋是大彈窗太重，另有一則意見建議只在 VIP 頁面彈出。

我在這個提案上線前就離開了，所以沒有成果可以報告。

關於金融產品，有四件事我記了下來。

1. 依使用者承擔的風險來分類。使用者不認得我們的產品名稱，但他們知道自己要的是安全的、收益比較高的，還是結構性的。照這個順序排的頁面，比照我們組織架構排的頁面好讀。
2. 從使用者持有的幣種出發。帳戶裡有 USDT 的人，想知道的是 USDT 可以賺什麼，所以推薦從這裡開始。
3. 難懂的產品，在做決定的地方解釋。雙幣和結構性產品最難讀，所以申購頁會顯示回款預測，結構性產品也用 icon 幫助理解。
4. 把數字放回行情裡看。在加密貨幣的世界，流量跟著價格走，所以我用轉化率，以及相同長度期間的比較，來判斷一次上線的結果。