Bắt đầu với Claude Design (Get started with Claude Design)

Thiết kế Claudecho phép bạn tạo các thiết kế, nguyên mẫu tương tác, trang đơn và các tác phẩm hình ảnh khác bằng cách trò chuyện với Claude. Đây là một trong những mẫu mà bạn có thể bắt đầu một tác phẩm từ đó, vì vậy bạn có thể sử dụng nó trong bất kỳ cuộc trò chuyện nào, trong Claude Code và từArtifactstab, với chỉnh sửa trực tiếp trên canvas và hệ thống thiết kế của bạn được bao gồm. Hướng dẫn này sẽ đưa bạn qua việc tạo thiết kế đầu tiên của bạn, chỉnh sửa nó và tận dụng tối đa nó. Tìm hiểu thêm vềcác cổ vật là gì và cách sử dụng chúng.

Hướng dẫn này giả định rằng hệ thống thiết kế của tổ chức bạn đã được thiết lập, vì vậy mọi thứ bạn tạo ra sẽ tự động sử dụng màu sắc, kiểu chữ và các mẫu thành phần của thương hiệu bạn. Nếu bạn là một trưởng nhóm thiết kế cần thiết lập hoặc sửa đổi chính hệ thống thiết kế, hãy xemThiết lập hệ thống thiết kế của bạn trong Claude Design.

Tạo một Artifacts với Claude

Claude Design kết hợp cuộc trò chuyện với một bảng vẽ. Bạn mô tả những gì bạn muốn, và Claude tạo ra một thiết kế hoạt động trên bảng vẽ bên cạnh cuộc trò chuyện. Từ đó, bạn tiếp tục chỉnh sửa—tinh chỉnh thông qua cuộc trò chuyện, bình luận trực tiếp, và trực tiếp trên bảng vẽ cho đến khi hoàn chỉnh.

Luồng điển hình là:

Bạn có thể chuyển đổi giữa làm việc trong Claude Design và Claude Code trong khi giữ cho công việc của bạn được đồng bộ. Sử dụng /design-sync để kéo vào hệ thống thiết kế của bạn, vì vậy mọi thứ bạn xây dựng trong Claude Design bắt đầu từ các thành phần hiện có của bạn. Khi một thiết kế sẵn sàng để trở thành phần mềm, bạn có thể chuyển nó sang Claude Code, nơi tiếp tục từ công việc hiện có của bạn thay vì bắt đầu lại từ ảnh chụp màn hình.

Từ Claude Code, sử dụng /design để nhập một thiết kế vào cơ sở mã của bạn, xuất mã của bạn dưới dạng nguyên mẫu trực tiếp, hoặc để Claude xây dựng toàn bộ từ đầu đến cuối.

Khi bạn tạo một dự án, nó tự động kế thừa hệ thống thiết kế của tổ chức bạn. Bạn không cần tải lên các tài sản thương hiệu hay cấu hình bất cứ điều gì—màu sắc, phông chữ và các thành phần thương hiệu của bạn đã được thiết lập sẵn.

Nhập một hoặc nhiều hệ thống thiết kế từ kho GitHub, tệp thiết kế, tải lên thô hoặc cơ sở mã cục bộ của bạn bằng lệnh /design-sync trong Claude Code. Claude xây dựng với các thành phần hệ thống thiết kế thực của bạn, kiểm tra kết quả đầu ra của chính nó so với hệ thống thiết kế của bạn và thực hiện các chỉnh sửa trước khi bạn nhìn thấy chúng.

Trên các gói Enterprise, quản trị viên có thể đặt quyền xuất bản, thiết lập mặc định và xóa hệ thống thiết kế cho người dùng cụ thể. Tìm hiểu thêm trongHướng dẫn quản trị Artifact cho các gói Team và Enterprise.

Các hệ thống thiết kế mà bạn tạo tại claude.ai/design có thể chuyển sang, để Claude có thể sử dụng chúng trong bất kỳ cuộc trò chuyện nào, bao gồm cả trong Claude Code. Tìm hiểu thêm vềthiết lập hệ thống thiết kế của bạn.

Càng cung cấp nhiều bối cảnh cho Claude, kết quả đầu ra của bạn sẽ càng tốt. Bạn có thể đính kèm tài liệu tham khảo vào bất kỳ giai đoạn nào trong dự án.

Bạn không cần phải là một nhà thiết kế để đạt được kết quả tuyệt vời. Hãy cụ thể về những gì bạn đang xây dựng, dành cho ai và điều gì quan trọng nhất.

Một lời nhắc tốt bao gồmmục tiêu(những gì bạn đang xây dựng), cáibố cục(cách mọi thứ nên được sắp xếp), cáinội dung(thông tin gì cần hiển thị), vàkhán giả(ai sẽ sử dụng nó). Claude cũng sẽ đặt các câu hỏi làm rõ nếu cần thêm thông tin.

Dưới đây là một số ví dụ về các lời nhắc hoạt động hiệu quả:

Thế hệ đầu tiên là một điểm khởi đầu. Giá trị thực sự đến từ việc lặp đi lặp lại.

Chat là tốt nhất cho những thay đổi rộng có ảnh hưởng đến thiết kế tổng thể:

Bạn cũng có thể yêu cầu Claude giải thích các quyết định thiết kế của nó, gợi ý cải tiến hoặc xem xét thiết kế về khả năng tiếp cận.

Bình luận trực tiếp cho phép bạn nhấp trực tiếp vào một phần cụ thể của canvas và yêu cầu thay đổi mục tiêu. Điều này nhanh hơn so với việc mô tả vị trí trong cuộc trò chuyện.

Các ví dụ về chú thích nội tuyến tốt:

Sử dụng các điều khiển bố cục phong phú để nhanh chóng thay đổi về mặt hình ảnh và thẩm mỹ, cụ thể là để kéo, thay đổi kích thước và căn chỉnh các phần tử trực tiếp.

Sử dụngbình luậncho các thay đổi có mục tiêu, ở cấp thành phần (“sửa cái nút này,” “điều chỉnh khoảng cách này”). Sử dụngtrò chuyệncho các thay đổi cấu trúc, phần mới hoặc bất cứ điều gì cần giải thích hoặc bối cảnh.Chỉnh sửa trực tiếpđể thay đổi nhanh về mặt hình ảnh và thẩm mỹ.

Nếu bạn muốn khám phá một hướng đi khác mà không làm mất công việc hiện tại, hãy nói với Claude: “Lưu những gì chúng ta có và thử một cách tiếp cận hoàn toàn khác.” Claude sẽ lưu dự án hiện tại của bạn và xác nhận nơi nó được lưu, để bạn có thể dễ dàng tham khảo các phiên bản trước trong cuộc trò chuyện.

Khi thiết kế của bạn đã sẵn sàng, bạn có thể chia sẻ nó với đồng nghiệp hoặc xuất nó để sử dụng ở nơi khác. Định dạng phù hợp phụ thuộc vào trường hợp sử dụng của bạn—dù bạn đang nhận phản hồi từ các bên liên quan, chuyển giao cho nhóm kỹ thuật, hay trình bày trước một nhóm.

Sử dụng nút “Xuất” ở góc trên bên phải khi xem dự án của bạn để chọn từ các định dạng xuất sau.

Các thiết kế ban đầu chỉ riêng bạn. Để chia sẻ một thiết kế, nhấp vào “Chia sẻ” và chọn ai có thể mở nó và họ có thể làm gì. Những người bạn chia sẻ thiết kế có thể xem, bình luận hoặc chỉnh sửa nó. Tìm hiểu thêm vềchia sẻ Artifacts.

Claude Design được tính vào cùng hạn mức sử dụng với phần còn lại của Claude. Hoạt động thiết kế lấy từ cùng một nguồn với các công việc khác của bạn với Claude, bao gồm Claude Code, vì vậy không có hạn mức riêng cho Claude Design để theo dõi. Các dự án phức tạp với cơ sở mã lớn hoặc nhiều lần lặp lại sẽ tiêu tốn nhiều sử dụng hơn.

Nếu bạn đạt đến giới hạn sử dụng của mình, Claude Design sẽ không khả dụng cho đến khi giới hạn của bạn được đặt lại. Nếu bạn đã bật tín dụng sử dụng, bạn có thể tiếp tục làm việc sau khi đạt đến giới hạn đã bao gồm của mình. Tìm hiểu thêm vềcách hoạt động của giới hạn sử dụng và độ dài.

Claude Design hiện đã có sẵn ở phiên bản beta. Một vài điều cần lưu ý: