Skip to content
Retour aux projets

Expenza

Un suivi des dépenses mobile éditorial et gestuel, conçu autour de l'interaction physique Shake-to-Add, d'un minimalisme neutre chaleureux et d'une architecture 100% locale sur appareil.

Type
Design de produit et application mobile en production
Rôle
Designer de produit et architecte mobile
Plateforme
iOS et Android (React Native et Expo)
Outils
Figma, React Native, Sharp
Application mobile Expenza : tableau de bord d'accueil, modal rapide Shake-to-Add et aperçu analytique comportemental

Le problème de la friction dans les finances personnelles

La plupart des applications de finances personnelles échouent non par manque de fonctionnalités, mais en raison d'une friction d'interaction excessive. En quittant un café ou une caisse de supermarché, les utilisateurs ont moins de cinq secondes d'attention avant de ranger leur téléphone. Les flux traditionnels exigeant des sous-menus complexes et des synchronisations entraînent l'abandon rapide de l'application.

Expenza est construite sur le principe inverse : une saisie en moins de trois secondes. En remplaçant la navigation d'interface par une intention physique, l'application réconcilie la saisie instantanée et la clarté financière à long terme.

Tableau de bord Expenza affichant le solde, la progression du budget, la répartition des dépenses et les séries
Modal de saisie rapide avec grille de catégories 3x3 et puces d'incrémentation rapide
Écran de configuration de la sensibilité Shake-to-Add avec calibrage des seuils et autorisations

L'intention physique plutôt que la navigation : Shake-to-Add

Plutôt que de chercher un bouton flottant ou de parcourir un menu, l'utilisateur effectue un simple mouvement du poignet. Un filtre d'accéléromètre personnalisé calcule les variations sur trois axes (Δ > 3.0G) couplé à un délai de temporisation de 1 500 ms pour éliminer les faux positifs en poche tout en garantissant une réactivité instantanée.

La fenêtre modale active immédiatement la saisie, pré-sélectionne le contexte récent et propose des puces d'incrémentation rapide (+10, +50, +100, +200, +500) pour consigner les montants ronds en un geste sans clavier. En arrière-plan, un service natif déclenche une impulsion haptique et une notification avec lien direct.

Liste chronologique des transactions groupée par dates avec filtres de catégories et recherche
Vue calendrier interactive avec indicateurs de dépenses et carte d'inspection détaillée du jour
Tableau de bord d'analytique comportementale avec vélocité Money Mood, graphiques mensuels et répartition

Clarté éditoriale chaleureuse sans ombres portées

Expenza s'éloigne des clichés fintech sombres et néon au profit d'un univers visuel éditorial clair. Conçue sur des fonds neutres chauds (#F7F7F5), des cartes blanches nettes (#FFFFFF) et des bordures subtiles (#E7E7E4), l'interface applique une règle stricte de zéro ombre portée. La sensation tactile naît d'un espacement rigoureux, d'une hiérarchie de contours et de retours haptiques.

La typographie est composée en Plus Jakarta Sans pour une lisibilité parfaite des chiffres. Les tokens de catégories utilisent des accords chromatiques contrastés : ambre pour la Nourriture, bleu cobalt pour les Transports, magenta pour le Shopping et violet pour les Factures.

Répartition par catégories et distribution des dépenses avec barres segmentées proportionnelles
Écran de story Money Replay offrant un bilan financier mensuel immersif au format story
Configuration du budget mensuel avec saisie numérique et puces de montants prédéfinis

Réflexion comportementale : Money Replay et Money Mood

Enregistrer les dépenses n'est que la moitié du chemin ; l'interface doit également éclairer le rythme des dépenses. Expenza remplace les graphiques passifs par des indicateurs comportementaux : le badge « Money Mood » évalue la cadence de dépense par rapport au calendrier, tandis que les séries de régularité valorisent les journées sans dépense et le respect du budget.

À la fin de chaque mois, une story interactive Money Replay en 7 étapes transforme les chiffres du mois en un récit visuel percutant, détaillant les postes majeurs et la santé financière en langage naturel.

Système de design mobile Expenza, carte de story Money Replay et calibrage budgétaire
Moteur d'exportation multiformat générant des feuilles Excel stylisées et des relevés PDF
Système de design tokenisé Expenza : hiérarchie typographique, couleurs sémantiques et composants

Souveraineté locale et moteur d'exportation natif

La confidentialité est totale : 100% des données financières restent sur l'appareil via un stockage local sécurisé, sans télémétrie externe, sans traceurs et sans obligation de créer un compte. L'utilisateur reste l'unique propriétaire de ses données.

Pour assurer une portabilité complète, Expenza intègre un moteur d'export multi-format. Les utilisateurs peuvent générer des classeurs Excel stylisés (.xlsx) avec formules, des relevés PDF au format A4 prêts à l'impression ou des sauvegardes complètes en JSON structuré.

Ce que cela a produit

Une application mobile de finances personnelles complète et éprouvée qui réduit la saisie quotidienne à un geste physique de moins de trois secondes, tout en préservant une esthétique éditoriale claire et la souveraineté totale des données sur l'appareil.

Ce qu'elle démontre pour les projets clients est un savoir-faire de bout en bout : exploiter les capteurs matériels pour créer des micro-interactions fluides, concevoir des design systems rigoureux sans artifices visuels et intégrer des exports de données professionnels.