App Basketball : Mon Playground

Mon Playground est en projet de développement

Résumé du Projet

CONTEXTE

Le but de ce projet est de permettre aux amateurs de basketball (ou à n’importe qui d’autre), n’ayant pas forcément les moyens, le temps, ou l’envie de prendre une licence dans un club, de profiter des nombreuses installations sportives pour jouer, se rencontrer, s’amuser.De nombreux playgrounds (ou n’importe quel terrain doté d’un panier) sont déserts, ou peu fréquentés, notamment dans les petites villes, le but étant de pouvoir les réhabiliter (via une base de données interactive) et d’inciter les joueurs à s’y rencontrer pour y jouer.

SOLUTION

• Une note de cadrage expliquant les objectifs du projet
• Budget
• Rétro-planning
• Un bilan qui décrit et évalue rétrospectivement mon expérience.
• Les éléments de création du projet

Voir Prototype

ROLE

UX, UI Designer

DUREE

8 semaines

TACHES

Identifier et mener un projet à impact social
Mobiliser ses compétences au profit de la réalisation d’un projet

OUTILS

Processus créatif

EMPATIR

Recherche

Bien qu’étant assez familier avec le monde du basketball, en tant que fan et pratiquant, j’ai voulu en savoir plus en commençant avec quelques recherches secondaires, notamment sur les tendances et les données démographiques du marché. J’ai ensuite conduit quelques entretiens pour en savoir plus sur les différentes expériences que les pratiquants ont pu avoir.

Au cours de ma recherche j’ai donc cherché à :

    • Comprendre les tendances du marché lié au basketball
    • Identifier le marché cible
    • Identifier les concurrents et évaluer leurs forces et leurs faiblesses
    • Comprendre le rôle du basketball en France
    • Comprendre les expériences qu’ont les pratiquants de basketball
    • Découvrir les objectifs, besoins, motivations et frustrations des joueurs

Etude de Marché

Pour en savoir plus sur les tendances du marché et les données démographiques du basketball en France, j’ai commencé par une étude de marché avec l’aide de Google. Grâce à cette étude, j’ai pu acquérir une compréhension plus approfondie pour mieux éclairer mes décisions de conception à l’avenir. Voici quelques-unes des informations clés que j’ai découvert :

    • 2ème sport collectif le plus populaire (derrière le football)
    • 1er sport collectif féminin
    • 660 000 licenciés (chiffres FFBB)
    • 2,5 millions de pratiquants (chiffres FFBB)
    • 20 000 playgrounds recensés en France

 

La présence des fans de basket sur les réseaux sociaux ne fait qu’augmenter et la popularité de la NBA y est pour beaucoup. Les chaines YouTube spécialisées dans le basket connaissent un essor important ces dernière années.

    • TrashTalkProduction 150 000 abonnés (+50% la dernière année)
    • FIRST TEAM 127 000 abonnés (+27% la dernière année)

Analyse Compétitive

Après avoir mené mon étude de marché, j’ai procédé à l’analyse des concurrents de Mon Playground pour voir quelles étaient leurs forces et leurs faiblesses. Grâce à cette analyse, j’ai pu mieux comprendre les différentes approches adoptées par les marques pour résoudre un problème similaire et appliquer ces informations pour aider à prendre les meilleures décisions pour le produit de Mon Playground.

Questionnaire exploratoire

Bien que j’ai acquis une meilleure compréhension du marché, des concurrents et du public en général, je voulais approfondir mes connaissances sur qui sont ces personnes qui sont susceptibles d’utiliser l’application – qui sont exactement les utilisateurs et à quoi ressemblent leurs expériences quand il s’agit de jouer au basketball ? Il était maintenant temps de mener des entretiens pour commencer à en savoir plus sur les possibles futurs utilisateurs.

Pour mener à bien ces recherches, j’ai créé et partagé un sondage Google Forms dans des forums liés au basketball afin de recueillir un maximum d’échantillons. Je me suis concentré sur des questions ouvertes, en gardant à l’esprit les objectifs de recherche que j’avais définis dans mon plan de recherche:

    • Identifiez ce qui motive les joueurs à aller au playground
    • Découvrez les points faibles que les joueurs rencontrent lors qu’ils sont sur le terrain
    • Déterminez les facteurs d’une excellente expérience
    • Identifier les applications similaires et évaluer les forces et les faiblesses

Après avoir rassemblé toutes les informations tirées lors des sondages, il était maintenant temps de faire une analyse plus approfondie en utilisant une carte d’empathie.

Carte d’Empatie

J’ai placé toutes les notes que j’ai prises pendant les entretiens et les ai placées sur des notes autocollantes et j’ai commencé à les organiser en catégories, ce qui m’a aidé à avoir une meilleure vue d’ensemble de toutes les informations recueillies auprès des différents utilisateurs.

En examinant toutes les notes, des motifs ont commencé à émerger dans les différentes catégories, me permettant d’en tirer des informations clés. Les modèles les plus importants que j’ai découverts étaient les suivants:

CONNEXIONS
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim in selectione virtus ponenda erat, ut id ipsum, quod erat bonorum ultimum, aliud aliquid adquireret.
SITUATION
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim in selectione virtus ponenda erat, ut id ipsum, quod erat bonorum ultimum, aliud aliquid adquireret.
RECOMMANDATIONS
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim in selectione virtus ponenda erat, ut id ipsum, quod erat bonorum ultimum, aliud aliquid adquireret.

Et maintenant, que signifient ces patrons ?

Voici les informations clés que j’ai tirées de ces modèles et les besoins des utilisateurs que j’étais désormais en mesure de comprendre à partir de ces informations :

Connaissances
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim in selectione virtus ponenda erat, ut id ipsum, quod erat bonorum ultimum, aliud aliquid adquireret.
Besoins
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim in selectione virtus ponenda erat, ut id ipsum, quod erat bonorum ultimum, aliud aliquid adquireret.

Storyboard

J’ai maintenant une solide compréhension des besoins des utilisateurs, mais je voulais approfondir le parcours d’utilisation globale des utilisateurs. Quelles sont les motivations et les frustrations de ces utilisateurs au cours de leur expérience ? La création de ce storyboard m’a permis de visualiser l’environnement de l’utilisateur ainsi que les motivations et les frustrations tout au long de cette expérience:

Personas

En utilisant ce que j’ai appris de mes recherches secondaires et primaires, j’ai créé plusieurs personas qui représentaient bien pour qui je conçois cette application. Ces personas ont aidé à guider mes décisions tout au long du processus de conception pour m’assurer que la solution que je conçois est centrée sur notre utilisateur.

DEFINIR

Définir les Problèmes

Sur la base de la synthèse de mes recherches, j’ai commencé le processus de définition des problèmes fondamentaux à résoudre et de définition de la stratégie pour trouver des solutions.

Objectifs du Projet

Pour démarrer ce processus, j’ai créé un diagramme de Venn décrivant les différents objectifs entre le projet, l’utilisateur et certaines considérations techniques à garder à l’esprit. La définition et la compréhension des objectifs individuels, ainsi que des objectifs plus larges et mutuels du projet, m’ont aidé à ouvrir une voie plus claire lors de la prise de décisions tout au long du processus de conception.
Maintenant que j’ai compris les objectifs du projet, j’ai commencé à réfléchir aux types de fonctionnalités nécessaires pour atteindre ces objectifs. Pour m’aider à organiser et à planifier ces fonctionnalités, j’ai créé une feuille de route des fonctionnalités.

Roadmap des Fonctionnalités

En repensant aux résultats de mes recherches, j’ai dressé une liste des différentes fonctionnalités dont l’application Mon Playground aurait besoin, puis je les ai hiérarchisées en fonction de ce qui était le plus essentiel pour atteindre les objectifs du projet.
Voir Roadmap des Fonctionnalités

Maintenant que je comprenais quels types de fonctionnalités seraient essentiels pour atteindre les objectifs du projet, je voulais commencer à explorer l’architecture globale de l’application. Comment pouvais-je organiser, structurer et présenter toutes les informations et fonctionnalités de l’application pour atteindre l’objectif de créer une expérience agréable pour les utilisateurs ?

Plan d’Application

Maintenant que je savais quelles solutions j’allais devoir utiliser, je voulais comprendre comment ces fonctionnalités s’intégreraient dans l’architecture de l’application Mon Playground. Afin de mieux comprendre cela, j’ai créé un plan d’application.

IDEER

Elaborer des solutions

Je savais quel type de contenu figurerait désormais sur l’application Mon Playground grâce au plan d’application, mais comment ces utilisateurs interagiront-ils avec celle-ci ? Avant de commencer à travailler sur la conception de l’application, je voulais mieux comprendre comment les utilisateurs utiliseraient Mon Playground et atteindraient leurs objectifs.

Flux de Tâches

Pour mieux comprendre comment les utilisateurs effectueraient des tâches clés sur l’application Mon Playground, j’ai commencé par créer des flux de tâches (task flow). La création de ces flux de tâches m’a aidé à identifier les tâches clés que les utilisateurs accompliraient et les écrans avec lesquels les utilisateurs interagiraient.

Flux Utilisateur

En cherchant plus profondément, j’ai créé un flux d’utilisateurs explorant différents scénarios pour mon persona, Kylian. Ici, j’ai exploré les différents chemins que Kylian emprunterait tout en interagissant avec le site Web et identifié les pages et fonctionnalités clés avec lesquelles il interagirait.

Croquis & Wireframes

À ce stade, j’ai commencé à esquisser différentes idées pour la mise en page de l’application Mon Playground reflétant les besoins de Kylian ainsi que des modèles de design courants que j’ai recherchés sur le Web.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Création du Logo

Avant de passer à la conception de l’interface utilisateur de l’application, il était temps de travailler le logo Mon Playground. En utilisant les attributs de l’application et du basketball en général, j’ai commencé par rassembler des idées en créant un moodboard pour définir l’orientation de l’image de la marque. En utilisant le moodboard et les attributs de l’application comme guide, j’ai commencé à esquisser différentes idées pour le logo de Mon Playground. Après avoir réfléchi à un certain nombre d’idées et effectué des itérations sur les meilleures options, je me suis limité au logo final qui, à mon avis, reflétait le mieux l’image de marque de Mon Playground.

Charte Graphique

Suite à la conception du logo, j’ai créé une charte graphique pour l’image de marque de Mon Playground – en prenant les décisions finales sur les éléments de l’application qui refléteraient son identité (palette de couleurs, typographie, images et logo).

UI Design

Une fois la charte graphique définie pour Mon Playground, j’ai commencé à créer la conception visuelle des pages clés de l’application à partir des wireframes que j’avais créés précédemment. Ici, je me suis concentré sur la façon dont l’image de Mon Playground se traduirait sur l’application et j’utiliserais ces conceptions pour l’étape suivante: créer un prototype à tester.

PROTOTYPE

Définir les Problèmes

En utilisant les pages que j’ai conçues dans Adobe XD, j’ai créé un prototype haute fidélité à fonctionnalités limitées pour les tests d’utilisabilité afin d’observer comment les utilisateurs interagissent avec l’application et d’identifier où des améliorations pourraient être apportées.
Voir Prototype

TEST

Tester le Design

Avant de plonger dans les tests, j’ai commencé par créer un plan de test pour avoir un plan clair de la façon dont les tests seraient menés. J’ai ensuite recruté des participants et commencé à tester ma conception pour observer comment les utilisateurs interagissent avec elle et identifier comment je pourrais améliorer la conception.

Aperçu des tests d’utilisabilité

Objectifs

    1. Tester si les utilisateurs peuvent facilement effectuer les tâches
    2. Observez les différents chemins empruntés par les utilisateurs pour effectuer les mêmes tâches
    3. Évaluer les domaines d’amélioration pour les futures itérations de la conception

Participants

    • 6 participants
    • Entre 15 et 30 ans
    • Avoir déjà joué au basketball avant

Carte d’affinité

Afin d’analyser les observations faites lors des tests d’utilisabilité, j’ai utilisé une carte d’affinité avec toutes les observations que j’avais faites. Cela m’a permis de découvrir des tendances à travers les expériences des différents participants et d’identifier les améliorations à apporter au prototype. J’ai d’abord regroupé les notes autocollantes de chaque participant pour avoir un aperçu de toutes les observations faites lors des tests. Ensuite, je les ai regroupés selon des modèles communs que j’ai remarqués parmi les participants pour tirer des idées des informations que j’ai recueillies.
Tendances clés
    Connaissances
     
    Recommandations Design
     

    Révisions prioritaires

    En utilisant ce que j’ai appris des tests d’utilisabilité, j’ai révisé ma conception et créé le prototype final.

    (Avant)

    (Après)

    Voir Prototype Final

    Réflexions
    & Prochaines Etapes

    Ce projet m’a aidé à comprendre le rôle essentiel que jouent la recherche et les tests dans la création d’un produit qui fournit une solution non seulement à ce que les utilisateurs pensent vouloir, mais à quelque chose dont l’utilisateur a vraiment besoin. Si je devais pousser ce projet plus loin, voici les prochaines étapes que je prendrais:

    1. RE-TESTER LES MODIFICATIONS

    Bien que j’ai apporté des modifications de conception en fonction des informations tirées de ma carte d’affinité, je voudrais valider que ces améliorations sont en effet des améliorations de la conception globale.

    2. TRANSFERT DU DESIGN

    Une fois la version finale de la conception terminée, je la transmettrais aux développeurs ou à d’autres parties prenantes pour commencer à créer le produit.

    3. LANCEMENT DU PRODUIT

    Enfin, une fois le produit créé, nous lancerions le produit final sur les plateformes adaptées : l’application Mon Playground.