Buổi 03 — Lý thuyết: Ngôn Ngữ Mô Tả Giao Diện
Mục tiêu buổi học
- Nắm bộ từ vựng mô tả bố cục bằng tiếng Việt đời thường (không cần thuật ngữ kỹ thuật)
- Học khung prompt chuẩn dùng cho cả khóa
- Thành thạo kỹ thuật iterate — chỉnh từng chút thay vì làm lại
- Biết dùng ảnh tham khảo để mô tả nhanh và chính xác
1. Vì sao mô tả giao diện là kỹ năng quan trọng nhất?
Trong Vibe Coding, giao diện app đẹp hay xấu, đúng ý hay lệch ý — phụ thuộc gần như hoàn toàn vào bạn mô tả tốt tới đâu. AI không đọc được suy nghĩ; nó chỉ làm theo lời bạn. Tin vui: bạn không cần biết thuật ngữ kỹ thuật như “widget”, “flexbox”. Bạn chỉ cần tả rõ như đang chỉ cho một người bạn cách sắp xếp đồ trong phòng.2. Bộ từ vựng mô tả bố cục (học thuộc bảng này)
3. Khung prompt chuẩn — dùng suốt cả khóa
Đây là “công thức” giúp prompt của bạn rõ ràng, AI làm đúng ngay:4. Kỹ thuật ITERATE — bí quyết quan trọng nhất
4.1. Đừng nói “làm lại đi”
Khi chưa ưng, người mới hay nói “làm lại từ đầu”. Điều này khiến AI bỏ luôn cả những phần đang tốt. Thay vào đó, hãy giữ cái tốt, chỉ sửa cái chưa ổn.4.2. Công thức iterate: “Giữ nguyên… chỉ đổi…”
Iterate là cách làm việc bình thường và đúng đắn, không phải dấu hiệu bạn kém. Ngay cả chuyên gia cũng chỉnh nhiều vòng. Mỗi vòng làm sản phẩm tốt hơn một chút.
5. Dùng ảnh tham khảo — “một tấm ảnh hơn ngàn lời tả”
Cách nhanh nhất để AI hiểu bạn muốn gì là đưa cho nó một tấm ảnh:6. Ba trạng thái của một màn hình (khái niệm quan trọng)
Một màn hình tốt không chỉ đẹp khi mọi thứ suôn sẻ. Nó phải xử lý được 3 tình huống:
Ngay từ bây giờ, tập thói quen yêu cầu AI xử lý cả 3 trạng thái, để app luôn “tử tế” với người dùng.
Tóm tắt buổi học
- Mô tả giao diện = kỹ năng quan trọng nhất; dùng từ vựng đời thường, không cần thuật ngữ.
- Dùng khung prompt chuẩn (Bối cảnh / Yêu cầu / Chi tiết / Giới hạn).
- Iterate bằng công thức “Giữ nguyên… chỉ đổi…”, đừng bao giờ “làm lại đi”.
- Đính kèm ảnh tham khảo để mô tả nhanh và chính xác.
- Luôn nghĩ tới 3 trạng thái màn hình: có dữ liệu / đang tải / trống-lỗi.