TrickleAI

Qu’est-ce que Trickle AI ?

Trickle AI est une plateforme de développement d’IA visuelle conçue pour créer des sites web, des formulaires et des applications Web légères, dont le produit phare s’appelle Magic Canvas. Les utilisateurs peuvent décrire leurs besoins en langage naturel, puis visualiser directement les pages, les éléments de référence, les versions et les opérations effectuées par l’IA sur la toile de dessin.

Les autorités le définissent comme une toile d’agent intelligente destinée au Vibe Coding, où l’objectif n’est pas seulement de générer un morceau de code, mais de permettre aux utilisateurs de collaborer avec l’IA dans un contexte visuel continu pour concevoir, développer des fonctionnalités, gérer des données et publier des résultats.

Comment fonctionne Magic Canvas

Les outils de programmation d’IA traditionnels séparent souvent la conversation, le code et la prévisualisation ; l’utilisateur doit décrire à plusieurs reprises l’emplacement des pages et les modifications à apporter. Magic Canvas place la page, les règles, les images, les esquisses et les versions antérieures dans un même espace, faisant du tableau de dessin lui-même le contexte permettant à l’IA de comprendre le projet.

• Création en langage naturel : description de produits, de pages et de fonctionnalités, version initiale exécutable générée par l’IA.
• Contexte visuel : placer les diagrammes de référence, les règles et les pages sur une même toile pour une utilisation conjointe.
• Gestion multi-pages : organiser les pages de accueil, de détail, de connexion, etc., au sein du même projet.
• Édition directe : sélectionnez les éléments de la page pour modifier le texte, le style ou la position, sans avoir à demander à chaque fois.
• Organisation des versions : conservation de différents résultats de génération, avec possibilité de restaurer des versions antérieures.
• Synchronisation du code : les modifications visuelles sont synchronisées avec le code du projet de base.
• Publication en un clic : Une fois terminé, il est possible de le publier sur le nom de domaine de la plateforme ou en connectant un nom de domaine personnalisé.

Fonction principale

• Génération de sites et d’applications IA : création de la structure, du style et des interactions des pages à partir de besoins textuels.
• Base de données intégrée : stocke les soumissions de formulaires et le contenu dynamique, sans nécessiter de mettre en place un backend indépendant au préalable.
• Mode d’image IA : génération, édition et gestion des éléments visuels de la page.
• Gestion des matériaux : télécharger des images, utiliser des éléments de la bibliothèque ou travailler avec des esquisses en ligne.
• Pages multiples et versions : étendre les pages dans la toile et restaurer les itérations antérieures.
• Édition et déplacement directs : ajustement précis des éléments sélectionnés pour réduire la consommation de ressources.
• Hébergement de site : les options gratuites et payantes incluent tous deux l’hébergement de la plateforme.
• Noms de domaine et analyse : la version payante prend en charge des noms de domaine personnalisés, et les données d’accès peuvent être consultées dans l’interface administrative.
• Paramètres SEO : configuration du titre, de la description, de l’icône du site et des informations de partage social.
• Intégration avec des tiers : la documentation officielle fournit des instructions pour l’intégration de Supabase, Stripe et Three.js.

Quels produits peuvent être créés

• Site officiel du produit, page personnelle et page de conversion marketing.
• Page de lancement du nouveau produit, page d’événement et page de liste d’attente.
• Questionnaires, tests, inscriptions et formulaires améliorés par l’IA.
• Tableau de bord interne, saisie de données et outils métier légers.
• Application Web avec connexion, données et structure multi-pages.
• Portfolio, histoires interactives et expérience de présentation de la marque.
• Produit minimum viable utilisé pour valider la demande du marché.
• Prototype commercial reliant une base de données externe à un service de paiement.

Base de données intégrée

La base de données intégrée de Trickle permet de créer des collections via des prompts, et de sauvegarder en temps réel les données des formulaires ou des applications. Pour les inscriptions, les retours, les listes d’attente et les petits systèmes de contenu, elle peut réduire le nombre d’étapes nécessaires pour configurer séparément le backend.

• Créer des champs et des ensembles de données pour la soumission du formulaire.
• Lire et afficher du contenu dynamique sur la page d’application.
• Ajouter ou modifier des structures de données en langue naturelle.
• Voir et gérer les enregistrements collectés dans l’arrière-plan du projet.
• La version gratuite permet jusqu’à 100 lignes, la version Pro jusqu’à 1000 lignes, et la version Premium jusqu’à 10 000 lignes.
• Pour les données de production sensibles ou à forte concurrence, il est encore nécessaire d’évaluer les droits d’accès, les sauvegardes et les besoins en expansion.

Génération d’images et gestion de matériel

Le mode Image est un espace de travail visuel indépendant, permettant de créer, d’éditer et d’organiser des images, pour ensuite les utiliser dans des projets web. La documentation officielle prend également en charge le téléchargement de ses propres matériaux, l’utilisation d’images de référence d’Unsplash et la création de maquettes en ligne.

• Créer l’élément visuel principal de la page d’accueil, les illustrations et les éléments d’interface.
• Modifiez le sujet, l’arrière-plan ou le style de l’image existante selon les indications.
• Placer une image de référence sur la toile pour aider l’IA à comprendre la direction souhaitée.
• Téléchargez le logo de la marque, des photos de produits et des assets de conception propres.
• Utilisez des schémas simples pour illustrer la disposition, plutôt que de vous fier uniquement à une description écrite.
• Avant la mise en ligne, il est nécessaire de vérifier les autorisations d’utilisation des images, les portraits de personnes et les droits d’utilisation de la marque.

Éditer et déplacer des éléments directement

Direct Edit permet aux utilisateurs de sélectionner les éléments sur la page générée par l’IA pour modifier directement leur contenu et leur style. Move Element, quant à lui, sert à ajuster les positions ; ces opérations manuelles n’ont pas besoin d’être effectuées via de nouvelles instructions, et ne consomment pas de points supplémentaires pour corriger des erreurs.

• Modifier les titres, les boutons, le texte des instructions et d’autres contenus de la page.
• Ajuster les couleurs, la taille du texte, l’espacement et les détails visuels.
• Déplacer les éléments pour améliorer la mise en page sur ordinateur ou sur mobile.
• Commencez par effectuer manuellement un retouche locale, puis laissez l’IA gérer les modifications structurelles plus importantes.
• Réduire la probabilité de changements accidentels sur toute la page dus à des rappels répétés.

Versions et projets multi-pages

Magic Canvas rassemble l’historique des versions et la gestion des pages dans un même espace visuel. Les utilisateurs peuvent conserver différentes orientations, créer de nouvelles pages ou restaurer des versions antérieures, ce qui convient à une expansion progressive du projet.

• Créez des pages distinctes pour la page d’accueil, les pages de fonctionnalités, la page des prix et la page de contact.
• Comparer différentes options de conception et de contenu, sans remplacer immédiatement l’ancienne version.
• Revenir à une version antérieure en cas d’erreur ou de direction inappropriée.
• Organiser les références, les pages et les versions selon leurs relations spatiales pour maintenir le contexte du projet.
• Il est toujours recommandé de vérifier que les données et les services externes ne subiront pas d’effets irréversibles avant toute modification majeure.

Noms de domaine, hébergement et analyse de site web

Tous les forfaits incluent l’hébergement de site web ; les plans payants offrent un nombre variable de noms de domaine pour la plateforme et des noms de domaine personnalisés. La connexion au nom de domaine nécessite généralement l’ajout d’un enregistrement CNAME et une validation sur la plateforme.

Le panneau Analytics permet de consulter des données telles que les visites de page, les visiteurs uniques, les tendances du trafic et les régions. Il convient pour une vérification de base ; l’attribution complexe, le consentement à la protection des données et l’analyse commerciale peuvent encore nécessiter d’autres outils.

Paramètres SEO et partage

• Définir le titre de la page afin que les résultats de recherche reflètent précisément son thème.
• Rédigez une méta-description qui résume la valeur de la page plutôt que d’empiler des mots-clés.
• Télécharger l’icône du site pour uniformiser les onglets du navigateur et l’identité de la marque.
• Configurer les informations Open Graph pour améliorer l’aperçu des partages sur les réseaux sociaux.
• Après mise en ligne, vérifier l’index, la version mobile, la vitesse et les performances réelles de recherche.
• Les pages générées par l’IA ne gagnent pas automatiquement en classement ; la qualité du contenu et du site restent essentielles.

Intégration Supabase

Lorsque la capacité de la base de données intégrée ou les besoins du backend ne suffisent pas, il est possible de se connecter à Supabase selon les guides officiels. Il convient aux projets qui nécessitent une authentification, des données relationnelles et un contrôle backend plus complet.

• Utilisez un projet indépendant pour enregistrer les données de l’application.
• Concevoir la structure de la table et les stratégies d’accès en fonction des besoins métier.
• Fournir aux utilisateurs connectés une lecture et une écriture de données contrôlées.
• Configurer la sécurité au niveau de la ligne et les clés d’environnement avant le lancement.
• NeExposez pas les clés de service à hauts privilèges du côté du navigateur.

Intégration de paiement Stripe

La documentation officielle fournit des directives pour l’intégration des paiements Stripe, pouvant être utilisées pour les produits, les abonnements ou d’autres scénarios de paiement. La fonction de paiement implique des fonds réels et des données clients ; il ne suffit pas de s’assurer que le bouton sur la page est cliquable.

• Vérifiez d’abord les produits, les montants et le processus de paiement dans un environnement de test.
• Le serveur vérifie le résultat du paiement, sans dépendre de l’évaluation effectuée par la page du navigateur.
• Gérer correctement les échecs, les annulations, les remboursements et les notifications répétées.
• Configurer les taxes et frais, la monnaie, les conditions et les processus de support client.
• Vérifiez les clés, les appels de rappel, les permissions et les exigences de conformité régionale avant le lancement.

Three.js et les expériences interactives

Trickle peut intégrer Three.js selon les guides officiels, pour des présentations 3D et des pages interactives. De tels effets améliorent l’aspect visuel, mais augmentent également les exigences en termes de performances de chargement, de compatibilité mobile et d’utilisabilité.

• Affichage 3D des produits et mise en espace des pages de marque.
• Portefeuilles interactifs, projets expérimentaux et histoires visuelles.
• Page de publication avec animation ou page d’événement créatif.
• Une version simplifiée doit être fournie pour les appareils à faible performance.
• Les informations importantes et les boutons ne devraient pas dépendre uniquement d’animations complexes pour être présentés.

À qui s’adresse-t-il

• Entrepreneurs et développeurs indépendants qui ont besoin de valider rapidement une idée de produit.
• Les marketeurs qui souhaitent créer eux-mêmes des pages de destination et des pages d’événement.
• Designers qui accordent de l’importance à l’édition visuelle, mais qui ne maîtrisent pas bien les technologies front-end complètes.
• Équipes métier nécessitant la création d’outils internes et de formulaires.
• Product managers qui souhaitent accélérer le prototype en langage naturel.
• Freelance capable de finaliser rapidement la première version du site web d’un client.
• Ingénieurs disposés à examiner la sécurité et le code, et à utiliser l’IA comme assistant de développement.

Scénarios d'utilisation typiques

• Créer le site web officiel du nouveau produit et la liste d’attente en une journée.
• Transformer les besoins de l’événement en page d’inscription et en table de données backend.
• Créer des outils interactifs avec des quiz, une page de résultats et une collecte de données.
• Créer une application légère pour l’entrée et la présentation d’informations destinée aux équipes internes.
• Générer plusieurs versions de pages de destination pour tester les informations et le design.
• Connectez Supabase pour créer un MVP avec connexion et données dynamiques.
• Connecter le processus de paiement ou de souscription vérifié par Stripe.

Tutoriel de création de site avec Trickle AI

1. Définir les objectifs du site, le public cible, la liste des pages et les actions à effectuer par l’utilisateur.
2. Créez un projet et décrivez la marque, la structure, le style et les fonctionnalités dans Magic Canvas.
3. Insérez le logo, les images du produit, les pages de référence et les règles dans la toile en tant que contexte.
4. Laissez l’IA générer la première page, puis utilisez l’édition directe pour ajuster le texte et les détails visuels.
5. Créez d’autres pages et vérifiez la navigation, les liens, ainsi que l’expérience sur mobile et l’accessibilité.
6. Il faut configurer une base de données intégrée ou se connecter à un backend externe lorsqu’il est nécessaire de collecter des données.
7. Ajouter le SEO, les noms de domaine et les paramètres d’analyse, puis publier après avoir rempli le formulaire et effectué les tests de sécurité.

Processus de mise en ligne d’une application web

1. Compléter le parcours principal avec des données de test, y compris l’inscription, la soumission, le paiement ou les opérations en arrière-plan.
2. Vérifiez les règles d’accès à la base de données pour vous assurer que les utilisateurs ne peuvent ni lire ni modifier les données des autres.
3. Vérifier toutes les clés d’environnement pour éviter de exposer des identifiants à haut niveau de privilèges au front-end.
4. Gestion des échecs de test réseau, des soumissions répétées, des données vides et des entrées anormales.
5. Préparer des pages officielles pour la confidentialité, les conditions générales, les remboursements et le support client.
6. Connecter le nom de domaine et vérifier les performances sur bureau, smartphone et principaux navigateurs.
7. Après le lancement, surveillez les erreurs, les points, la capacité de la base de données et les tendances d’accès pour itérer en temps opportun.

Prix et forfaits

À la date de cette vérification, Trickle propose trois forfaits mensuels : Free, Pro et Premium. La page des prix officiels indique que le forfait Pro coûte 17 dollars par mois et le forfait Premium 42 dollars par mois ; des packs supplémentaires de points peuvent être achetés séparément.

Pack de points supplémentaires

Comment consommer des points

• La plateforme utilise d’abord les points gratuits mensuels, puis les points du forfait, et enfin les points d’achat supplémentaire.
• La consommation à chaque suggestion est affichée dans la zone de réponse de l’IA.
• L’activation de « Fix error » pour corriger une erreur ne consomme pas de points supplémentaires.
• La consommation peut varier selon les tâches, il convient de l’observer dans des projets réels.
• La version gratuite a une limite quotidienne de points, et un total maximum de 350 points peut être accumulé par mois.
• Les prix, les points et les avantages peuvent être modifiés ; il convient de se référer à la page de compte en temps réel et de règlement.

Comment choisir un forfait

Avantages du produit

• Le tableau de bord transforme les pages, les actifs, les règles et les versions en un contexte d’éléments constamment visible.
• La génération de langage naturel combinée à l’édition directe assure à la fois vitesse et contrôle local.
• Base de données intégrée, hébergement, noms de domaine, analyse et SEO, pour réduire la nécessité d’assembler des outils en amont.
• Prend en charge la génération d’images et des références visuelles, idéal pour les utilisateurs qui accordent de l’importance à la conception des pages.
• La restauration de plusieurs pages et versions est plus adaptée aux itérations continues que la génération d’une seule conversation.
• Les guides Supabase, Stripe et Three.js permettent d’élargir les capacités backend, de paiement et interactives.
• Le plan gratuit permet de vérifier l’effet réel généré avant de payer.

Restrictions d'utilisation et précautions

• La génération de langage naturel ne peut pas garantir que la logique métier, les droits d’accès et la sécurité des paiements soient corrects.
• La version gratuite offre un volume limité pour les projets, les bases de données et les points, ce qui fait que les projets complexes atteignent rapidement leur limite.
• L’IA peut affecter d’autres pages en modifiant les besoins locaux, ce qui nécessite des versions et des tests de régression.
• Les bases de données intégrées conviennent aux scénarios légers ; les cas à forte concurrence, avec des relations complexes et des droits d’accès stricts nécessitent une évaluation distincte.
• Les noms de domaine personnalisés ne sont disponibles que dans les forfaits payants, et leur nombre est également limité par le forfait.
• L’intégration externe augmente les risques liés aux clés, aux appels de retour, à la confidentialité et à la dépendance envers les fournisseurs.
• La création d’images et de matériel pour les pages nécessite encore la confirmation des droits d’auteur, des marques déposées et des autorisations relatives aux portraits.
• L’hébergement sur plateforme et les capacités propriétaires créent une dépendance vis-à-vis du fournisseur ; les projets importants doivent prévoir un plan de migration.

Différences avec les outils traditionnels de création de sites sans code

GitHub et l’état open source

Trickle dispose d’une organisation GitHub nommée trickleai et publie un petit nombre de répertoires, mais Magic Canvas, l’hébergement, la base de données intégrée et la plateforme commerciale n’ont pas été publiés en tant que projets open source complets. Plusieurs outils Web3, Python ou de bande passante portant le même nom apparaissent également dans les recherches, mais ils ne peuvent pas être considérés comme le code source de ce produit.

Informations de base

Indice de recommandation

4,4 / 5. Le Magic Canvas de Trickle AI regroupe les prompts, la conception, les éléments visuels, les versions et la publication dans un même espace visuel, ce qui convient à la création rapide de sites web et d’applications légères ; cependant, en cas d’utilisation de comptes, de paiements, de données sensibles ou de backends complexes, une analyse de sécurité professionnelle et des tests approfondis restent nécessaires.

Questions fréquentes

Qu’est-ce que Trickle AI fait principalement ?

Il génère des sites web, des formulaires, des pages de destination, des outils internes et des applications Web légères pouvant être publiés, à partir du langage naturel et d’une toile de visualisation.

Trickle AI est-il gratuit ?

Il existe un forfait gratuit qui offre 70 points par jour, jusqu’à 350 points par mois, permettant de créer jusqu’à 3 projets et d’utiliser 100 lignes de base de données.

Combien coûte le forfait Pro ?

Selon les informations officielles, le prix est actuellement de 17 dollars par mois, ce qui inclut 1500 points du forfait, 350 points gratuits, des projets illimités et un nom de domaine personnalisé.

Peut-on connecter son propre nom de domaine ?

Oui, Pro prend en charge 1 nom de domaine personnalisé, tandis que Premium en prend en charge 3 ; il est généralement nécessaire de configurer et de valider des enregistrements CNAME.

Est-il possible de créer un site web à plusieurs pages ?

Oui, Magic Canvas permet de créer et d’organiser plusieurs pages au sein d’un même projet, tout en conservant différentes versions.

Y a-t-il une base de données ?

Il dispose d’une base de données intégrée : 100 lignes pour la version gratuite, 1 000 lignes pour Pro, 10 000 lignes pour Premium ; il est également possible de se connecter à Supabase selon les besoins.

Est-il possible d’intégrer Stripe pour les paiements ?

Les guides officiels d’intégration Stripe sont disponibles, mais il est impératif de tester la validation du serveur, les appels de retour, les remboursements et la sécurité des clés avant de mettre en ligne le service.

L’édition directe consomme-t-elle des points ?

Selon les indications officielles, l’édition directe et le déplacement des éléments permettent de perfectionner la page ; l’action de correction d’erreur ne consomme pas de points supplémentaires.

Trickle convient-il pour des applications de production en série ?

Il est possible de publier des produits réels, mais les comptes, les paiements, les données sensibles et les projets à droits complexes ne peuvent être soumis sans une étude d’ingénierie, de sécurité et de conformité.

Trickle AI est-il open source ?

Ce n’est pas une plateforme entièrement open source ; le répertoire public officiel sur GitHub ne contient pas tout le code source de Magic Canvas ni des services commerciaux.