Jak stworzyć prezentację AI za pomocą Windsurf i programowania Vibe

Jako entuzjasta nowych technologii, nieustannie poszukujący innowacyjnych narzędzi, niedawno podjąłem się stworzenia profesjonalnej prezentacji PowerPoint na 6-godzinne szkolenie z workflowów AI w FlowHunt.io. To, co wyróżniło to doświadczenie, to wykorzystanie Windsurf z modelem Claude 4 Sonnet jako LLM do wygenerowania 24-slajdowej prezentacji z użyciem biblioteki pptxgenjs — wszystko za pomocą pojedynczego promptu i dobrze rozpisanego konspektu. Oto jak wyglądał cały proces.

Cel: Praktyczna i wizualna prezentacja szkoleniowa

Moim celem było przygotowanie angażującej, interaktywnej prezentacji na 6-godzinny warsztat poświęcony FlowHunt.io, platformie do budowania workflowów AI. Prezentacja miała:

• Być praktyczna i wizualna, z krótkimi wyjaśnieniami przed demonstracjami na żywo
• Zawierać przykłady z życia wzięte z finansów, HR, compliance i zarządzania projektami
• Oferować elementy interaktywne, takie jak zadania lub quizy co 30 minut, by utrwalić wiedzę
• Realizować uporządkowany, dwuczęściowy format obejmujący zarówno podstawy, jak i zaawansowane komponenty modularnych procesów (MPC)

Aby zapewnić przejrzystość, najpierw poprosiłem Claude 4 Sonnet o wygenerowanie szczegółowego konspektu prezentacji, dzieląc ją na dwie 3-godzinne sesje z konkretnymi tematami i czasem trwania. Ten konspekt stał się fundamentem projektu, wyznaczając zarówno treść, jak i strukturę slajdów.

Narzędzie: pptxgenjs oraz Windsurf z Claude 4 Sonnet

Wybrałem bibliotekę pptxgenjs, ponieważ to potężne narzędzie JavaScript do programowego generowania prezentacji PowerPoint. Dzięki możliwości tworzenia slajdów i dodawania tekstu, obrazów czy formatowania poprzez kod, idealnie nadawało się do automatyzacji. Aby zrealizować swoją wizję, użyłem Windsurf zasilanego przez Claude 4 Sonnet, aby napisać kod i wygenerować prezentację na podstawie konspektu.

Proces rozpocząłem od zainstalowania biblioteki poleceniem:

npm install pptxgenjs

W ciągu kilku sekund biblioteka i jej zależności zostały zainstalowane, umożliwiając przejście do tworzenia prezentacji.

Prompt: Jedna instrukcja, kompleksowy efekt

Po zainstalowaniu biblioteki przygotowałem jeden, szczegółowy prompt dla Claude 4 Sonnet przez Windsurf. Prompt zawierał:

• Komendę instalacji pptxgenjs
• Pełny konspekt 6-godzinnego szkolenia, podzielony na dwa pakiety slajdów (Sesja 1 i Sesja 2)
• Kryteria prezentacji, z naciskiem na praktyczność, wizualność i realne przypadki użycia
• Instrukcje utworzenia slajdów dla każdego modułu: wprowadzenia, demo na żywo, przykłady użycia oraz finałowego wyzwania

Oto uproszczona wersja struktury promptu:

Zainstaluj npm i pptxgenjs. Stwórz prezentację w bibliotece pptxgenjs na 6-godzinne szkolenie z workflowów AI FlowHunt.io. Postępuj według tego konspektu: [szczegółowy podział sesji]. Upewnij się, że prezentacja jest praktyczna, wizualna, zawiera realne przypadki użycia (finanse, HR, compliance) oraz zadania interaktywne co 30 minut. Utwórz slajdy dla: Powitania, Wprowadzenia do FlowHunt, Workflow Canvas, Demo na żywo, Połączeń narzędzi, Iteracji, Przypadków użycia, MPC, Logiki, API, Monitoringu, Compliance, Wdrożenia, Finałowego wyzwania i Q&A.

Na podstawie tego promptu Claude 4 Sonnet wygenerował kompletny plik JavaScript (flowhunt-training.js), który z użyciem pptxgenjs stworzył 24-slajdową prezentację. Skrypt obsługiwał wszystko — od układów slajdów po spójną identyfikację wizualną w kolorystyce FlowHunt.

Proces: Od kodu do slajdów

Uruchomienie wygenerowanego skryptu było bardzo proste. Wpisałem:

node flowhunt-training.js

Skrypt działał bez problemów, choć pojawiło się kilka ostrzeżeń o nieprawidłowych kodach kolorów (“70AD4720 nie jest poprawnym schematem koloru ani hex RGB! użyto ‘000000’”). Były to drobne kwestie, które nie wpłynęły na efekt końcowy, ponieważ biblioteka domyślnie użyła czerni. W ciągu kilku chwil skrypt wygenerował plik FlowHunt-AI-Workflows-Training.pptx z 24 profesjonalnie sformatowanymi slajdami.

Prezentacja była majstersztykiem automatyzacji:

Sesja 1 (10 slajdów): Obejmowała podstawy FlowHunt.io, demo tworzenia workflowu, łączenie narzędzi (CSV, Google Sheets), wskazówki dotyczące iteracji, przykłady z finansów (walidacja budżetu) i HR (automatyczny bot onboardingowy). Wprowadzała także MPC, używając prostej metafory klocków LEGO.

Sesja 2 (8 slajdów): Skoncentrowana na zaawansowanych tematach: tworzeniu MPC, logice warunkowej, integracjach API (Google Search, CRM, Slack), zarządzaniu, botach compliance i wdrożeniu. Zakończona slajdem z finałowym wyzwaniem w formie mini-hackathonu.

Dodatkowe slajdy: Powitanie, agenda, przerwa, Q&A i podziękowania — zapewniały płynność prezentacji.

Slajdy miały spójny branding, czytelne tytuły i elementy wizualne z miejscami na GIF-y lub filmy. Elementy interaktywne, takie jak instrukcje krok po kroku do demo oraz grupowe wyzwania, były płynnie wplecione w całość.

Efekt: Gotowa prezentacja do użycia

Finalnym efektem był plik PowerPoint o rozmiarze 239 KB, gotowy do otwarcia w dowolnym kompatybilnym programie. Wraz z prezentacją Claude 4 Sonnet wygenerował plik README.md dokumentujący projekt, w tym instrukcję użycia i najważniejsze punkty prezentacji. Rezultatem była profesjonalna, interaktywna i atrakcyjna wizualnie prezentacja, doskonale odpowiadająca moim założeniom.

Refleksje: Siła rozwoju napędzanego przez AI

To doświadczenie pokazało niezwykłą moc narzędzi AI, takich jak Windsurf i Claude 4 Sonnet. Za pomocą jednego promptu, zamieniłem ogólny konspekt w gotową, 24-slajdową prezentację wraz z formatowaniem, brandingiem i elementami interaktywnymi. Biblioteka pptxgenjs okazała się bardzo solidnym wyborem, a zdolność Claude’a do zrozumienia moich wymagań i wygenerowania funkcjonalnego kodu była imponująca.

Najbardziej uderzyła mnie efektywność. Ręczne pisanie tego kodu zajęłoby godziny, jeśli nie dni — zwłaszcza aby zachować spójne formatowanie na 24 slajdach. Claude zrobił to w kilka sekund, tworząc skrypt modularny i łatwy do modyfikacji. Drobne ostrzeżenia o kodach kolorów były niewielką przeszkodą, łatwą do poprawienia przez zmianę wartości hex w skrypcie.

Kolejne kroki

Jestem zachwycony efektem i zamierzam wykorzystać tę prezentację podczas mojego szkolenia FlowHunt.io. W przyszłości planuję wzbogacić ją poprzez:

• Dodanie własnych obrazów lub GIF-ów do slajdów (w skrypcie są na to miejsca)
• Dopracowanie schematu kolorów, by wyeliminować ostrzeżenia
• Rozszerzenie wyzwań interaktywnych o bardziej szczegółowe instrukcje

Projekt ten zainspirował mnie do dalszego eksplorowania automatyzacji tworzenia treści z użyciem AI. Jeśli chcesz szybko i efektywnie tworzyć prezentacje, gorąco polecam połączenie pptxgenjs z narzędziem AI takim jak Claude 4 Sonnet przez Windsurf — to naprawdę zmienia zasady gry!