Wireframes & Maquettes

Conception d’une application mobile first dédiée à la découverte de circuits de randonnée personnalisés.

Durée du projet : 6 heures

Scroll

Contexte du projet

Le sujet consistait à créer une interface mobile first permettant à l’utilisateur de découvrir facilement des balades à proximité, filtrées selon plusieurs critères : durée, niveau de difficulté, accessibilité et centres d’intérêt. A droite ce sont des applications concurantes : Komoot, Strava et MaRando qui proposent plus ou moins ce type de service.

Ce projet visait à concevoir un parcours utilisateur clair et intuitif, de la recherche de circuits jusqu’au lancement d’une balade. Mon rôle a été de structurer l’expérience utilisateur (UX) et de développer l’aspect visuel (UI) à travers la création de wireframes et de maquettes détaillées.

Storyboard du projet Echoes Motion

Processus créatif

Le projet a débuté par une phase de recherche d’inspiration sur des applications existantes de randonnée et de découverte (comme Strava ou Komoot), afin d’identifier les bonnes pratiques d’ergonomie mobile.

J’ai ensuite conçu quatre pages principales :

  • Accueil : présentation des circuits à proximité
  • Liste des circuits : affichage filtré selon les préférences
  • Carte interactive : visualisation des trajets et points d’intérêt
  • Circuit lancé : interface simplifiée pour suivre la progression en temps réel

Wireframes

Les wireframes ont permis de définir la structure fonctionnelle de l’application avant toute mise en couleur. Chaque écran a été réfléchi pour offrir une navigation intuitive, mettant l’accent sur la lisibilité et la facilité d’accès aux filtres.

Maquettes finales

Après validation des wireframes, j’ai réalisé les maquettes haute fidélité en respectant une charte graphique naturelle et moderne. Les interactions ont été simulées sur Figma pour visualiser le parcours utilisateur complet, de la sélection d’une balade jusqu’à son suivi sur la carte.