Prototype
Ba prototype tương tác: luồng đặt hàng của khách hàng, luồng thiết kế theo mẫu (V2, kèm video demo) và màn quản trị cho 5 vai trò nội bộ.
Các prototype dưới đây xuất từ bản thiết kế trên Claude thành HTML tĩnh, chạy trực tiếp trong trình duyệt. Đây là wireframe dùng để trao đổi nghiệp vụ và nghiệm thu luồng, dữ liệu trên màn là dữ liệu mẫu; prototype không thay thế user stories hay màn hình đã duyệt.
Luồng đặt hàng (khách hàng)
Danh mục sản phẩm, cấu hình quy cách, báo giá tay, giỏ hàng, đặt hàng, theo dõi đơn, đơn của tôi và chính sách. Bật “Ghi chú PRD” để xem user story và câu hỏi mở gắn với từng màn.
Thiết kế theo mẫu (V2, 05/10/2026)
Prototype V2 tập trung vào phần chọn sản phẩm → thư viện mẫu → chỉnh sửa trên khuôn → prompt AI → tải file → kiểm tra & gửi, minh họa luồng thiết kế theo mẫu thống nhất với CEO PrintUp ngày 05/10/2026. Chỉ sản phẩm HG-01 Hộp nắp gài đáy cài bấm vào được; giá, mẫu và nội dung là dữ liệu mẫu. Các bước còn lại (giỏ, đặt hàng, theo dõi đơn) dùng prototype Luồng đặt hàng ở trên.
Video demo có thuyết minh (1 phút)
| Thời điểm (khoảng) | Bước trong video | Story liên quan |
|---|---|---|
| 0:00 | 1 · Danh mục: sản phẩm chủ lực, giá trọn lô hiện ngay | US-11 |
| 0:06 | 2 · Sản phẩm: chọn quy cách, giá cập nhật ngay; thông số khuôn bế (tràn lề, đường xén, vùng an toàn), tải khuôn PDF / AI / SVG | US-12, US-13, US-69 |
| 0:12 | 3 · Thư viện mẫu: mẫu riêng cho từng sản phẩm, lọc phong cách, đổi màu một chạm, xem trước khi chọn | US-76 |
| 0:18 | 4 · Chỉnh sửa: sửa chữ theo danh sách ô của mẫu, kéo, đổi cỡ, xoay phần tử trên khuôn, định dạng chữ, thêm hình khối, đổi nền và bảng màu, bật/tắt đường hướng dẫn và thước đo, xem 3D | US-15 |
| 0:48 | 5 · Prompt AI: chưa sinh ảnh trong PrintUp, copy prompt đã ghép khuôn và ô chữ sang công cụ khác | US-80 |
| 0:54 | 6 · Kiểm tra & gửi: cảnh báo ô chữ mẫu chưa sửa, khách xác nhận, gửi đơn; PrintUp kiểm file, gửi bản duyệt, khách cọc 70% qua QR | US-79, US-16, E6, E7 |
Prototype tương tác
Bấm “Xem sản phẩm” ở thẻ HG-01 để bắt đầu, hoặc chọn thẳng bước trên thanh 1–7. Trong trình chỉnh sửa: nhấp đúp vào chữ để sửa, kéo để di chuyển, núm ↻ để xoay; nút “Tiếp tục: kiểm tra” sang màn cảnh báo và xác nhận.
Prototype và video khác story v0.5 ở đâu. Prototype V2 được dựng trước buổi trao đổi 05/10/2026, nên còn 3 điểm lệch. Khi lệch, story là chuẩn; prototype sẽ được sửa sau khi CEO PrintUp duyệt các câu P0-12, P0-13:
| Điểm | Prototype V2 / video | Story v0.5 |
|---|---|---|
| Thứ tự | Chọn sản phẩm → chọn quy cách, kích thước → mới vào thư viện mẫu | Chọn mẫu → chọn size của mẫu → quy cách → thiết kế (US-76, US-77) |
| Size | Mẫu “tự co giãn theo kích thước đã chọn”, kích thước nhập theo sản phẩm | Mỗi mẫu có bộ size cố định; ngoài bộ thì yêu cầu báo giá tay (US-77, P0-13) |
| Xác nhận | Có ô tick xác nhận ở bước Kiểm tra & gửi | Giống; thêm lưu kết quả kiểm tra và thời điểm xác nhận vào đơn (US-79) |
Quản trị (5 vai trò nội bộ)
Super Admin, Admin, Kỹ thuật, Sản xuất và Kế toán: timeline và SLA, chat, duyệt file, bảng tính giá, phiếu sản xuất, xác nhận giao dịch. Bật “Ghi chú BA” để xem ghi chú nghiệp vụ.