Edit UI Aplikasi Menggunakan Screenshot dalam AI Studio

Tekan play pada video. Ia akan terus lompat ke bahagian yang menjawab tajuk di atas — tak perlu tonton video penuh.

Gemini 3 Google AI Studio Web Design Coding

Teknik 'vibe coding' untuk mengubah suai kod UI dengan memuat naik screenshot rujukan dan memberikan arahan mudah kepada AI untuk menambah elemen baru.

Kelebihan Teknik Vibe Coding

Anda tidak perlu tahu nama kelas CSS atau struktur kod yang rumit. Cukup sekadar bagi gambar rujukan, AI akan faham 'vibe' atau gaya rekaan tersebut untuk hasilkan elemen baru yang selari.

Tips Resolusi Gambar

Pastikan screenshot yang dimuat naik adalah jelas dan tidak pecah (high resolution) supaya AI dapat mengecam saiz font dan margin dengan lebih tepat.

More from Coding & Pembangunan Aplikasi AI

Generate Frontend App dengan Google AI Studio & Sambung Webhook

Google AI Studio n8n

Analisis Rakaman Audio Sales Call Guna Google AI Studio

Google AI Studio Google Gemini

Automasi variasi iklan media sosial dengan Google AI Studio

Google AI Studio Gemini

Hasilkan simulasi 3D interaktif menggunakan Gemini 3 Pro dan Three.js

Gemini 3 Pro Three.js

Bina browser game dengan one-shot prompting menggunakan Gemini 3 Pro

Gemini 3 Pro Google AI Studio

Buat laman web responsif dengan Gemini 3 Pro dalam AI Studio

Gemini 3 Pro Google AI Studio