Claude Skill MartKhám phá skillCâu dùng ngayHọc qua videoDùng terminalSkill là gì?
← Về danh sách

Nhà phê bình thiết kế (critique)

Skill phê bình UI theo hướng đối kháng: render thật, chụp ảnh, rồi lập luận vì sao nên từ chối bản thiết kế.

Thiết kế · UITrung cấp★ 1,560⑂ 170Điểm AI 8/10Cập nhật lần cuối: 8 thg 10, 2026

Làm được gì

  • Đánh giá sản phẩm hiện tại (một file hoặc thư mục) trong ngữ cảnh fork hoàn toàn mới, không thấy cuộc hội thoại đã tạo ra nó — nhờ vậy nó phê bình hiện vật, không phê bình lời giải thích.
  • Từ chối phê bình "mù": bắt buộc render và chụp ảnh ở 1280px và 390px, cả light và dark, tắt transition, rồi bấm thử mọi control và ghi lại thay đổi thực tế.
  • Chạy các script của kit (taste_audit.mjs, slop_tells.mjs, verify_overflow.mjs, verify_responsive.mjs) để có số liệu cụ thể để dẫn chứng.
  • Xuất kết luận + 3 lý do một designer senior sẽ trả lại bản này + bảng findings kèm bằng chứng theo đúng định dạng trong .claude/agents/design-critic.md.
  • Cấm nhận xét chung chung: phải chỉ rõ tên file và phần tử, kiểu "khoảng cách 12px bên trong card bằng khoảng cách giữa các card nên nhóm bị đọc thành một khối".

Dành cho ai

  • Dev frontend muốn có một vòng review thiết kế khách quan, không nể nang.
  • Người làm sản phẩm một mình, cần lọc những UI "trông ổn nhưng vô vị" do AI tạo ra.
  • Nhóm đã dùng bộ kit gate của repo ux-ui-agent-skills.

Ví dụ sử dụng

  1. Sau khi /gate xanh, chạy critique src/components/PricingCard.tsx để nhận 3 lý do từ chối và bảng findings dựa trên ảnh light/dark.
  2. Chạy trên cả thư mục dashboard để có báo cáo kèm số liệu overflow và responsive ở mức zoom 1.25x.
  3. Sửa hết các finding Critical/Major, chạy lại critique và chỉ dừng khi chỉ còn finding Minor/Enhancement.

· · · Hướng dẫn cài đặt · · ·

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/plugin87/ux-ui-agent-skills/HEAD/.claude/skills/critique/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên Claude Skill Mart.
Copy thư mục .claude/skills/critique từ repo GitHub plugin87/ux-ui-agent-skills vào ~/.claude/skills/critique/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/plugin87/ux-ui-agent-skills.git ~/ux-ui-agent-skills && cd ~/ux-ui-agent-skills && npx ux-ui-agent-skills init

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Mở terminal và clone repo: git clone https://github.com/plugin87/ux-ui-agent-skills.git ~/ux-ui-agent-skills
  2. Vào thư mục vừa clone: cd ~/ux-ui-agent-skills
  3. Quan trọng: chỉ copy thư mục skill sẽ không chạy được. Tại thư mục gốc dự án, chạy npx ux-ui-agent-skills init để cài trọn bộ kit gồm tokens/, scripts/ và .claude/agents/design-critic.md (hoặc cài dưới dạng plugin của Claude Code).
  4. Kiểm tra Node.js đã có: node -v — các script của kit chạy bằng Node.
  5. Đảm bảo Claude Code từ phiên bản v2.1.218 trở lên, nếu không bạn chỉ nhận được thông báo "đã bắt đầu" mà không có bản phê bình.
  6. Khởi động lại Claude Code và gọi thủ công kèm mục tiêu, ví dụ /critique src/App.tsx (skill này tắt tự động gọi).
  7. Sửa các finding Critical/Major rồi chạy lại cho tới khi chỉ còn Minor/Enhancement.