Votre éditeur de code devient un studio de cinéma
· 3 min de lecture
Ceux qui connaissent le mieux un produit sont souvent ceux qui le construisent, et ils passent leur journée dans un éditeur, souvent avec Claude Code à côté. Le 15 septembre, notre extension VS Code a cessé d’être un petit outil de capture. Elle est devenue PageToVid Studio : l’endroit où l’on prépare les films d’un produit, où on le filme derrière sa connexion, et où on les tient à jour.
Aller là où les équipes travaillent déjà
Les développeurs veulent rarement un tableau de bord de plus. Notre connexion pour assistants permettait déjà à une IA de créer et de modifier des films ; il manquait une installation d’une minute, naturelle dans un projet de code.
Alors Claude Code est devenu l’outil d’installation. L’extension prépare l’espace de travail, Claude Code pilote PageToVid avec ses outils, et une personne confirme chaque rendu avant toute dépense. Vous décrivez le film voulu en mots simples, l’assistant fait les clics.
Une commande installe le studio
Une seule commande, « Install studio pack », écrit ce dont un projet a besoin :
- un fichier de configuration qui relie Claude Code aux outils PageToVid ;
- des commandes slash prêtes à l’emploi pour installer le studio, planifier une capture, créer une émission récurrente, travailler un format, écrire un tutoriel et ranger les visuels de marque ;
- un petit guide dans le dépôt qui explique chaque commande.
Le panneau affiche le studio, les émissions du site (lancer, confirmer, mettre en pause) et son plan de capture. Il lit les mêmes points d’accès que le site web et l’extension navigateur, jamais un format à lui : les trois sont toujours d’accord.
Votre clé reste hors de vos fichiers
Un fichier de configuration dans un dépôt se commite vite par erreur, alors nous nous sommes assurés qu’il ne contienne rien de précieux. Le fichier généré désigne votre clé par son nom ; la clé elle-même ne touche jamais le disque. L’extension la garde dans le stockage secret de l’éditeur et la transmet aux terminaux de l’éditeur comme variable d’environnement, rafraîchie à chaque actualisation du panneau.
Un contrôle automatique vérifie que le fichier généré ne contient aucune clé. Et si vous personnalisez une commande slash, réinstaller le pack garde votre version au lieu de l’écraser.
Filmer le produit derrière sa connexion
L’essentiel d’un logiciel se trouve derrière une connexion, et c’est précisément ce qu’une démo doit montrer. Cette version ajoute les sessions de capture : les cookies propres à un site, enregistrés une fois pour son adresse et sa version www, conservés un à trois jours, puis oubliés.
La chaîne de production associait déjà les sessions par site : dès qu’une session existe, chaque rendu de ce site filme connecté, qu’il parte de l’application web, de l’API ou d’un assistant. Vous pouvez enregistrer une session depuis un état de navigateur sauvegardé, un compte de test ou l’extension navigateur. Le serveur ne garde que les cookies du site, ne les renvoie jamais et les supprime sur demande. À partir d’un état de navigateur sauvegardé, PageToVid ne voit jamais aucun mot de passe.
Des tutoriels filmés avec PageToVid
Un studio a besoin d’un mode d’emploi, et nous avons fait le nôtre comme vous feriez le vôtre : trois courtes animations rendues sur PageToVid. L’une couvre l’installation dans VS Code, une autre le tournage d’un produit derrière sa connexion, la dernière une émission récurrente créée depuis un dépôt par Claude Code.
Chacune est une vidéo publique ordinaire, avec sa page, ses sous-titres et ses boutons de partage, liée depuis la page de l’extension en quatre langues. Pour le film sur la connexion, nous avons préféré une simple liste d’étapes à une comparaison côte à côte : un parcours simple se montre le mieux simplement.
Ce que cela change
Un développeur peut désormais passer d’un projet vide à une visite filmée de sa propre application, derrière sa connexion, sans quitter l’éditeur, puis tenir ce film à jour au fil du produit. L’assistant fait l’installation ; la personne garde le dernier mot sur chaque rendu.
Prochaine étape : rendre la connexion encore plus directe, en se connectant dans un vrai navigateur ouvert depuis l’éditeur, sans rien laisser sur la machine. Vous pouvez installer l’extension depuis la page de l’extension VS Code et lire comment les assistants se connectent sur la page des assistants.
Voyez-le sur votre propre site
Collez une page et obtenez la vidéo commentée dont parle ce blog. La première est offerte.
À lire ensuite
