Acasă / Articole / Vibe Coding pentru prezentări

Vibe Coding pentru prezentări: cum am renunțat la slide-uri pentru o pagină care rulează în browser.

Trebuia să pregătesc o prezentare despre vibe coding și nu voiam încă un teanc de slide-uri pe care nimeni nu le ține minte. Răspunsul, venit la un brainstorming cu Claude, n-a fost un fișier .ppt.

// Cuprins
AI Accounting Hub
21.07.2026
// vibe coding · prezentări interactive

Slide-ul prăfuit

Știu formatul pe de rost. Un titlu sus, trei-patru bullet-uri dedesubt, poate o iconiță ca să nu pară gol, click pe „slide următor". L-am folosit de sute de ori și, cinstit, cele mai multe prezentări pe care le-am făcut — sau la care am stat în sală — s-au evaporat din memoria tuturor înainte să ajungem la parcare.

Problema nu e PowerPoint. E că un slide îți arată o poză cu ideea, dar nu te lasă niciodată să pui mâna pe ea. Când tema însăși e „cu AI îți poți construi singur unelte", un slide cu bullet-uri devine ironic: vorbești despre lucruri interactive... pe un mediu complet static. Voiam ca oamenii din sală să facă ceva, nu doar să se uite.

Ideea: o pagină, nu un .ppt

Am deschis o discuție cu Claude exact cu întrebarea asta — „cum fac prezentarea mai puțin plictisitoare?". La un moment dat, în loc să-mi propună un alt template de slide-uri, mi-a propus altceva: o pagină HTML care se deschide local, direct în browser. Un singur fișier. Dublu-click și pornește. Se trimite prin e-mail sau pe chat ca orice atașament. Rulează pe laptopul colegului care n-are Office, pe telefon, pe orice.

Și, spre deosebire de un slide, o pagină poate să reacționeze: să calculeze ceva, să se animeze, să răspundă când dai click. Nu mai prezinți despre interactivitate — o pui direct în mâinile audienței. În câteva iterații de brainstorming, direcția era clară. Nu mai făceam un deck. Făceam o pagină.

Un slide îți arată o poză cu ideea. O pagină HTML îți dă ideea în mână — funcțională, chiar în timp ce o prezinți.

De ce HTML?

Pe scurt: pentru că e formatul pe care AI-ul îl scrie cel mai bine și pe care orice browser îl deschide fără instalări. HTML e limba în care e scris jumătate din internet, deci e și cea pe care un model AI o generează cel mai fluent și cel mai corect. Nu-i ceri ceva exotic — îi ceri exact lucrul pe care se pricepe cel mai bine.

Iar HTML plus puțin CSS și JavaScript e, la propriu, o pânză albă: nu are un format fix de „slide", nu are șabloane obligatorii, nu are margini. Îi descrii ce vrei și îți desenează pe ea orice — un tabel, o animație, un calculator, un joculeț — fără să-i dai tu pensulele. Un .pptx te ține în cutia de slide-uri. O pagină goală nu te ține în nimic.

Pentru un model AI, HTML e o pânză albă: îl rogi, iar el desenează pe ea orice îi ceri — fără să-i explici cum se ține pensula. // și, ca bonus, într-un format pe care orice browser îl deschide fără să instalezi nimic
01

Un singur fișier

Pagină, animații, calculatoare, jocuri — toate într-un .html. Îl trimiți ca un atașament și se deschide oriunde, fără dependențe.

02

Zero instalări

Nicio licență Office, niciun cont, niciun viewer. Dublu-click în browser — inclusiv pe mașina colegului care n-a auzit de PowerPoint.

03

Interactiv, nu static

Un calculator care chiar calculează, o animație pe care o parcurgi pas cu pas. Audiența face, nu doar privește.

04

Iterație rapidă

„Fă accentul albastru, mai adaugă un pas, scoate jocul al treilea." AI-ul modifică în secunde, în aceeași conversație.

1
fișier .html, self-contained — se trimite ca orice atașament
0
instalări, licențe sau conturi ca să-l deschizi
orice
browser, pe orice sistem de operare, inclusiv pe telefon

Ce am construit, concret

Ca să nu rămână la teorie, iată exact ce a ieșit — prezentarea despre vibe coding pentru departamentul financiar-contabil, cap-coadă o singură pagină:

  1. Un calculator TVA, nu un titlu. În loc de slide-ul de intro, un prompt se scrie singur pe ecran și, din el, se materializează un calculator de TVA funcțional (cotele României, 2026). Audiența tastează o sumă și vede pe loc net / TVA / total. În primele 30 de secunde, ideea e deja demonstrată: asta nu e un slide, calculează.
  2. Ciclul de revizuire, ca animație. Cei cinci pași ai vibe coding-ului — descrii → generează → rulezi → dai feedback → repeți — nu ca listă cu bullet-uri, ci ca un ciclu animat pe care îl parcurgi pas cu pas. Un contabil recunoaște imediat: e același ciclu de revizuire pe care îl face oricum.
  3. Dulapul cu dosare. Șase direcții practice — aplicații .exe standalone, macro-uri VBA, dashboard-uri Excel, artefacte AI, aplicații web, aplicații mobile — ca șase dosare într-un dulap. Tragi de un sertar ca să-l deschizi. Tactil, nu un tabel plictisitor.
  4. Arcade-ul Contabilului. Trei jocuri mici cu umor de breaslă — Dodge-ul Contabilului, Inspecția nu așteaptă, Whack-a-Deadline — construite tot prin aceeași metodă. Buget IT: zero lei. Dovada că pânza chiar n-are margini.
  5. Poanta finală. Ultima secțiune spune ce bănuia deja toată sala: tot ce tocmai au văzut — pagina, animațiile, calculatorul, jocurile — a fost vibe-codat. Nicio linie de cod scrisă de mână. Mesajul se prezintă singur.

Meta-gluma e că prezentarea despre vibe coding a fost ea însăși vibe-codată. Nu e un artificiu — e chiar argumentul: dacă asta se poate face descriind în română ce vrei, ce mai putem automatiza din ce facem noi zi de zi?

Ce e un MVP și ce poți construi?

MVP vine de la Minimum Viable Product — în română, „produs minim viabil". E cea mai simplă versiune funcțională a unei idei: nu produsul finit, ci exact atât cât să demonstreze că ideea merge și să poată fi testată de cineva. Iar aici e partea care depășește „prezentare frumoasă": aceeași pagină care e slide-ul tău poate fi, în același timp, un MVP pe care oamenii îl apasă, cu date de test, chiar în ședință. Nu mai arăți un screenshot static și zece bullet-uri — arăți lucrul care funcționează.

Concret, iată ce poți pune în fața cuiva sub formă de pagină HTML care chiar merge:

  • Un dashboard. Un tablou de bord cu indicatorii tăi — cash-flow, vechimea creanțelor, execuția bugetară — cu grafice și filtre pe care le apeși, populat cu date de test. Colegul vede exact cum ar arăta raportul lunar, nu o descriere a lui.
  • O aplicație internă mică. Un calculator de dobânzi și penalități conform Codului Fiscal, un convertor de extrase, un validator de CIF-uri — unealta rulează, nu o promiți.
  • Un formular de colectare date. Chestionarul de onboarding pentru un client nou sau formularul de aprobare a notelor de cheltuieli — cu câmpurile și validările reale, ca să vezi cum se completează înainte să-l construiască cineva „de-adevăratelea".
  • Un mini-portal sau o pagină de prezentare. Un punct intern de acces la proceduri și tool-uri, sau o pagină care prezintă un serviciu — structura și navigația, testabile pe loc.
  • Un raport interactiv pentru management. În loc de PDF static, o pagină în care conducerea schimbă o ipoteză (curs valutar, prag, scenariu) și vede cifrele recalculându-se — util exact când vrei o decizie, nu o lectură.

Pentru un contabil care pledează în fața IT-ului sau a conducerii pentru o unealtă internă, un MVP HTML care merge bate zece slide-uri descriptive. De-riscă discuția: toată lumea se uită la același lucru concret, nu la interpretarea fiecăruia despre cum ar arăta. Nu întâmplător instrumentele care au făcut vibe coding-ul popular — Claude Artifacts, v0, Lovable — scot exact acest tip de output. HTML e limba comună a prototipurilor.

Prezentarea și produsul devin același artefact. Nu mai descrii dashboard-ul propus — îl dai colegilor să apese pe el.

Unde nu bate HTML PowerPoint-ul?

Ar fi necinstit să prezint numai partea luminoasă. Direcția asta are limite reale, și e bine să le știi înainte să arunci PowerPoint pe geam. Pe fiecare criteriu, „câștigătorul" e marcat cu :

CriteriuPowerPointPagină HTML
InteractivitateStatică; click = slide următor✓ Calculatoare, animații, jocuri care rulează
DistribuțieFișier + are nevoie de Office / viewer✓ Un fișier; orice browser îl deschide
Editabil de colegi✓ Da, oricine cu OfficeDoar prin cod (sau cerându-i AI-ului)
Șablon de brand✓ Master corporate gata făcutÎl reconstruiești (sau îi dai AI-ului tokenii)
Mod prezentator / note✓ NativNu; ți-l construiești tu
Prototip funcționalNu; doar imagini✓ Da — aceeași pagină e și MVP
Export la print / PDF✓ Simplu, previzibilFițos; animațiile nu se traduc în handout

Pe scurt: un coleg poate corecta o virgulă pe un slide de PowerPoint în cinci secunde. Pe pagina ta HTML, nu — dacă nu știe cod (sau nu cere unui AI). N-are șablonul corporate gata, n-are mod prezentator cu note și cronometru, iar la print animațiile devin capturi statice. Și, foarte practic: pentru un status de trei bullet-uri, un deck clasic e pur și simplu mai rapid. Pagina HTML își merită efortul doar când interactivitatea chiar adaugă ceva. Nu tot ce poate fi o pagină merită să fie o pagină.

Cât de sigur e HTML?

Depinde de sursă — și e punctul pe care un departament financiar nu are voie să-l sară. Diferența fundamentală: un .pptx e, în esență, date; o pagină HTML e cod care se execută în clipa în care o deschizi. JavaScript-ul din ea rulează în browserul tău, imediat. Browserele moderne izolează destul de bine fișierele locale — n-au acces la disc, sunt restricționate — dar codul poate încă să facă apeluri de rețea (deci să trimită afară ce tastezi în el), să încarce resurse externe, să pună un formular fals de login sau să te redirecteze.

Traducerea pentru un contabil: o pagină HTML primită de la cineva în care nu ai încredere merită exact prudența pe care o ai deja față de orice atașament. Vestea bună e că, spre deosebire de un binar, codul unei pagini e text simplu, lizibil — poți să-l verifici, sau să-i ceri unui AI să-l verifice pentru tine. Iată lista mea de igienă, pe care o aplic la orice pagină pe care o construiesc și o trimit mai departe:

  • Self-contained, testul avionului. Fără scripturi externe, fără CDN-uri. Pune laptopul pe airplane mode și deschide pagina — dacă arată și funcționează la fel, nu trimite nimic afară.
  • Zero formulare care postează în afară. Un calculator calculează local; nimic din ce tastezi nu pleacă de pe mașină. Dacă o pagină „de prezentare" vrea să trimită date undeva, e un semnal.
  • Fonturi de sistem sau încorporate. Onest: pagina mea încă trage fonturile de la Google — deci „sună acasă" la deschidere și are nevoie de internet. Pentru o variantă complet offline, le încorporezi în fișier.
  • Cere AI-ului să citească codul. „Verifică dacă pagina asta face vreun apel de rețea în afară." E o transparență pe care un .pptx binar nu ți-o oferă niciodată.
  • Regula veche rămâne. Deschizi HTML doar de la cine ai încredere, ca orice atașament. Iar unele companii blochează .html pe e-mail — s-ar putea să-l arhivezi .zip sau să-l pui pe un drive intern.
Nuanța corectă: o pagină HTML pe care ai citit-o și care nu iese în rețea e, de fapt, mai transparentă decât un fișier Office binar cu macro-uri ascunse. Riscul nu e formatul în sine — e să deschizi cod necunoscut fără să te uiți la el. Diferența dintre util și expunere e un singur pas: să știi ce face fișierul înainte să dai dublu-click.

Ce rămâne

N-am înlocuit PowerPoint și nici n-a fost nevoie. Pentru multe ședințe, un deck clasic rămâne unealta potrivită — rapid, editabil de oricine, cu note de prezentator. Dar am descoperit că, atunci când vreau ca oamenii să pună mâna pe idee, nu doar să se uite la ea, o pagină HTML face ceva ce un slide nu poate: o duce de la „poză cu ideea" la „ideea, funcțională, în mâna ta".

Iar partea care contează pentru mine, ca de fiecare dată: nimic din toate astea n-a cerut să devin programator. Am descris în română ce voiam, am iterat, am verificat rezultatul — inclusiv, mai ales, ce trimite sau nu trimite pagina în rețea. Restul l-a desenat AI-ul pe pânza aia albă. Iar la final, singurul lucru pe care nu-l deleg rămâne același: eu decid ce pleacă mai departe și îmi asum ce poartă numele meu.

Vibe coding-ul nu înlocuiește programatorii, la fel cum Excel n-a înlocuit contabilii. Dar le dă contabililor un instrument pe care înainte îl aveau doar programatorii: capacitatea de a-și construi propriile unelte — și propriile prezentări.

Prezentarea despre care am scris — pagina cu tot cu calculator, animații, dulapul cu dosare și arcade — o găsești mai jos, într-un singur fișier, exact cum le-am obișnuit deja pe colege și pe colegi: descarci arhiva, o dezarhivezi și deschizi pagina local în browser, apoi deschide-i codul și vezi cum e făcută.

Prezentarea „Vibe Coding", un singur fișier HTML — hero cu calculator TVA funcțional, ciclul de revizuire animat, dulapul cu șase dosare de aplicații și arcade-ul cu trei jocuri. Deschide-o local în browser; nu instalezi și nu creezi niciun cont.
Descarcă prezentarea (.zip) ZIP · 22 KB · conține 1 fișier .html
#vibe-coding #html #prezentari #mvp #securitate #claude
Articolul #016

Mai multe din hub.

Arhiva articolelor