> ## Documentation Index > Fetch the complete documentation index at: https://docs.bricks.tools/llms.txt > Use this file to discover all available pages before exploring further. # 內建 skills > bricks-ctor 內建的 AI 代理 skills bricks-ctor 包含內建 skills，在執行 `bun install` 期間會自動安裝至您的專案。這些 skills 提供領域知識，協助 AI 編碼代理理解並建置 BRICKS 應用程式。 Skills 是可重複使用的指令文件，為 AI 代理提供情境資訊。請參閱 [CTOR skills 參考文件](/zh-Hant/ctor/reference/skills)，深入了解 skills 的運作方式。 ## bricks-ctor `bricks-ctor` skill 會安裝至 `/.bricks/skills/bricks-ctor/`（並在 `.claude/skills/` 和 `.codex/skills/` 提供相容性符號連結）。它提供 BRICKS 執行環境的架構模式與設定參考。 **適用情境：** 您正在建置或設定 BRICKS 應用程式，且需要特定領域的指引。 ### 涵蓋主題流程分解策略與模式選擇優先順序。教導如何將使用者流程拆解為產生器、事件動作鏈、系統動作與 Data Calculation 的最簡組合。動畫系統參考，涵蓋 3 種動畫類型（timing、spring、decay）、9 個可動畫化屬性、10 種以上的緩動函式，以及組合動畫（parallel/sequence）。 Canvas 進入/退出動畫與共享元素轉場。涵蓋 5 種待機模式（top、bottom、left、right、custom），包含框架選項與時序最佳實踐。 E2E 測試框架，包含 3 種自動化類型（launch、anytime、cron）、模擬動作（brick 按壓、按鍵事件、HTTP 請求），以及 6 種以上的斷言類型（含螢幕截圖視覺回歸）。 JavaScript 沙箱化執行環境參考，內建 25 種以上函式庫（lodash、moment、crypto、compression 等）。涵蓋觸發模式、非同步操作、多重輸出，以及應避免的反模式。多顯示器設定的 LAN 裝置同步。涵蓋主要/次要裝置角色、執行模式、subspace 與資料層級的設定，以及視訊牆和互動式資訊站等使用情境。雲端資料同步，包含 3 種遠端更新類型、為非技術人員產生網頁更新頁面、附驗證的 REST API 存取，以及含存取控制的資料路由。資產管理，涵蓋 media box 組織、產生器的 Media Flow 檔案清單、4 種屬性類型（image、video、audio、lottie）、上傳方式，以及 CDN 傳遞。遠端 AI 推論卸載。涵蓋功能交換、策略選項（prefer-local、prefer-buttress、prefer-best）、伺服器設定，以及 GPU 設定。 ## bricks-design `bricks-design` skill 會安裝至 `/.bricks/skills/bricks-design/`。這是 Application 與 Subspace 的視覺設計準則——字型、色票、素材取得、設計語言、系統承諾、視覺節奏與品牌工作。 **適用情境：** 您正在進行視覺、美學、系統、樣式或品牌素材相關工作——即便簡報以產品術語命名（slideshow、kiosk、signage、menu board、lobby screen、museum display），或起點為 Figma 檔案、網站、螢幕截圖、PDF 或品牌手冊。對於端對端簡報（「為 X 設計一個 kiosk」、「製作介紹 Y 的簡報」），`bricks-design` 會與 [`bricks-ux`](#bricks-ux) 平行啟用：視覺表層由前者負責，互動形狀由後者負責。 ### 涵蓋主題 BRICKS 設計的 10 條支柱法則 —— Canvas 即狀態、Data 是動態值的傳遞通道、跨 Canvas 共用 Brick id 會自動補間、Switch 比對而 Data hit 僅作相等匹配、Generator 為無頭非同步、frame 以 grid 為單位、Standby Transition 屬於設計語言、Subspace 是型別化模組、DataCalculation 僅用於衍生計算，以及不存在 scroll／overflow／responsive reflow。分階段交付（非衝刺至完成）：確認部署情境、以註解區塊宣告設計系統、先鎖定一個 Showcase Canvas、再以共用的 hero id 跨 Canvas 鋪展整個 Canvas 圖、針對間距節奏與多語言適配進行精修，最後驗證並自我審查。精選的視覺語言函式庫（Swiss Editorial、Kenya Hara 留白、Field.io motion poetics、Brutalist web、Y2K futurist-retro 等），橫跨 10 個方向 × 5 個流派，各自帶有 grid 立場與以 grid 單位表達的間距尺度。方向顧問會為模糊簡報提出三個跨流派候選方向。視覺檢視優先的流程 —— 絕不從 markdown 萃取結果翻譯。會驅動瀏覽器自動化擷取每個頁面或 frame，再透過讀圖能力回看每張截圖，才開始組成 BRICKS 原生對應物。 Logo、產品攝影、UI 截圖、場景攝影與動態素材的五步驟取得流程 —— 依 5-10-2-8 品質標準的五個命名維度評分，每個類別備有三條備援路徑，並以結構性規範要求 Brick 透過 `DataLink` 引用 Media Flow Data，而非內嵌或重畫。 Canvas 圖形狀的選擇（線性投影鏈 vs. hub-and-spoke vs. 編排式揭示）、透過共用 Brick 自動補間實現的英雄連續性、反「PowerPoint 配音」原則，以及給序列性作品使用的初次觀看者評分表。在 Generator 邊界節流、明確限制 Data 歷史筆數、`persistData: true` 保留給 last-known-good 與冪等鍵、開機 Canvas 須能在 1 秒內以快取 Data 渲染、為網路 Generator 套用 offline-first 包裝。另涵蓋複雜度警訊 —— Subspace 濫用、Switch 分支爆炸、DataCalc 鏈、動畫氾濫、Canvas 膨脹。依 token 成本排序的三種模式 —— Data 預設（預設值）、共用模組、獨立 Subspace —— 搭配分階段交付流程。比較介面僅限對話與原始碼樹，絕不在生產環境留下 Canvas 內的主題切換器。完成定義：每個 Canvas 都透過 `preview` MCP 截圖、每張截圖都透過讀圖能力回看、與參考素材並排逐項對比、主控台無錯誤。預設路徑 1 使用 Electron preview MCP；當部署仰賴硬體行為時（付款、身分擷取、周邊裝置、Local Sync），升級為路徑 2，透過裝置 DevTools（CDP 位於 `:19851`）執行。每個 Canvas 依系統承諾、視覺層級、工藝、功能契合度與原創性五個維度評分。反低品質掃描涵蓋路由切換採用 snap、繞過 Data 的硬編碼動態字串、無觸控硬體上的 hover 暗示、手繪仿冒品牌素材，以及以聚合來源 logo 出貨。 ## bricks-ux `bricks-ux` skill 會安裝至 `/.bricks/skills/bricks-ux/`。這是任何以 Canvas、Brick、Generator 與 Data 建構的 Application 或 Subspace 的互動設計準則——使用者旅程、互動原型、流程狀態、可按壓組合、監控畫面、無障礙設計。 **適用情境：** 您正在進行可用性、流程、旅程、可供性、回饋、復原或無障礙相關工作——「審視這段流程」、「改善可用性」、「設計等待狀態」、「修補錯誤路徑」、「設計監控畫面的警報狀態」、「為多語言設計」、「設計閒置與招客狀態」。 `bricks-ux` 會與 [`bricks-design`](#bricks-design) 在端對端簡報中平行啟用。網頁慣性（hover 暗示、捲動揭示、預設彈窗、頁面提交表單）無法套用到無觸控或周邊驅動的硬體。 ### 涵蓋主題每段互動都遵循的七個步驟 —— 可供性、指引、即時回饋、執行中可見度、延續、復原、收尾。這個架構取代裝置特定的食譜：QR 掃描、人臉偵測、BLE 接近、NFC 觸碰、付款、語音麥克風、觸控全部遵循相同形狀。使用者在 BRICKS 畫面前做的六件事 —— glance、browse、interact、transact、monitor、dwell。每種原型各自決定 Subspace 結構（Canvas 數量、主導的 Brick 家族、動態語彙）、失敗訊號，以及哪些 UX 維度權重最大。七種一級公民狀態 —— 閒置、招客、載入中、空白、錯誤、開機、維護 —— 各自附有通用原則、BRICKS 原生表達手法，以及代理工作中常見的失敗模式。閒置是經過設計的 Canvas，不是「剛好最後載入的畫面」。複合按鈕中關於 `on_press` 應落在哪個層級、以及哪些內部 Brick 應設為 `pressable: 'bypass'` 的明確決策。可供性必須視覺上可區分 —— 可按壓的方塊不能看起來和裝飾性方塊一模一樣。沉著／偵測／要求三段紀律。沉著狀態必須易讀且能被遺忘；變化必須能被察覺但不過度索求注意；要求必須能驅動回應但不狼來了。陳舊資料比沒有資料更糟；警報層級在壓力下仍能維持。對比、字級、不僅靠顏色、運動可及範圍、減少動態、可預測導覽與聲音提示，皆以部署相關的門檻設定。依觀看距離、環境光、使用者姿勢與硬體能力校準，而非綁定特定畫素數值。依部署風險分級的審查 —— 付款／身分／安全關鍵屬 CRITICAL，互動與帶警報的監控屬 HIGH，browse／dwell 屬 MEDIUM，glance／loop 屬 LOW。每段附必要項與反模式對照，與 `bricks-design` 審查並行執行，兩者皆會阻擋出貨。