Skill 多語言閱讀指南
frontend-design-review用途、用法與原始來源
審核並創建具有獨特性、生產級的前端介面,確保高設計品質和設計系統合規性。評估基於三大支柱:流暢的洞察到行動、精湛的工藝和值得信賴的構建。適用範圍:PR審核、設計審核、可訪問性審核、設計系統合規性檢查、創意前端設計、UI程式碼審核、元件審核、響應式設計檢查、主題測試以及創建令人印象深刻的UI。不適用於:後端API審核、資料庫模式審核、基礎架構或DevOps工作、不含UI的純業務邏輯或非前端程式碼。
原文擷取時間:
- 來源儲存庫
- microsoft/skills
- SKILL.md
.github/skills/frontend-design-review/SKILL.md- 儲存庫 Star
- 3,157
- 儲存庫最近更新
- 2026-10-31
- 能力分類
- 開發
- 最近採集時間
授權:MIT
流程片段用來協助閱讀上游說明。本頁沒有執行第三方 Skill,不屬於實測評測。
下面的用途與操作片段來自上游文件,由本站整理並翻譯,和另行標示的 Codez 編輯分析分開呈現。
這個 Skill 能做什麼
審核並創建具有獨特性、生產級的前端介面,確保高設計品質和設計系統合規性。評估基於三大支柱:流暢的洞察到行動、精湛的工藝和值得信賴的構建。適用範圍:PR審核、設計審核、可訪問性審核、設計系統合規性檢查、創意前端設計、UI程式碼審核、元件審核、響應式設計檢查、主題測試以及創建令人印象深刻的UI。不適用於:後端API審核、資料庫模式審核、基礎架構或DevOps工作、不含UI的純業務邏輯或非前端程式碼。
如何使用:上游操作流程
設計系統工作流程
查看 Storybook/元件庫中的元件,以了解其 API 和用法。使用 Figma 開發模式取得精確的規格說明(間距、標記、屬性)。使用設計系統元件和設計標記進行實現。將實現與 Figma 設計進行比較。
原文片段 · L54 ↗核心原則
任務完成:最少點擊次數。每個螢幕都回答「我能做什麼?」和「接下來會發生什麼?」操作層級:1-2每個視圖的主要操作。次要操作逐步展開。引導:介紹時解釋各項功能。智慧預設值優於配置。導航:清晰明了entry/exit積分。Back/cancel隨時可用。深入探索的線索。
原文片段 · L82 ↗環境與相依需求
本次未從該檔案選出獨立的環境需求片段,不代表無須相依套件。請繼續核對儲存庫的安裝說明和引用檔案。
限制與結果檢查
開始使用前
- 先核對支援的 Agent 宿主和儲存庫安裝說明。保留完整 Skill 目錄及其引用的腳本、資源和文件,只複製 SKILL.md 可能遺漏相依需求。
- 向 Agent 提供實際輸入、預期輸出和驗收標準。呼叫方式與可用工具取決於宿主環境,本站不假定存在通用的安裝指令。
- 先在暫存專案或輸入副本上試用。涉及修改檔案、遠端服務或計費資源的操作,應逐項核對後再授權。
- 依照原文檢查項目和自己的需求驗證輸出。成功觸發或儲存庫 Star 較高,都不能證明結果正確。
繼續閱讀原始文件
相關 Skill
翻譯與介紹範圍
本頁從固定版本的上游 SKILL.md 整理用途與操作片段,譯文使用輔助翻譯。它不是完整手冊,也不代表經過相容性實測;使用前請核對原文及其引用檔案。
介紹依據下方列出的固定版本;目前儲存庫動態和目錄擷取時間分開呈現。
- 固定版本來源
- 閱讀原文 ↗
- 原文擷取時間
- 來源提交版本
00d66a64919edca5bca2c673373444e36a4b5461- 原文 SHA-256
639b68cdc6f9b4cdd66a111851555afee2eb82d4de37bf9cbad3be845bb00c2d