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:tech-graph

Sơ đồ SVG/PNG chất lượng xuất bản

Sinh và kiểm tra sơ đồ chất lượng production cho kiến trúc, data flow, flowchart, sequence, agent/memory, UML, network, timeline, matrix và concept map với bảy phong cách hình ảnh.

01

Phân loại sơ đồ

02

Rút cấu trúc

03

Lập layout

04

Nạp style

Nguyên tắc 01

Loại sơ đồ quyết định luật layout

Nguyên tắc 02

Màu mũi tên phải mang ý nghĩa ngữ nghĩa

Nguyên tắc 03

Mỗi nhãn mũi tên cần có nền và khoảng cách an toàn

Nguyên tắc 04

Kiểm cú pháp là cần thiết nhưng chưa chứng minh hình ảnh đã đúng

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 Phân loại sơ đồ Chọn luật layout cho kiến trúc, data flow, flowchart, agent, memory, sequence, UML, ER, network, timeline, matrix hoặc concept map.
  2. 2 Rút cấu trúc Rút ra layer, node, cạnh nối, flow, nhóm ngữ nghĩa, loại dữ liệu, lifeline, trạng thái hoặc entity từ yêu cầu.
  3. 3 Lập layout Áp dụng spacing, grid, viewBox, grouping, hướng mũi tên và luật nhãn theo từng loại sơ đồ trước khi viết SVG.
02

Xử lý

Agent / skill thực thi

  1. 4 Nạp style Mặc định dùng style 1 flat icon hoặc nạp reference style theo số người dùng yêu cầu để lấy token và mẫu SVG chính xác.
  2. 5 Ánh xạ hình khối Ánh xạ user, LLM, agent, memory, tool, API, queue, file, decision và data sang bộ hình khối đã quy định.
  3. 6 Định tuyến mũi tên Gán ý nghĩa cho mũi tên, thêm legend khi có từ hai loại flow, đi vòng quanh node và dùng cung nhảy khi đường giao nhau.
03

Kiểm chứng

Gate, review, xác thực

  1. 7 Viết SVG Dùng script hỗ trợ hoặc phương pháp Python list bắt buộc, kèm defs, marker, font nhúng, nền cho nhãn và thẻ đóng đầy đủ.
  2. 8 Validate và export Chạy rsvg-convert để kiểm cú pháp, export PNG 1920px, rồi kiểm va chạm, tràn chữ, lỗi nhãn và bố cục rối.
  3. 9 Báo đường dẫn Trả đường dẫn SVG và PNG cùng hạn chế hình ảnh nếu không thể tự review được.

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:tech-graph [diagram-type or system description]

Đối số

[diagram-type or system description]

Brief sơ đồ

Nêu loại sơ đồ mong muốn hoặc mô tả hệ thống, luồng, kiến trúc, mô hình memory, cấu trúc UML, network, timeline, matrix hoặc concept map cần render thành SVG và PNG chất lượng xuất bản.

/ak:tech-graph architecture diagram for the auth service

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

Sơ đồ kiến trúc Khuyến nghị 
/ak:tech-graph draw the payment service architecture
Dùng khi:
Cần sơ đồ kiến trúc hệ thống đủ chất lượng để xuất bản.
Kết quả:
Phân loại layout, viết SVG, validate, export PNG và báo cả hai đường dẫn.
Luồng memory agent 
/ak:tech-graph visualize agent memory write and read paths
Dùng khi:
Sơ đồ cần tách đường ghi memory, đọc memory, retrieve và ghép context.
Kết quả:
Dùng luật kiến trúc memory, mũi tên có ngữ nghĩa, tách read/write path và legend rõ ràng.
Sơ đồ sequence 
/ak:tech-graph sequence diagram for checkout authorization
Dùng khi:
Cần minh họa tương tác theo thời gian giữa các participant.
Kết quả:
Dùng lifeline, activation box, message có thứ tự và frame loop hoặc alt khi cần.

Phạm vi xử lý

  • sơ đồ kiến trúc
  • sơ đồ memory agent
  • UML và ER
  • kiểm SVG
  • export PNG
  • tự review hình ảnh

Tiếp theo