Vibe Code Studio — Tổng quan

Trang này để làm gì

Vibe Code Studio là công cụ xây Zalo Mini App bằng cách mô tả cho AI. Bạn viết bằng tiếng Việt điều mình muốn, AI tạo giao diện, gắn dữ liệu và dựng luồng. Không cần biết lập trình.

Đường dẫn: Tiện ích → Vibe Code Solution (/vibe-code-solution)

Tên gọi

Danh sách gọi là Vibe Code Solution, còn màn hình dựng hiển thị nhãn Vibe Code Studio. Cùng một công cụ.

Nó khác gì với Zalo Mini App có sẵn

	Kho giao diện Zalo Mini App	Vibe Code Studio
Cách làm	Chọn mẫu theo ngành rồi tuỳ chỉnh	Mô tả cho AI, AI dựng theo yêu cầu
Phù hợp khi	Nhu cầu giống mẫu có sẵn	Nhu cầu riêng, không mẫu nào khớp
Thời gian	Nhanh nhất	Trung bình
Giới hạn	Chỉ sửa được trong khuôn mẫu	Tự do về bố cục và logic

Nói ngắn gọn: mẫu có sẵn hợp với nhu cầu phổ biến; Studio hợp với thứ đặc thù của riêng bạn — trang tích tem theo cách tính riêng, trang tra cứu bảo hành, trang check-in sự kiện.

Cấu trúc một Solution

Mỗi Solution gồm ba loại thành phần:

Màn hình tổng quan một Solution. Ảnh chụp thực tế.

1. Trang — các màn hình của Mini App. Một Solution có thể có nhiều trang.
2. DataHub — bảng dữ liệu mà Solution đọc và ghi. Xem Data Hub.
3. Nguồn dữ liệu — kết nối API hoặc database bên ngoài. Xem Nguồn dữ liệu.
4. Nút mở trang — vào trình dựng của trang đó để làm việc với AI.

Ba thành phần này chia việc rất rõ:

Màn hình danh sách Solution

Danh sách Solution. Ảnh chụp thực tế; tên người tạo đã thay bằng tên mẫu.

1. Nút Tạo solution — khởi tạo Solution mới.
2. Cột Thành phần — ba con số lần lượt là số Trang, số DataHub và số Nguồn dữ liệu của Solution đó. Nhìn cột này biết ngay Solution nào đã dựng thật, Solution nào mới tạo vỏ.
3. Cột Trạng thái — Nháp (chỉ bạn xem được) hoặc Đã xuất bản (khách dùng được).

Studio tiêu AI Credit

Mỗi lượt bạn nhắn cho AI để dựng hoặc sửa trang đều trừ vào hạn mức AI Credit của doanh nghiệp — chỉ số thứ ba trên thanh trên cùng, cạnh Credit và Token.

Khi AI Credit cạn, hệ thống vẫn cho bạn tạo Solution, tạo trang và gõ tin nhắn, nhưng đến lúc gửi thì hiện thông báo:

Không còn credit để sử dụng Số dư credit hiện tại không đủ để thực hiện thao tác này. Vui lòng nạp thêm credit để tiếp tục.

Tin nhắn của bạn vẫn nằm trong khung trò chuyện, nhưng AI không phản hồi và trang không được dựng.

Kiểm tra AI Credit trước khi bắt đầu một Solution

Đây là điểm dễ mất thời gian nhất: bạn dựng xong cấu trúc, viết mô tả kỹ càng, rồi mới phát hiện không gửi được.

Nhìn ô AI Credit còn lại trên thanh trên cùng trước khi mở Studio. Số âm nghĩa là đã dùng vượt hạn mức và mọi thao tác AI đều bị chặn cho tới khi nạp thêm.

Ba chỉ số hạn mức không dùng chung

Credit, Token và AI Credit là ba ví riêng. Còn nhiều Token không giúp gì cho Studio — nó chỉ tiêu AI Credit. Xem Credit, Token & AI Credit.

Vòng đời một Solution

1. Tạo Solution và đặt tên Tên nên mô tả chức năng — Tích tem, Tra cứu bảo hành — vì danh sách sẽ dài dần.
2. Chuẩn bị dữ liệu trước khi dựng giao diện Nếu trang cần đọc hoặc ghi dữ liệu, gắn DataHub trước. AI dựng chính xác hơn nhiều khi đã biết có những cột nào.
3. Tạo trang và mô tả cho AI Xem Xây trang bằng AI.
4. Xem trước và chỉnh sửa Khung preview điện thoại cập nhật sau mỗi lượt AI sửa. Quét mã QR để mở thử trên điện thoại thật.
5. Xuất bản Trạng thái chuyển từ Nháp sang Đã xuất bản. Từ lúc này khách mới dùng được.

Nháp và Đã xuất bản là hai bản khác nhau

Sửa một trang đã xuất bản không làm khách thấy thay đổi ngay — bản đang chạy vẫn là bản xuất bản lần trước. Bạn phải xuất bản lại.

Điều này có mặt tốt: bạn sửa thoải mái trên bản nháp mà không sợ ảnh hưởng khách đang dùng. Nhưng nó cũng là lý do phổ biến khiến người dùng báo "tôi sửa rồi mà không thấy gì đổi".

Khi nào nên dùng Studio, khi nào không

Tình huống	Nên dùng
Trang tích tem, tích điểm theo cách tính riêng	Studio
Tra cứu bảo hành, tra cứu đơn theo mã	Studio
Check-in sự kiện, điểm danh	Studio
Form thu thập thông tin đơn thuần	Dynamic Form — nhanh hơn
Vòng quay may mắn, game tương tác	Gamification — có sẵn mẫu
Cửa hàng bán hàng đầy đủ	Kho giao diện Zalo Mini App

Đừng dùng Studio cho việc đã có công cụ chuyên dụng

Studio linh hoạt nhất nhưng cũng tốn công nhất. Nếu Dynamic Form hoặc mẫu Mini App làm được việc đó, dùng chúng — bạn sẽ xong trong 15 phút thay vì nửa buổi, và về sau người khác trong đội cũng dễ tiếp quản hơn.

Bước tiếp theo

• Xây trang bằng AI
• Zalo Mini App