← Retour aux réalisations

UX/UI Design · Design system · Branding

Terry

Terry est un concept d'application mobile qui accompagne les utilisateurs dans l'entretien de leurs plantes d'intérieur selon leur niveau : rappels d'arrosage, conseils et tutoriels, et une estimation du bon emplacement d'une plante dans le logement grâce à la modélisation du foyer et à la simulation des conditions météo.

Contexte

Projet de fin d’études

Rôle

UX/UI Designer

Durée

9 mois

Livrables

Maquettes app et landing page, design system

Interfaces de l'application Terry.

01

Contexte & Problème

Projet de fin d’études (PFE) réalisé seule dans le cadre de mon M2 UX/UI Design à l'ECV Nantes (2023), j’ai imaginé et conçu une application d'accompagnement pour l'entretien de plantes d'intérieur ainsi que le design system associé. L'exercice demandait de se projeter dans un contexte de startup avec plusieurs pôles (design, marketing, développement), j'ai donc mené seule l'ensemble de la démarche, de la recherche UX jusqu'au design system, en tenant compte des besoins de ces différents interlocuteurs fictifs.

Comment accompagner les personnes, quel que soit leur niveau, dans l'entretien de leurs plantes d'intérieur ?

Le constat de départ : un grand nombre de plantes d'intérieur meurent chaque année, par manque de connaissances, par manque d'attention, ou parce que leur entretien finit par être vécu comme une corvée.

Pour valider ce constat, j’ai mené un questionnaire quantitatif diffusé sur plusieurs plateformes, complété par des entretiens qualitatifs avec 7 personnes sélectionnées parmi les répondants.

264

réponses au questionnaire en 15 jours

95,5%

possèdent des plantes d'intérieur

67,9%

se disent intéressés par le concept

Les entretiens ont fait ressortir des besoins clairs (connaître ses plantes, des rappels, des conseils fiables) mais aussi des points de vigilance : ne pas multiplier les fonctionnalités, éviter les notifications trop nombreuses, garantir des informations de sources sûres.

02

Démarche

Cette recherche a donné lieu à trois personas représentant chacun un niveau d'expertise différent, qui ont accompagné toutes les décisions de conception :

  • — Enzo : jeune homme débutant qui n’a pas du tout la main verte
  • — Diane : jeune femme intermédiaire qui aime s’occuper de ses plantes
  • — Carine : femme âgée confirmée qui adore par-dessus tout prendre soin de sa collection de plantes

L'architecture de l'information a suivi plusieurs étapes : liste des fonctionnalités triées par thème et priorisées en V1/V2 (les fonctionnalités communautaires ont été repoussées en V2), arborescence de l'application et de la landing page, userflow, puis une user journey construite sur Diane pour repérer les points de friction de son parcours (ajouter une plante à son foyer).

Le projet s'articule autour de trois valeurs : personnalisation, pédagogie, responsabilité environnementale. Celles-ci sont traduites dans une identité de marque complète : palette de couleurs, typographies (Clash Display pour les titres, Archivo pour le texte courant), patterns et logo.

Palette de couleurs utilisée dans l'application Terry.

Des wireframes détaillés ont ensuite structuré les parcours clés (inscription, onboarding, dashboard, détail d'une plante, gestion des foyers, recherche), avant le passage aux maquettes haute-fidélité et à une landing page responsive.

Extraits mobile et desktop de la landing page de l'application Terry.

Sur le volet Design System, j'ai construit une librairie Figma organisée par catégories de composants (actions, navigation, formulaires), chacun documenté avec son anatomie, ses cas d'usage et ses do/don't. Pour que le design system reste maîtrisé dans le temps, j'ai mis en place un arbre de décision permettant de savoir si un besoin correspond à une évolution ou à un nouveau composant, dans les deux cas, passé par une étape de validation avant intégration.

Arbre de décision relatif à l'ajout d'un nouveau composant.

J'ai enfin centralisé cette documentation sur ZeroHeight pensé pour être accessible à plusieurs interlocuteurs (design, développement, marketing), et mis en place des design tokens exportés en JSON pour fiabiliser une future implémentation par des développeurs.

Extrait de la documentation du composant bouton de l'application Terry.

03

Résultat

Le projet a abouti à un prototype complet et testable (application + landing page) et à un design system documenté et gouverné, pensé pour continuer à évoluer :

  • — Un concept validé en amont par la recherche utilisateur plutôt que par intuition : 67,9 % des répondants se disaient intéressés par le concept avant même la conception des écrans.
  • — Une librairie de composants Figma documentée, avec des design tokens exportables, pour fluidifier la collaboration avec le développement.
  • — Un processus de gouvernance (arbre de décision) évitant la prolifération de composants redondants.
  • — Une documentation centralisée sur ZeroHeight, partagée entre design, développement et marketing.

Une V2, intégrant l'aspect communautaire identifié pendant la recherche (profils d'autres utilisateurs, plant sitting), avait été planifiée sur la roadmap de fin de projet.

Voir le détail complet sur Behance · Application et site web · Design system

On travaille ensemble ?

contact@mathildedejoie.fr