OPEN-SLIDE : créez vos slides avec un agent AI
📌 OPEN-SLIDE est un créateur de slides conçu pour les agents AI. Contrairement aux outils classiques qui vous forcent à utiliser des templates rigides, open-slide transforme chaque slide en code React sur un canvas 1920×1080. Pas de layout prédéfini, pas de contraintes visuelles : vous décrivez ce que vous voulez en langage naturel, votre agent écrit le code, et open-slide gère le rendu, la navigation, le hot reload, et le mode présentation. C’est du code généré, mais c’est aussi du code que vous pouvez éditer.
L’installation est simple : npx @open-slide/cli init my-slide crée un workspace, pnpm dev lance le serveur de développement.
L’agent pose quatre questions (thème et esthétique, nombre de slides, densité du texte, motion ou statique), planifie la structure, et écrit les slides. Chaque slide est un fichier TypeScript dans slides/, avec un composant React arbitraire. Vous pouvez éditer directement, ou laisser l’agent faire le travail via /create-slide pour créer un deck complet, ou /apply-comments pour appliquer des modifications basées sur des commentaires.
- 🤖 Agent-native : fonctionne avec Claude, Codex, Cursor, Gemini CLI, OpenCode, Windsurf, Zed
- 🎯 Canvas 1920×1080 : chaque slide est un composant React arbitraire
- 🔍 In-browser inspector : cliquez sur un élément, laissez un commentaire, l’agent applique
- 📦 Assets manager : gérez images, vidéos, fonts, et 1500+ logos via svgl
- 🎬 Mode présentation pro : fullscreen, navigation clavier, notes du présentateur, timer
- 📁 Slide manager : organisez vos decks en dossiers avec emoji, drag-and-drop
Voici une petite demo de ce que ça rend :
https://demo.open-slide.dev/s/slide-transitions-maximal
L’inspector dans le navigateur est la clé du workflow : cliquez sur n’importe quel élément, ajoutez un commentaire (« make this red », « change to ‘Open Slide Rocks' », « shrink the headline »), et le marqueur @slide-comment apparaît dans le code source. Tapez /apply-comments, l’agent lit tous les marqueurs, applique les modifications, et nettoie. Le présentateur voit le slide actuel, le prochain, ses notes, et le timer. Le mode présentation est fait pour la scène, pas juste pour l’onglet du navigateur.
L’export en static HTML et PDF se fait en une commande. Partagez vos decks sans serveur : c’est un site statique complet, prêts à déployer sur Vercel, Cloudflare Pages, Zeabur, Netlify ou n’importe quel hébergeur statique. Pas de serveur, pas de runtime, pas de lock-in. C’est du code React compilé en HTML/CSS/JS statique, optimisé pour le web et pour l’impression. Vous pouvez aussi exporter en PDF pour partager via email ou imprimer.
Le slide manager organise vos decks en dossiers avec des emojis personnalisés, et permet de réordonner par drag-and-drop. C’est utile une fois que vous avez créé plus de trois decks et que vous avez besoin de retrouver quelque chose. L’assets manager intégré gère images, vidéos et fonts par deck, avec une recherche directe dans le catalogue svgl pour les logos de marque. Plus besoin de chasser les SVGs : tapez « Vercel », choisissez, et l’atterrissage dans le dossier assets.
Les slides sont du code, pas du design. open-slide est le runtime qui transforme « make slides about X » en un deck poli et présentable, sans jamais quitter le chat. C’est le type de projet qui exploite vraiment les agents AI : l’agent est bon pour écrire du code, open-slide fournit le contexte et les contraintes. Le résultat est du React de qualité, sans boilerplate, sans friction. Si vous savez écrire du React, vous pouvez éditer. Si vous préférez déléguer, l’agent le fait.
Sources
