
Tech • IA • Robotique • Jeu
Kimmy K3 a été utilisé pour créer de zéro un outil de suivi des finances personnelles dans le navigateur, en quatre prompts successifs, produisant une application autonome en un seul fichier avec gestion des transactions, analyses, vues mensuelles et design adapté au mobile.
La création a commencé dans un chat Kimmy vide, sans code de départ, outils de développement local ni clé API. Un simple compte gratuit dans le navigateur suffisait pour accéder à K3, sélectionné dans le menu des modèles comme option par défaut pour un projet demandant plus de contexte.
Le premier prompt a généré un outil de suivi des finances personnelles dans un unique fichier HTML utilisant Tailwind CSS et du JavaScript natif. L’application de base comprenait un en-tête avec solde courant, un formulaire de transaction, des sélecteurs de catégorie et de type, un bouton d’ajout, et une liste de transactions remplie avec des exemples fictifs.
Les catégories incluaient food, utilities, salary, entertainment et transport, chacune affichée avec des badges colorés. Un test avec un exemple comme des courses a confirmé que les nouvelles transactions apparaissaient immédiatement et mettaient à jour le solde courant sans rechargement de la page.
Un deuxième prompt a enrichi l’application avec trois cartes récapitulatives pour le revenu total, les dépenses totales et le solde net. La carte du solde net changeait de style selon que le solde restait positif ou passait sous zéro, ajoutant un signal visuel immédiat au tableau de bord.
L’application a aussi ajouté un graphique circulaire Chart.js montrant les dépenses regroupées par catégorie. Lorsqu’une nouvelle entrée, comme Metro card topup de 40 dans transport, était soumise, le graphique se redessinait automatiquement et les totaux se recalculaient en synchronisation.
Un troisième prompt a introduit une barre de recherche et des boutons de filtre pour all, income et expenses. La recherche prenait en compte à la fois les descriptions des transactions et les noms de catégories, tandis que la logique de filtre et de recherche fonctionnait ensemble pour affiner les résultats par texte et par type de transaction.
Chaque ligne a reçu des contrôles edit et delete. La modification rechargeait le formulaire avec l’entrée sélectionnée, tandis que la suppression demandait d’abord une confirmation; dans les deux cas, le solde, les cartes récapitulatives, la liste des transactions et le graphique circulaire étaient mis à jour immédiatement.
L’étape finale a ajouté des contrôles pour le mois précédent et suivant, avec le mois et l’année actifs affichés entre des flèches, par exemple August 2026. Tous les éléments du tableau de bord, y compris les totaux, le graphique et la liste, étaient filtrés selon le mois sélectionné, tandis que l’interface était revue avec des fonds ardoise, des cartes arrondies, un espacement plus propre et des effets au survol.
L’application a été ajustée pour que les cartes récapitulatives s’empilent verticalement sur les petits écrans et que les graphiques et listes se redimensionnent sans défilement horizontal. Après téléchargement de index.html, l’outil fonctionnait localement dans un navigateur standard sans serveur, commande de build ni base de données, confirmant qu’il marchait comme fichier autonome.
Le workflow par étapes a été présenté comme le facteur clé du résultat. Découper le projet en base, analyses, outils de gestion puis navigation et style finaux a réduit le risque de réponses trop volumineuses, de logique contradictoire et de code incomplet, problèmes fréquents quand trop de fonctionnalités sont demandées d’un coup.
L’exercice a montré qu’une première application complète peut être créée en langage naturel via un workflow d’IA dans le navigateur lorsque les fonctionnalités sont ajoutées par étapes claires. Le résultat le plus marquant n’était pas seulement la génération de code, mais un outil de suivi des finances personnelles terminé qui continuait à fonctionner après export comme un logiciel ordinaire.
Explique-moi