Gratuit et open source
Votre agent construit.
Vous façonnez la suite.
Un espace léger pour voir, essayer et améliorer l’application de votre agent. Explorez les vrais écrans, indiquez ce qui doit changer et continuez depuis le code source.
Gratuit · Licence MIT · Votre propre agent
Claude Code
Codex
Gratuit et open source
L’application est le canvas.
De vrais écrans exécutant le code UI d’origine. Essayez l’exemple public avant toute installation.
Données synthétiques · sans backend d’app · sans compte · sans clé API
Pour construire, vérifier et améliorer
- Voyez ensemble les écrans complets, leurs états nommés et les parcours implémentés.
- Une seule implémentation UI. Votre agent crée fixtures, adapter et contrôles de couverture.
- Essayez 77 états et 44 parcours avec des données synthétiques, sans compte ni clé API.
Voir, utiliser, rejouer
Dézoomez pour comprendre l’application
Écrans complets regroupés par page, recherche, filtres et panneaux repliables. Un lien de parcours déplace la caméra vers sa destination.
Zoomez pour utiliser la vraie UI
Browse verrouille les contrôles pendant le déplacement. Sélectionnez un écran puis Interact pour utiliser son code original avec des données jetables.
Indiquez précisément quoi changer
Sélectionnez un écran ou un élément UI, ajoutez votre demande et copiez une référence pour votre agent. Demandez-lui de modifier le code ; les aperçus liés au source se reconstruisent.
Indiquez précisément quoi changer
Sélectionnez un écran ou un élément UI, ajoutez votre demande et copiez une référence pour votre agent. Demandez-lui de modifier le code ; les aperçus liés au source se reconstruisent.
Intégrez-le à votre développement.
Essayez l’application incluse en local, puis connectez votre dépôt avec votre agent. Node.js 22+ requis.
Commencer gratuitementnpm install -g github:tombelieber/app-canvas#v0.16.0
agent-canvas browsers
agent-canvas demoAvant de commencer
Est-ce gratuit ?
Le CLI, le canvas et les skills sont gratuits et open source sous licence MIT. Les coûts de votre agent restent distincts.
Compatible avec Claude Code et Codex ?
Oui. Installez les skills pour l’un ou les deux. Les autres agents peuvent suivre le guide public et utiliser le CLI. Le canvas n’appelle aucun modèle.
Faut-il un fichier de design ?
Partez du code de votre application ou importez un site. Votre agent connecte l’UI existante et des fixtures synthétiques pour examiner écrans et états.
La démo modifie-t-elle mon application ?
Non. Elle exécute un exemple synthétique figé dans le navigateur. Votre application et son code se modifient dans votre projet local avec votre agent.
Et les applications natives ?
UIKit, SwiftUI et Android nécessitent des harnesses et captures du runtime d’origine propres au projet. Une capture native n’est pas une application native interactive dans le navigateur.
Portée et limites
- Le Web utilise le vrai HTML/CSS et le JavaScript original pour les interactions. UIKit, SwiftUI et Android exigent des harnesses et preuves du runtime d’origine ; une capture n’est pas une app native interactive.
- La couverture relie du code examiné à des cas, sans découverte automatique de toutes les conditions métier. Les tests UI ne qualifient ni backends de production, ni précision clinique ou des modèles.
- Viewer : anglais par défaut, 11 langues. La démo publique est un frontend synthétique figé ; les intégrations locales suivent votre source. Les performances sur iPad physique ne sont pas mesurées.
Confidentialité et télémétrie
Événements minimaux facultatifs via Cloudflare vers PostHog. Aucun contenu, code, nom, chemin, e-mail ou IP n’est transmis à PostHog. Vous pouvez désactiver l’analyse.