Claude Code pour tenir le coup ? Le journal de développement d'une application personnelle, créée par un designer UI qui n'arrivait pas à tenir avec les applications de santé globales

Bonjour ! Je suis Hasshy, designer UI chez Liberogic Inc.

Avez-vous déjà vécu ce problème secret ? Vous vous étiez dit : « Allez, on commence aujourd'hui ! », vous avez installé une application, et pourtant, l'application d'habitudes ne tient pas du tout dans le temps.

Je suis un pro pour commencer les choses, mais je n'ai jamais réussi à les poursuivre.

Il existe de nombreuses applications intelligentes et élégantes.

Au début, on enregistre rigoureusement chaque jour. Mais entre un travail chargé et des soirées arrosées, il suffit d'un jour où la « série » est interrompue pour que la motivation tombe d'un coup à zéro...

Les rappels, qui avaient d'abord retenu toute mon attention, sont devenus peu à peu un bruit de fond, et mes applications finissent par s'ensevelir, fossilisées, au bord de l'écran de mon téléphone.

Ce sentiment de défaite qui surgit à ce moment précis : « Bon, tant pis. » Je suis sûr que je ne suis pas le seul à l'avoir connu.

Pour ceux qui abandonnent tout au bout de trois jours, n'y a-t-il vraiment personne pour tendre la main ? (Il n'y en a pas)

Mais ce qui me pesait encore plus, c'était la dispersion des applications.

Passer d'une application à l'autre pour chaque élément (suivi des habitudes, calendrier des médicaments, livre de comptes du foyer...) ne faisait qu'accentuer la lassitude. Pire encore, les abonnements payants s'étaient multipliés, si bien que je perdais le fil de la gestion et oubliais parfois de les résilier. Au final, cela allait à l'encontre du but recherché.

C'est alors qu'une idée un peu capricieuse de designer a éclaté. « Et si je développais moi-même une application ne contenant que les fonctions dont j'ai besoin, uniquement pour moi ? »

C'est ainsi qu'a commencé le développement du « Cockpit d'habitudes sur mesure », une application conçue spécialement pour mon quotidien, réalisée en duo avec l'IA (Claude Code) !

La solution optimale, l'IA devrait bien pouvoir me la suggérer.

1. [Présentation des fonctions] Une fonction soignée qui transforme ma nonchalance en système, en mettant en place la procrastination sous forme de système

Voyons maintenant concrètement les fonctions que j'ai mises en place.

Tout en reprenant le meilleur des applications existantes, j'ai visé un « tableau de bord » ultime, conçu spécifiquement pour mon quotidien.

Pour regrouper les applications nécessaires en une seule, j'ai commencé par créer une application de suivi des habitudes.

Comme je souhaite alterner entre les deux selon le moment de la journée, j'ai prévu à la fois un mode clair et un mode sombre.

🌱 Écran initial

L'écran initial affiche le formulaire de saisie des habitudes que vous souhaitez maintenir, à remplir vous-même.

En faisant défiler la page vers le bas, vous trouverez un lien « Créer une habitude en répondant aux questions ». En cliquant dessus, vous répondez à une série de questions, et l'application vous propose des habitudes adaptées à votre profil.

Intégration d'un diagnostic de mise en habitude sur l'écran initial

Nous avons également créé, sur l'écran initial, un navigateur d'habitudes : les utilisateurs qui ne savent pas encore quelle habitude adopter peuvent simplement répondre à quelques questions pour choisir une habitude adaptée à leur profil.

🌱 Suivi des habitudes : en finir avec le tout ou rien

Pour installer une habitude, il est utile de commencer par de petits pas, afin de pouvoir continuer régulièrement, même à petite échelle.

Nous avons développé une application de mise en habitude dotée d'une fonction d'évaluation « en 5 niveaux ». Les applications que nous utilisions auparavant se limitaient souvent à deux choix : « réussi » ou « non réussi ». Dans cette application, les jours où vous avez « parfaitement réussi » comme ceux où vous avez « fait un petit effort » (niveau 1) sont tous marqués en couleur dans le calendrier.

Par exemple, pour le sport, vous pouvez enregistrer vos efforts selon les jours, du « Niveau 1 : monter sur la balance » ou « Niveau 2 : faire des squats quand vous allez aux toilettes » jusqu'au « Niveau 5 : nager 1 km à la piscine et faire 40 minutes de boxe ».

Les jours où vous avez manqué à votre habitude restent vides, mais grâce au système de « taxe de procrastination » expliqué plus loin, il suffit de rattraper ces jours-là pour s'en sortir. Ainsi, même si vous sautez un jour, cela ne vous décourage pas.

Il suffit de recommencer le lendemain. Grâce à cette légèreté, je parviens au moins à monter sur la balance chaque jour !

Le calendrier se colore progressivement en dégradé de vert, ce qui rend visuellement agréable l'« accumulation des couleurs ». Sur un mois, on voit clairement tout ce que l'on a accompli, et cela booste la motivation.

Suivi visuel grâce au calendrier

Dans l'interface du calendrier, la couleur change lorsque vous atteignez réellement une habitude. Selon le niveau, l'intensité ou la teinte de la couleur varie, ce qui permet de voir concrètement la régularité de vos efforts et contribue à maintenir la motivation.

Fonctions d'archivage des habitudes et de création de nouvelles habitudes

Une fois une habitude bien installée, il peut être judicieux de s'attaquer à une autre. C'est pourquoi j'ai prévu une fonction d'archivage des habitudes ainsi qu'une fonction de création de nouvelles habitudes ! Un clic sur le bouton « Habitude acquise » permet d'ajouter une nouvelle habitude.

🏛️ Taxe sur la procrastination : transformer la culpabilité en épargne

Voici une autre fonctionnalité liée au suivi d'habitudes présenté précédemment !

Chaque jour où l'on n'a pas tenu son engagement, une « taxe » (300 yens par défaut) est prélevée automatiquement.

Tout le monde traverse parfois des moments où il est impossible de tenir le rythme.

Une pénalité est nécessaire pour nous discipliner, mais une simple amende finit par me lasser.

Savez-vous pourquoi on devient obèse ? Parce qu'on privilégie ce qui est facile et confortable, qu'on fuit l'effort, et qu'on compte sur la nourriture pour obtenir une petite dose de bonheur immédiat grâce à la dopamine. Alors, quelle que soit la sévérité de la pénalité, elle ne sert à rien pour ceux d'entre nous qui peinent à installer une habitude.

J'ai bien envisagé de verser un don pour chaque jour de paresse, mais je savais que si je me serrais la vis à ce point, je ne rouvrirais jamais l'application (rires).

La taxe paresse est versée sur mon propre compte d'investissement en indexation.

En somme, c'est une amende qui n'en est pas vraiment une : une amende pour moi-même.

Même le sentiment de culpabilité d'avoir procrastiné se transforme en investissement pour mon futur moi.

Ce à quoi j'ai particulièrement tenu, c'est un système de « réduction fiscale » selon le taux de réalisation mensuel.

• « Taux de réalisation de 90 % ou plus : exonération de 50 % »
• « Taux de 80 % ou plus : exonération de 25 % »

Le mécanisme est ainsi conçu.

L'écran affiche « Plus que 1 % pour une réduction de 25 % ! », et en voyant cela, une motivation un peu mystérieuse me pousse à me dire : « Aujourd'hui, même au niveau 2, je vais faire de mon mieux. »

Le plus grand ennemi de la constance, c'est le moment où l'on saute un jour, que la série est brisée, et que l'on a envie de tout abandonner.

Mais grâce à ce dispositif de réduction d'impôts, on peut se dire : « J'ai sauté un jour, mais il me reste encore une chance de bénéficier de la réduction ! » et tenir bon.

Une conception bienveillante, pensée pour les personnes peu organisées comme moi, qui ne laisse pas un seul échec décourager.

✨ Suivi des soins de la peau & 💊 Gestion des médicaments : plus besoin de jongler entre les applications

✨ J'aurais tant voulu un outil de suivi des soins de la peau

Habitudes, médicaments, budget domestique... Gérer tout cela dans des applications séparées était, pour quelqu'un de peu organisé, le comble de la corvée. Pour supprimer ce « va-et-vient entre les applications », j'ai intégré entièrement les soins quotidiens et le suivi de santé dans ce tableau de bord unique.

Les fonctionnalités reprenaient directement celles de mon application d'habitudes, donc l'implémentation a été simple.

🧴 Un « suivi des soins de la peau » qui accepte les jours sans énergie

Prendre soin de sa peau est aussi une habitude à part entière. Dès l'ouverture de l'écran, une question apparaît : « Où en es-tu ? », avec une série de 5 étapes à compléter.

Les jours où je rentre épuisée, « Niv. 1 : nettoyage du visage seul (lavage à l'eau ou avec un nettoyant) » suffit. Si j'ai un peu d'énergie, « Niv. 2 : soins minimum (nettoyage + lotion) », « Niv. 3 : soins de base (+ émulsion) », et les jours spéciaux, « Niv. 4 : soins approfondis » en ajoutant même un sérum… Vous pouvez ainsi enregistrer votre routine selon l'état de votre peau ce jour-là.

De plus, il est possible de personnaliser le nom de chaque niveau ainsi que le contenu des soins (leur description) depuis les « Réglages des étapes ». En haut de l'écran, la « Moyenne de niveau du mois » et le « Nombre de jours consécutifs au niveau 3 ou plus » sont également affichés, ce qui vous permet de rester motivée sans pression, par exemple en vous disant : « Je suis fatiguée et n'ai fait que du niveau 1 récemment, alors aujourd'hui je vise le niveau 3 ! ».

💊 La gestion des médicaments, pour ne rien oublier

Et personnellement, c'est la gestion des médicaments qui est la plus difficile à tenir.

Cette application ne se limite pas à saisir le nom d'un médicament. Elle permet un enregistrement très détaillé et flexible : le moment de la prise (« matin », « midi », « soir »), les consignes (« avant le repas », « après le repas », « au choix »), le nombre de comprimés à chaque prise, ainsi que des fréquences complexes comme « tous les jours », « un jour sur deux » ou « jours de la semaine spécifiques ».

Lorsqu'un médicament n'a pas été pris, une alerte rouge bien visible s'affiche en haut de l'écran : « ⚠️ Un médicament n'a pas été pris. Veuillez vérifier. », pour vous rappeler à l'ordre.

En bas de l'écran, des chiffres bien réels s'affichent également, comme le « Taux de prise des médicaments du mois » et le « Nombre d'oublis » (sur l'écran de test en cours de développement, mon taux de prise est de 5 %, preuve de mon côté négligent… haha).

Rassurez-vous malgré tout.

Même si vous avez oublié de prendre un médicament un jour, la conception « saisie a posteriori » reste disponible : vous pouvez enregistrer rétroactivement depuis le calendrier. Vous n'avez donc pas à vous laisser gagner par le perfectionnisme et pouvez avancer à votre rythme.

Avec l'âge, la prise de médicaments augmente, donc cette fonctionnalité est vraiment pratique. Et comme je peux partager les informations sur mes anciens médicaments lors des consultations, c'est très utile (moi qui oublie toujours mon carnet de santé).

🍺 Gestion des soirées : une fonctionnalité géniale qui booste votre motivation pour la santé et les économies

Et personnellement, la fonctionnalité qui a le plus changé mon quotidien, c'est cette « Gestion des soirées ».

Il ne s'agit pas seulement de noter ses consommations : elle permet de gérer le nombre maximal de soirées par mois (par exemple « 4 maximum par mois ») ainsi que son budget, tout en transformant chaque petit effort du quotidien en récompense visuelle.

🍵 Un tap, et ça tinte ! « Épargne sobriété »

Au quotidien,

« Aujourd'hui, je décide de ne pas boire à la maison. »

Quand vous réussissez à vous retenir, il vous suffit d'appuyer sur l'interrupteur « Pas d'apéro ce soir » sur l'écran d'accueil.

Un simple geste suffit : un marqueur vert apparaît dans le calendrier, et 500 yens sont ajoutés à votre « Épargne sobriété » dans un tintement.

Chaque petit effort du quotidien s'accumule en argent, si bien qu'à mesure que la fin du mois approche, vous ressentez ce sentiment de réussite un peu absurde, accompagné d'une bouffée de dopamine : « Ce mois-ci, j'ai déjà économisé 3 000 yens (6 jours) ! »

Cet argent économisé, je le place en investissement ou je le mets de côté.

Si l'on finance ses envies avec l'argent économisé en limitant sa consommation d'alcool, par exemple en prélevant sur la « boîte à désirs », on ressent concrètement les bénéfices de cette sobriété, ce qui aide à tenir plus longtemps sur la durée.

🛡️ Mode « Prévention de la gueule de bois » pour se contrôler pendant les soirées

L'atout caché de cette application est le « mode Prévention de la gueule de bois ». Dès le début de la soirée, il suffit d'activer ce mode : un compte à rebours jusqu'à l'« heure de retour prévue » que vous avez définie s'affiche en grand au centre de l'écran. Bien sûr, si vous vous amusez trop pour rentrer, vous pouvez prolonger le temps grâce aux boutons « Modifier l'heure de retour » ou « 🎉 Encore un verre, c'est possible ! », une conception souple pensée pour les personnes un peu insouciantes comme moi.

De plus, l'écran affiche des compteurs de verres pour « 🍺 Alcool », « 🥤 Soft » et « 💧 Eau ». Une jauge indique en temps réel si le rythme est respecté, par exemple « un soft pour chaque deux alcools », et passe au vert « OK ». Ainsi, on réduit nettement la gueule de bois du lendemain et les regrets du type « Pourquoi ai-je autant bu ?… ».

📊 De nombreuses autres fonctions pratiques pour les soirées

Une fois la soirée terminée, vous pouvez enregistrer le nom du restaurant, comme « Torikizoku Shibuya », le montant réellement payé et des notes sur les personnes présentes. Nous avons également ajouté une fonction qui remplit automatiquement ces informations à partir d'une URL Google Maps. Cette opération n'étant effectuée que quelques fois par mois, l'intégration de l'API ne coûte rien, selon l'IA, c'est pourquoi nous l'avons mise en place.

Nous avons aussi ajouté cette fonction comme mémo, car il arrive d'oublier le règlement après une soirée.

Plus besoin de se demander qui a payé quoi, c'est vraiment pratique.

Enfin, le « rapport mensuel » de fin de mois présente de façon bien visible un « total des économies », qui additionne l'« épargne sobriété » correspondant au nombre de jours sans apéro et la différence entre le budget soirée et le montant réellement dépensé, c'est-à-dire l'argent économisé lors des soirées. Par exemple, en voyant d'un coup d'œil « Ce mois-ci, j'ai économisé 9 000 yens ! », on a envie de s'offrir ce gadget convoité avec cet argent. C'est une fonction que j'apprécie beaucoup, car elle permet de préserver à la fois sa santé et son porte-monnaie.

2. Après le développement : Claude a été le meilleur « traducteur » pour les designers

Ainsi, l'application qui regroupe toute ma paresse et mes caprices a fini par prendre forme. Moi, qui n'avais aucune expérience en développement, si j'en suis arrivé là, c'est uniquement grâce à mon acolyte, Claude.

Les ingénieurs risquent de me prendre pour un fou en voyant cela, mais pour ce projet, j'ai opté pour une approche d'une simplicité brute : tout le HTML, le CSS et le JavaScript regroupés dans un seul fichier index.html. Mais pour Claude et moi, c'est le choix parfait.

Lorsque le code est réparti dans plusieurs fichiers, expliquer « corrige tel passage dans tel fichier » demande déjà beaucoup d'efforts. Avec un fichier unique, il suffit de coller tout le code dans le chat : Claude en saisit instantanément l'ensemble.

Claude traduit mes idées abstraites du type « je voudrais que ça se comporte comme ceci » en un code élégant. Il est vrai qu'il nous est arrivé, à cause d'une balise fermante oubliée ou d'un ordre de chargement erroné des JavaScript, de faire planter toute l'application, et de passer la nuit à deux à traquer les messages d'erreur. Mais même ces épisodes avaient quelque chose de réjouissant, comme dans un film de duo de buddies (rires).

Pour la connexion à GitHub ou à Cloudflare, il suffisait de demander à l'IA : elle explique comment créer les comptes et fournit directement les liens vers les sites officiels. Ainsi, en discutant avec elle, j'ai pu tout connecter en un clin d'œil.

3. Le prochain mur : design et profondeurs de la sécurité

Grâce à Claude, j'ai pu obtenir le meilleur des jouets (l'application), avec un design et des animations qui incarnent mon idéal.

……Mais c'est là qu'un nouveau problème surgit.

En utilisant ce cockpit au quotidien, j'ai soudain pris conscience de la situation. « Attends, cette application contient mon état de santé réel, mes données de médicaments quotidiens, mon budget mensuel récent, et l'historique de mes paresses. C'est une quantité considérable de données personnelles à nu. »

Pour l'instant, l'écran est verrouillé par un simple code PIN à titre de précaution, mais, à vrai dire, je ne suis absolument pas expert en sécurité. Avec les connaissances acquises uniquement par moi et l'IA, je ne peux pas totalement dissiper mon inquiétude à l'idée de confier des données aussi importantes.

En tant que designer, nous créons des expériences agréables, et c'est pourquoi le sentiment de sécurité qui se cache derrière, à savoir la certitude que rien ne peut fuiter ni être compromis, doit aussi faire partie intégrante du travail.

« Je voudrais pouvoir l'ouvrir de manière à la fois sûre et fluide, rien qu'à moi, grâce à Face ID sur mon smartphone ou aux passkeys, la dernière technologie en date ! »

C'est l'idée qui m'est venue, mais la sécurité est un domaine extrêmement spécialisé qui ne se maîtrise pas facilement.

Là, c'est au-dessus de mes capacités...

Je compte en discuter avec un ingénieur et avancer prudemment sur ce point.

Plus tard, j'aimerais aussi intégrer un outil de gestion de budget et ajouter une fonctionnalité qui enregistrerait automatiquement les dépenses simplement en important l'historique de ma carte de crédit, mais la sécurité me préoccupe, donc c'est en suspens pour le moment.

Conclusion

Les outils sont prêts. Maintenant, je veux créer la « sérénité » !

Une idée restée au stade de simple rêverie, faute de connaissances en développement, a fini par prendre vie grâce à l'IA, ce partenaire idéal, et s'est transformée en un outil qui change réellement mon quotidien. Au lieu de me reprocher de ne pas être parfait, je peux recommencer autant de fois que nécessaire en acceptant une petite « taxe de flemme ». Grâce à ce système bienveillant, moi qui étais un champion de l'abandon au bout de trois jours, je parviens aujourd'hui à installer mes habitudes au quotidien, avec plaisir.

Mais plus les outils deviennent pratiques, plus la responsabilité de les protéger vient avec eux.

Cet article ne le mentionne pas, mais nous ajoutons progressivement des fonctionnalités de notifications et de gestion de budget.

Pour la gestion du budget domestique, par exemple, il faut procéder avec prudence pour des raisons de sécurité, alors je m'efforce encore de la développer dans l'environnement de développement sans l'avoir intégrée comme fonctionnalité.

Rendez-vous donc pour la prochaine mise à jour, on vous réserve de belles surprises !