專案總覽
Crypto Arsenal（CA）是量化交易平台：策略機器人替使用者自動下單，但人想介入自己的倉位時，CA 裡沒有任何入口——跳回交易所手動操作，還可能讓整支策略被判定異常、強制停掉。我從使用者回饋與三家交易所的既有流程出發，把倉位資訊、限價與市價平倉、止盈止損整合進 CA，讓人工介入變成系統看得懂的合法操作。
成果走查
在 Trading Details 中選擇限價平倉，輸入價格與數量後確認送出。
產品介紹
就像傳統金融市場，加密市場裡的交易者透過交易所把法幣（如 USD）換成加密貨幣；交易所就像中間人，幫交易者完成買賣、並連到背後的區塊鏈。
但加密交易的門檻在於：通常得手動盯盤、手動下單，還要對市場有一定了解。於是「交易策略」出現了：策略是一段程式或演算法，幫交易者監控市場、更有效率地交易。
而 Crypto Arsenal 就是一個直接串接交易所、提供交易者自動化策略來交易的平台。它同時服務兩種角色，形成一個策略供需的生態系。
這個模式為交易者、開發者與平台本身同時創造價值。不過策略並非 100% 全自動，往往仍需要交易者依市場狀況自己微調，這正是後來「倉位顯示與手動平倉」這個功能要解決的起點。
角色與工作流
在 CA，每 1–2 週會持續一個 sprint，小功能設計時程約 2–4 週，大功能設計時程約需 1–3 個月。除了與 PO 持續討論產品功能上線時程及每週使用者回饋，多數 feature 以二手桌面研究與競品設計為基礎，我身為設計師的設計流程如下：
問題定義
使用者在 CA 平台上使用策略機器人交易時，雖然可以看到策略整體賺了多少，卻無法清楚理解「現在到底開了什麼倉位」。當同時啟動多支策略、或同一支策略可能開多也可能開空時，使用者無法直接判斷目前是多倉還是空倉、倉位數量、入場價、標記價、浮動盈虧，以及該倉位距離止盈 / 止損還有多遠。
「策略賺了多少我看得到，但它現在開的是多倉還是空倉、正在賺還是賠，介面上完全看不出來。」
「想確認倉位只能登入交易所，同時跑好幾支策略時，我根本分不清哪一筆是哪支策略開的。」
「策略本身有設定止盈止損，但市場變化太快，我想先手動停利或止損，不一定想等策略條件被觸發才離場。」
「已經獲利到我滿意的程度了，我想自己先落袋，而不是乾等策略設定的條件才平倉。」
「我只是想提前平掉一筆倉位，跑去交易所操作，結果整支策略被系統判定異常停掉、還救不回來。」
「我想知道目前倉位距離止盈 / 止損還有多遠，但 CA 只看到整體績效，看不出這筆倉位接下來可能在哪裡被平掉。」
介面現況
目前 CA 的 Portfolio 頁面可查看所有運行中的策略機器人，並在右上角呈現策略整體績效，例如獲利、ROI、未實現 ROI 與資產分布。然而，介面尚未直接顯示單一策略目前實際持有的倉位資訊，例如多 / 空方向、數量、入場價、標記價、浮動盈虧。使用者若想確認單一倉位狀態，仍需登入交易所查閱，導致 CA 作為策略管理平台，無法讓使用者在站內完整掌握個別策略的實際收益與風險狀態。
設計理由
問題不只是「看不到倉位」，而是使用者為了控制單筆風險去交易所平倉，反而可能讓整支策略報廢：機器人偵測到自己管理的倉位突然消失、狀態錯亂，為風險控管只能停掉策略且無法恢復。
所以方向很明確：把平倉收進 CA 內。手動平倉只結束當下這一筆倉位、策略進入空倉，未來再符合開倉條件時機器人仍會自動開倉，讓使用者可以同時享有自動化交易的紀律以及自主控管收益的權利。
交易所介面參考
為了讓使用者一上手就熟悉流程，我參考 Binance / Bybit / OKX 的實際介面，拆解三家共通的倉位資訊欄位、平倉和止盈止損流程，同時考量交易所能回傳的資料，收斂出專屬於 CA 的操作流程。
從三家交易所介面收斂出交易合約中倉位最通用、可從交易所撈取之數據，並且也是使用者最關心的欄位。
交易資訊 Tab
Position、Open Orders、Order History、Position History
倉位資訊
Symbol、Side、Size、Entry Price、Mark Price、Liq. Price、Margin、PnL (ROE%)
Binance
Bybit
OKX
BinanceBybitOKX三家平倉流程大致一致：在倉位列表找到倉位 →（限價或市價二擇一）→ 確認送出；差別僅在 Binance 需多一個輸入金額 / 數量的畫面。CA 沿用相同的核心結構。
BinanceBybitOKX三家止盈止損同樣是兩步：開啟倉位 → 設定止盈 / 止損的觸發價與數量。CA 沿用相同結構。
從上面流程可以觀察到無論是 Binance、OKX、Bybit 的介面或是操作流程基本雷同，僅介面元件有差異，因此 CA 的兩項操作流程也將依照上述形式進行，確保使用者可以快速銜接。
線框稿
雖然目前已參考交易所操作建立初步概念，但 CA 產品的交易流程與交易所仍存在差異。交易所偏向全手動操作，而 CA 目前以策略機器人全自動開單為主；交易者後續可依自身判斷，手動決定平倉時機與平倉數量。因此，在 CA 中導入手動平倉、止盈與止損功能時，需透過多種設計提案，進一步確認最終的介面樣式與操作流程。
未採納原因
左邊的趨勢圖需要往左縮小，以資訊層級而言，趨勢圖當中會標記何時進場和出場，若圖表過小很難點擊這些資訊。另外，右邊空間無法塞入 8–10 欄交易所的所有資訊，必定會有部分資訊被犧牲。
未採納原因
這個版本參考幣安現行設計，是使用者習慣、也還不錯的做法，但 CA 目前沒有這個元件，要重新手刻比較費時。
Design Iteration
我們找內部團隊和工程師實測，逐一修過策略機器人 Bar 的資訊顯示、平倉的數量互動與止盈止損按鈕文字，讓每個元件都更貼近使用者實際的操作理解。
原本列表欄位同時顯示 Performance 與 Time Period，導致資訊集中在表格中，欄位偏多、橫向空間被壓縮；右側 Action 區只有主要的 Stop 按鈕，Duplicate 功能不明顯或不在同一層級呈現。
調整後，新版將 Performance 與 Time Period 從下方列表中移除，改放到上方 Accumulated EC 圖表區域。這樣使用者在查看績效曲線時，可以直接對照策略 ID 與時間區間，不需要再到表格欄位中交叉比對，資訊層級更清楚，也讓下方列表更精簡。
原本的平倉數量採用輸入框搭配下拉選單的方式，使用者需要點擊欄位後，再從 10%、20%、50%、100% 等固定比例中選擇。這種設計雖然能快速選取常用比例，但這些比例若非使用者的選擇，則需要手動輸入。另外，選項展開後也會覆蓋下方內容，讓彈窗視覺變得較擁擠。
調整後將平倉數量元件改為「輸入框 + 比例滑桿」的形式。使用者可以直接透過滑桿調整平倉比例，並即時看到目前比例數值，例如 0%。相較於下拉選單，滑桿更適合表達「從 0% 到 100%」這種連續比例的操作，也讓平倉數量的調整方式更直覺。
原本的 TP / SL 功能說明直接放在彈窗最下方，將完整的規則與限制一次性呈現在介面中。這樣雖然能讓使用者立即看到所有資訊，但也讓主要操作區被大量文字擠壓，視覺負擔較重。對已熟悉功能的使用者來說，這些長篇描述並不是每次操作都需要閱讀，反而會降低操作效率，讓介面顯得擁擠、不夠俐落。
調整後將完整的功能說明收斂到標題旁的 info 元件中，只有在使用者 hover 或需要進一步理解時才會讀取到詳細資訊。這讓介面預設狀態更乾淨，主操作區能更聚焦在 Take Profit、Stop Loss 的價格設定與確認操作上，減少不必要的文字干擾。這樣的調整同時滿足了新手與專家的使用情境：對專家來說，他們通常已經理解 TP / SL 的運作規則，乾淨簡潔的介面能讓他們更快速完成設定，也更適合長期高頻使用；對新手來說，必要的專業資訊仍完整保留，只是收進可自主查看的 info 元件中，當他們需要了解觸發邏輯、適用範圍或限制條件時，可以主動滑到 info 查看完整說明。
原本在 TP/SL 欄位中，即使該倉位已經設定過止盈止損，仍然顯示 Add 按鈕。這容易讓使用者誤解目前還可以「新增」另一組 TP/SL 委託，彷彿能持續替同一個倉位加掛多筆止盈止損設定。然而，在 CA 的操作邏輯中，TP/SL 是針對整個倉位一次性下單，委託送出後，後續能做的只有調整這筆既有設定。因此，使用 Add 會讓介面語意與實際系統邏輯產生落差，增加使用者判斷成本。
調整後，當倉位已經存在 TP/SL 設定時，按鈕文字改為 Modify。使用者看到 Modify，就會知道自己是在調整整個倉位既有的止盈止損設定，不會再誤以為能加掛一筆新的 TP/SL 單。這樣操作語意更貼近系統實際邏輯，也少了對後續操作的誤解。
Final UI Design
承接競品流程的拆解與多次提案的權衡，收斂出最適合 CA 的方案，把手動平倉和止盈止損分為三個流程依序介紹。
設計成效
我的驗證假設是：如果 CA 延續交易者熟悉的操作邏輯與用詞，使用者應能直接在策略頁完成平倉與止盈止損，不必切回交易所。
我邀請 5 位具合約交易經驗的內部成員進行簡單易用性測試，完成限價平倉、市價平倉與止盈止損三項任務，主要記錄操作時間、整體易用性與現場回饋。
三項核心任務平均由 65 秒降至約 27 秒。
受測者普遍認為新版操作容易理解，且能延續既有交易習慣。
原流程需切換至交易所並重新定位持倉；新版可直接從 CA 策略頁完成。
| 任務 | 原流程 | 新版 |
|---|---|---|
| 手動限價平倉 | 65秒 | 28秒 |
| 手動市價平倉 | 48秒 | 19秒 |
| 手動止盈止損 | 82秒 | 35秒 |
市價、限價與平倉流程延續常見交易所的操作邏輯，受測者能直接套用既有經驗完成操作。
「市價和限價的按鈕放在持倉資訊旁，流程跟我常用的交易所很接近；看到價格和數量欄位後，我知道下一步該填什麼，不太需要重新理解。」
「以前要切去交易所，再確認交易對、方向和部位；現在從策略頁就能找到同一筆持倉並完成平倉，少了重新比對資料的過程。」
使用者需要同時理解多空方向、價格關係、輸入單位及觸發條件，認知負擔明顯高於平倉。
「設定止盈止損時，我會來回確認多空方向、設定價格和百分比距離，還要判斷 Mark Price 或 Last Price 會怎麼觸發，資訊比平倉多很多。」
「按下確認後，我想立刻看到條件是否送出成功、交易所有沒有同步，以及之後價格到哪個位置會真正觸發，不然會擔心設定沒有生效。」
同時呈現設定價格、百分比距離與預估盈虧，降低使用者自行換算的負擔。
依持倉方向提示合理的止盈止損區間，並在送出前清楚預覽觸發條件。
清楚呈現送出中、成功、失敗，以及交易所持倉是否完成同步。
本次由 5 位具合約交易經驗的內部成員進行簡單易用性測試，結果用於檢查操作流程與找出後續改善方向。
學習反思
這份實習讓我學會在快節奏產品開發中做設計判斷：當沒有額外資源安排正式使用者測試時，透過內部團隊與工程師快速驗證流程，再把交易所既有操作習慣、CA 原本的設計系統與技術限制一起納入取捨。
以 1–2 週為節奏，把模糊的產品需求拆成可討論的 flow、wireframe 與原型畫面，讓團隊能更快對齊方向並推進交付。
在沒有額外資源安排正式使用者測試的情況下，透過內部團隊、工程師與熟悉產品流程的成員快速測試操作邏輯，及早發現資訊層級、流程理解與實作限制問題。
參考交易所既有模式，不代表把整套介面照搬過來。我們的做法是讀懂使用者已經熟悉的操作習慣，再結合 CA 原本的設計系統、風控邏輯與平台元件，轉化成更一致、也更好落地的方案。
