Claude Design có thể cho bạn một bản thiết kế trang web trong vài phút, nhưng bản thiết kế đẹp chưa phải là website. Trang chạy thật có đúng ý hay không phụ thuộc vào hai tờ giấy: phiếu bàn giao bạn đưa cho người dựng (một người thợ web, hoặc một công cụ viết mã như Claude Code), và bảng nghiệm thu bạn dùng trước khi cho khách vào xem.
Bài này dành cho chủ doanh nghiệp nhỏ và người phụ trách website mà công việc chính không phải lập trình. Bạn sẽ có một phiếu bàn giao thiết kế một trang và một bảng nghiệm thu bản xem thử để sao chép, cùng một ví dụ giả lập đã chạy thử.
Tổ Thạo Việc đối chiếu tài liệu của Anthropic và thử trực tiếp Claude Design ngày 01/10/2026 trên một tài khoản gói Max, với một doanh nghiệp không có thật. Phần dựng mã bằng Claude Code và đưa trang lên mạng chưa thử. Đề tài được gợi từ video của một người làm nội dung về công nghệ; những gì người đó làm được là trải nghiệm riêng, bài không dùng làm dữ kiện.
Bản thiết kế, bản xem thử và website công khai khác nhau thế nào?
Ba thứ này hay bị gọi chung là “trang web làm xong rồi”. Hãy tách ra trước khi giao việc.
| Bản thiết kế | Bản xem thử | Website công khai | |
|---|---|---|---|
| Là gì | Hình và bố cục trang, có thể bấm được | Trang đã dựng thành mã, đặt ở một địa chỉ tạm | Trang ở tên miền của bạn, khách tìm thấy |
| Ai xem | Bạn và người được mời | Người có đường dẫn tạm | Bất kỳ ai |
| Biểu mẫu | Thường chỉ mô phỏng, không gửi đi đâu | Gửi thử về nơi nhận thử | Gửi dữ liệu thật của khách |
| Nội dung | Có thể còn khung chờ chốt | Phải hết khung chờ trước khi duyệt | Đã duyệt, có người chịu trách nhiệm |
| Sai thì sao | Sửa trong vài phút | Sửa trước khi công bố | Khách thấy, có thể mất đơn hoặc lộ dữ liệu |
Trong lần thử của chúng tôi, chính Claude Design ghi chú: bản thiết kế chưa gửi dữ liệu đi đâu, nút gửi chỉ mô phỏng kết quả. Đó là hành vi đúng của một bản thiết kế, và cũng là lý do không được coi nó là website.
Claude Design làm được gì, theo tài liệu của Anthropic?
Các ý dưới đây lấy từ trang trợ giúp và trang hướng dẫn của Anthropic, đối chiếu ngày 01/10/2026.
- Trạng thái và gói: Claude Design đang ở giai đoạn Beta, có trên các gói Pro, Max, Team và Enterprise. Gói Enterprise mặc định tắt cho tới khi chủ sở hữu tổ chức bật. Bài không nêu giá vì giá gói thay đổi; xem trang giá của Anthropic trước khi quyết định.
- Hạn mức: dùng chung hạn mức với phần còn lại của Claude, kể cả Claude Code. Hết hạn mức thì Claude Design tạm không dùng được cho tới khi hạn mức đặt lại. Một bản thiết kế đầy đủ tốn hạn mức hơn một tin nhắn thường.
- Xuất và bàn giao: trang trợ giúp liệt kê tải tệp .zip, PDF, PPTX, HTML độc lập, gửi sang một số công cụ khác, và bàn giao sang Claude Code theo hai cách: gửi cho công cụ viết mã chạy trên máy của bạn, hoặc gửi sang Claude Code chạy trên web.
- Giới hạn Anthropic tự nêu: chưa có lịch sử phiên bản; sửa trên điện thoại còn hạn chế; nhiều người cùng sửa một dự án còn ở mức cơ bản; nhận xét gắn vào trang đôi lúc không hiện.
- Việt Nam: Việt Nam có trong danh sách quốc gia được hỗ trợ dùng Claude. Lần thử này thực hiện từ một tài khoản tại Việt Nam. Chúng tôi chưa kiểm trên gói Pro, Team hay Enterprise.
Không có chỗ nào trong các tài liệu trên nói bản thiết kế sẽ tự thành một website an toàn, tự lên mạng đúng, hay giữ nguyên mọi chi tiết khi chuyển thành mã. Bàn giao là chuyển bối cảnh cho bên viết mã. Việc duyệt vẫn là của người.
Trang hướng dẫn của Claude Academy có ba lời khuyên trước khi bàn giao, rất đáng làm theo dù bạn dùng công cụ nào: đặt tên rõ cho từng phần của trang; ghi lại các quyết định thiết kế; và yêu cầu vẽ cả những trường hợp ít ai nghĩ tới như lúc trống, lúc lỗi, lúc đang tải, lúc dữ liệu nhiều hay ít.
Khi nào bản thiết kế sẵn sàng để bàn giao?
Bàn giao sớm quá thì người dựng phải đoán. Sáu điều dưới đây là gợi ý của Tổ Thạo Việc; thiếu điều nào thì ghi rõ là chờ chốt, đừng để trống.
- Phần chữ trên trang đã chốt. Chỗ chưa chốt có khung [ ] nhìn thấy được, không điền tạm cho đẹp.
- Có bản cho máy tính và bản cho điện thoại.
- Biểu mẫu có đủ các trạng thái: nhập sai, đang gửi, gửi thành công, hết chỗ hoặc hết hàng, gửi không được.
- Mỗi nút và mỗi liên kết đều ghi rõ bấm vào thì đi đâu.
- Biết biểu mẫu thu những trường nào, gửi về đâu, ai được xem.
- Có tên người duyệt cuối cùng.
Phiếu bàn giao thiết kế một trang (mẫu để sao chép)
Điền phiếu này trước khi mở Claude Design, và đưa nguyên phiếu cho người dựng. Mỗi trang một phiếu.
PHIẾU BÀN GIAO THIẾT KẾ MỘT TRANG Trang: [tên trang], của [tên doanh nghiệp]. Ngày: [ngày]. Người lập: [tên] 1. Mục tiêu của trang - Việc muốn người xem làm: [một việc, ví dụ gửi biểu mẫu, gọi điện, đặt bàn] - Coi là đạt khi: [mô tả bằng việc người xem làm được, không dùng chữ "đẹp"] 2. Người xem - Họ là ai, đến từ đâu, phần lớn xem bằng máy gì: [ ] 3. Nội dung theo thứ tự trên trang (chữ đã chốt, dùng nguyên văn) a) [ ] b) [ ] c) [ ] - Câu hỏi nào thì kèm luôn câu trả lời. Giá, giờ, số lượng ghi đúng con số. 4. Thương hiệu - Tên, logo (tệp nào), màu (mã màu), phông chữ: [ ] - Ảnh: [tệp ảnh thật] hoặc ghi "chờ ảnh thật". Không dùng ảnh lấy trên mạng, không tạo ảnh người. 5. Các trạng thái phải vẽ - Bản máy tính và bản điện thoại. - Biểu mẫu: nhập sai, đang gửi, gửi thành công, hết chỗ hoặc hết hàng, gửi không được. - Câu báo cho từng trạng thái: [viết sẵn, hoặc ghi "người dựng đề xuất, tôi duyệt"] 6. Liên kết và nút - [tên nút]: bấm vào thì [cuộn tới mục nào / mở trang nào / gọi số nào] 7. Dữ liệu của biểu mẫu - Chỉ thu: [các trường]. Không thu: [ ] - Gửi về: [hộp thư, bảng tính, phần mềm nào]. Ai được xem: [tên] - Câu báo mục đích dùng thông tin đặt cạnh nút gửi: [ ] 8. Chờ chốt (để khung [ ], không tự điền) - [ ] 9. Ngoài phạm vi lần này - [ví dụ: thanh toán trực tuyến, tài khoản người dùng, tiếng Anh] 10. Người duyệt - [tên] duyệt nội dung, giá và bản xem thử trước khi công bố. Người dựng xác nhận lại bằng văn bản trước khi làm: đã hiểu mục 1 đến 10; chỗ nào chưa rõ; bản xem thử đặt ở đâu và ai xem được; biểu mẫu thử gửi về đâu; cách quay lại bản trước nếu bản mới hỏng.
Ví dụ giả lập: trang giới thiệu lớp gốm cuối tuần
Xưởng gốm Sân Nắng, lịch học và giá dưới đây không có thật, được dựng để thử.
PHIẾU BÀN GIAO (GIẢ LẬP, rút gọn)
Trang: giới thiệu lớp làm gốm cuối tuần của Xưởng gốm Sân Nắng
1. Mục tiêu: người xem gửi biểu mẫu giữ chỗ. Đạt khi người xem bằng điện thoại
tìm được lịch, giá và gửi được biểu mẫu mà không phải nhắn hỏi lại.
2. Người xem: người đi làm 25 đến 40 tuổi, bấm vào từ Facebook hoặc Zalo.
3. Nội dung: đầu trang; tiêu đề và mô tả; ba điều nhận được trong một buổi;
lịch và giá (sáng thứ Bảy, sáng Chủ nhật, 450.000 đ một người);
bốn câu hỏi đáp; biểu mẫu giữ chỗ; chân trang.
4. Thương hiệu: chưa có logo, dùng chữ; ba mã màu; phông Be Vietnam Pro;
chưa có ảnh thật, để khung "Ảnh lớp học (chờ ảnh thật)".
5. Trạng thái: máy tính 1280, điện thoại 390; biểu mẫu có lỗi nhập, đang gửi,
gửi thành công, ca đã hết chỗ, gửi không được.
Câu báo thành công phải là "Xưởng đã nhận yêu cầu giữ chỗ", không ghi "đã giữ chỗ".
6. Nút "Giữ chỗ": cuộn tới biểu mẫu. "Xem lịch và giá": cuộn tới mục Lịch và giá.
7. Biểu mẫu chỉ thu họ tên, số điện thoại, ca học, số người, ghi chú.
Nơi nhận và người được xem: chờ chốt với người dựng.
8. Chờ chốt: địa chỉ xưởng, số Zalo, ảnh thật, trang Chính sách riêng tư.
9. Ngoài phạm vi: thanh toán trực tuyến, tài khoản người dùng, blog, tiếng Anh.
10. Người duyệt: chủ xưởng.Kết quả khi thử ngày 01/10/2026
Chúng tôi dán phiếu đầy đủ vào Claude Design. Sau vài phút, công cụ trả về hai tệp: một tệp là chính trang web, một tệp “bản vẽ” mà theo mô tả của công cụ đặt bản máy tính, bản điện thoại và các trạng thái của biểu mẫu cạnh nhau. Chúng tôi đã xem trang ở bề rộng máy tính, và xem được các trạng thái lỗi nhập, đang gửi, gửi thành công, ca hết chỗ, gửi không được.
Điều công cụ làm đúng theo phiếu:
- Tiêu đề, mô tả, tên nút, lịch và giá được dùng nguyên văn. Không có số liệu, lời khen của khách hay ảnh người nào được thêm vào.
- Địa chỉ, số Zalo, ảnh và trang chính sách đều nằm trong khung chờ chốt, nhìn thấy rõ.
- Câu báo thành công đúng như phiếu yêu cầu: xưởng đã nhận yêu cầu và sẽ gọi lại, ca học chỉ được giữ sau khi xưởng xác nhận.
Điều công cụ tự báo lại, và đây là phần đáng giá nhất:
- Phiếu của chúng tôi có lỗ hổng. Mục Hỏi đáp chỉ có câu hỏi, không có câu trả lời. Công cụ để khung chờ chốt cho ba câu, và chỉ trả lời câu “Giá đã gồm những gì?” bằng đúng câu đã có ở mục Lịch và giá. Nó không tự bịa câu trả lời. Mẫu phiếu ở trên đã được sửa: câu hỏi nào thì kèm luôn câu trả lời.
- Công cụ tự viết các câu báo lỗi (ví dụ “Vui lòng nhập họ và tên.”) và đề nghị chủ xưởng duyệt lại.
- Công cụ ghi rõ nút gửi chỉ mô phỏng, vì nơi nhận dữ liệu còn chờ chốt.
Điều bảng nghiệm thu bắt được, dù bản thiết kế trông đã hoàn chỉnh:
- Bấm “Gửi yêu cầu giữ chỗ” khi biểu mẫu còn trống: ba câu báo lỗi hiện đúng dưới từng ô, nhưng trang không cuộn lên ô lỗi. Người đang đứng ở nút gửi cuối biểu mẫu sẽ không thấy gì thay đổi.
- Nhập số điện thoại thiếu số: có câu báo “Số điện thoại chưa đúng. Nhập đủ 10 chữ số, bắt đầu bằng số 0.” Nhập đúng thì nút đổi thành “Đang gửi yêu cầu…” rồi hiện câu báo thành công.
- Ở đầu trang, bấm “Lịch và giá” thì cuộn đúng mục. Bấm nút “Giữ chỗ” ba lần và “Lớp học” một lần thì trang không cuộn, trái với mục 6 của phiếu. Chúng tôi bấm bằng trình duyệt điều khiển tự động, nên việc đầu tiên khi làm thật là có người bấm tay lại.
- Bề rộng điện thoại: cửa sổ trình duyệt của chúng tôi chỉ thu được tới 614 điểm ảnh. Ở bề rộng đó trang xếp lại gọn và đọc được. Chúng tôi chưa xem được ở đúng 390 điểm ảnh trên điện thoại thật, nên mục điện thoại trong bảng nghiệm thu để “chưa kiểm”.
Một phiếu rõ giúp công cụ giữ đúng nội dung và tự chỉ ra chỗ phiếu còn thiếu. Nhưng “bấm được” trong bản thiết kế chưa có nghĩa mọi nút đều chạy đúng. Phải có người bấm thử theo bảng.
Bàn giao sang người dựng hoặc Claude Code: cần xác nhận gì?
Trên tài khoản thử, mục Share của Claude Design có các lựa chọn xuất PNG, tải dự án dạng HTML (tệp .zip hoặc một tệp độc lập), PowerPoint, và gửi sang Claude Code. Hộp bàn giao sang Claude Code có hai thẻ: sao chép một câu lệnh để dán vào Claude Code trên máy, hoặc mở một phiên Claude Code trên web. Danh sách này khác đôi chút với trang trợ giúp, và có thể khác theo tài khoản, thời điểm. Bản Design tạo trong Claude Cowork của cùng tài khoản chỉ có xuất HTML, PDF và PNG, không có mục gửi sang Claude Code.
Cùng mục đó còn có lựa chọn xuất bản tệp thành một artifact công khai. Đừng bấm khi trang còn khung chờ chốt hoặc còn dữ liệu thử: công khai nghĩa là người có đường dẫn sẽ xem được.
Ba điều chúng tôi thấy khi mở hộp bàn giao, đáng để bạn kiểm trước khi bấm:
- Tệp được chọn là tệp đang mở. Lúc đó chúng tôi đang mở tệp bản vẽ, nên câu lệnh yêu cầu dựng tệp bản vẽ chứ không phải tệp trang web. Kiểm tên tệp, đổi nếu cần.
- Câu lệnh mặc định rất ngắn. Nó chỉ gồm đường dẫn tới dự án thiết kế, tên tệp cần tập trung, và yêu cầu dựng tệp đó. Không có mục tiêu của trang, không có chỗ chờ chốt, không có tiêu chí duyệt. Trang hướng dẫn của Claude Academy mô tả gói bàn giao có kèm cuộc trò chuyện và một tệp hướng dẫn; chúng tôi chưa mở gói ở phía Claude Code nên chưa xác nhận được bên viết mã đọc được những gì.
- Có một ô ghi thêm chỉ dẫn, mặc định để trống. Đây là chỗ đưa phiếu bàn giao và yêu cầu xác nhận vào.
Câu dưới đây có thể dán vào ô chỉ dẫn, hoặc gửi kèm phiếu cho người dựng. Câu này do Tổ Thạo Việc soạn, chưa chạy thử với Claude Code.
Trước khi viết mã, hãy đọc phiếu bàn giao dưới đây và trả lời bằng danh sách: 1. Những chỗ trong phiếu ghi "chờ chốt": bạn sẽ giữ nguyên khung [ ], không tự điền. 2. Biểu mẫu sẽ gửi dữ liệu về đâu trong bản xem thử. Nếu chưa có nơi nhận, hãy nói rõ là biểu mẫu chưa gửi thật. 3. Bản xem thử sẽ đặt ở đâu, ai mở được đường dẫn. 4. Điều gì trong bản thiết kế bạn không dựng được đúng, và bạn đề xuất thay bằng gì. 5. Cách quay lại bản trước nếu bản mới hỏng. Chỉ dựng bản xem thử. Không đưa lên tên miền chính, không nối biểu mẫu với dữ liệu thật khi tôi chưa duyệt bảng nghiệm thu. PHIẾU BÀN GIAO: [dán phiếu]
Với người dựng là thợ web hay một công ty, năm câu trên vẫn dùng được, thêm hai câu: tên miền và nơi đặt trang đứng tên ai; sau khi bàn giao, ai sửa khi có lỗi và trong bao lâu.
Bảng nghiệm thu bản xem thử (mẫu để sao chép)
Dùng khi người dựng gửi bạn đường dẫn bản xem thử. Mỗi dòng ghi Đạt, Chưa đạt hoặc Chưa kiểm, kèm ghi chú. “Chưa kiểm” không được tính là đạt.
BẢNG NGHIỆM THU BẢN XEM THỬ Trang: [ ]. Đường dẫn bản xem thử: [ ]. Ngày: [ ]. Người kiểm: [ ] A. Máy tính [ ] Mở bằng trình duyệt thường dùng, trang hiện đủ các mục theo đúng thứ tự trong phiếu. [ ] Không có chữ tràn, chồng lên nhau hay bị cắt. B. Điện thoại (mở trên điện thoại thật, không chỉ thu nhỏ cửa sổ) [ ] Không phải kéo ngang. Chữ đọc được, nút bấm vừa ngón tay. [ ] Đầu trang không che nội dung khi cuộn. C. Nội dung [ ] Chữ khớp nguyên văn với phiếu: tiêu đề, giá, giờ, tên. [ ] Không còn khung [ ] chờ chốt. Không có chữ, số, ảnh nào tôi chưa duyệt. [ ] Ảnh là ảnh thật của tôi hoặc ảnh tôi có quyền dùng. D. Liên kết và nút (bấm từng cái, ở cả máy tính và điện thoại) [ ] Mỗi nút đi đúng nơi ghi trong mục 6 của phiếu. [ ] Số điện thoại, Zalo, bản đồ mở đúng. Không có liên kết chết. E. Biểu mẫu và lỗi [ ] Bấm gửi khi để trống: thấy ngay ô nào sai mà không phải cuộn tìm. [ ] Nhập sai định dạng: câu báo nói rõ cần sửa gì, nội dung đã nhập còn nguyên. [ ] Gửi đúng: có trạng thái đang gửi, không gửi được hai lần, câu báo thành công đúng như phiếu. [ ] Hết chỗ hoặc hết hàng: người xem biết còn lựa chọn nào. [ ] Mất mạng hoặc gửi không được: có câu báo và cách liên hệ khác. F. Dữ liệu [ ] Gửi một bản ghi thử, tôi tìm thấy nó ở đúng nơi nhận đã ghi trong phiếu. [ ] Biểu mẫu không thu trường nào ngoài phiếu. Có câu báo mục đích dùng thông tin. [ ] Bản ghi thử đã được xóa sau khi kiểm. G. Quyền [ ] Biết ai mở được bản xem thử, ai sửa được trang, ai xem được dữ liệu biểu mẫu. [ ] Tên miền và nơi đặt trang đứng tên doanh nghiệp của tôi, tôi có quyền quản trị. [ ] Biết cách quay lại bản trước và ai làm việc đó. H. Quyết định [ ] Công bố [ ] Sửa rồi kiểm lại các dòng chưa đạt [ ] Dừng Người duyệt: [tên, ngày]
Áp vào ví dụ giả lập ở trên, bản thiết kế mới qua được mục A và phần lớn mục C và E. Mục D có dòng chưa đạt, mục B chưa kiểm, mục F và G chưa thể kiểm vì chưa có bản xem thử nào được dựng. Kết luận đúng lúc đó là “sửa rồi kiểm lại”, chưa phải “công bố”.
Ai duyệt gì trước khi công bố?
| Việc | Người đặt việc | Người dựng |
|---|---|---|
| Nội dung, giá, ảnh | Chốt và chịu trách nhiệm | Dùng nguyên văn, hỏi lại khi thiếu |
| Bản xem thử | Bấm thử theo bảng nghiệm thu | Sửa các dòng chưa đạt |
| Biểu mẫu và dữ liệu | Quyết định thu gì, ai xem | Nối đúng nơi nhận, không thu thêm |
| Công bố | Ký duyệt | Đưa lên sau khi có chữ ký, giữ được bản trước |
Khi trang có biểu mẫu thu thông tin khách, phần kiểm ai vào xem được dữ liệu cần làm kỹ hơn bài này. Bài tự dựng ứng dụng nội bộ bằng AI có phiếu kiểm lộ dữ liệu cho việc đó; bài này không lặp lại. Để chọn các điểm phải có người duyệt, xem bốn điểm dừng phê duyệt trước khi AI hành động.
Hỏi đáp
Không dùng Claude Design thì phiếu này còn dùng được không?
Được. Phiếu và bảng nghiệm thu không phụ thuộc công cụ. Bạn có thể đưa phiếu cho một người thiết kế, một công ty làm web, hoặc một công cụ AI khác.
Tải tệp HTML về là có website chưa?
Chưa. Tệp tải về vẫn là bản thiết kế. Để thành website còn cần nơi đặt trang, tên miền, biểu mẫu nối với nơi nhận thật, trang chính sách riêng tư và một lần nghiệm thu trên bản xem thử.
Có video làm xong cả website trong một buổi, sao tôi phải kiểm nhiều thế?
Người làm video thường có kinh nghiệm lập trình và tự chịu trách nhiệm với trang của họ. Trang của bạn mang tên doanh nghiệp bạn và nhận thông tin của khách bạn. Lần thử của chúng tôi cho thấy công cụ làm nhanh và giữ nội dung tốt, nhưng vẫn có nút không chạy đúng. Thời gian bấm thử theo bảng thường ngắn hơn nhiều so với thời gian sửa sau khi khách đã gặp lỗi.
Phiếu có dùng được cho ứng dụng nội bộ không?
Phiếu này viết cho một trang giới thiệu có biểu mẫu. Ứng dụng nội bộ có đăng nhập và dữ liệu nhiều người cần thêm phần phân quyền và sao lưu, xem bài về tự dựng ứng dụng nội bộ.
Giới hạn của bài này
- Chỉ thử phần Claude Design và hộp bàn giao, một lần, với một phiếu giả lập, trên một tài khoản gói Max. Chưa dán câu lệnh vào Claude Code, chưa dựng mã, chưa đưa trang lên máy chủ hay tên miền.
- Kết quả bấm thử liên kết lấy từ trình duyệt điều khiển tự động; chưa có người bấm tay lại. Chưa xem bản điện thoại trên điện thoại thật.
- Claude Design đang ở giai đoạn Beta. Tên nút, lựa chọn xuất và cách đóng gói bàn giao có thể đổi sau ngày đối chiếu.
- Phiếu bàn giao và bảng nghiệm thu là gợi ý biên tập của Tổ Thạo Việc, không phải mẫu của Anthropic. Bài không thay cho tư vấn pháp lý về dữ liệu cá nhân hay kiểm thử bảo mật chuyên sâu.
Nguồn & lưu ý
- Claude Help Center: Get started with Claude Design (gói, nơi dùng, xuất, bàn giao, hạn mức, giới hạn đã biết).
- Claude Academy: Using Claude Design for prototypes and UX (gói bàn giao, ba lời khuyên trước khi bàn giao).
- Claude Design, trang sản phẩm; Anthropic: danh sách quốc gia được hỗ trợ.
- Nguồn phát hiện đề tài: video TikTok của @jennngx ngày 14/09/2026 và video YouTube của Jen Nguyen ngày 03/09/2026. Chúng tôi đọc mô tả công khai và mục lục chương; chưa xem và nghe được toàn bộ hai video. Video YouTube có đường dẫn giới thiệu một dịch vụ đặt trang web của người làm video; AI Thạo Việc không nhận tài trợ hay hoa hồng từ người làm video, từ Anthropic hay từ dịch vụ đó; Trợ lý AI trên trang này dùng mô hình của Anthropic như một khách hàng trả phí.
- Xưởng gốm Sân Nắng và mọi nội dung của ví dụ là giả lập.
- Thử và đối chiếu ngày 01/10/2026.
