Cum generează AI un site WordPress complet în 2 minute

De fiecare dată când cineva introduce o descriere a afacerii în PAGEnza și apasă pe generare, se întâmplă ceva destul de complex în fundal — în aproximativ 90 de secunde. Acest articol explică exact ce este.

Problema cu șabloanele

Majoritatea constructorilor de site-uri AI funcționează astfel: aleg un șablon, înlocuiesc textul dvs. și îl numesc „generat de AI”. Rezultatul arată la fel ca orice alt site construit pe acea platformă.

PAGEnza funcționează diferit. Nu există șabloane. Fiecare site începe de pe o pânză Gutenberg goală și este construit algoritmic dintr-un set de reguli de design pe care le numim Mandat de Design.

Ce este Mandatul de Design?

Mandatul de Design este un prompt structurat — aproximativ 8.000 de token-uri — care descrie fiecare decizie vizuală și structurală pentru un anumit site. Acesta este construit în Python înainte de a se face orice apel AI, pe baza intrării dvs.

Conține șase părți:

Partea A — Identitate de Brand: industrie, numele afacerii, ton (de ex. „profesional” vs „jucăuș”), public țintă.

Partea B — Sistem de Culori: o paletă de 4 culori (cerneală, bg1, bg2, accent) generată algoritmic și validată conform regulilor de contrast WCAG AA. Fiecare paletă este verificată cu matematică reală a luminozității — nu presupuneri.

Partea C — Tipografie: un trio de fonturi (titlu / corp / accent) ales din peste 80 de fonturi Google, filtrat după arhetipul industriei și verificat pentru a include suport pentru caractere latin-ext.

Partea D — Plan de Layout: structura paginii — ce secțiuni apar, în ce ordine și cu ce variantă (de ex. erou cu imagine pe toată lățimea vs erou cu layout împărțit).

Partea E — Constrângeri de Design: stilul razei colțurilor (ascuțit / moale / rotunjit), forme ale separatoarelor de secțiuni, tratamentul imaginilor, sistemul de spațiere.

Partea F — Reguli de Conținut: ce text merge unde, cum sunt structurate titlurile, ce CTA-uri apar.

Cum sunt generate paletele

Culoarea este punctul unde majoritatea instrumentelor AI eșuează. Solicitarea unui LLM de a alege culori vă oferă coduri hex aleatorii care pot arăta bine izolat, dar eșuează testele de accesibilitate — sau pur și simplu arată generic.

Noi abordăm diferit. Sistemul nostru de palete funcționează astfel:

1. Pe baza industriei și arhetipului dvs. (de ex. „lux”, „îndrăzneț”, „pământiu”), selectăm din 20 de grupuri de palete pre-auditate
2. În cadrul fiecărui grup, alegem o paletă unde cerneala are un contrast de ≥4,5:1 față de toate fundalurile
3. Verificăm ca accentul să aibă un contrast de ≥3,0:1 față de bg1 și bg2
4. Ne asigurăm că cele două culori de fundal au temperaturi de culoare contrastante (una caldă, una rece) pentru ca secțiunile să pară distincte

Dacă o paletă eșuează orice verificare, este înlocuită automat. Nicio implicare LLM în acest pas — este matematică pură.

Cum sunt asamblate blocurile Gutenberg

Odată ce Mandatul de Design este gata, acesta ajunge la Gemini Flash cu un prompt strict care specifică:

• Ce blocuri sunt permise (o listă albă de ~40 de tipuri de blocuri Gutenberg)
• Atributele necesare pentru fiecare tip de bloc
• Formatul exact JSON pentru ieșire

AI-ul returnează JSON brut de blocuri Gutenberg — nu HTML, nu React, ci marcaj real de bloc WP. Acel JSON trece apoi prin mai multe etape de validare:

1. Validare de schemă — atributele necesare prezente, nicio tip de bloc necunoscut
2. Sănătosirea claselor CSS — numele de clase inventate sunt eliminate, înlocuite cu clasele sistemului nostru de design
3. Etape de corecție — atributele de spațiere sincronizate, gradienții blocurilor de acoperire normalizați, separatoarele de forme injectate

Rezultatul este încărcat direct în WordPress prin WP REST API și activat ca pagina de pornire a site-ului.

Ce face unic fiecare site

Mai multe lucruri variază între fiecare generație, chiar și pentru aceeași industrie:

• Paleta: 20+ grupuri, fiecare cu multiple palete
• Trio de fonturi: 6+ combinații per arhetip
• Ordinea și variantele secțiunilor: layout erou, stil statistici, aranjament carduri caracteristici
• Forme separatoare: organice vs geometrice, variații de amplitudine/frecvență
• Forme de blob: pentru industriile organice, blob-urile de imagini și carduri sunt randomizate din 12 variante

Rezultatul este că două restaurante de pizza generate în aceeași zi vor avea culori diferite, fonturi diferite, layout-uri diferite — și ambele vor fi conforme WCAG AA.

Ce urmează

Lucrăm în prezent la:

• Generare multi-pagină — generarea paginilor /despre, /servicii și /contact din același mandat
• Previzualizare live — vizualizarea site-ului înainte de a fi implementat în WordPress
• Transfer de stil — încărcarea unei capturi de ecran a unui site care vă place și extragerea ADN-ului său de design

Dacă doriți să vedeți sistemul în acțiune, generatorul este gratuit de încercat — nu este necesară crearea unui cont pentru primul site.