Bỏ qua tới nội dung

Làm logo từ tin nhắn khách bằng Claude Code: 8 món, đúng từng dấu

Dán nguyên tin nhắn Zalo của khách, Claude Code tự rút ràng buộc, vẽ logo từ cái ghế của ông ngoại, dựng 8 món có mockup rồi soát lại từng dòng. Kèm kit.

Hướng dẫn13 phút đọc

Làm logo từ tin nhắn khách bằng Claude Code: 8 món, đúng từng dấu

Khách nhắn cho bạn một tin Zalo dài, kể chuyện nhà, chuyện cái ghế, chen giữa là vài yêu cầu rất cụ thể. Bài này thử giao nguyên tin nhắn đó cho Claude Code và xin một bộ nhận diện trọn vẹn: logo, màu, chữ, 8 món có mockup, gom vào một trang để gửi khách duyệt.

Đọc xong, bạn biết cách ra đề để Claude không bỏ sót ràng buộc nằm giữa câu chuyện, và vì sao một bộ nhận diện làm bằng AI vẫn có thể không sai một dấu tiếng Việt.

Muốn tự làm trước khi đọc tiếp: tải kit thực hành (.zip), làm theo HUONG-DAN.md trong kit. Tiệm, người, địa chỉ, số điện thoại trong kit đều giả, tạo để thực hành.

Màn đầu của trang trình bày Claude Code làm ra sau 45 phút.Cảnh mặt tiền tạo bằng Codex

Đề bài: 14 tin nhắn, ràng buộc nằm lẫn trong chuyện

Chị Tư Diệu mở tiệm hớt tóc Ghế Ngoại ở Mỹ Tho. Ông ngoại chị hớt tóc 41 năm dưới gốc me đầu chợ, trên một cái ghế sắt sơn xanh lá, tay vịn gỗ mòn lõm hai chỗ, đệm da nâu vá một miếng vuông. Chị mang cái ghế về đặt ngay cửa tiệm.

Đầu vào chỉ có hai thứ: file BRIEF.md chép nguyên 14 tin nhắn của chị, và một ảnh cái ghế. Mục "Cần làm" cuối brief chỉ ghi logo, màu chữ, bảng giá A3, thẻ tích điểm và file trình bày. Còn những điều dễ sai nhất lại nằm giữa câu chuyện:

Tin lúcChị nhắnVì sao dễ trượt
21:08Tên là cái GHẾ, dấu mũ dấu sắc, không phải "ghé". In GHÉ là chị không nhậnChữ hoa Ế có hai dấu chồng, dễ mất dấu mũ
21:12Biển là hộp đèn ngang dài 2,4 m, cao 40 cmKhông có trong "Cần làm"; tỉ lệ 6 : 1, logo vuông đặt vào sẽ bé xíu
21:13Thẻ đóng con dấu gỗ tròn 2 cm, mực tímKhông có trong "Cần làm"; logo phải sống được ở cỡ đồng xu, một màu
21:15Không trụ xoay, kéo, dao cạo bắt chéo, ria mép, đầu lâu; không đen với vàng kimĐây đúng là bộ hình và cặp màu quen của tiệm cắt tóc nam
21:18Mở 6 giờ sáng tới 7 giờ tối, nghỉ thứ HaiCâu kế bên nói "mấy tiệm kia mở cả tuần"
21:19, 21:204 dòng giá, địa chỉ 61 Ấp Bắc, số 0900 000 061Dễ bị làm tròn, đảo số, thành "Ấp Bấc"

Thử nghiệm này đo một điều: Claude có tự nhặt ra những ràng buộc khách nói lẫn trong chuyện, rồi giữ đúng tới món cuối cùng hay không.

Giao việc: một prompt 8 dòng

Thử nghiệm chạy trên Claude Code, tab Code của app Claude (Claude làm việc ngay trên thư mục trong máy, tự chạy lệnh, xem thêm Claude Code là gì). Thư mục chỉ có BRIEF.md và ảnh cái ghế. Chế độ quyền để Tự động, nên Claude không dừng lại hỏi từng lệnh.

Prompt dán vào nguyên văn:

Văn bản
Dùng skill brand-identity-design.
Đọc BRIEF.md và ảnh ghe-ong-ngoai.png trong thư mục này, rồi làm logo cùng bộ nhận diện cho tiệm hớt tóc Ghế Ngoại.
Trước khi vẽ, chép mọi ràng buộc của khách trong tin nhắn ra file ra/rang-buoc.md: logo sẽ nằm ở đâu, kích thước bao nhiêu, chữ nào phải đúng, khách cấm gì.
Trước khi báo xong, soát lại từng dòng trong file đó trên kết quả, ghi đạt hay chưa.
Làm tổng 5–8 món hợp một tiệm hớt tóc, mỗi món có bản phẳng và mockup.
Trên trang, nói rõ logo nói gì với người đi ngang, và vì sao chọn hình, nét, màu, chữ của logo: mỗi lựa chọn gắn với câu nào trong tin nhắn của khách.
Kết quả là một file ra/trinh-bay.html.
Tự quyết, không cần hỏi lại.
Gửi prompt xong, Claude Code tự lập danh sách 7 việc rồi bắt đầu nạp skill.

Mỗi dòng có một việc:

  • Dòng 1 gọi tên skill. Skill ở đây là Agent Skills: một thư mục có file SKILL.md cùng các script, dạy Claude một nghề cụ thể. brand-identity-design do xưởng viết, kèm trong kit. Nó bắt Claude mở nhiều hướng trước khi chọn, gọi Codex (công cụ của OpenAI, có tạo ảnh) vẽ phác nét tay và cảnh mockup, rồi ghép chữ thật vào.
  • Dòng 2 đưa nguyên văn, không tóm tắt hộ. Tóm tắt là chỗ ràng buộc rơi mất.
  • Dòng 3 và 4 là cặp quan trọng nhất: chép ràng buộc ra file trước khi vẽ, rồi soát lại đúng danh sách đó trước khi nộp. Prompt không nói ràng buộc nào nằm ở đâu, chỉ yêu cầu thói quen.
  • Dòng 6 bắt Claude giải thích logo bằng chính lời của khách, để người duyệt thấy lý do chứ không chỉ thấy hình.
  • Dòng 8 để Claude chạy một mạch.

Claude làm gì trong 45 phút

Gửi prompt lúc 01:18, Claude Code báo xong lúc 02:04: khoảng 45 phút, không hỏi lại lần nào. Thư mục ra/ có 195 file, trong đó 14 ảnh do Codex vẽ (3 tờ phác tay và 11 cảnh mockup).

  1. Chép ràng buộcGhi ra ra/rang-buoc.md trước khi vẽ
  2. Phác tayCodex vẽ ba hướng, mỗi tờ bốn kiểu
  3. Vẽ lại nétChọn một hướng, vẽ thành vector
  4. Dựng 8 mónBản phẳng đúng khổ, ghép vào cảnh
  5. Soát lạiTừng dòng ràng buộc, ghi đạt hay chưa
Ràng buộc được chép ra trước khi vẽ và được soát lại ở cuối.

File ra/rang-buoc.md có 25 dòng chia 5 nhóm: logo nằm ở đâu, chữ nào phải đúng, khách cấm gì, chị thương gì, yêu cầu giao. Hai ràng buộc nằm ngoài "Cần làm" đều có mặt, kèm hệ quả cho thiết kế. Ví dụ dòng về hộp đèn:

Biển là hộp đèn ngang dài 2,4 m, cao 40 cm (tỉ lệ 6 : 1) … Logo chính phải nằm ngang, đọc được từ xe máy chạy ngang. Giao một file biển đúng 2400 × 400 mm (vector + PNG), có ghi lề an toàn.

Giữa chừng, Claude tự bắt lỗi của chính mình: bản logo một màu đặt trên nền tối bị mất hình cái ghế, cảnh mockup Codex vẽ có tấm bảng và tấm thẻ lệch tỉ lệ, lá me vẽ ra giống cành ô-liu. Mỗi lỗi được sửa trước khi đi tiếp.

Phút thứ 23: Claude tự xem ảnh kiểm, ghi lỗi và sửa trước khi dựng món.

Logo nói gì, và vì sao là cái ghế này

Logo là chính cái ghế của ông ngoại, nhìn thẳng, có miếng vá vuông màu nâu. Trang trình bày dành hẳn hai màn để giải thích, đúng như dòng 6 của prompt yêu cầu.

Màn 02 của trang trình bày Claude dựng.Ảnh cảnh và ảnh cái ghế tạo bằng Codex

Claude viết câu logo nói với người đi ngang:

"Cái ghế ở cửa là ghế của ông ngoại. Vô ngồi đi, hớt kiểu cũ, không vội."

Rồi chia theo khoảng cách người nhìn:

  1. Từ xe máy: đọc được một nhịp hai chữ Ghế Ngoại, có hình cái ghế đứng bên cạnh.
  2. Nhìn xuống cửa: cái ghế thật nằm ngay dưới biển, khung xanh, đệm nâu, đúng hình trên biển. Biển với ghế nói cùng một câu.
  3. Lại gần: miếng vá vuông, chỗ ai ngồi cũng sờ, là mảng nâu duy nhất trên logo. Ai biết ông Sáu thì nhận ra liền.

Cả màn gắn với tin 21:07 của chị Tư: "mang cái ghế về đặt ngay cửa, khách đi ngang là thấy".

Màn 03: năm chỗ trên hình, mỗi chỗ một lý do.

Màn 03 đánh số năm chỗ trên hình, mỗi chỗ một lý do, tất cả dẫn về tin 21:05:

  1. Tựa đầu, lưng cao, trụ tròn: ai đi ngang cũng biết là ghế hớt tóc, không cần thêm kéo hay trụ xoay.
  2. Hai tay vịn gỗ, mỗi bên hai chỗ lõm, đúng chỗ khách đặt tay.
  3. Miếng vá vuông khâu tay, hơi lệch: chi tiết của riêng cái ghế này, không tiệm nào có.
  4. Khung sắt xanh, đệm da nâu: màu lấy từ chính ảnh chị gửi.
  5. Mép hơi run như cọ sơn, vì ông tự sơn lại ghế mấy lần. Run nhẹ thôi, để còn khắc dấu 2 phân, thêu, in hộp đèn được.

Ý 1 đáng chú ý: cái ghế được chọn một phần vì nó tự nói "tiệm hớt tóc", nên không cần tới kéo hay trụ xoay mà khách đã cấm.

Ba hướng phác, chọn hướng nhìn thẳng

Codex vẽ ba tờ phác tay, mỗi tờ bốn kiểu. Claude bỏ hướng nhìn nghiêng vì "ra đúng hình ghế cắt tóc mà tiệm nào cũng dùng", giữ hướng dưới gốc me làm họa tiết vì "nhiều lá quá: khắc dấu 2 phân sẽ bít hết", và chọn hướng nhìn thẳng: "miếng vá ngay giữa, hai tay vịn dang ra như mời ngồi. Đối xứng nên in lên áo choàng, khách soi gương vẫn y vậy."

Màn 04: ba tờ phác tay và lý do chọn, bỏ.Tờ phác tạo bằng Codex

Chữ: GHẾ phải ra GHẾ, kể cả từ bên kia đường

Đây là bẫy chính của đề. Claude chọn font Chonburi (dáng chữ kẻ biển hiệu miền Nam ngày xưa), rồi phát hiện ở font gốc dấu mũ mảnh như sợi tóc: "nhìn xa là mất, còn lại mỗi dấu sắc, thành ra 'Ghé'". Claude làm dày dấu mũ, tách riêng dấu sắc, và đặt bản gốc cạnh bản sửa ở cỡ nhìn xa để chị Tư tự so.

Màn 05: font gốc và bản sửa dấu mũ, ở cỡ lớn và cỡ nhìn xa.

Tên tiệm là nét vector, không phải chữ máy vẽ ảnh viết ra. Giá, giờ, địa chỉ cũng là chữ thật đặt bằng font Pridi. Vì vậy dấu đúng ở mọi món.

Màu đi cùng lối nghĩ đó: 7 màu đều lấy từ cái ghế và câu chuyện (xanh sơn ghế, nâu miếng vá, nâu da đệm, gỗ tay vịn, trắng khăn nóng, xanh chỗ sơn tróc, tím mực dấu). Màu gỗ tay vịn thay cho màu đen, nên cả bộ không có cặp đen với vàng kim khách cấm.

8 món, mỗi món một bản phẳng và một mockup

Claude làm đủ 8 món: biển hộp đèn, bảng giá A3, thẻ tích điểm kèm con dấu, tạp dề thợ, áo choàng khách, túi giấy, ly trà đá, bài đăng khai trương. Mockup là cảnh trống do Codex vẽ, thiết kế thật ghép vào, nên chữ trên mockup đúng như bản phẳng.

Biển hộp đèn: bản phẳng đúng tỉ lệ 6 : 1, kèm file in vector 2400 × 400 mm.Cảnh mặt tiền tạo bằng Codex

Biển đúng khổ anh thợ quảng cáo cần (máy đo bản phẳng 6,00 : 1). Biển chỉ ghi số điện thoại, không ghi địa chỉ, để chữ tên đủ to; Claude giải thích vì biển treo ngay tại địa chỉ đó.

Bảng giá A3: miếng vá giữ dòng nghỉ thứ Hai.Cảnh tường tạo bằng Codex
Thẻ tích điểm: 9 ô vừa con dấu 2 cm, chia hai mặt.Cảnh quầy tạo bằng Codex

Hai quyết định ở đây Claude tự nêu ra trong câu trả lời cuối:

  • Thẻ: 9 vòng 2 phân có chừa chỗ tay đóng lệch thì không vừa một mặt thẻ 85 × 55 mm. Claude chia mặt sau 6 ô, mặt trước 3 ô, ô thứ mười là miếng vá "Lần 10 hớt tặng".
  • Bảng giá: bốn dòng giá chép đúng từng chữ; "Cạo mặt, đắp khăn nóng" chỉ xuống dòng sau dấu phẩy cho vừa khổ.
Con dấu 2 cm: bản vẽ lại riêng, không thu nhỏ bản lớn.Cảnh con dấu tạo bằng Codex

Ở cỡ đồng xu, Claude vẽ lại logo riêng: bỏ đường chỉ khâu, bỏ chỗ lõm tay vịn, nới khe, làm miếng vá to hơn. Trong dấu không có chữ, vì "chữ có dấu tiếng Việt cao chưa tới 2 li, khắc gỗ đóng mực tím dễ nhòe".

Tạp dề: túi ngực là miếng da nâu như miếng vá đệm ghế.Ảnh người mẫu giả tạo bằng Codex
Áo choàng: không có chữ, vì khách nhìn gương sẽ thấy chữ ngược.Ảnh người mẫu giả tạo bằng Codex

Áo choàng là chi tiết cho thấy Claude nghĩ tới nơi dùng: mặt trước không in chữ vì khách ngồi nhìn vô gương; hình ghế nhìn thẳng thì đối xứng, soi gương vẫn y vậy.

Soát lại: Claude tự chấm, máy chấm lại

Màn cuối của trang là danh sách "Chị dặn gì, em giữ đó", mỗi dòng một ràng buộc kèm cách đã giữ. Trong ra/rang-buoc.md, cột "Soát" ghi rõ dòng nào soát bằng máy (quét chữ trong mã nguồn các món, đo khổ file in) và dòng nào soát bằng mắt.

Màn 18: soát từng dòng chị dặn, và việc chị cần làm tiếp.

Tự chấm thì chưa đủ, nên xưởng chạy thêm một máy chấm riêng trên kết quả. Kết quả: 10 đạt, 0 trượt, 2 cần xem lại.

Phép đoKết quả
Tên "Ghế Ngoại" đúng dấu17 chỗ đúng. 2 chỗ "ghé Ngoại" máy báo nghi, xem lại thì đều nằm trong ngoặc, là trích nguyên tin 21:08 của khách
Địa chỉ "Ấp Bắc"11 chỗ, 0 chỗ sai
Biển hộp đèn tỉ lệ 6 : 1Bản phẳng 1920 × 320, đúng 6,00 : 1
Màu vàng kim trong mã màu của trang0 trên 14 mã màu
Giờ mở cửa, nghỉ thứ Hai, 4 dòng giá, số điện thoạiĐủ, đúng từng số
Danh sách ràng buộcĐủ 6/6 nhóm: hộp đèn, con dấu, tên, món cấm, màu cấm, ngày nghỉ
Trang tự chứa41 tài nguyên (ảnh, font) đều nhúng sẵn, gửi một file là đủ
Số mónMáy đếm 10 nhóm ảnh (nghi); xem bằng mắt đúng 8 món, 2 nhóm dư là màn các bản logo và màn con dấu

Soi bằng mắt: chữ Ế trên logo và biển phóng to đủ dấu mũ và dấu sắc, không thành É; con dấu một màu tím; không thấy trụ xoay, kéo, dao cạo, ria mép, đầu lâu.

Có một chi tiết vui: tiêu đề phiên mà app tự đặt cho cuộc trò chuyện lại viết "Ghế Ngoài". Sai dấu ngay ở chỗ không ai dặn soát, đúng loại lỗi mà bài này muốn chặn trên ấn phẩm.

Câu trả lời cuối: Claude nói rõ ba chỗ tự quyết và ba điều còn chưa chắc.

Chỗ chưa xong

Claude tự ghi ba điều chưa chắc, và cả ba đều đúng là việc ngoài màn hình:

  • Chưa in thử bạt hộp đèn, nên chưa biết màu xanh khi bật đèn khác màn hình bao nhiêu.
  • Chưa khắc thử con dấu 2 phân; file đọc được ở cỡ thật, thực tế còn tùy thợ khắc và độ đẫm mực.
  • Chưa có ngày khai trương, nên bài đăng ghi "Sắp khai trương".

Xưởng đo thêm trang trình bày bằng bộ máy đo thiết kế:

  • Font và dấu: đạt. 7 kiểu chữ (Chonburi, Pridi) đều do đúng font vẽ, 0 chữ thiếu dấu, 0 ô vuông.
  • Không tràn ngang ở cả khổ 1920 px và khổ điện thoại 390 px.
  • Độ tương phản: có 3 cặp màu chữ nhỏ dưới mức 4,5 : 1 (mức khuyến nghị cho chữ đọc): chú thích xám #7B7268 trên nền kem #F4F2ED (4,22 : 1), nhãn "món n/8" nâu #A86F45 trên kem (3,74 : 1), chữ xanh nhạt #A9C2A4 trên nền xanh #3F6A50 (3,23 : 1) ở dải tên màn đầu và chữ mô tả màn cuối. Muốn gửi khách bản chỉn chu hơn, bạn có thể bảo Claude làm đậm ba màu chữ này.

Còn một điều chưa kiểm: hình cái ghế không bị đọc thành ghế nha khoa mới chỉ qua mắt người làm, chưa hỏi người lạ.

Hai bài học mang sang việc khác

  1. Đưa nguyên văn, bắt chép ràng buộc trước, soát theo đúng danh sách đó sau. Hai ràng buộc nặng nhất của đề (hộp đèn 6 : 1, con dấu 2 cm) không nằm trong mục "Cần làm". Bạn không cần chỉ cho Claude chỗ đó; chỉ cần bắt nó viết danh sách ra file rồi chấm lại theo file.
  2. Ảnh để máy vẽ, chữ phải ghép thật. Codex lo nét tay và cảnh mockup trống, không chữ. Tên, giá, địa chỉ là chữ thật đặt vào sau, nên đúng từng dấu. Cách này dùng được cho bao bì, poster, menu, slide, bất cứ việc nào trộn ảnh AI với chữ tiếng Việt.

Tự làm lại với kit

Bạn cần:

  • Claude Code (tab Code của app Claude, hoặc bản dòng lệnh). Xưởng quay trên gói Team, mô hình Opus 5.5.
  • Python 3 có Playwright và Pillow, uv (công cụ chạy script Python), Google Chrome, và có mạng để skill tải font Google.
  • Codex, tùy chọn: Codex CLI đăng nhập bằng tài khoản ChatGPT, để vẽ phác tay và cảnh mockup. Lần quay này dùng 14 ảnh Codex.

Các bước:

  1. Giải nén skill/brand-identity-design.zip trong kit vào thư mục skill cá nhân của Claude Code (~/.claude/skills/ trên macOS, Linux; %USERPROFILE%\.claude\skills\ trên Windows), rồi mở lại Claude Code.
  2. Tạo một thư mục trống, chép BRIEF.md và ghe-ong-ngoai.png vào, mở thư mục đó trong Claude Code, chọn chế độ quyền Tự động.
  3. Dán nguyên prompt.txt, gửi, để Claude chạy.
  4. Mở ra/trinh-bay.html bằng Chrome, bấm F11, cuộn từng màn. Tự chấm bằng tu-cham.md, làm xong mới mở dap-an/.

Tải kit thực hành (.zip)

Viết bởi Thế cho AI247. Thấy hữu ích? Hãy chia sẻ cho người cần.

FacebookX