Tracks
Cơ bản về Trí tuệ Nhân tạo
10 giờ
Claude Design hoạt động như thế nào?
Hai khung: chat bên trái, canvas trực tiếp bên phải. Bạn viết prompt, Claude tạo thiết kế trên canvas, rồi bạn tiếp tục tinh chỉnh. Anthropic mô tả vòng lặp gồm năm bước:
- Tạo một dự án với ngữ cảnh phù hợp
- Mô tả điều bạn muốn
- Xem xét đầu ra
- Lặp lại qua chat và bình luận
- Xuất hoặc chia sẻ
Điểm khiến tôi chú ý là hành vi hỏi làm rõ. Khi prompt mơ hồ, Claude có thể tạm dừng để hỏi những gì còn thiếu thay vì vẽ ngay điều đầu tiên nó suy đoán.
Bảng chat bên trái, canvas được tạo bên phải. Hình ảnh: Tác giả.
Giờ hãy xem từng phần của vòng lặp đó trong thực tế.
Thiết lập dự án và bổ sung ngữ cảnh
Các dự án mới kế thừa hệ thống thiết kế đã xuất bản của tổ chức, nên tài sản thương hiệu sẽ không cần tải lại khi đã có thiết lập đó.
Hướng dẫn thiết lập khuyên bạn cung cấp cho Claude ngữ cảnh thực ngay từ đầu: ảnh chụp màn hình, mockup, bộ slide theo phong cách bạn thích và kho mã nếu có. Nếu cần thêm thông tin, Claude có thể hỏi làm rõ trước khi vẽ, qua đó lộ ra những chi tiết bạn quên chỉ định.
Prompt tốt bao gồm bốn phần: mục tiêu, bố cục, nội dung và đối tượng. Ví dụ prompt: "Tạo một dashboard hiển thị doanh thu theo tháng với bộ lọc theo khu vực và dòng sản phẩm" và "Thiết kế luồng onboarding ứng dụng di động với 4 màn hình."
Lặp trên canvas
Có nhiều cách để đẩy thiết kế tiến lên sau bản nháp đầu tiên.
- Chat xử lý các thay đổi rộng (chủ đề tối hơn, hai hoặc ba phương án bố cục)
- Bình luận inline nhắm vào một phần tử cụ thể mà không cần giải thích vị trí
- Chỉnh sửa văn bản trực tiếp để sửa nội dung mà không cần prompt
- Các thanh trượt điều chỉnh tùy chỉnh để tinh chỉnh khoảng cách, màu sắc và bố cục theo thời gian thực
Một điểm khó chịu từ ngày đầu: đôi khi bình luận biến mất trước khi Claude đọc được. Giải pháp đã được ghi nhận là dán lại nội dung vào ô chat. Khó chịu, nhưng nên biết trước khi bạn phụ thuộc vào bình luận cho phần review.
Phiên bản, chia sẻ và xuất
Để giữ bản nháp hiện tại và thử hướng khác, Anthropic gợi ý bạn nói với Claude kiểu như "lưu những gì ta đang có và thử một cách tiếp cận hoàn toàn khác."
Chia sẻ theo phạm vi tổ chức, với quyền riêng tư, chỉ xem, bình luận và chỉnh sửa; quyền chỉnh sửa cho phép đồng đội sửa thiết kế và trò chuyện với Claude trong cùng cuộc hội thoại.
Menu Export ở góc trên bên phải, bao phủ các định dạng tệp phổ biến, chuyển giao sang Canva và gói chuyển giao sang Claude Code.
Bạn có thể xây dựng gì với Claude Design?
Thông báo ra mắt nêu sáu loại đầu ra từ người dùng tiền phát hành. Dưới đây là từng loại kèm ghi chú ngắn:
- Nguyên mẫu thực tế: biến mockup tĩnh thành nguyên mẫu tương tác có thể chia sẻ và kiểm thử người dùng mà không cần review code hay pull request.
- Wireframe và mockup sản phẩm: các luồng tính năng có thể chuyển giao cho Claude Code hoặc chuyển cho nhà thiết kế để đánh bóng.
- Khám phá thiết kế: thử nhanh nhiều hướng, dành cho nhà thiết kế vốn phải tiết kiệm thời gian khám phá.
- Pitch deck và bài thuyết trình: từ dàn ý thô đến bộ slide đúng thương hiệu, có xuất
PPTXhoặc gửi sang Canva. - Tài liệu marketing: trang đích, tài sản mạng xã hội và hình ảnh chiến dịch.
- Thiết kế tiên phong: nguyên mẫu dùng code với giọng nói, video, shader, 3D hoặc AI tích hợp. Đây là hạng mục thử nghiệm nhất trong sáu loại, và tôi sẽ quay lại các câu hỏi mở của nó ở phần giới hạn.
Nguyên mẫu onboarding di động được tạo trên canvas. Hình ảnh: Tác giả.
Hướng dẫn quản trị bổ sung microsite và trang đích như một danh mục riêng. Lời chứng thực khi ra mắt của Anthropic tập trung vào tốc độ và khả năng đi từ ý tưởng đến nguyên mẫu trong một cuộc họp duy nhất; hãy coi đó là minh họa chứ không phải phổ quát, vì các tài liệu này cũng chỉ ra những điểm gồ ghề ở các đầu ra mang tính thử nghiệm hơn.
Cách Claude Design sử dụng hệ thống thương hiệu và thiết kế
Phần này quan trọng vì nó thay đổi đầu ra mặc định. Anthropic cảnh báo rằng nếu không có hệ thống thiết kế, các đội sẽ nhận được đầu ra "đủ dùng nhưng chung chung". Khi đã xuất bản hệ thống, dự án mới sẽ lấy màu sắc, kiểu chữ và thành phần của bạn. Điểm cần lưu ý là hệ thống trích xuất chỉ tốt tương xứng với tài sản nguồn bạn tải lên; đầu vào lộn xộn sẽ cho hệ thống khởi đầu lộn xộn.
Giờ hãy xem hệ thống được xây dựng thế nào.
Cách hệ thống được tạo
Thiết lập diễn ra một lần cho mỗi tổ chức. Bài viết về hệ thống thiết kế hướng dẫn bốn bước: tạo tổ chức, tải lên tài sản thương hiệu và sản phẩm, xem lại những gì Claude tạo ra, rồi xuất bản cho đội nhóm. Tài liệu nguồn có thể là kho mã, tệp thiết kế hiện có, bộ slide phản ánh nhận diện trực quan của bạn hoặc tài sản đơn lẻ như logo và tệp bảng màu. Một nguồn là đủ để bắt đầu.
Anthropic cho biết hệ thống được tạo thường bao gồm bảng màu, thang kiểu chữ, các thành phần (nút, thẻ, điều hướng) và mẫu bố cục. Hãy thử nghiệm bằng các prompt như "Tạo trang đích cho [sản phẩm của bạn]" để xem thương hiệu thể hiện ra sao trong thực tế.
Xem lại hệ thống thiết kế với các token trích xuất. Video: Tác giả.
Xuất bản, nhiều hệ thống và cập nhật
Khi đã hài lòng, bật công tắc "Published" để các dự án mới trong tổ chức đó tự động sử dụng. Các đội có thể giữ nhiều hệ thống cho thương hiệu phụ hoặc dòng sản phẩm riêng. Để cập nhật, bài viết về hệ thống thiết kế hướng dẫn dùng nút "Remix", mở một cuộc chat nơi Claude có thể thay đổi các phần của hệ thống.
Hướng dẫn quản trị nêu rõ thứ tự: bật Claude Design khi chưa có hệ thống đã xuất bản sẽ cho đầu ra "đủ dùng nhưng chung chung", vì vậy quy trình triển khai khuyến nghị thiết lập hệ thống thiết kế trước.
Claude Design chấp nhận loại đầu vào nào?
Bạn không bị giới hạn ở một dòng prompt. Claude Design chấp nhận nhiều loại đầu vào có thể kết hợp tốt, và ngữ cảnh thực tế hơn thường tạo ra bản nháp đầu tiên tốt hơn.
Các đầu vào hiện được ghi nhận gồm:
- Prompt văn bản thuần trong bảng chat.
- Ảnh chụp màn hình, hình ảnh hoặc tài sản hiện có, bao gồm bộ slide và tài liệu theo phong cách bạn muốn sao chép.
- Tài liệu định dạng
DOCX,PPTXvàXLSX, được nêu trong bài đăng ra mắt. - Codebase, bằng cách liên kết kho mã hoặc đính kèm thư mục cục bộ qua luồng nhập.
- Web capture: bạn có thể thu thập phần tử từ trang web hiện có, để Claude phản chiếu các mẫu giao diện thực tế sát hơn.
Hai điều thường bị đưa sai. Anthropic đề cập "tệp thiết kế hiện có" nhưng không liệt kê định dạng gốc của các công cụ thiết kế, và hiện chưa có tuyên bố hỗ trợ nhập hay xuất Figma gốc; menu xuất không có tệp .fig . Nếu quy trình của bạn phụ thuộc vào việc trao đổi qua lại với Figma, điều đó đáng để kiểm tra trên sản phẩm thực tế trước khi bạn cam kết.
Nếu bản nháp đầu tiên chưa đúng ý, hãy quay lại danh sách bốn phần lúc trước: mục tiêu, bố cục, nội dung và đối tượng.
Claude Design so với Claude Code
Chúng dùng chung tên Claude, mô hình nền tảng và cầu nối chuyển giao, nhưng không phải cùng một công cụ. Nhầm lẫn giữa chúng là lỗi phổ biến kể từ khi ra mắt. Tên nghe giống nhau; sản phẩm làm các việc khác nhau.
Hãy xem khác biệt thực sự.
Mỗi công cụ dùng để làm gì?
Claude Design là sản phẩm web để tạo và tinh chỉnh đầu ra trực quan trên canvas: nguyên mẫu, bộ slide, microsite và trang marketing. Nó có thể đọc kho mã để hiểu thương hiệu của bạn, nhưng không chỉnh sửa codebase hoặc chạy lệnh.
Claude Code là công cụ lập trình theo tác vụ. Tổng quan chính thức mô tả đây là công cụ đọc codebase của bạn, chỉnh sửa tệp và chạy lệnh trong quy trình phát triển hiện có. Nó chạy trong terminal, IDE, ứng dụng desktop hoặc trình duyệt, và nhiệm vụ là làm việc với mã. Công việc khác nhau, cùng quy trình.
Claude Design và Claude Code kết nối thế nào?
Khi một dự án sẵn sàng để xây dựng, menu Export có chuyển giao sang Claude Code, tới agent lập trình cục bộ hoặc Claude Code Web. Anthropic cho biết Claude đóng gói ý đồ thiết kế thành một bundle mà agent nhận sẽ tiếp quản chỉ với một chỉ dẫn. Đường nhấp cụ thể xuất hiện trong phần hướng dẫn bên dưới.
Mô hình tư duy đúng là chuỗi: ý tưởng, nguyên mẫu, mã. Hai sản phẩm cũng có giới hạn sử dụng riêng, tôi sẽ đề cập ở phần truy cập.
Claude Design dành cho ai?
Anthropic chia đối tượng thành hai: nhà thiết kế giàu kinh nghiệm thường phải tiết kiệm thời gian khám phá, và "mọi người khác" cần tạo ra sản phẩm trực quan mà không có nền tảng thiết kế. Hướng dẫn triển khai cũng nêu nhà nghiên cứu UX, quản lý sản phẩm, marketer và các vai trò liên quan.
Đọc tài liệu nguồn và trích dẫn khách hàng, sản phẩm có vẻ được xây dựng cho nhà thiết kế thử hướng sớm, quản lý sản phẩm phác thảo luồng tính năng, và founder hay account executive cần một bộ slide mà không phải dành cả cuối tuần cho slide.
Nó cũng hợp với marketer làm trang đích, tài sản mạng xã hội và hình ảnh chiến dịch như điểm xuất phát, cùng những người không chuyên thiết kế nhưng cần truyền đạt ý tưởng trực quan mà không phải dùng Figma.
Phạm vi rộng, nhưng không phải "ai cũng phù hợp như nhau." Nhà thiết kế làm việc theo thư viện thành phần nghiêm ngặt và thông số chính xác vẫn cần công cụ thiết kế thực cho giai đoạn sau. Sự phù hợp rõ ràng hơn với đội đã có hệ thống thương hiệu và coi trọng bản nháp đầu tiên.
Claude Design phù hợp ở đâu?
Sản phẩm nằm ở phần đầu đến giữa của quy trình thiết kế, nơi bản nháp đầu quan trọng hơn phần đánh bóng cuối. Các trường hợp dưới đây đến từ định vị của Anthropic, hướng dẫn chính thức và lời chứng thực khi ra mắt.
Các mẫu thường gặp nhất là khám phá nguyên mẫu sớm, demo nội bộ cần cảm giác "thật" nhưng không nhất thiết trở thành mã, và bộ slide cho founder, đội bán hàng hoặc account executive.
Lý do tương tự áp dụng cho ý tưởng chiến dịch, bản nháp trang đích, mockup theo thương hiệu và chuẩn bị chuyển giao, nơi Anthropic cho biết nguyên mẫu hoàn chỉnh có thể được đóng gói sang Claude Code hoặc Claude Code Web để triển khai.
Điểm chung của hầu hết các trường hợp này là hành trình từ ý tưởng đến bản nháp đầu có thể trình chiếu. Sản phẩm không cố giải quyết toàn bộ quy trình thiết kế. Không phải trường hợp nào cũng trúng ngay từ đầu, đó là lý do hầu hết những ví dụ thành công ban đầu trông như hai hoặc ba vòng lặp, không phải một.
Thử nghiệm Claude Design trong thực tế
Chỉ đọc về quy trình thì có hạn. Dưới đây là một lượt ngắn qua toàn bộ vòng lặp, dùng một prompt bạn có thể tái tạo nếu tài khoản của bạn có quyền truy cập. Nếu bạn đã hiểu luồng, hãy bỏ qua bước xuất; đó là phần nhiều người nhầm với Claude Code.
Mở claude.ai/design, nhấp New project, đặt tên Workspace tour và chọn High fidelity. Dán prompt này vào bảng chat:
Create a dashboard for a small fintech app.
It should show monthly revenue at the top, a chart of revenue over the last six months in the middle, and a list of recent transactions below.
Keep it clean and readable. Single page, no sidebar.Claude có thể hỏi vài câu làm rõ trước: đối tượng, thẩm mỹ, đơn vị tiền tệ và mẫu điều hướng. Câu trả lời đơn giản là đủ (nhóm nội bộ, sạch và tối giản, USD, chỉ thanh trên cùng). Canvas sau đó sẽ được lấp đầy sau một lúc chờ ngắn.
Tiếp theo, lặp lại. Chuyển canvas sang chế độ Comment, nhấp nút kêu gọi hành động chính và gõ một yêu cầu một dòng như "Tăng đệm ngang cho nút này." Đây là hành vi bình luận inline tôi đã mô tả trước đó.
Bình luận inline ghim vào phần tử trên canvas. Hình ảnh: Tác giả.
Khi thiết kế đã đạt mức bạn muốn, nhấp Export và chọn Hand off to Claude Code. Đây là đường chuyển giao tôi đã nhắc tới.
