Hogyan beszélj a Lovable-lel.
A prompt az új design brief. Nem kód, nem mockup, egy mondat, ami elindít egy oldalt. Itt megnézzük az anatómiát, tíz konkrét tippet, a tipikus hibákat, és egy valódi példát.
Egy jó prompt öt rétege.
Készíts egy landing page-et magyar jógastúdiónak (cél),
kismamáknak és kezdőknek (kontextus),
meleg földszínű paletta, Aesop / Stoa hangulat (stílus),
órarend, foglalás emailen, oktatók bemutatása (funkciók).
Két oktató: Petra (hatha) és Bori (vinyasa) (tartalom).
Amit én megtanultam.
- 01
Mondd el a célt, ne a megoldást
„Egy oldal, ahol fotósok bemutatkozhatnak ügyfeleknek.” jobb, mint „csinálj egy navbart logóval és három menüponttal”.
- 02
Adj kontextust kinek készül
„Magyar piacra, középkorú vendégeknek.” vagy „Indie fejlesztő közönségnek angolul.”, a hangvétel és a vizuál ettől fog változni.
- 03
Egy referencia többet ér ezer szónál
„Linear stílusban, sötét háttér, sok whitespace.” Konkrét márka- vagy oldalnevek jelentősen szűkítik az értelmezést.
- 04
Egyszerre egy dolgot kérj
Ne pakold össze a hero-t, a fizetést és a blogot egy promptba. Lépésről lépésre haladj, így könnyebb visszafordulni.
- 05
Mondd ki ha valami nem tetszik
„A gombok túl rikítóak.” „A serif font nem illik ide.” Lovable szereti az őszinte feedbacket, és gyorsan tanul belőle.
- 06
Adj példa tartalmat
Ha van három valós termék, három valós idézet, három valós szolgáltatás, másold be. Sokkal jobb lesz, mint a Lorem Ipsum.
- 07
Kérd a stílust nevén
„Editorial magazin”, „brutalist”, „glassmorphism”, „neumorphism”, „swiss minimal”, ezek a szavak konkrét designra fordulnak.
- 08
Mondd meg mit NE csináljon
„Ne legyen stock fotó.” „Ne legyen lila-indigó gradient.” A negatív utasítás sokszor hatékonyabb a pozitívnál.
- 09
Iterálj kicsiben
Tíz apró módosítás jobb, mint egy nagy átírás. A Lovable verziókat tart, vissza tudsz térni bármelyikre.
- 10
Bízz a chatben
Nem kell technikailag pontosnak lenned. „Tedd kisebbre”, „légy bátrabb”, „kevesebb szöveg”, ezek érvényes utasítások.
Egy mondat, egy oldal.
Az egyik első Lovable projektem ennyi volt, egyetlen üzenet a chat ablakba:
„I need a website for this plan: We have 140 ways of healing you. Interested?"
Ennyi volt. Egy mondatnyi koncepció. Lett belőle egy meglepően költői, használható oldal, amit élesben is meg tudsz nézni:
Megnézem élőben →Néha egyetlen evokatív mondat elég, ha önmagában már koncepció. A „140" + „ways" + „healing" három olyan szó, ami struktúrát is ad (lista lesz belőle) és érzelmi tónust is (gyengéd, kerek). Próbáld ki: van olyan címed, ami önmagában történet?
Amit ne csinálj.
- ✕Mindent egyszerre: „landing + blog + shop + auth + email”, bontsd szét.
- ✕Túl homályos: „csinálj egy jó oldalt cégnek”, milyen cég? kinek? mit árul?
- ✕Ellentmondó utasítás: „minimalista, de színes és sok elemmel”, döntsd el.
- ✕Nincs visszajelzés: csak újraindítod a beszélgetést, ahelyett hogy elmondanád mit változtasson.
Az első verzió sosem kész.
A Lovable-nél a generálás csak a nulladik lépés. A munka 80%-a a chat-ben történik: konkrét, kicsi módosítások, ahol minden válasz után ránézel a preview-ra. Ha valami nagyon elromlott, visszamehetsz korábbi verzióra. Ne félj kísérletezni, nincs „elrontás", csak tanulás.
Lássuk a valódi példákat.
Konkrét promptok, konkrét eredmények, élő linkekkel. Nézd meg, mit lehet kihozni egy-egy jól megfogalmazott mondatból.