Blocul Gen UI (Generative UI) este unul dintre cele mai puternice instrumente din SendBot. Vă permite să randați componente UI personalizate și interactive direct în conversație, mergând mult dincolo de bulele de text standard. Acest bloc poate fi utilizat în două moduri: Manual (configurat de dvs. în Studio) sau Generativ (generat dinamic de un AI).

​
Ce este Gen UI?

Spre deosebire de o bulă de text sau de imagine, Gen UI este un „container” pentru componentele React. Aceasta înseamnă că puteți afișa orice, de la un calendar de rezervări la o diagramă financiară complexă, atâta timp cât componenta este înregistrată în pachetul dvs. de webchat.

​
Cum se configurează manual

În Studio, când adăugați un bloc Gen UI, veți găsi două câmpuri principale:
  1. Numele componentei: Identificatorul unic al componentei React care urmează să fie randată (de exemplu, booking-calendar, sales-chart, product-card).
  2. Date (JSON): Un obiect JSON care conține informațiile de care componenta are nevoie pentru a funcționa. Puteți utiliza variabilele SendBot aici folosind sintaxa {{variabila_mea}}.

​
Exemplu de configurare

  • Nume: product-card
  • Date:

​
Scenarii de utilizare manuală

Utilizarea manuală este ideală pentru situațiile în care aveți nevoie de predictibilitate și performanță.

​
1. Widgeturi de rezervare

Dacă aveți deja o componentă de calendar, puteți forța afișarea acesteia după ce utilizatorul alege un serviciu.
  • Scenariu: „Perfect, acum alegeți cea mai bună oră în calendarul de mai jos.”
  • Avantaj: Determinist și rapid, fără a te baza pe AI pentru a decide formatul.

​
2. Tablouri de bord și diagrame

Dacă botul dvs. interoghează un API extern, puteți transmite rezultatul către o componentă de diagramă.
  • Scenariu: Afișarea extrasului de puncte de loialitate al utilizatorului.
  • Avantaj: Vizualizare bogată a datelor care ar fi imposibilă doar cu text.

​
3. Experiențe gamificate

Afișați roți de reducere, carduri răzuibile digitale sau selectoare de avatar.
  • Avantaj: Crește implicarea utilizatorului cu o interfață care „trăiește” în interiorul chat-ului.

​
Scenarii de utilizare cu AI (Agent AI)

Când este utilizat împreună cu blocul Agent AI, Gen UI devine cu adevărat „generativ”. AI-ul poate decide, pe baza contextului conversației, ce componentă să afișeze și ce date să completeze în aceasta.
  • Exemplu: Utilizatorul spune „Caut o masă de sufragerie din lemn”. AI-ul înțelege intenția și, în loc să listeze doar linkuri, emite o componentă product-carousel cu mobilierul filtrat.

​
Cele mai bune practici

  • Validare JSON: Asigurați-vă că JSON-ul introdus este valid. Editorul Studio vă va avertiza dacă există erori de sintaxă.
  • Fallbacks: Rețineți că componenta trebuie să fie disponibilă în pachetul dvs. Webchat pentru a fi randată corect pentru utilizatorul final.
  • Variabile: Utilizați variabile pentru a face componentele dinamice pe baza răspunsurilor anterioare ale utilizatorului.