FÉDÉRATION
FRANÇAISE DE TENNIS

FÉDÉRATION
FRANÇAISE DE TENNIS

Ce projet pour la Fédération Française de Tennis m’a permis de rentrer en profondeur dans la création d’un produit web inexistant puisque j'ai accompagné leur équipe durant toute la phase de conception d'un nouveau service.

J'ai commencé par définir les cibles du projet puis nous avons défini des écrans lors d'ateliers de sketching pour réaliser un prototype cliquable en V1. Nous avons réalisé des tests utilisateurs sur cette première version pour apprécier les ressentis des utilisateurs.


Atelier Sketching - Wireframe - Prototypage - Tests utilisateurs - Design UX - Design UI

Visiter le site : Ma réservation tennis 
Crédit : Clever-age

Ce projet pour la Fédération Française de Tennis m’a permis de rentrer en profondeur dans la création d’un produit web inexistant puisque j'ai accompagné leur équipe durant toute la phase de conception d'un nouveau service.

J'ai commencé par définir les cibles du projet puis nous avons défini des écrans lors d'ateliers de sketching pour réaliser un prototype cliquable en V1. Nous avons réalisé des tests utilisateurs sur cette première version pour apprécier les ressentis des utilisateurs.


Atelier Sketching - Wireframe - Prototypage - Tests utilisateurs - Design UX - Design UI

Visiter le site : Ma réservation tennis 
Crédit : Clever-age

Atelier co-conception

Atelier co-conception

unsplash-image

L'objectif : confronter mes idées avec les leurs pour consolider des sketches qui m’ont permis d’élaborer un prototype en wireframe.

L'objectif : confronter mes idées avec les leurs pour consolider des sketches qui m’ont permis d’élaborer un prototype en wireframe.

Exemples de Wireframe Desktop

Wireframe Desktop

Browser window_2
Browser window

Parcours utilisateurs

prototyping_2

J'ai d'abord établi des parcours liés aux différentes cibles que nous avons identifiés.

Cela nous a permis d'imaginer comment, à partir des besoins rencontrés, nous pourrions orienter les futurs utilisateurs. Cette étape cruciale permet de déterminer la mécanique du produit.

Elle nous a aussi permis de délimiter le périmètre des templates à réaliser pour la phase de prototypage.

J'ai d'abord établi des parcours liés aux différentes cibles que nous avons identifiés.

Cela nous a permis d'imaginer comment, à partir des besoins rencontrés, nous pourrions orienter les futurs utilisateurs. Cette étape cruciale permet de déterminer la mécanique du produit.

Elle nous a aussi permis de délimiter le périmètre des templates à réaliser pour la phase de prototypage.

Tests utilisateurs

À cette étape, j’ai travaillé un prototype cliquable réalisé avec Axure. Cela m'a permis de réaliser des parcours fluides et faciles d'accès avec des menus déroulants et autres animations d'interface fréquement utilisés vu sur le web.

Les séances se sont déroulées par groupes de 5 personnes. D'abord sur un prototype en Wireframe puis avec 2 autres groupes de 5 personnes avec un prototype utilisant une interface graphique.

À cette étape j’ai travaillé un prototype cliquable réalisé avec Axure. Cela m'a permis de réaliser des parcours fluide et facile d'accès avec des menu déroulants.

La séance s'est déroulé par lot de 5 personnes. D'abord sur un prototype en Wireframe puis avec 2 autres groupes de 5 personnes avec le design graphique.

unsplash-image

Design UI

ecran_ui_1
ecran_ui_2

Pour la réalisation graphique, j'ai travaillé en collaboration avec la directrice artistique attitrée du projet. Suite au brief graphique et à son impulsion en direction artistique, j'ai décliné tous les Wireframes que nous avions partagé lors de la première phase. 3 supports ont été réalisés : mobile, tablette et desktop. Cela dans une logique Mobile First pour garder une expérience cohérente entre les supports.

Pour que la communication avec les développeurs front soit plus fluide, j'ai mis à leur disposition un guide de style regroupant tous les éléments nécessaires à l'élaboration de nouvelles pages.

Pour la réalisation graphique, j'ai travaillé en collaboration avec la directrice artistique attitrée du projet. Suite au brief graphique et à son impulsion en direction artistique, j'ai décliné tous les Wireframes que nous avions partagé lors de la première phase. 3 supports ont été réalisés : mobile, tablette et desktop. Cela dans une logique Mobile First pour garder une expérience cohérente entre les supports.

Pour que la communication avec les développeurs front soit plus fluide, j'ai mis à leur disposition un guide de style regroupant tous les éléments nécessaires à l'élaboration de nouvelles pages.

ecrans_mobile

La dernière phase de test utilisateur a été partagé entre 2 groupes :
L’un avait accès une offre d'essai sans obligation d'achat de la licence FFT, tandis que l'autre était obligé de valider l'achat d'une licence pour continuer le processus de réservation d'un court de tennis.

Suite aux résultats de ces tests utilisateurs, nous avons pu corriger l'offre initialement prévue.
Cela nous a permis de déterminer le point bloquant lié à l’offre, donc le produit actuelement en ligne conserve l’offre d’essai proposée en amont de l’achat d’une licence.

La réussite de ce projet nous a donné l’opportunité de poursuivre cette collaboration et de faire évoluer pour la FFT une plate-forme à destination des joueurs de tennis : Mon espace tennis.

Logo

CONTACT

Vous pouvez me contacter à cette adresse beaufils.nicolas[@]gmail.com ou télécharger mon CV.