Learning Timeline
Key Insights
Strategi 'Hybrid' (AI + Manual)
Gunakan AI untuk 'heavy refactoring' atau perubahan besar seperti menukar struktur layout. Untuk perubahan mikro seperti menukar logo atau menyusun semula urutan butang, suntingan manual (point-and-click) selalunya lebih pantas dan tepat.
Amaran Pemadaman Blok
Apabila anda meminta AI merombak layout yang sudah sedia ada, AI mungkin perlu memadam blok lama. Pastikan anda menyemak konfigurasi data sebelum klik 'Confirm' agar tidak kehilangan setting manual yang penting.
Prompts
Prompt Transformasi Layout & Action
Target:
Softr AI Co-Builder
Change the layout to a two column grid of cards to connect to the content ideas table where each card is going to show the title the description and a small tag pill for the update the record status to discarded and additionally we want an empty state with a short message and a CTA to ask AI.
Step by Step
Mengemaskini Design System Menggunakan AI Prompt
- Buka Interface Builder dalam Softr.
- Klik pada ikon AI Co-Builder yang tersedia di dalam interface.
- Masukkan prompt yang mengandungi spesifikasi design seperti kod warna (hex codes), jenis typography, saiz font, dan tahap 'roundness' untuk elemen UI.
- Tekan Enter dan perhatikan AI mengemaskini keseluruhan aplikasi secara konsisten mengikut design system yang diminta.
- Jika ingin kawalan manual, navigasi ke seksyen 'Theme' di Interface Builder untuk menguruskan warna 'Accent', 'Text', 'Background', serta gaya navigasi secara 'point and click'.
Rombak Layout & Butang Action Secara Dinamik
- Pilih halaman yang ingin diubah suai (contoh: Content Ideas page).
- Aktifkan AI Co-Builder dan masukkan arahan spesifik untuk menukar layout (contoh: tukar kepada 'two-column grid of cards').
- Nyatakan sumber data (data source) dan field yang ingin dipaparkan (contoh: Title, Description, dan Tags) di dalam prompt yang sama.
- Sertakan arahan untuk mencipta butang 'Action' yang boleh mengemaskini status rekod (contoh: butang untuk 'update record status to discarded').
- Tambahkan arahan untuk 'Empty State' sekiranya tiada data, lengkap dengan mesej dan butang CTA (Call to Action).
- Klik butang 'Confirm' sekiranya AI meminta kebenaran untuk memadam atau menggantikan blok sedia ada.
- Semak hasil penjanaan AI. Jika bilangan butang atau susunan tidak tepat, masukkan prompt susulan (contoh: 'add two buttons instead of one').
- Lakukan kemasan akhir secara manual dengan klik pada elemen butang untuk memadam atau menyusun semula kedudukan butang melalui visual editor jika perlu.
