Dùng để: Viết landing page một trang bám đúng tinh thần thương hiệu, có mã chạy được và chạy tốt trên điện thoại.
Nội dung prompt
VAI TRÒ Bạn là lập trình viên giao diện kiêm nhà thiết kế, người dựng landing page chuyển đổi tốt mà vẫn giữ đúng bản sắc thương hiệu. NHIỆM VỤ Thiết kế cấu trúc và viết mã cho một landing page một trang theo mô tả trong ĐẦU VÀO. ĐẦU VÀO - Tên thương hiệu: [TÊN THƯƠNG HIỆU] - Sản phẩm hoặc dịch vụ: [MÔ TẢ NGẮN] - Khách mục tiêu: [KHÁCH HÀNG CHÍNH] - Tinh thần thương hiệu: [VÍ DỤ: TĨNH LẶNG, ẤM ÁP, NĂNG ĐỘNG] - Bảng màu: [MÀU CHÍNH VÀ MÀU PHỤ] - Phông chữ: [PHÔNG HOẶC PHONG CÁCH CHỮ] - Hành động chính: [NÚT CẦN KHÁCH BẤM] - Điểm khác biệt: [BA ĐIỀU KHIẾN KHÁCH CHỌN BẠN] - Công nghệ: [HTML VÀ CSS THUẦN, HOẶC REACT, HOẶC NEXTJS] QUY TẮC 1. Nêu cấu trúc các mục theo thứ tự trước khi viết mã. 2. Dùng thẻ ngữ nghĩa cho tiêu đề, mục và nút, không lạm dụng thẻ bao chung. 3. Đảm bảo độ tương phản chữ và nền đủ đọc. Không đặt chữ nhỏ trên nền ảnh rối. 4. Bố cục một cột trên điện thoại và nhiều cột trên màn hình rộng. 5. Không dùng ảnh hay phông tải từ ngoài trừ khi tôi cho phép. Ghi chú chỗ cần thay nội dung thật. 6. Không tự thêm số liệu, chứng nhận hay lời chứng thực khi tôi chưa cung cấp. KHUÔN ĐẦU RA 1. Danh sách mục theo thứ tự kèm mục tiêu từng mục trong một câu. 2. Mã hoàn chỉnh, có chú thích ở chỗ cần thay nội dung. 3. Ghi chú ngắn về cách chạy thử và điều cần chỉnh khi lên thật.
Thay nội dung trong dấu [ ] trước khi sử dụng.
Mẹo tinh chỉnh
Landing page không cần hiệu ứng cầu kỳ, nên hãy ưu tiên tốc độ tải và độ rõ của thông điệp. Nếu thương hiệu có bộ nhận diện sẵn, dán mã màu và phông vào ĐẦU VÀO để trang không lệch tông. Sau khi có bản đầu, yêu cầu AI rút gọn phần chào mừng và làm nổi nút hành động hơn. Với mỗi lần sửa, chỉ đổi một thứ để bạn còn biết thay đổi nào tạo ra khác biệt. Cuối cùng, tự kiểm tra lại trên điện thoại thật vì mô phỏng đôi khi bỏ sót lỗi tràn chữ.
Prompt khác cùng nhóm
Dựng ứng dụng trắc nghiệm tương tác bằng JavaScriptCho ngân hàng câu hỏi và thiết lập, nhận về app trắc nghiệm: nhiều dạng câu, đếm ngược, chấm điểm, xem lại bài và bảng điểm cao.Xem promptDựng ứng dụng quản lý thu chi cá nhânMô tả nhu cầu tài chính, nhận về app quản lý thu chi: bảng điều khiển, phân loại giao dịch, biểu đồ, mục tiêu ngân sách và sao lưu.Xem promptDựng ứng dụng web tạo hóa đơn PDF bằng Node.jsMô tả nguồn đơn hàng và quy tắc hoa hồng, nhận về kiến trúc ứng dụng Node.js xuất hai tệp PDF: bảng chi tiết và hóa đơn.Xem promptDựng ứng dụng ghi chú Markdown hai màn hìnhMô tả nhu cầu ghi chú, nhận về app hai khung soạn và xem trước, hỗ trợ bảng, khối mã, công thức và lưu trong trình duyệt.Xem promptDựng Telegram Mini App điểm danh ca làm việcMô tả ca làm và vai trò, nhận về mini app: chấm công vào ra, xác thực người dùng, xem lịch ca và trang quản trị xếp ca.Xem promptLập quy trình xử lý lỗ hổng bảo mật CVEĐưa danh sách lỗ hổng và hệ thống đang dùng, nhận về quy trình phân tích nguyên nhân, chọn mức ưu tiên và tài liệu tuân thủ.Xem promptĐóng vai kỹ sư phần mềm nhúng ô tô theo chuẩn AUTOSARĐưa bối cảnh vi điều khiển và yêu cầu, nhận về cách chia lớp phần mềm, danh sách mô-đun và điểm kiểm tra an toàn.Xem promptTạo mẫu giao diện ứng dụng trò chuyện AI cho AndroidMô tả tính năng và địa chỉ API, nhận về bản mẫu giao diện tối gồm bốn màn hình và luồng điều hướng bằng thanh cạnh trái.Xem promptDựng game đua xe 3D bằng Three.jsMô tả đường đua và chế độ chơi, nhận về game đua xe: mô phỏng vật lý, đối thủ AI, HUD đầy đủ, hiệu ứng khói và thời tiết.Xem prompt