Kaip dirbtinis intelektas per 2 minutes sukurti visą „WordPress“ svetainę

Kiekvieną kartą, kai kas nors įveda verslo aprašymą į „PAGEnza“ ir paspaudžia „sukurti“, fone vyksta kažkas gana sudėtingo – maždaug per 90 sekundžių. Šiame įraše paaiškinama, kas tai yra.

Šablonų problema

Daugelis dirbtinio intelekto svetainių kūrimo įrankių veikia taip: jie pasirenka šabloną, pakeičia jūsų tekstą ir vadina tai „dirbtinio intelekto sugeneruota“. Rezultatas atrodo kaip bet kuri kita platformoje sukurta svetainė.

„PAGEnza“ veikia kitaip. Nėra jokių šablonų. Kiekviena svetainė prasideda nuo tuščios „Gutenberg“ drobės ir yra kuriama algoritmiškai pagal dizaino taisyklių rinkinį, kurį vadiname Dizaino pavedimu.

Kas yra Dizaino pavedimas?

Dizaino pavedimas yra struktūrizuotas raginimas – maždaug 8 000 žetonų – apibūdinantis kiekvieną vizualinį ir struktūrinį sprendimą konkrečiai svetainei. Jis sukurtas „Python“ kalba prieš bet kokį dirbtinio intelekto kvietimą, remiantis jūsų įvestimi.

Jį sudaro šešios dalys:

A dalis – Prekės ženklo tapatybė: pramonė, verslo pavadinimas, tonas (pvz., „profesionalus“ prieš „žaismingas“), tikslinė auditorija.

B dalis – Spalvų sistema: 4 spalvų paletė (juoda, bg1, bg2, akcentas), sugeneruota algoritmiškai ir patvirtinta pagal WCAG AA kontrasto taisykles. Kiekviena paletė tikrinama naudojant tikrą šviesumo matematiką – ne spėjimus.

C dalis – Tipografija: šriftų trio (antraštė / tekstas / akcentas), pasirinktas iš daugiau nei 80 „Google Fonts“, filtruotas pagal pramonės archetipą ir patvirtintas, kad apimtų latin-ext simbolių palaikymą.

D dalis – Išdėstymo brėžinys: puslapio struktūra – kurie skyriai pasirodo, kokia tvarka ir su kokiu variantu (pvz., herojus su viso pločio vaizdu prieš herojų su padalintu išdėstymu).

E dalis – Dizaino apribojimai: kraštinių spindulių stilius (aštrus / švelnus / apvalus), skyrių skiriamųjų linijų formos, vaizdo apdorojimas, tarpų sistema.

F dalis – Turinio taisyklės: koks tekstas kur eina, kaip struktūrizuojamos antraštės, kokie raginimai veikti pasirodo.

Kaip generuojamos spalvų paletės

Dauguma dirbtinio intelekto įrankių klysta su spalvomis. Paprašius LLM pasirinkti spalvas, gausite atsitiktinius šešioliktainius kodus, kurie gali atrodyti gerai atskirai, bet neatskaito prieinamumo testų – arba tiesiog atrodo bendrai.

Mes laikomės kitokio požiūrio. Mūsų spalvų paletės sistema veikia taip:

1. Atsižvelgiant į jūsų pramonę ir archetipą (pvz., „prabanga“, „drąsus“, „žemės“), mes pasirenkame iš 20 iš anksto patikrintų spalvų paletės grupių
2. Kiekvienoje grupėje pasirenkame paletę, kurioje juoda turi ≥4,5:1 kontrastą su visais fonais
3. Patvirtiname, kad akcentas turi ≥3,0:1 kontrastą su bg1 ir bg2
4. Užtikriname, kad du fono spalvos turėtų kontrastingas spalvų temperatūras (viena šilta, viena šalta), kad skyriai atrodytų skirtingi

Jei spalvų paletė nepraeina jokio patikrinimo, ji automatiškai pakeičiama. Šiame etape nėra LLM dalyvavimo – tai gryna matematika.

Kaip surenkami „Gutenberg“ blokai

Kai Dizaino pavedimas yra paruoštas, jis perduodamas „Gemini Flash“ su griežtu raginimu, kuriame nurodoma:

• Leidžiami blokai (apie 40 „Gutenberg“ blokų tipų baltasis sąrašas)
• Reikalingi kiekvieno bloko tipo atributai
• Tikslus išvesties JSON formatas

Dirbtinis intelektas grąžina neapdorotą „Gutenberg“ blokų JSON – ne HTML, ne „React“, tikrą „WP“ blokų žymėjimą. Tada tas JSON pereina kelis patvirtinimo etapus:

1. Schemos patvirtinimas – pateikiami reikalingi atributai, nėra nežinomų blokų tipų
2. CSS klasių valymas – sugalvotos klasės vardai pašalinami, pakeičiami mūsų dizaino sistemos klasėmis
3. Taisymo etapai – tarpų atributai sinchronizuojami, dangčio blokų gradiento normalizuojami, įterpiami formų skiriamieji elementai

Rezultatas tiesiogiai įkeliamas į „WordPress“ per WP REST API ir aktyvuojamas kaip svetainės pagrindinis puslapis.

Kas daro kiekvieną svetainę unikalią

Kiekvienos kartos metu skiriasi kelios smulkmenos, net ir toje pačioje pramonėje:

• Spalvų paletė: 20+ grupių, kiekviena su keliais spalvų paletėmis
• Šriftų trio: 6+ deriniai kiekvienam archetipui
• Skyrių tvarka ir variantai: herojų išdėstymas, statistikos stilius, funkcijų kortelių išdėstymas
• Formų skiriamieji elementai: organiniai prieš geometrinius, amplitudės/dažnio variacijos
• Blob formos: organinėms pramonėms, vaizdo ir kortelių blobai atsitiktinai parenkami iš 12 variantų

Rezultatas yra tas, kad du picerijų restoranai, sugeneruoti tą pačią dieną, turės skirtingas spalvas, skirtingus šriftus, skirtingus išdėstymus – ir abu atitiks WCAG AA reikalavimus.

Kas toliau

Šiuo metu dirbame ties:

• Kelių puslapių generavimas – /apie, /paslaugos ir /kontaktai puslapių generavimas iš to paties pavedimo
• Tiesioginė peržiūra – svetainės peržiūra prieš jos įdiegimą į „WordPress“
• Stiliaus perkėlimas – svetainės ekrano kopijos, kuri jums patinka, įkėlimas ir jos dizaino DNR ištraukimas

Jei norite pamatyti sistemą veikloje, generatoriumi galima naudotis nemokamai – pirmosios svetainės nereikia paskyros.