Ctrl K

Tóm tắt nhanh / Lệnh

Bộ Engineer

/ak:ui-ux-pro-max

Trí tuệ thiết kế UI/UX

Cung cấp trí tuệ thiết kế UI/UX đóng gói, có thể tìm kiếm cho độ hợp product, style, palette màu, typography, cấu trúc landing, chart, accessibility, tương tác, responsive, polish app và hướng dẫn stack React Native.

Quyết định kích hoạt

Phân tích yêu cầu

Sinh design system

Lưu phân cấp

Nguyên tắc 01

Nếu giao diện được nhìn, cảm, chuyển động hoặc tương tác, luật UI/UX phải được áp dụng

Nguyên tắc 02

Bắt đầu từ design system đầy đủ rồi mới đào sâu từng domain

Nguyên tắc 03

Accessibility và touch là yêu cầu nghiêm trọng, không phải polish

Nguyên tắc 04

Token ngữ nghĩa tốt hơn màu hex rải rác theo từng mà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.

Khởi động

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

1 Quyết định kích hoạt Dùng skill khi công việc thay đổi cách giao diện nhìn, cảm, chuyển động, có cấu trúc hoặc được tương tác.
2 Phân tích yêu cầu Rút ra product type, đối tượng dùng, bối cảnh sử dụng, từ khóa style, nền tảng và stack.

Xử lý

Agent / skill thực thi

3 Sinh design system Bắt đầu bằng tìm kiếm design-system để kết hợp product, style, màu, landing, typography, luật suy luận và anti-pattern.
4 Lưu phân cấp Khi cần dùng lâu dài, lưu MASTER.md và override theo page nếu có; file page sẽ ưu tiên hơn Master cho page đó.

Kiểm chứng

Gate, review, xác thực

5 Tìm sâu theo domain Truy vấn các domain product, style, color, typography, chart, UX, google-fonts, landing, react, web hoặc prompt cho từng quyết định cụ thể.
6 Áp dụng theo stack Dùng hướng dẫn theo stack như điều hướng React Native, hiệu năng list, accessibility label, vùng chạm và safe area.

Đóng

Báo cáo, bàn giao, artifact

7 Triển khai theo luật Áp dụng luật ưu tiên cho accessibility, touch, hiệu năng, style, layout, typography, animation, form, navigation và chart.
8 Review trước bàn giao Chạy validation UX và các mục critical/high trên điện thoại nhỏ, landscape, dark mode, reduced motion và dynamic text lớn.

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:ui-ux-pro-max [UI/UX task brief]

Đối số

[UI/UX task brief]

Brief tác vụ UI/UX

Brief ngôn ngữ tự nhiên tùy chọn mô tả trải nghiệm hiển thị cần thiết kế, review, sửa, cải thiện hoặc chuyển thành design system. Nên nêu loại sản phẩm, người dùng, stack, page hoặc component, từ khóa phong cách, ràng buộc và artifact mong muốn khi biết.

/ak:ui-ux-pro-max design an accessible mobile-first checkout system for a subscription app with dark mode

Tính năng đặc biệt

Search design-system của CLI đóng gói

Skill không có mode flag top-level được tài liệu hóa. CLI search đi kèm có thể kết hợp dữ liệu product, style, màu, landing, typography và reasoning đóng gói để tạo khuyến nghị baseline.

Domain tập trung của CLI đóng gói

Search tập trung thuộc các dataset CLI đóng gói như style, color, typography, chart, ux, react hoặc web; dùng chúng như hướng dẫn tại một thời điểm, không phải chuẩn live.

Chỉ persist khi đã duyệt

CLI đóng gói có thể persist master design system đã duyệt và override theo page dưới design-system; review tên, path, token và ảnh hưởng migration trước khi ghi.

Ranh giới dataset React Native

React Native là dataset stack-specific duy nhất trong CLI đóng gói. Không suy diễn hỗ trợ các stack chưa được tài liệu hóa từ mô tả Skill.

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ế.

Sinh design system Khuyến nghị

/ak:ui-ux-pro-max design an accessible mobile-first checkout system for a subscription app with dark mode, reduced motion, and implementation-ready tokens

Dùng khi:: Dùng khi trang mới hoặc khu vực product cần style, palette, typography, layout, state và anti-pattern có lý do trước khi viết code.
Kết quả:: Định khung product context, bắt đầu từ search design-system đóng gói, rồi trả hướng được chọn và bị loại, token ngữ nghĩa, thang type/spacing, luật responsive, state component và yêu cầu accessibility.

Review UI hiện có

/ak:ui-ux-pro-max review this checkout page for accessibility, trust, loading, error, empty states, and mobile interaction

Dùng khi:: Dùng khi page, component, navigation pattern, form, animation hoặc mobile interaction hiện có cần review UX và accessibility theo mức ưu tiên.
Kết quả:: Áp dụng các nhóm ưu tiên từ accessibility và touch đến performance, layout, form, navigation và chart, rồi báo anti-pattern cụ thể, cách sửa và bằng chứng còn cần kiểm.

Lưu rule đã duyệt

/ak:ui-ux-pro-max create a master design system for a wellness booking app and add page-specific checkout overrides

Dùng khi:: Dùng khi project cần master design system có thể tái dùng và ngoại lệ theo page thay vì hướng dẫn terminal một lần.
Kết quả:: Chỉ dùng workflow persist cho rule đã duyệt, giải thích phân cấp MASTER.md và override trong pages, đồng thời nêu tên, path, token và rủi ro migration trước khi ghi.

Chọn hướng chart

/ak:ui-ux-pro-max recommend accessible charts for realtime analytics with keyboard tooltips, legends, empty states, and failure states

Dùng khi:: Dùng khi màn hình nhiều dữ liệu cần loại chart khớp task của user, ràng buộc thiết bị và yêu cầu accessibility.
Kết quả:: Ghép loại chart với task trend, comparison, proportion hoặc funnel và kèm giản lược responsive, legend, tooltip, khả năng dùng bằng keyboard, contrast, bảng hoặc text thay thế và xử lý lỗi.

Phạm vi xử lý

accessibility
tương tác chạm
layout responsive
màu và typography
animation
form
navigation
chart
UX React Native