Ako vytvoriť AI prezentáciu s Windsurf a Vibe Coding

Ako technologický nadšenec neustále hľadajúci inovatívne nástroje som sa nedávno pustil do projektu vytvoriť profesionálnu PowerPoint prezentáciu na 6-hodinové školenie workflowov FlowHunt.io s využitím AI. Výnimočné na tejto skúsenosti bolo, že som využil Windsurf a Claude 4 Sonnet ako LLM na vygenerovanie 24-snímkového školenia cez knižnicu pptxgenjs — a to všetko jediným promptom a dobre štruktúrovanou osnovou. Tu je, ako to celé prebiehalo.

Cieľ: Praktická a vizuálna školiaca prezentácia

Mojím cieľom bolo pripraviť pútavú, interaktívnu prezentáciu na 6-hodinový workshop o FlowHunt.io, platforme na tvorbu AI workflowov. Prezentácia mala:

• Byť praktická a vizuálna, s krátkymi vysvetleniami nasledovanými ukážkami v praxi
• Obsahovať reálne prípady použitia z financií, HR, compliance a projektového riadenia
• Zahrnúť interaktívne prvky — úlohy alebo kvízy každých 30 minút pre upevnenie poznatkov
• Riadila sa štruktúrou dvoch blokov, pokrývajúcich všetko od základov workflowov po pokročilé modulárne procesné komponenty (MPC)

Pre prehľadnosť som najskôr použil Claude 4 Sonnet na vygenerovanie detailnej osnovy prezentácie, rozdelenej na dva 3-hodinové bloky s konkrétnymi témami a časom. Táto osnova sa stala základom projektu — určovala obsah aj štruktúru snímok.

Nástroj: pptxgenjs a Windsurf s Claude 4 Sonnet

Zvolil som knižnicu pptxgenjs, pretože je to výkonný JavaScriptový nástroj na programovateľné generovanie PowerPoint prezentácií. Umožňuje cez kód vytvárať snímky, pridávať texty, obrázky a formátovanie, čo je ideálne pre automatizáciu. Na oživenie tejto vízie som využil Windsurf, poháňaný Claude 4 Sonnet, ktorý podľa mojej osnovy napísal kód a vygeneroval prezentáciu.

Proces začal inštaláciou knižnice príkazom:

npm install pptxgenjs

Knižnica a jej závislosti sa nainštalovali za niekoľko sekúnd, čím sa otvorila cesta pre tvorbu prezentácie.

Prompt: Jediný pokyn, jeden komplexný výstup

Po inštalácii knižnice som pre Claude 4 Sonnet cez Windsurf pripravil jeden detailný prompt. Prompt obsahoval:

• Inštalačný príkaz pre pptxgenjs
• Kompletnú osnovu 6-hodinového školenia, rozdelenú do dvoch balíkov snímok (Session 1 a Session 2)
• Špecifické požiadavky na prezentáciu so zameraním na praktické učenie, vizuálne prvky a reálne prípady použitia
• Inštrukcie na vytvorenie snímok pre každý modul: úvod, živé ukážky, use casy aj záverečnú výzvu

Tu je zjednodušená verzia štruktúry promptu:

Nainštaluj npm i pptxgenjs. Vytvor prezentáciu pomocou knižnice pptxgenjs pre 6-hodinové školenie AI workflowov FlowHunt.io. Dodrž túto osnovu: [detailné rozdelenie školenia]. Prezentácia musí byť praktická, vizuálna, obsahovať reálne prípady použitia (financie, HR, compliance) a interaktívne úlohy každých 30 minút. Vytvor snímky pre: Privítanie, Úvod do FlowHunt, Workflow Canvas, Živá ukážka, Prepojenia s nástrojmi, Iterácia, Prípady použitia, MPCs, Logika, API, Monitoring, Compliance, Nasadenie, Záverečná výzva a Q&A.

Na základe tohto promptu Claude 4 Sonnet vygeneroval kompletný JavaScriptový súbor (flowhunt-training.js), ktorý využil pptxgenjs na vytvorenie 24-snímkového školenia. Skript zabezpečil všetko od rozloženia snímok po konzistentný branding vo farbách FlowHunt.

Proces: Od kódu k snímkam

Spustenie vygenerovaného skriptu bolo jednoduché. Stačilo zadať:

node flowhunt-training.js

Skript bežal hladko, narazil som len na niekoľko varovaní o neplatných farbách (“70AD4720 nie je platná schéma farby alebo hex RGB! Použitá ‘000000’”). Išlo však o drobnosti — knižnica použila namiesto toho čiernu. Po pár sekundách skript vytvoril súbor FlowHunt-AI-Workflows-Training.pptx s 24 profesionálne naformátovanými snímkami.

Prezentácia bola ukážkou automatizácie:

Session 1 (10 snímok): Pokrývala základy FlowHunt.io, živú ukážku tvorby workflowu, napojenie na nástroje (CSV, Google Sheets), tipy na iteráciu, prípadové štúdie z financií (validácia rozpočtu) a HR (automatizovaný onboarding bot). Nechýbal úvod do MPCs cez jednoduchú LEGO metaforu.

Session 2 (8 snímok): Zameraná na pokročilé témy ako tvorba MPC, podmienená logika, API integrácie (Google Search, CRM, Slack), governance, compliance boti a nasadenie. Záverom bola výzva v štýle mini-hackathonu.

Doplňujúce snímky: Privítanie, agenda, prestávka, Q&A a poďakovanie zaručili plynulý priebeh prezentácie.

Snímky mali jednotný vizuál, jasné nadpisy a vizuálne prvky s miestom pre GIFy či videá. Interaktívne prvky — napríklad návody na živé demo či skupinové výzvy — boli zapracované priamo v prezentácii.

Výsledok: Prezentácia pripravená na použitie

Konečný výstup bol PowerPoint súbor s veľkosťou 239 KB, pripravený na otvorenie v akomkoľvek kompatibilnom softvéri. Okrem prezentácie Claude 4 Sonnet vygeneroval aj README.md s dokumentáciou projektu, návodom na použitie a prehľadom prezentácie. Výsledkom bola profesionálna, interaktívna a vizuálne príťažlivá prezentácia presne podľa mojich kritérií.

Zamyslenie: Sila AI-poháňanej automatizácie

Táto skúsenosť ukázala úžasnú silu AI nástrojov ako Windsurf a Claude 4 Sonnet. Jediným promptom som premenil osnovu na hotovú prezentáciu s formátovaním, brandingom aj interaktívnymi prvkami. Knižnica pptxgenjs sa ukázala ako spoľahlivá voľba a schopnosť Claude správne pochopiť zadanie a vygenerovať funkčný kód bola pôsobivá.

Najviac ma ohromila efektivita. Písanie kódu ručne by trvalo hodiny až dni, najmä ak by som chcel zabezpečiť jednotné formátovanie na 24 snímkach. Claude to zvládol za pár sekúnd a skript bol navyše modulárny a jednoducho upraviteľný. Drobné varovania o farbách boli zanedbateľné a dajú sa prípadne doladiť úpravou hex hodnôt v kóde.

Ďalšie kroky

S výsledkom som veľmi spokojný a prezentáciu použijem na svojom školení FlowHunt.io. Do budúcna by som ju mohol ešte vylepšiť:

• Pridať vlastné obrázky alebo GIFy na snímky (skript už obsahuje zástupné prvky)
• Upraviť farebnú schému, aby zmizli varovania
• Rozšíriť interaktívne výzvy o detailnejšie návody

Tento projekt ma inšpiroval viac skúmať AI automatizáciu pri tvorbe obsahu. Ak chcete rýchlo a efektívne vytvárať prezentácie, určite odporúčam spojiť pptxgenjs s AI nástrojom ako Claude 4 Sonnet cez Windsurf — je to naozaj prelomové riešenie!