Giao Diện Tạo
Tổng Quan Bố Cục
Giao Diện Tạo là môi trường chỉnh sửa ba bảng bạn mở bằng cách nhấp đúp vào bất kỳ nhóm nào trong Khu Vực Thành Phần. Nó cung cấp danh sách block bên trái, trình soạn thảo mã ở giữa và xem trước trực tiếp bên phải, với Hộp Nhắc AI chạy dọc phía dưới.
Bảng Danh Sách Block
Bảng bên trái hiển thị tất cả các khối trong nhóm hiện tại. Mỗi khối hiển thị bản xem trước dạng thẻ với tên khối và danh sách tệp được đánh số bên dưới. Sử dụng thanh công cụ ở trên để điều hướng quay lại, chuyển đổi giữa chế độ xem danh sách và chia đôi, hoặc nhấn nút + để thêm khối mới.
Trình Soạn Thảo Mã
Bảng giữa là trình soạn thảo mã có tab nơi bạn viết và chỉnh sửa nội dung block. Tab được tổ chức theo loại tệp:
Văn Bản
Viết tài liệu, markdown hoặc nội dung văn bản thuần cho block.
HTML
Chỉnh sửa cấu trúc HTML của thành phần.
CSS
Thêm kiểu dáng cho thành phần.
JavaScript
Thêm tương tác và logic cho thành phần.
Xem Trước Trực Tiếp
Bảng bên phải hiển thị bản xem trước trực tiếp của component. Khi bạn thêm HTML, CSS và JavaScript trong trình soạn thảo, bản xem trước cập nhật để hiển thị kết quả đã biên dịch. Bạn cũng có thể kéo thả tệp hoặc dán nội dung (Ctrl+V) trực tiếp vào khu vực xem trước để thêm vào khối. Sử dụng biểu tượng mắt để bật/tắt xem trước và nút BG để thay đổi nền xem trước.
Hộp Nhắc AI
Thanh dưới cùng là Hộp nhập lệnh AI. Sử dụng nó để mô tả các thay đổi và để AI tạo hoặc sửa đổi nội dung khối của bạn. Nó bao gồm bộ chọn mô hình, trường nhập văn bản, đầu vào giọng nói và emoji, và nút Tạo. Hai nút chế độ — A và V — chuyển đổi giữa Chế độ AI trực tiếp và Chế độ biến thể.
Danh Mục Tạo AI
Bộ chọn mô hình AI hiển thị các danh mục tạo xác định loại nội dung AI sản xuất:
Tạo Văn Bản
Tạo hoặc chỉnh sửa nội dung dựa trên văn bản như mã, tài liệu và markup.
Tạo Hình Ảnh
Tạo hình ảnh từ lời nhắc văn bản hoặc chỉnh sửa hình ảnh hiện có bằng AI (văn bản sang hình ảnh và hình ảnh sang hình ảnh).
Tạo Video
Tạo video từ mô tả văn bản hoặc chuyển động hình ảnh tĩnh thành video (văn bản sang video và hình ảnh sang video).
Chế Độ AI Trực Tiếp (A)
Khi nút A đang hoạt động, AI thực hiện các sửa đổi trực tiếp trên component của bạn. Văn bản trường hiển thị “Mô tả các thay đổi cần áp dụng cho component của bạn” và huy hiệu cho biết tệp nào sẽ được sửa đổi (ví dụ: “Sẽ sửa đổi: text”). Chế độ này lý tưởng cho các chỉnh sửa nhanh, cụ thể cho tệp đang được chọn.
Chế Độ Biến Thể (V)
Khi nút V đang hoạt động, AI tạo nhiều biến thể của component thay vì chỉnh sửa trực tiếp. Văn bản trường chuyển sang “Mô tả các biến thể bạn muốn tạo” và bộ đếm với các điều khiển − / + xuất hiện để bạn chọn số lượng biến thể cần tạo. Các biến thể đã tạo xuất hiện trong bảng chuyên dụng nơi bạn có thể xem xét và thêm các phiên bản ưa thích vào nhóm.