ui-implementer

UI Implementer 是一項專為高保真前端工程設計的專業開發技能。它透過整合的多代理工作流程，架起了靜態設計稿與生產級代碼之間的橋樑。此技能適用於需要將 Figma 連結、設計截圖或視覺樣機轉換為功能性 React 19 與 Tailwind CSS 4 組件的專業開發人員。透過自動提取設計規格並啟用反覆運算的驗證週期，它確保產出的代碼不僅符合嚴格的像素級精確度標準，同時保持無障礙合規性與最佳架構實踐。

• 執行多階段 UI 實作，包含設計分析、結構規劃與代碼生成。

• 支援在標準 UI 開發人員與專業 UI Developer Codex 代理之間進行自適應切換，以解決複雜的實作困難。

• 整合 Figma、遠端 URL 與本地檔案路徑，以讀取設計來源素材。

• 執行自動化驗證循環，將實作的組件與設計保真度要求進行調和。

• 推廣原子化設計導向的檔案結構，並利用現代 TypeScript 開發流程。

• 生成最終實作報告，提供品質檢查與組件就緒狀態的清晰更新。

• 當您提供 Figma 連結、截圖或預計轉換為 UI 代碼的樣機時，請調用此技能。

• 此技能需要明確的輸入參數：設計來源、具體組件描述、目標專案目錄與本地預覽 URL（例如 localhost）。

• 若僅需進行簡單的 UI 修復或非設計相關的開發，請勿使用此技能；通用功能開發請使用標準開發代理。

• 請確保可存取有效的預覽環境，以便代理能針對渲染出的輸出進行驗證。

• 根據代理切換偏好提示進行操作，以平衡通用開發速度與進階 Codex 驅動的精度。

• 為獲得最佳效果，請在實作階段開始前明確命名組件（例如 'UserProfileCard'）並定義所需的佈局或行為。