Video đã giới thiệu nhanh về Claude Design - công cụ thiết kế mới của Claude, cho phép tạo prototype, slide, poster và giao diện chỉ bằng câu chữ. Tài liệu này sẽ đi sâu hơn: giải thích từng khái niệm cho người chưa từng thiết kế, đưa ra công thức viết prompt chuẩn, các prompt mẫu có sẵn nút copy, cách sửa lỗi thường gặp và một checklist đầy đủ trước khi bạn xuất bản sản phẩm. Đọc xong, bạn có thể tự mở Claude Design và tạo ra bản demo đầu tiên của riêng mình ngay trong buổi hôm nay.
Mục lục
- Claude Design là gì và ai dùng được
- Chuẩn bị trước khi bắt đầu
- Mở Claude Design lần đầu tiên
- Công thức viết prompt để Claude hiểu đúng ý
- Bảy bước thực hiện một dự án từ đầu đến cuối
- Ba prompt mẫu dùng được ngay: Poster, slide, demo app
- Kho câu lệnh chỉnh sửa nhanh sau khi có bản đầu tiên
- Lỗi thường gặp và cách xử lý
- Checklist trước khi xuất bản
- Ứng dụng Claude Design theo từng vai trò công việc
1. Claude Design là gì và ai dùng được
Claude Design - hiểu đơn giản: Đây là một khu vực làm việc riêng bên trong Claude, nơi bạn gõ ra ý tưởng bằng tiếng Việt (hoặc tiếng Anh) và Claude vẽ ra một sản phẩm nhìn thấy được, thay vì chỉ trả lời bằng chữ như khi bạn chat bình thường. Sản phẩm đó có thể là một trang demo bấm được, một bộ slide, một tấm poster, hay một giao diện ứng dụng.
Một vài từ sẽ xuất hiện nhiều lần trong tài liệu, xin giải thích trước để không ai bị lạc:
- Prototype: Bản dựng thử của một sản phẩm, trông và hoạt động gần giống bản thật, nhưng dùng để thử nghiệm ý tưởng chứ chưa phải bản chạy chính thức.
- Tương tác (interactive): Người xem có thể tự thao tác lên sản phẩm - bấm nút, rê chuột, kéo thả - chứ không chỉ đứng nhìn một tấm hình tĩnh.
- Prompt: Đoạn câu lệnh bằng lời bạn gõ ra để nói cho Claude biết bạn muốn gì. Prompt càng rõ ràng, kết quả càng đúng ý.
- Xuất file (export): Lưu sản phẩm bạn vừa tạo thành một file có thể mở ở nơi khác, ví dụ file PDF, file trình chiếu PPTX, hoặc gửi sang Canva để chỉnh tiếp.
Về điều kiện sử dụng: Claude Design hiện đang trong giai đoạn thử nghiệm sớm (research preview) và dành cho các gói trả phí của Claude - Pro, Max, Team và Enterprise. Tài khoản dùng gói miễn phí hiện chưa thấy được mục này. Nếu công ty bạn dùng gói Enterprise mà vẫn chưa thấy, khả năng cao là quản trị viên cần vào mục cài đặt tổ chức để bật tính năng lên trước[1].
Vì đây là tính năng đang thử nghiệm, giao diện có thể thay đổi theo thời gian. Nếu một vài chi tiết trong tài liệu này không khớp hoàn toàn với những gì bạn thấy trên máy, cứ làm theo tinh thần chung: mô tả ý tưởng, xem bản demo, rồi yêu cầu Claude chỉnh sửa dần.
2. Chuẩn bị trước khi bắt đầu
Bạn không cần biết vẽ, không cần biết lập trình. Thứ duy nhất cần chuẩn bị là sự rõ ràng trong đầu: bạn muốn tạo ra cái gì, cho ai xem và trông nó nên như thế nào. Hãy chuẩn bị ba nhóm thông tin sau trước khi mở Claude Design, viết ra giấy hoặc ghi chú điện thoại cũng được.
Xác định loại sản phẩm muốn tạo
Chọn một trong các nhóm quen thuộc sau, vì mỗi nhóm sẽ cần một kiểu prompt hơi khác nhau:
- Prototype tương tác: Ví dụ một hệ mặt trời bấm được, một app demo, một website mẫu.
- Nội dung trình bày: Slide thuyết trình, poster mạng xã hội, banner quảng cáo, ảnh bìa.
- Giao diện sản phẩm: Mockup website, mockup ứng dụng di động, wireframe (bản phác thảo bố cục trước khi làm chi tiết).
Ghi rõ nội dung cần đưa vào
Trước khi gõ prompt, hãy chuẩn bị sẵn tám mẩu thông tin sau. Không cần đủ cả tám, nhưng càng đủ thì Claude càng đỡ phải đoán:
| Thông tin | Ví dụ |
|---|---|
| Tên dự án hoặc sản phẩm | Khóa học AI Automation & Agentic AI |
| Mục tiêu của thiết kế | Kêu gọi đăng ký khóa học mới |
| Nội dung chính cần hiển thị | Tiêu đề, mô tả ngắn, nút kêu gọi hành động |
| Màu sắc mong muốn | Cam làm chủ đạo, nền tối |
| Phong cách thiết kế | Hiện đại, công nghệ, tối giản |
| Đối tượng người xem | Chủ doanh nghiệp nhỏ, người mới học AI |
| Kích thước hoặc định dạng | Tỉ lệ vuông 1:1 để đăng Instagram |
| Có cần tương tác không | Có, người xem bấm được vào từng mục |
Nếu công ty bạn đã có logo, mã màu thương hiệu hoặc ảnh chụp một thiết kế cũ, hãy chuẩn bị sẵn để tải lên cùng prompt. Claude Design đọc được ảnh và tài liệu (kể cả file DOCX, PPTX, XLSX) để hiểu phong cách thương hiệu của bạn ngay từ đầu.
3. Mở Claude Design lần đầu tiên
Mở Claude trên máy tính
Truy cập claude.ai bằng trình duyệt, hoặc mở ứng dụng Claude trên máy tính. Nên dùng máy tính (không phải điện thoại) để thao tác dễ hơn, vì màn hình lớn giúp bạn nhìn rõ bản demo khi Claude tạo ra.
Tìm mục Design
Nhìn vào thanh điều hướng bên trái màn hình, tìm chữ Design. Nếu chưa thấy, bạn có thể mở thẳng đường dẫn claude.ai/design - đây là cổng vào chính thức của Anthropic Labs[1].
Bắt đầu một dự án mới
Bấm nút tạo mới. Một ô nhập liệu trống sẽ hiện ra, đây chính là nơi bạn dán prompt đầu tiên vào.
Gõ hoặc dán prompt đầu tiên rồi gửi
Dán đoạn mô tả ý tưởng đã chuẩn bị ở phần 2, sau đó bấm gửi (hoặc phím Enter). Claude sẽ mất khoảng vài chục giây đến vài phút để dựng bản demo đầu tiên, tùy độ phức tạp.
Không thấy mục Design dù đã đăng nhập đúng gói trả phí? Đừng vội cho là mình làm sai. Tính năng đang được Anthropic mở dần cho từng tài khoản, hoặc khu vực của bạn có thể chưa được hỗ trợ. Hãy thử đăng xuất rồi đăng nhập lại, hoặc chờ vài ngày và kiểm tra lại.
4. Công thức viết prompt để Claude hiểu đúng ý
Đây là phần quan trọng nhất. Một prompt tốt giúp bạn tiết kiệm rất nhiều lần sửa đi sửa lại. Hãy đưa đủ sáu phần sau vào mỗi prompt, viết liền thành một đoạn văn tự nhiên, không cần đánh số:
- Bạn muốn tạo cái gì: Nêu rõ loại sản phẩm ngay câu đầu tiên. Ví dụ: "Tạo cho tôi một hệ mặt trời 3D tương tác."
- Đối tượng người xem là ai: Giúp Claude chọn đúng phong cách và mức độ đơn giản. Ví dụ: "Dành cho học sinh cấp 2."
- Phong cách thiết kế mong muốn: Mô tả cảm giác thị giác bạn muốn. Ví dụ: "Phong cách hiện đại, công nghệ, nền tối, có hiệu ứng ánh sáng vũ trụ."
- Chức năng tương tác cần có: Nói rõ người xem bấm/rê chuột vào đâu thì xảy ra chuyện gì. Ví dụ: "Người dùng bấm vào từng hành tinh để xem tên, kích thước, khoảng cách tới Mặt Trời và một sự thật thú vị."
- Bố cục mong muốn: Mô tả vị trí các khối nội dung. Ví dụ: "Hệ mặt trời nằm ở trung tâm, bảng thông tin hiện bên phải, tiêu đề nằm phía trên."
- Yêu cầu kỹ thuật hoặc xuất file: Nói rõ bạn cần bản demo chạy được hay cần file để chia sẻ. Ví dụ: "Thiết kế có thể chạy được dưới dạng demo tương tác và có thể xuất để chia sẻ."
Ghi nhớ công thức chuẩn này để dùng cho hầu hết mọi yêu cầu: "Tạo cho tôi [loại thiết kế] về chủ đề [chủ đề]. Đối tượng xem là [đối tượng]. Phong cách thiết kế [phong cách]. Màu chủ đạo [màu sắc]. Nội dung chính gồm [các phần chính]. Cần có tương tác [mô tả tương tác]. Bố cục cần [yêu cầu bố cục]. Kết quả cuối cùng phải [mục tiêu đầu ra]."
Prompt mẫu: Hệ mặt trời 3D tương tác
Copy nguyên đoạn dưới đây và dán thẳng vào ô chat của Claude Design:
Tạo cho tôi một hệ mặt trời 3D tương tác. Giao diện có nền vũ trụ tối, các hành tinh xoay quanh Mặt Trời theo quỹ đạo. Người dùng có thể bấm vào từng hành tinh để hiển thị bảng thông tin gồm: tên hành tinh, kích thước, khoảng cách đến Mặt Trời, thời gian quay quanh Mặt Trời và một sự thật thú vị. Thiết kế theo phong cách hiện đại, trực quan, dễ hiểu cho học sinh. Thêm hiệu ứng hover khi rê chuột vào từng hành tinh và animation chuyển động mượt.
5. Bảy bước thực hiện một dự án từ đầu đến cuối
Sau khi gửi prompt đầu tiên, đừng dừng lại. Claude Design hoạt động theo kiểu trò chuyện qua lại: bạn xem bản nháp, góp ý, Claude sửa, rồi lặp lại đến khi ưng ý. Dưới đây là quy trình bảy bước nên theo.
Chờ Claude tạo bản thiết kế đầu tiên
Claude sẽ tự phân tích prompt và dựng ra bản demo đầu tiên. Ở bước này, chưa cần chỉnh gì cả - chỉ cần nhìn tổng thể và tự hỏi: Bố cục đã đúng chưa, có đủ phần cần thiết chưa, màu sắc có đúng phong cách mong muốn không.
Thử thao tác trực tiếp trên bản demo
Nếu sản phẩm có tương tác, hãy tự tay thử: Rê chuột vào từng phần, bấm vào từng nút, kiểm tra bảng thông tin có hiện đúng không, xem chuyển động có mượt không. Đây là bước kiểm tra thật, không phải chỉ nhìn bằng mắt.
Mô tả lỗi bằng lời, đừng tự sửa tay
Nếu phát hiện lỗi, đừng cố tự chỉnh trực tiếp trên bản demo. Hãy mô tả lại cho Claude bằng câu chữ, càng cụ thể càng tốt. Ví dụ: "Khi tôi bấm vào Sao Hỏa thì bảng thông tin chưa hiện ra. Hãy sửa lại để mỗi hành tinh đều có thông tin riêng."
Dùng khu vực chỉnh sửa để tinh chỉnh từng phần
Sau bản đầu tiên, bạn có thể tiếp tục trò chuyện để yêu cầu chỉnh sửa, bình luận trực tiếp vào từng chi tiết trên bản demo, sửa chữ trực tiếp, hoặc kéo các thanh trượt điều chỉnh (do chính Claude tạo ra) để chỉnh khoảng cách, màu sắc, bố cục theo thời gian thực.
Chỉnh nội dung chữ nếu chưa đúng ý
Nếu phần văn bản chưa đúng, hãy yêu cầu cụ thể. Ví dụ: "Viết lại phần thông tin hành tinh ngắn gọn hơn, mỗi hành tinh chỉ gồm ba ý chính: Đặc điểm nổi bật, khoảng cách tới Mặt Trời và sự thật thú vị." Hoặc: "Dịch toàn bộ nội dung sang tiếng Việt, dùng ngôn ngữ dễ hiểu cho học sinh lớp 6."
Chỉnh phong cách hình ảnh tổng thể
Yêu cầu đổi cảm giác thị giác nếu cần. Ví dụ: "Làm phong cách giống website giáo dục hiện đại", hoặc "Dùng màu xanh tím neon", hoặc "Tăng độ chuyên nghiệp, giảm chi tiết rối."
Kiểm tra lại bản cuối trước khi chia sẻ
Trước khi xuất file, kiểm tra: Tất cả nút bấm có hoạt động không, nội dung có sai chính tả không, màu sắc có dễ nhìn không, bố cục có bị lệch không. Nếu dùng để đăng mạng xã hội, hãy kiểm tra thêm ở tỉ lệ và kích thước màn hình nhỏ.
Khi bản thiết kế đã ổn, bạn có thể chia sẻ đường dẫn nội bộ cho đồng nghiệp trong cùng tổ chức xem hoặc cùng chỉnh sửa, lưu vào một thư mục, hoặc xuất sang Canva, PDF, PPTX, hay một file HTML độc lập. Nếu bản thiết kế đã sẵn sàng để dựng thành sản phẩm thật, Claude còn có thể đóng gói toàn bộ thành một bộ bàn giao để đưa sang Claude Code chỉ bằng một câu lệnh[1].
6. Ba prompt mẫu dùng được ngay: Poster, slide, demo app
Ngoài prototype tương tác, Claude Design còn dùng tốt cho ba việc rất thường gặp dưới đây. Mỗi prompt chỉ cần bấm nút copy, dán vào ô chat của Claude Design và gửi đi - không cần tải file nào cả.
6.1. Poster mạng xã hội
Dùng khi cần một hình ảnh vuông đăng Facebook, Instagram, LinkedIn hoặc TikTok.
Tạo cho tôi một poster mạng xã hội tỉ lệ 1:1 để giới thiệu khóa học AI Automation & Agentic AI. Phong cách hiện đại, công nghệ, màu cam chủ đạo, có tiêu đề lớn: "Làm chủ AI Automation trong 30 ngày". Thêm phần mô tả ngắn: "Biến AI thành trợ lý 24/7 cho công việc và kinh doanh". Có nút kêu gọi hành động: "Đăng ký ngay". Bố cục rõ ràng, chuyên nghiệp, dễ đọc trên điện thoại.
Sau khi có bản đầu tiên: Yêu cầu chỉnh màu, font chữ, bố cục nếu cần, rồi kiểm tra chữ có dễ đọc trên màn hình điện thoại hay không trước khi xuất file để đăng bài.
6.2. Slide thuyết trình
Dùng khi cần dựng nhanh một bộ slide từ nội dung thô, chưa cần thiết kế từ đầu.
Tạo cho tôi một bộ slide thuyết trình 8 trang về chủ đề "Ứng dụng AI trong kinh doanh nhỏ". Phong cách hiện đại, chuyên nghiệp, màu cam và đen. Mỗi slide có tiêu đề rõ ràng, ít chữ, có icon minh họa. Cấu trúc gồm: Mở đầu, vấn đề, giải pháp AI, ví dụ thực tế, quy trình triển khai, công cụ gợi ý, lợi ích, kết luận và lời kêu gọi hành động.
Sau khi có bản đầu tiên: Đếm lại số lượng slide, chỉnh từng slide nếu nội dung quá dài và yêu cầu Claude làm gọn hơn nếu cần trước khi xuất sang PPTX để trình bày hoặc chỉnh tiếp.
6.3. Demo ứng dụng quản lý công việc
Dùng khi cần một bản demo có thể thao tác được, để gửi cho khách hàng hoặc đội ngũ kỹ thuật tham khảo trước khi làm bản thật.
Tạo cho tôi một demo app quản lý công việc cá nhân. Giao diện gồm màn hình dashboard, danh sách công việc, nút thêm task, bộ lọc theo trạng thái, lịch deadline và trang thống kê năng suất. Người dùng có thể bấm vào task để xem chi tiết. Phong cách hiện đại, tối giản, thân thiện với người mới dùng.
Sau khi có bản đầu tiên: Test thử từng nút và từng màn hình, yêu cầu sửa luồng thao tác nếu chưa hợp lý, rồi chia sẻ bản demo cho đồng đội, khách hàng hoặc người phụ trách kỹ thuật.
7. Kho câu lệnh chỉnh sửa nhanh sau khi có bản đầu tiên
Đừng yêu cầu sửa quá nhiều thứ trong một câu. Hãy sửa lần lượt từng nhóm: Bố cục trước, màu sắc sau, rồi tới nội dung chữ, hiệu ứng tương tác và cuối cùng là độ chuyên nghiệp tổng thể. Dưới đây là các câu lệnh có thể copy dùng ngay.
Nhóm câu lệnh chỉnh bố cục
- "Căn giữa toàn bộ nội dung chính."
- "Tăng khoảng cách giữa các phần."
- "Đưa nút kêu gọi hành động xuống cuối màn hình."
- "Làm tiêu đề nổi bật hơn."
Nhóm câu lệnh chỉnh màu sắc
- "Đổi màu chủ đạo sang cam và kem."
- "Giảm độ chói của màu nền."
- "Tăng độ tương phản giữa chữ và nền."
Nhóm câu lệnh chỉnh chữ
- "Rút gọn phần mô tả."
- "Viết lại nội dung dễ hiểu hơn."
- "Chuyển toàn bộ nội dung sang tiếng Việt."
Nhóm câu lệnh chỉnh tương tác
- "Thêm hiệu ứng hover khi rê chuột vào."
- "Khi bấm vào từng mục, hãy mở bảng thông tin tương ứng."
- "Thêm nút quay lại và nút đặt lại về trạng thái ban đầu."
Nhóm câu lệnh chỉnh độ chuyên nghiệp
- "Làm thiết kế cao cấp hơn, giảm chi tiết thừa."
- "Làm giống một sản phẩm SaaS chuyên nghiệp."
- "Làm bản này phù hợp để trình bày với khách hàng."
8. Lỗi thường gặp và cách xử lý
Không thấy mục Design
Kiểm tra lại gói tài khoản đang dùng (cần Pro, Max, Team hoặc Enterprise). Thử dùng trên máy tính thay vì điện thoại. Đăng xuất rồi đăng nhập lại. Nếu vẫn chưa thấy, tính năng có thể chưa được mở cho tài khoản hoặc khu vực của bạn.
Claude tạo sai phong cách mong muốn
Bổ sung mô tả phong cách rõ hơn thay vì chỉ nói chung chung. Ví dụ: "Thiết kế này đang hơi trẻ con. Hãy chỉnh lại theo phong cách chuyên nghiệp, cao cấp, giống landing page SaaS hiện đại."
Nội dung quá nhiều chữ
Yêu cầu Claude rút gọn cụ thể. Ví dụ: "Rút gọn toàn bộ nội dung, mỗi phần chỉ giữ lại một đến hai câu ngắn, ưu tiên tiêu đề mạnh và dễ đọc."
Tương tác chưa hoạt động đúng
Mô tả lỗi thật cụ thể, đừng chỉ nói "bị lỗi". Ví dụ: "Khi tôi bấm vào nút 'Xem thêm', chưa có gì xảy ra. Hãy sửa để nút này mở ra phần thông tin chi tiết."
Bố cục bị rối, quá nhiều chi tiết
Yêu cầu tối giản hóa. Ví dụ: "Thiết kế đang quá nhiều chi tiết. Hãy làm tối giản hơn, tăng khoảng trắng, giảm số lượng icon và chỉ giữ lại các phần quan trọng."
9. Checklist trước khi xuất bản
Trước khi gửi cho người khác hoặc đăng lên mạng xã hội, hãy rà lại đủ mười điểm sau. Mất chưa đến hai phút nhưng tránh được rất nhiều lần phải sửa lại sau khi đã chia sẻ.
- Tiêu đề đã rõ ràng và đúng trọng tâm chưa.
- Nội dung có dễ hiểu với người xem chưa biết gì về chủ đề không.
- Màu sắc có đồng bộ trong toàn bộ thiết kế không.
- Chữ có dễ đọc trên màn hình điện thoại không.
- Bố cục có bị lệch hoặc chồng chữ ở đâu không.
- Tất cả nút bấm và tương tác có hoạt động đúng không.
- Hiệu ứng chuyển động có mượt, không bị giật không.
- Có lỗi chính tả nào trong toàn bộ văn bản không.
- File xuất ra có đúng định dạng cần dùng không.
- Thiết kế có phù hợp với mục tiêu ban đầu đã đặt ra không.
10. Ứng dụng Claude Design theo từng vai trò công việc
Cùng một công cụ, nhưng mỗi vai trò công việc sẽ khai thác Claude Design theo một hướng khác nhau. Dưới đây là gợi ý cụ thể để bạn bắt đầu ngay với công việc của mình.
| Vai trò | Có thể dùng để |
|---|---|
| Người làm nội dung | Tạo hình minh họa cho bài viết, infographic, slide trình bày ý tưởng, mockup landing page |
| Marketer | Tạo poster chiến dịch, landing page demo, bài trình bày gửi khách hàng, banner quảng cáo |
| Chủ doanh nghiệp nhỏ | Tạo demo sản phẩm, tài liệu bán hàng, bản đề xuất, mockup website |
| Nhà thiết kế | Dựng concept ban đầu nhanh, tạo nhiều hướng thiết kế để so sánh, test ý tưởng trước khi làm chi tiết |
Ba nhóm dùng nhiều nhất theo ghi nhận thực tế từ các đội ngũ đã thử nghiệm: Dựng prototype tương tác thay cho việc code thủ công từng bản demo, biến bản phác thảo tĩnh thành bản có thể bấm thử để lấy phản hồi người dùng thật và dựng bài thuyết trình hoàn chỉnh chỉ từ một dàn ý sơ sài[1].