Learning Timeline
Key Insights
Kelebihan Google AI Studio untuk Shaders
Google AI Studio sangat cemerlang dalam menghasilkan 'shaders' melalui teknik 'one-shot'. Ia sering kali memberikan hasil yang hampir sempurna dalam cubaan pertama tanpa memerlukan banyak suntingan manual.
Strategi Multi-LLM
Jangan bergantung pada satu tool sahaja. Jika Google AI Studio berjaya menghasilkan visual yang cantik tetapi logik kodnya kurang mantap, gunakan Claude untuk melakukan 'finesse' atau pengoptimuman kod, terutamanya untuk pembangunan iOS/Swift.
Had Penjanaan Kod AI
Walaupun AI mampu menjana kod dengan pantas, hasil rekaan asal di Figma biasanya masih lebih teliti dan 'perfect' dari segi perincian berbanding hasil 'one-shot' daripada AI.
Prompts
Penjanaan Kod Aplikasi dari Imej
Target:
Google AI Studio
I have attached a screenshot of my Figma design. Please generate a fully functional mobile app code based on this layout. Ensure the color scheme (especially the orange accents) and logo placement are accurate. Use Swift for iOS development and optimize for a clean UI.
Step by Step
Proses Menukar Rekaan Figma kepada Kod dalam Google AI Studio
- Buka fail rekaan anda di Figma dan pilih frame yang ingin ditukar kepada kod.
- Ambil tangkapan skrin (screenshot) rekaan tersebut dengan jelas.
- Akses Google AI Studio melalui pelayar web anda.
- Klik pada ruangan input prompt dan tekan Ctrl+V (Windows) atau Cmd+V (Mac) untuk 'paste' screenshot rekaan tadi.
- Taip prompt arahan yang spesifik untuk menjana kod (contohnya untuk Swift, React, atau Flutter) di bawah imej tersebut.
- Klik butang 'Run' atau tekan Enter untuk memulakan proses penjanaan kod oleh AI.
- Tunggu sehingga AI selesai menjana keseluruhan struktur kod dan gaya visual (seperti warna dan logo).
- Salin kod yang dihasilkan dan masukkan ke dalam IDE (Integrated Development Environment) pilihan anda.
- Jika kod memerlukan pengoptimuman lanjut, salin output tersebut dan masukkan ke dalam LLM lain seperti Claude untuk proses 'finessing'.
