>_ DevTrendsnl

Taal

Home

Talen

Secties

Frontend Backend Mobiel DevOps AI / ML GameDev Blockchain Embedded Beveiliging
JavaScript

Hoe je een AI-agent omzet in een interactieve presentatiegenerator

Presentaties genereren via neurale netwerken eindigt meestal op dezelfde manier. Het model spuugt ofwel een hoop afbeeldingen met wazige tekst uit, of een saai PowerPoint-sjabloon waar de helft van de blokken niet goed uitgelijnd is en de grafieken er handgetekend uitzien. Het handmatig corrigeren van dergelijke resultaten kost meer tijd dan dia's helemaal opnieuw bouwen in Figma of Keynote.

Onlangs stuitte ik op dashi-ppt-skill — een project van een Chinese ontwikkelaar met de gebruikersnaam chuspeeism. De repository verzamelde snel bijna zesduizend sterren op GitHub, en de reden is duidelijk. De auteur benaderde het probleem vanuit een onverwachte hoek. In plaats van onmiddellijk en pijnlijk binaire PPTX te renderen, levert zijn tool een kant-en-klare interactieve HTML-pagina op met een ingebouwde visuele editor, die je vervolgens met één klik kunt converteren naar een volledig bewerkbare PPTX of PDF.

Demo

Wat er onder de motorkap zit en hoe het werkt

In wezen is dit een vaardigheid voor AI-agents. Je kunt het voeden aan Claude Code, Codex, Cursor of elke andere agent die bestanden kan lezen en terminalopdrachten kan uitvoeren.

Het idee is eenvoudig. LLMs werken goed met gestructureerde tekst en code, maar ze verwerken de nauwkeurige positionering van vormen in proprietaire formaten verschrikkelijk. Daarom breekt dashi-ppt-skill het proces op in duidelijke stappen:

  1. De agent analyseert je document of prompt en stelt een van de 12 visuele thema's voor.
  2. Selecteert geschikte lay-outs uit de bibliotheek (de database bevat meer dan duizend lay-outvariaties voor verschillende dia-typen).
  3. Stelt een lokaal HTML-dek samen waar elke dia werkt als een mini-app met zijn eigen bedieningspaneel.
  4. Je opent de browser, bewerkt tekst rechtstreeks op de dia, past rasterschuifregelaars aan en exporteert het resultaat vervolgens naar PPTX.

Bij het exporteren naar PPTX blijft tekst tekst en wordt deze niet omgezet in rasterafbeeldingen. Je kunt het eindbestand openen in PowerPoint of Google Slides en daar verder bewerken.

HTML vs PPTX comparison

Beschikbare thema's en lay-out

De repository heeft 12 ingebouwde ontwerpthema's: van strenge code en donkere analytische dashboards tot neonverlopen en tijdschriftstijl.

| | | |---|---| | theme01
theme01 | theme02
theme02 | | theme03
theme03 | theme04
theme04 | | theme05
theme05 | theme06
theme06 | | theme07
theme07 | theme08
theme08 | | theme09
theme09 | theme10
theme10 | | theme11
theme11 | theme12
theme12 |

Elk thema bevat een set kant-en-klare patronen: tijdlijnen, trechters, SWOT-matrices, het Five Forces-model van Porter, PEST-matrices en Gantt-grafieken.

Analytical models

Popular layouts

De hoofdfunctie — Bewerken rechtstreeks in de browser

De meeste AI-tools vereisen dat je de bot opnieuw vraagt: 'Herschrijf het derde punt korter' of 'Maak vier kolommen in plaats van drie.' Hier wordt dat direct opgelost in de gegenereerde HTML-interface.

Klik op een kop of alinea, bewerk de tekst direct en aangrenzende elementen passen automatisch hun hoogte aan.

| In-place tekst bewerken | Afbeeldingen toevoegen | |---|---| | Text editing | Inserting images |

Voor afbeeldingen worden kant-en-klare plaatsen gemaakt: je kunt gewoon een bestand uit een map slepen en de engine comprimeert het naar de vereiste resolutie.

Filling placeholders

Aan de rechterkant van elke dia wordt een paneel met schuifregelaars geopend. Van gedachten veranderd over drie kaarten? Versleep de schuifregelaar — nu zijn er vier kaarten. Wil je het grafiektype wijzigen van staafdiagram naar cirkeldiagram? Dat wordt gedaan met één klik zonder de agent opnieuw te starten.

| Elementaantal schuifregelaars | Lay-out schakelen | |---|---| | Element slider | Layout switching |

| Grafiektype schakelen | Paletinstellingen | |---|---| | Chart switching | Palette selection |

Dia-overgangsanimaties worden daar ook geconfigureerd:

Transition animations

Chart tour

Snel starten en systeemvereisten

Node.js versie 20 of hoger is vereist.

Starten en installeren gebeurt met één commando:

npx dashi-ppt-skill@latest

Als je het commando geeft aan je AI-agent (bijvoorbeeld in Claude Code), is het voldoende om te schrijven:

Установи и используй скилл: npx dashi-ppt-skill@latest

Wanneer de agent de presentatiestructuur assembleert, kun je deze exporteren via de console:

npm --prefix ./project run export:pptx -- ./output/presentation.pptx
npm --prefix ./project run export:pdf  -- ./output/presentation.pdf

Export to PPTX

Voor export wordt onder de motorkap een headless browser gebruikt, dus Chrome, Chromium of Edge moet op je machine zijn geïnstalleerd. Als dat nodig is, kan het pad naar de binary worden doorgegeven via de omgevingsvariabele CHROME_PATH.

Privacy en beveiliging

Veel mensen zijn terughoudend om interne rapporten te voeden aan externe SaaS-diensten. Hier worden alle rendering en export lokaal op je computer uitgevoerd. De enige netwerkoproepen zijn de initiële npm-pakketdownload en een achtergrondcontrole op een nieuwere versienummer. Er worden geen teksten of afbeeldingen naar buiten verzonden.

Wat de licentie betreft: de hoofdcode is open onder de copyleft AGPL-3.0-licentie. Het conversiemodule html-deck-to-pptx is echter gemarkeerd als het proprietaire component van de auteur, wat mag worden gebruikt als onderdeel van deze vaardigheid, maar niet mag worden geëxtraheerd naar een apart gesloten product.

Wie heeft baat bij dit project

Als je regelmatig projectrapporten, concurrentieanalyses, architectuurreviews of materiaal voor meetups moet samenstellen, zal dashi-ppt-skill het meest vervelende deel van het werk voor zijn rekening nemen. Je geeft de agent ruwe notities of een markdown-document, krijgt een schone lay-out en besteedt een paar minuten aan het bijwerken van de tekst rechtstreeks in het browservenster. Voor pixel-perfect ontwerp is het project waarschijnlijk niet geschikt, maar als snelle tool voor het voorbereiden van werkende presentaties ziet het er uitstekend uit.

Gerelateerde projecten