Giới thiệu
6 phút đọc2 tháng 6, 2026

Ian Xiaohei Illustrations: Biến bài viết tiếng Trung thành minh họa hand-drawn b

Một Codex Skill giúp AI tự phân tích bài viết và vẽ minh họa 16:9 phong cách hand-drawn với nhân vật "Tiểu Hắc" không cần designer, không cần Figma.

N

Nguyễn Nhật Long

@nguyennhatlong1303

Ian Xiaohei Illustrations: Biến bài viết tiếng Trung thành minh họa hand-drawn b

Bạn có bao giờ viết xong một bài blog dài, đọc lại thấy tường chữ dày đặc, rồi nghĩ: "Giá mà có vài cái hình minh họa cho nó dễ thở"? Rồi bạn mở Figma, ngồi 2 tiếng vẽ được một cái flowchart xấu ơi là xấu, cuối cùng lại xóa đi paste cái screenshot cho nhanh.

Mình vừa thấy một repo trên GitHub giải quyết đúng cái pain point này nhưng theo một cách khá bất ngờ.

Chuyện gì đang xảy ra?

Một developer tên Ian vừa open-source một project có tên ian-xiaohei-illustrations. Tính đến thời điểm hiện tại, repo đã có 1.6k stars146 forks con số không nhỏ cho một project mới chỉ có 6 commits.

Nhưng đây không phải một library hay framework thông thường. Đây là một Codex Skill tức là một bộ instruction set được thiết kế để "dạy" AI agent cách đọc hiểu bài viết tiếng Trung, tìm ra những điểm nhận thức quan trọng, rồi tự động generate ra minh họa hand-drawn cho từng đoạn.

Nhân vật chính trong mọi bức minh họa là "Tiểu Hắc" (小黑) một character đen thui, mắt chấm trắng, chân que, mặt vô cảm. Nghe mô tả thì buồn cười, nhưng nhìn output thì phải nói là ấn tượng.

Tại sao project này đáng chú ý?

Điều mình thấy hay nhất không phải là style vẽ mà là cách nó approach vấn đề minh họa.

Đa số chúng ta khi dùng AI generate hình, thường chỉ prompt kiểu: "Vẽ cho tôi một cái hình về teamwork" hay "Tạo illustration cho bài viết về microservices". Kết quả thường là những hình stock photo AI nhìn rất generic, chẳng liên quan gì đến nội dung cụ thể của bài.

Project này làm khác. Nó bắt AI phải:

  1. Đọc và phân tích bài viết trước tìm ra các "cognitive anchor" (điểm nhận thức then chốt)
  2. Chọn đúng một ý cho mỗi bức hình không nhồi nhét
  3. Phát minh ra một metaphor vật lý để diễn đạt ý đó
  4. Bắt Tiểu Hắc tham gia vào hành động chính không phải đứng trang trí
  5. Kiểm tra chất lượng theo một QA checklist cụ thể

Nói cách khác, nó không chỉ generate hình nó tư duy về editorial illustration rồi mới vẽ.

Ai nên quan tâm, ai không?

Mình tổng hợp lại để bạn dễ hình dung:

Phù hợpKhông phù hợp
Viết blog/article tiếng Trung cần minh họa chèn giữa bàiCần commercial illustration, brand KV chuyên nghiệp
Làm content về knowledge, methodology, AI workflowCần PPT infographic phức tạp, architecture diagram chi tiết
Muốn phong cách nhận diện cá nhân, quirky, khác biệtMuốn cute cartoon, sticker, emoji style
Dùng Codex và muốn reuse một visual language nhất quánCần editable SVG/vector source file
Thích minimalism ít chi tiết, nhiều whitespaceMuốn nhét nhiều text, giải thích dài vào một hình

Cách nó hoạt động

Về mặt technical, project này là một Codex Skill bạn cài nó vào thư mục skills của Codex, rồi gọi bằng prefix $ian-xiaohei-illustrations.

Setup khá đơn giản:

Terminal
1git clone https://github.com/helloianneo/ian-xiaohei-illustrations.git
2cd ian-xiaohei-illustrations
3mkdir -p "${CODEX_HOME:-$HOME/.codex}/skills"
4cp -R ./ian-xiaohei-illustrations "${CODEX_HOME:-$HOME/.codex}/skills/"

Sau đó bạn có thể dùng theo nhiều mode:

Chỉ lên plan, chưa vẽ

Bạn paste bài viết vào, AI sẽ phân tích và đưa ra shot list gồm 4-8 bức hình. Mỗi bức ghi rõ: đặt sau đoạn nào, chủ đề gì, Tiểu Hắc đang làm gì, gợi ý annotation tiếng Trung.

Vẽ luôn

Paste bài, AI generate thẳng PNG 16:9. Output mặc định lưu vào assets/<article-slug>-illustrations/.

Vẽ cho một concept đơn lẻ

Không cần cả bài viết bạn đưa một câu như "Niềm tin không phải hét lên mà có, mà phải lát từng viên gạch bằng chứng" và nó sẽ biến thành một bức minh họa.

Theo kinh nghiệm của mình khi dùng các AI image tool, việc có một bộ constraint rõ ràng như thế này (trắng nền, ít màu, một ý một hình) thường cho output ổn định hơn rất nhiều so với prompt tự do.

Cấu trúc bên trong

Nếu bạn tò mò về cách một Codex Skill được tổ chức, repo này là một case study khá gọn:

Điều mình appreciate là cách tác giả tách biệt rõ ràng giữa style definition, character spec, và quality control. Đây không phải kiểu "viết một cái mega prompt rồi cầu nguyện" mà là engineering một hệ thống có structure.

File/FolderVai trò
`SKILL.md`Entry point mô tả skill cho Codex
`agents/openai.yaml`Config cho AI agent
`references/style-dna.md`Định nghĩa DNA visual style
`references/xiaohei-ip.md`Spec của nhân vật Tiểu Hắc
`references/composition-patterns.md`Các pattern bố cục được phép dùng
`references/prompt-template.md`Template prompt cho image generation
`references/qa-checklist.md`Checklist kiểm tra output

Góc nhìn thật lòng

Mình thấy project này thú vị ở mấy điểm:

Thứ nhất, nó cho thấy trend "AI Skill as a product" đang hình thành. Bạn không cần build app, không cần UI chỉ cần một bộ instruction đủ tốt, package nó lại, và người khác có thể reuse. 1.6k stars chứng minh nhu cầu là thật.

Thứ hai, approach "đọc hiểu trước, vẽ sau" là đúng hướng. Đa số content creator đang dùng AI image generation sai cách họ nghĩ về hình trước khi nghĩ về ý. Project này lật ngược lại.

Thứ ba, và đây là điểm mình muốn thẳng thắn: project này hiện tại focus hoàn toàn vào tiếng Trung. Nếu bạn viết content tiếng Việt hay tiếng Anh, bạn sẽ cần fork và adapt khá nhiều đặc biệt phần annotation style và cách phân tích cognitive anchor. Không phải cứ dịch prompt là xong.

Thứ tư, output là PNG không phải vector. Nếu bạn cần chỉnh sửa sau đó, bạn sẽ gặp hạn chế. Đây là trade-off có chủ đích của tác giả, nhưng bạn cần biết trước.

Bạn có thể làm gì tiếp?

Nếu bạn đang làm content tiếng Trung, thử luôn setup mất 5 phút.

Nếu bạn viết tiếng Việt nhưng thích idea này, mình nghĩ có vài hướng đáng explore:

  • Fork và adapt cho tiếng Việt thay đổi annotation style, thêm Vietnamese-specific metaphor patterns
  • Học cách tác giả structure Codex Skill áp dụng cho use case khác của bạn (generate slide outline, tạo social media caption, v.v.)
  • Lấy cảm hứng từ QA checklist approach bất kể bạn dùng tool gì để generate hình, việc có một checklist rõ ràng sẽ giúp output consistent hơn nhiều

Đây là kiểu project mà giá trị lớn nhất không nằm ở code mà nằm ở tư duy thiết kế đằng sau nó. Cách tác giả decompose một bài toán mơ hồ ("vẽ hình minh họa cho bài viết") thành một pipeline có structure, có constraint, có quality gate đó là thứ đáng học hơn bất kỳ dòng YAML nào trong repo.

NN

Nguyễn Nhật Long

@nguyennhatlong1303

Nguyễn Nhật Long is a Senior Frontend Engineer and Frontend Team Leader with 7 years of experience building real-time fintech platforms. Specializing in React, Next.js, TypeScript, and React Native, shipping 10+ products across Web, Mobile, Telegram Mini-Apps, and Web3.

Thấy hay? Chia sẻ cho bạn bè!