Préserver les modifications utilisateur
Les utilisateurs peuvent apporter des modifications dans le code en dehors de la conversation.
Si vous détectez un changement surprenant effectué entre-temps, ne l'écrasez pas, supposez qu'il était intentionnel ou demandez une confirmation.
Création d'une vidéo
Si l'utilisateur demande de faire, créer ou construire une nouvelle vidéo ou composition, chargez Créer une nouvelle vidéo Remotion, qu'un projet Remotion existe déjà ou non.
Configuration d'un nouveau projet
Si aucun projet Remotion n'existe actuellement, chargez Créer un nouveau projet Remotion
Meilleures pratiques pour le balisage React
Si vous écrivez du balisage React Remotion, chargez Meilleures pratiques pour le balisage Remotion
Cartes
Pour les cartes statiques, les itinéraires animés et les marqueurs, les explications géographiques, Mapbox, MapLibre, MapTiler, GeoJSON ou les survols géographiques 3D, chargez Cartes Remotion.
Multimédia
Pour réaliser des tâches multimédia dans le navigateur, telles que le rognage, le recadrage de vidéos ou l'obtention de leurs métadonnées, chargez Remotion Multimédia
Amélioration de l'interactivité
En structurant bien le balisage Remotion, nous pouvons permettre aux utilisateurs de modifier des éléments de manière interactive dans le Studio et de réécrire dans le code. Si pertinent : Meilleures pratiques d'interactivité
Ouvrir l'aperçu
Si l'utilisateur demande de "faire" une vidéo, "créer" une vidéo, etc. Ne rendez pas la vidéo par défaut, sauf s'ils sont très explicites. Ils veulent plutôt voir un aperçu interactif. Dès que le projet peut être exécuté, démarrez le Studio et ouvrez l'aperçu dans le navigateur avant de construire ou d'éditer la composition. Gardez-le ouvert pendant que vous travaillez afin que l'utilisateur puisse suivre la progression et orienter.
Si vous utilisez Cursor
Exécutez Studio sans --no-open pour qu'il ouvre le navigateur automatiquement :
npx remotion studio
Si vous utilisez un autre client agent avec un navigateur intégré à l'application
Vous pouvez utiliser la commande ci-dessus pour laisser Studio ouvrir le navigateur, ou exécuter :
npx remotion studio --no-open
Cela démarrera un processus de longue durée et affichera l'URL du serveur pour l'aperçu.
Si le serveur est déjà démarré, il affichera l'URL.
Si vous utilisez --no-open, ouvrez l'URL exacte imprimée dans le navigateur intégré à l'application et vérifiez que le Studio se charge. Une fois qu'une composition existe, vérifiez que son aperçu vidéo se charge. Si vous ne pouvez pas l'ouvrir là-bas, exécutez Studio sans --no-open.
Vous pouvez accéder à une composition spécifique en naviguant vers /[composition-id], par exemple http://localhost:3000/MapAnimation.
:::note Le Studio prend en charge les outils WebMCP. :::
Si vous n'avez pas de navigateur intégré à l'application
Cela ouvrira le Studio dans le navigateur ou le recentrera s'il est déjà ouvert.
npx remotion studio
Plus d'options
Pour lancer un projet dans Remotion Studio, ouvrir son URL locale exacte ou configurer les drapeaux CLI du Studio, chargez Remotion Studio.
Rendre la vidéo
Ne rendez que si l'utilisateur est très explicite dans sa demande. Par exemple : "Rendre la vidéo", "Exporter", "Donne-moi le MP4".
L'aperçu offre également une interface de rendu plus intuitive, donc envisagez de l'utiliser à la place de la ligne de commande pour le rendu.
npx remotion render
Pour plus d'options, consultez Rendu.
Pour un rendu avancé au-delà d'un simple npx remotion render, consultez : Meilleures pratiques de rendu
Sous-titres
Lorsque vous travaillez avec des sous-titres, chargez Remotion Captions.
Création d'un SaaS, d'une automatisation ou d'une application
Utilisez la compétence Remotion SaaS pour des connaissances sur les applications SaaS basées sur Remotion, telles que <Player>, le rendu sur Lambda, Vercel, Cloudflare, via Express.js, le rendu côté client, ou pour trouver le bon modèle SaaS.
Recherche d'API et de documentation Remotion
Pour trouver et lire la documentation actuelle de Remotion, chargez Documentation Remotion.
Mise à niveau
Pour mettre à niveau Remotion, les packages associés, les packages Mediabunny compatibles et les compétences d'agent Remotion installées, chargez Mise à niveau Remotion.