Tõepoolest – pooleldi juhuslikult jõudsin jälile, kuidas hetkel maailma parimad pildimudelid töötada võiks.
Ühel õhtul tegelesin RiteMark appi arendamisega ja tahtsin automatiseerida pildigenereerimist. Eesmärk oli õpetada Claude Code'ile, kuidas süstemaatiliselt pilte luua.
Olin juba varem teada saanud, et automatiseerijad kasutavad niinimetatud JSON prompte. See tähendab, et pildiprompt jagatakse erinevateks struktuuri komponentideks: üks komponent kirjeldab valgustust, teine tausta, kolmas kompositsiooni ja nii edasi.
Probleem: teksti asukoha täpne juhtimine
Mind hakkas huvitama, kas saan kuidagi täpsemalt juhtida, kuhu pildile tekst paigutatakse. Ma ei tahtnud, et tekst oleks suvaliselt kuskil – tahtsin täpselt, et see asetseks all vasakus nurgas, sinise kasti sees.
Ükskõik kuidas ma promptisin, ikka see kastike natuke nihkus paigast. Kast tekkis küll ja tekst läks sinna sisse, aga kõik oli veidi ebatäpne. Proovisin JSONis väga täpselt koordinaate ette anda, kuid iga pilt tuli ikkagi erinev.
Ja siis tekkis mõte: miks ma üritan JSONiga, kui võiksin proovida hoopis pildiformaadi enda keeles promptida?
Üks laialdaselt kasutatav vektorgraafikaformaat on SVG. See on XML-ilaadne formaat, mida masin suudab otseselt lugeda ja mõista. Mõtlesin, et prooviks – mis juhtub, kui annan Nano Bananale JSONi asemel otse SVG koodi?
Esimesed katsed ja üllatused
Siis hakkasidki avastused sündima.
Tekitasin Figmas lihtsa pildi: kaks ringi, üks punane ja teine sinine. Kopeerisin SVG koodi tekstina Nano Bananasse. Voilà – ekraanile ilmus väga selgelt kaks ringi, üks sinine ja teine punane. Täpselt nii nagu SVG-s kirjas.
Muutsin koodi ja tegin ühe ringi natuke väiksemaks ning Nano Banana jälgis muudatust täpselt.
Lihtne SVG kahe ringiga andis täpselt oodatud tulemuse.
Saladus paljastub
Siin hakkas midagi koitma. Nano Banana oli juba varem silma paistnud erakordselt täpse pildiloome poolest – liiga täpse, et pidada seda tavaliseks diffusion-mudeliks.
Tundub, et Nano Banana taustal töötab mitmeastmeline süsteem. Meie prompti põhjal programmeeritakse esmalt SVG-failis kujundus, küljendus ja tekst. Seejärel renderdatakse SVG baaspildiks. Alles siis lastakse see läbi diffusion-mudeli.
Just see mitmeastmeline töövoog selgitab, miks Nano Banana suudab anda ülimalt täpset teksti ja head kvaliteeti – süsteem ei ürita teksti "hallutsineerida" nagu tavalised pildimudelid, vaid renderdab selle korralikult enne diffusioni.
Näited SVG promptidest
Siin on mõned näited SVG promptidest, mida katsetasin, ja nende tulemustest.
UI elementide joonistamine
Esimene tõsisem katse oli UI mockup'i loomine:
<svg width="600" height="750" viewBox="0 0 600 750">
<rect width="600" height="750" fill="#0B0B0C"/>
<rect x="36" y="36" width="528" height="678" rx="28"
fill="none" stroke="#2A2A2E" stroke-width="2"/>
<text x="60" y="110" fill="#F2F2F2" font-size="44">
Header Title
</text>
<text x="60" y="160" fill="#A9ABB3" font-size="22">
Subtitle line goes here
</text>
<rect x="60" y="620" width="480" height="74" rx="18" fill="#F2F2F2"/>
<text x="300" y="668" text-anchor="middle" fill="#0B0B0C" font-size="26">
Call to Action
</text>
</svg>
Nano Banana järgis UI paigutust täpselt, lisades oma stiili.
Tekst kurvi peal
Järgmine test oli keerulisem – tekst, mis järgib kõverat:
<svg width="700" height="300" viewBox="0 0 700 300">
<rect width="700" height="300" fill="#0B0B0C"/>
<path id="curve" d="M50 190 C180 70, 520 70, 650 190"
fill="none" stroke="#2A2A2E" stroke-width="2"/>
<text font-size="34" fill="#F2F2F2">
<textPath href="#curve" startOffset="50%" text-anchor="middle">
TEXT ON A CURVE
</textPath>
</text>
</svg>
Isegi textPath töötab – tekst järgib täpselt etteantud kõverat.
Keerukam kompositsioon
Viimane test oli kõige keerulisem – muster, clipPath, mitmed tekstid ja kõverad koos:
Tähe-kujuline mask, diagonaalne muster ja mitu tekstielementi – kõik töötab.
Mida see praktiliselt tähendab?
See tähendab, et me jõuame pildiloome automatiseerimises täiesti uudse kontrollitavuse tasemeni. Selle asemel, et kirjeldada sõnadega "pane tekst vasakusse alla nurka", saad anda täpsed koordinaadid ja mõõdud. Masin ei pea enam interpreteerima – ta lihtsalt järgib joonist.
Veelgi põnevam: me saame luua SVG malle ja lisada SVG sisse kommentaare, mis juhendavad Nano Bananat. Näiteks saab märkida, kuhu täpselt peaks tekkima "rasterpilt" – ehk siis eraldada väga selgelt kontrollitav vektorala ja kontrollitav pildiala. Tekst jääb teravaks, kujundus täpseks, aga soovitud kohtadesse tekib ikkagi ilus genereeritud graafika.
Testige järele ja andke teada, kuidas läheb!
KKK
Mis on Nano Banana?
Nano Banana on Google'i Gemini pildigenereerija hüüdnimi, mida AI-kogukond kasutab. See viitab Gemini 3.0 mudeli sisseehitatud pildiloome võimekusele.
Kas SVG promptimine töötab ainult Nano Bananaga?
Praegu on see tehnika kõige paremini testitud Gemini mudelitega. Teiste pildimudelite puhul võivad tulemused erineda, kuna nad ei pruugi kasutada sama mitmeastmelist arhitektuuri.
Kas ma pean SVG-d oskama kirjutada?
Ei pea. Võid kasutada Figmat, Illustratorit või mõnda muud vektorgraafikarakendust ja sealt SVG koodi eksportida. Isegi AI saab sulle SVG koodi genereerida.
Miks on SVG promptimine parem kui tavapärane tekstiprompt?
SVG annab pikslitäpse kontrolli elementide asukoha, suuruse ja stiili üle. Tekstipromptiga saad öelda "tekst vasakul all", aga täpset positsiooni ei saa garanteerida. SVG-ga saad öelda "tekst koordinaatidel x=60, y=620".
Kas see töötab ka fotorealistlike piltide puhul?
Jah, aga natuke teistmoodi. SVG määrab kompositsiooni ja teksti, diffusion-mudel lisab realistlikkuse. Nii saad näiteks täpselt paigutatud tekstiga reklaami, kus taust on fotorealistlik.