VividKit Crystal clear AI coding
EN
Chọn Thiết Lập Bắt Đầu với AgentKit Tiếp Tục với ClaudeKit Chuyển từ ClaudeKit sang AgentKit Gỡ hẳn ClaudeKit AgentKit Là Gì? AgentKit Hoạt Động Như Thế Nào? Kit, Skill, Agent & Hook AgentKit Hỗ Trợ Runtime AgentKit Ứng Dụng AgentKit Desktop Cấu Hình AgentKit Tra Cứu CLI ak Cheatsheet skill AgentKit Workflows AgentKit Statusline AgentKit Cập Nhật CLI ak & Kits AgentKit Helper Cài lại clean AgentKit Xử Lý Sự Cố AgentKit Giới Thiệu ClaudeKit Hướng Dẫn ClaudeKit CLI Tìm Lệnh Phù Hợp Bảng Lệnh Nhanh Quy Trình Mẫu Tham Chiếu CLI Claude Mechanics Permission Modes ClaudeKit Hooks Coexistence ClaudeKit x Codex CK → Tool coding khác Cách ClaudeKit Hoạt Động Inside ClaudeKit Tìm Unknowns Của Bạn Khôi Phục Session Sửa Lỗi Từ Log Thiết Kế UI/UX Chuyển Đổi Tài Khoản Cấu Hình IDE Remote Control Codex App Sơ đồ hệ thống UI Review Gate Khuyến Mãi Ủng Hộ VividKit

Tóm tắt nhanh / Lệnh

Bộ Engineer

/ak:web-design-guidelines

Rà soát UI theo Web Interface Guidelines

Rà soát mã UI theo Web Interface Guidelines mới nhất về accessibility, UX và best practice thiết kế, rồi báo lỗi ngắn gọn dạng file:line.

01

Lấy guideline

02

Xác định mục tiêu

03

Đọc mã UI

04

Áp toàn bộ luật

Nguyên tắc 01

Luôn lấy guideline mới; tài liệu nguồn quyết định bộ luật hiện tại.

Nguyên tắc 02

Review đúng bề mặt UI được yêu cầu, không tự mở rộng ra cả app.

Nguyên tắc 03

Phát hiện phải hành động được và có dòng cụ thể.

Nguyên tắc 04

Kiểm accessibility và UX theo guideline nguồn, không theo gu cá nhân.

Bản đồ thực thi

Các nhánh chính từ đầu vào đến kết quả, bám theo cách command chạy khi dùng thật.

01

Khởi động

Đầu vào, phạm vi, route

  1. 1 Lấy guideline Lấy command.md mới nhất từ nguồn Web Interface Guidelines trước mỗi lần review.
  2. 2 Xác định mục tiêu Dùng file hoặc pattern được đưa vào; nếu chưa có, hỏi cần review các file UI nào.
02

Xử lý

Agent / skill thực thi

  1. 3 Đọc mã UI Chỉ mở các bề mặt được chỉ định để audit giữ đúng phạm vi giao diện được yêu cầu.
  2. 4 Áp toàn bộ luật Kiểm toàn bộ luật vừa fetch về accessibility, tương tác, layout, nội dung và UX; không chọn lọc tùy tiện.
03

Kiểm chứng

Gate, review, xác thực

  1. 5 Gắn bằng chứng Gắn mỗi phát hiện vào đúng file và dòng để người dùng xử lý ngay được.
  2. 6 Báo ngắn gọn Xuất phát hiện theo đúng format file:line ngắn gọn mà guideline mới nhất yêu cầu.

Cú pháp, đối số, subcommand

Cách gọi skill: cú pháp, đối số vị trí, option dùng chung, rồi từng subcommand với cú pháp và kết quả riêng.

Cú pháp

/ak:web-design-guidelines [file-or-pattern]

Đối số

[file-or-pattern]

File cần review

Một hoặc nhiều file UI cụ thể hoặc pattern hẹp cần kiểm. Nếu bỏ trống, skill hỏi phạm vi review thay vì mặc định quét toàn bộ repository.

/ak:web-design-guidelines "src/components/account-dialog.tsx src/styles/theme.css"

Prompt mẫu

Ví dụ gọi command theo từng flag, subcommand, mode hoặc route dùng được trong workflow thực tế.

Audit một component Khuyến nghị 
/ak:web-design-guidelines src/components/AppHeader.tsx
Dùng khi:
Một file UI cần được review theo guideline về accessibility hoặc UX.
Kết quả:
Lấy Web Interface Guidelines mới nhất, chỉ đọc file component đó, áp toàn bộ luật và báo phát hiện ngắn dạng file:line.
Audit nhóm route 
/ak:web-design-guidelines "src/app/**/*.tsx"
Dùng khi:
Một nhóm route hoặc component có phạm vi rõ cần review theo Web Interface Guidelines.
Kết quả:
Lấy nguồn guideline, đọc các file UI khớp pattern, kiểm toàn bộ luật đã fetch và chỉ xuất phát hiện theo format guideline.
Hỏi phạm vi trước 
/ak:web-design-guidelines
Dùng khi:
Bạn muốn review UI nhưng chưa chọn file hoặc pattern cần kiểm.
Kết quả:
Hỏi cần review file hoặc pattern nào trước khi lấy guideline hiện tại và kiểm mã UI đã chọn theo các luật đó.

Phạm vi xử lý

  • Lấy guideline
  • Xác định mục tiêu
  • Đọc mã UI
  • Áp toàn bộ luật
  • Gắn bằng chứng
  • Báo ngắn gọn

Artifact tạo ra

Phát hiện theo guideline

Mẫu đường dẫn

phát hiện ngắn dạng file:line

Mỗi phát hiện trỏ tới mã UI vi phạm và theo đúng format output của guideline vừa lấy.

Tiếp theo