Learning Timeline
Key Insights
Tip Automasi Ikon
Google Stitch bukan sahaja menyusun layout, malah ia mampu menghasilkan 'custom icons' yang relevan dengan topik (contoh: ikon raket untuk prompt tenis) secara automatik.
Era 'On-Demand Application'
Gunakan tools ini untuk fasa 'rapid prototyping'. Anda tidak perlu melukis setiap kotak; biarkan AI bertindak sebagai designer pertama anda, kemudian anda hanya perlu 'fine-tune' dalam Figma.
Prompts
Penghasilan Design Galeri Foto
Target:
Google Stitch
A personal photo library
Penghasilan Design Aplikasi Sukan
Target:
Google Stitch
Tennis app planner with custom icons and leaderboard
Step by Step
Cara Menghasilkan Design UI Menggunakan Google Stitch
- Layari laman web rasmi Google Stitch dan log masuk ke akaun anda.
- Pilih jenis projek yang ingin dihasilkan (Mobile App atau Web App) pada dashboard utama.
- Cari kotak input teks untuk 'Prompt' di bahagian tengah skrin.
- Taipkan deskripsi aplikasi yang ingin anda bina secara spesifik (Contoh: 'A personal photo library').
- Tekan butang 'Enter' atau butang 'Generate' untuk memulakan proses binaan AI.
- Tunggu AI menjana beberapa skrin antaramuka (UI) secara automatik berdasarkan konsep designer.
- Klik pada mana-mana komponen atau skrin untuk melihat butiran design dan kod yang dihasilkan.
- Gunakan butang 'Export' atau 'Import into Figma' untuk memindahkan design tersebut ke dalam alat reka bentuk profesional.
- Klik pada butang 'Code' jika anda ingin menyalin (copy) kod sumber (source code) bagi setiap elemen UI tersebut.
Mengubahsuai Design Menggunakan Template Sedia Ada
- Pilih mana-mana contoh (example) aplikasi yang dipaparkan pada galeri Stitch (Contoh: 'Board game app planner').
- Klik pada prompt asal yang digunakan oleh template tersebut untuk mengaktifkan mod edit.
- Gantikan kata kunci dalam prompt tersebut dengan keperluan anda (Contoh: Tukar 'Board games' kepada 'Tennis').
- Tekan butang 'Run' atau 'Regenerate' untuk melihat AI mengemaskini ikon, teks, dan layout mengikut topik baharu.
- Semak paparan 'Leaderboard' atau skrin profil yang dijana secara dinamik oleh AI.
