Front-end2 phút đọc

Từ ý tưởng đến prototype trong một buổi tối

Một quy trình dùng AI để đi từ ý tưởng mơ hồ tới prototype có thể bấm được: brief, luồng màn hình, dữ liệu giả, UI, rồi kiểm tra bằng người thật.

Viết bởi Zenith Nguyen

Prototype giao diện web được phác nhanh từ ý tưởng ban đầu

Một trong những cảm giác vui nhất khi dùng AI là thấy ý tưởng đi từ mơ hồ thành thứ có thể bấm được rất nhanh. Nhưng nhanh không có nghĩa là vội. Nếu bỏ qua cấu trúc, prototype sẽ đẹp lúc đầu và rối ngay sau đó.

Đây là quy trình tôi hay dùng khi muốn thử một ý tưởng sản phẩm nhỏ trong một buổi tối.

Bắt đầu bằng một câu hứa

Trước khi vẽ UI, tôi viết một câu: sản phẩm này giúp ai làm việc gì tốt hơn trong tình huống nào. Ví dụ: giúp lập trình viên mới học AI tạo checklist học mỗi ngày dựa trên thời gian rảnh.

Câu này là neo. Nếu một màn hình không phục vụ câu hứa đó, tôi bỏ ra.

Nhờ AI tạo user flow

Tôi đưa câu hứa cho AI và yêu cầu tạo luồng 4-6 bước: vào app, nhập dữ liệu, nhận kết quả, chỉnh sửa, lưu lại, quay lại. Sau đó tôi hỏi tiếp: bước nào có khả năng làm người dùng bỏ cuộc?

Câu hỏi thứ hai thường thú vị hơn câu đầu. Nó kéo UI về thực tế.

Tạo dữ liệu giả trước UI

Một UI không có dữ liệu thật rất dễ bị ảo. Tôi nhờ AI tạo 10 bản ghi mẫu: tên, trạng thái, lỗi, trường hợp dài, trường hợp rỗng. Sau đó mới dựng component.

Dữ liệu giả tốt giúp bạn thấy layout có vỡ không, chữ có dài quá không, empty state có cần không.

Dựng lát đầu tiên thật nhỏ

Tôi không cố dựng toàn bộ app. Tôi chọn một đường chính: nhập ý tưởng, nhận kế hoạch, chỉnh một mục. Nếu lát này ổn, các phần còn lại mới đáng làm.

AI có thể viết nhanh component, nhưng tôi vẫn tự giữ quyết định về hierarchy, spacing, trạng thái loading, lỗi và cách đặt tên.

Kết thúc bằng câu hỏi khó

Prototype xong, tôi hỏi AI review: người dùng mới sẽ hiểu gì trong 5 giây đầu? Chỗ nào giống demo hơn sản phẩm thật? Cần bỏ gì để rõ hơn?

Một buổi tối không đủ để tạo sản phẩm hoàn chỉnh. Nhưng đủ để trả lời câu hỏi quan trọng: ý tưởng này có đáng thêm một buổi tối nữa không?

Đi cùng nhau

Cùng học AI một cách thành thật

Tôi ghi lại những gì mình học và thử mỗi tuần. Nếu thấy hữu ích, hãy đọc cùng. Tôi cũng đang ấp ủ một buổi workshop trong tương lai, nếu bạn quan tâm, cứ để lại vài dòng để tôi hiểu bạn muốn học gì.