exemple d'un trajet UX/UI

ZE PLATEFORM

LE BRIEFING

pexels-huy-chien-tran-1756665.jpg

 Concevoir un système permettant de valoriser le travail de nos stagiaires mais aussi de regrouper, structurer et accompagner un groupe de “makers” autour d’un projet digital. Ce service comprendrait une plateforme online permettant des échanges et collaborations entre ces personnes. Les porteurs de projet devront pouvoir, le plus simplement possible, constituer une équipe adaptée aux besoins de leur projet. Les stagiaires et anciens qui le désirent devraient pouvoir, au travers de ce service, mettre facilement leurs compétences en valeur et montrer leurs savoir-faire. Pour créer et soutenir cette dynamique, les Centres de Compétence devraient proposer un soutien, mais aussi des rencontres et challenges (hackathons, défis …) afin de permettre à des équipes de se constituer et de se connaître. La mise en place de ce service fait ussi partie du projet.

LA PRÉPARATION

ÉTAT
DES LIEUX

Étude du marché et analyse concurrentielle des offres existantes en matière de plateformes professionnelles. Mise en relation des caractéristiques des plateformes existantes avec les vécus, besoins et ressentis des utilisateurs interviewés. Il en ressort que la plupart des plateformes existantes ne proposent pas l’aspect collaboratif, mise en relation/à disposition des compétences, mise en place d’équipes de skill sets différents autour d’un projet précis.

pexels-rodnae-productions-5915193.jpg

INTERVIEWS
DE POTENTIELS UTILISATEURS

Interviews réalisés auprès d’anciens stagiaires ayant suivi une ou des formations UX/UI, we design, data ou web développement dans un des centres commanditaires. L’objectif étant d’aller à l’encontre des usagers potentiels, afin d’en dégager des profiles-type, les besoins spécifiques à chaque profil. La synthèse de tous ces éléments permettra la création des personas utilisateurs.

L'EXPLORATION

PERSONAS
 

Grâce aux interviews précédemment réalisées, nous avons été en mesure de créer cinq personas : le BEGINNER, l’EXPERT, le PORTEUR DE PROJET, le COACH et le PEOPLE. Les trois premiers constitueront l’axe autour duquel la plateforme s’articulera.

JULIE, la beginner
JULIE, la beginner

press to zoom
ROBIN, l'expert
ROBIN, l'expert

press to zoom
SARAH, la people
SARAH, la people

press to zoom
JULIE, la beginner
JULIE, la beginner

press to zoom
1/5

BRAIN.....
SSSSTORMING

La création des personas  a permis ensuite de réaliser des séances de brainstorming afin de déterminer, en fonction de chaque profil, les points de contact de l’utilisateur avec la plateforme, ses actions, tangibles, contraintes et ressentis que l’utilisateur rencontrera avant son utilisation de la plateforme, pendant et après.

3 idées clés se sont dégagées:

• mise en avant de projets aboutis

• système de recommandations / testimonials

• coaching / outils / support

IMG_5113.jpeg
20210525_140946.jpg
IMG_5151.jpeg

CONCEPT
ZE PLATEFORM

Sur la landing page, des highlights seront affichés, dont les projets aboutis, par les teams créés sur la plate-forme. En accédant à la fiche descriptive du projet, on y trouvera les personnes ayant travaillé à l’aboutissement du projet, dont le/les porteurs de projet, le client, etc. Également présents sur cette fiche-projet, des recommandations/ testimonials sur les différents intervenants du projet, introduits par les intervenants, ou recuillis auprès de sources extérieures au projet. Ces recommandations/testimonials peuvent couvrir des hard skills ou soft skills. Toutefois, à l’instar d’une lettre de recommandation, ces commentaires/testimonials devront prendre une forme positive.En outre,la fiche projet pourra renseigner les différents outils, aides, stories, accompagnements et formations qui ont pu aider à l’aboutissement du projet. Cette fiche donnera accès également à la fiche profil personnelle, sur laquelle on pourra retrouver, outre les recommandations/ testimonials internes, le parcours, expériences et autre infos pertinentes.

PARCOURS
DES VOYAGEURS

Un sketching de ces interactions a permis de synthétiser et recentrer le parcours utilisateur, en mettant en évidence les fonctionnalités les plus importantes de la plateforme.

LE POINT DE DÉPART : Les beginners en formation

AVANT: Pas d'expérience, il doit se former.

PENDANT : Il se forme et partage par la même ocasion ses compétences et son projet. 

APRÈS : Il devient expert, puis pourquoi pas porteur de projet ou coach.

To play, press and hold the enter key. To stop, release the enter key.

press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom
press to zoom

LA NAVIGATION

STRUCTURE
ET ARCHITECTURE DE L'INFORMATION

Suite au parcours défini, une première modélisation a été effectuée. Elle consiste à reprendre les infos-clés que l'on souhaite présenter sur le site et à transposer les écrans en contenu en fonction de leur priorité.

Structure 1-80.jpg
Structure 2-80.jpg

WIREFRAME
ET PROTOTYPAGE

Passons maintenant à la conception des pages proprement dites. Toujours en fonction de la phase précédente. Un test sera réalisé avec le premier prototype et le proto sera revu en fonction des retours des utilisateurs.

ACCEUIL UX-80.jpg
COMMUNAUT2 UX-80.jpg
PROJET UX-80.jpg

TESTS
UTILISATEURS

Des tests, des re-tests et des re-re-tests.

Un ballet régulier et continu des premiers prétotype jusqu’à la livraison du produit fini au client (et souvent encore après). Pour progresser, voire les erreurs et améliorer le tout, rien de tel qu'une vision externe. Sans cette panoplie d'utilisateurs à disposition, il serait bien difficile de prendre du recul. Quand un problème est soulevé, il faut prendre le temps de s'y pencher et de trouver la meilleure réponse possible. Celle-ci passe parfois par une remise en question complète. Dans certains cas, une modification minime permettra d'apporter une solution.

Un minimum de testeurs est requis pour aborder la prochaine phase de modifications. De préférence en présentiel et pourquoi pas en employant des technologies d'eye-tracking ou autres quand c'est possible.

pexels-ekaterina-bolovtsova-5393491.jpg

LA VISION

(N)

MOO(N)DBOARD

Le nom est tout trouvé. Ce sera Ze Plateform, la plateforme qui te permettra d’atteindre la lune.

Ce sera avant tout professionnel, c'est ce qu'on lui demande. Cela se traduira par un design pur et clair. Une hiérarchisation des éléments sera nécessaire pour l’aspect technologique.

Le côté cool et facile sera ajouté par une approche "simple" (et non simpliste) des contenus.

Nous travaillerons sur l'association des photos et des éléments pour créer cet aspect e complémentarité.

Une touche de non conformité et de fun sera apporté par l'ajout de flêches, de traits et de légères illustrations

Côté couleurs, le première idée était de travailler avec celles que l'on retrouvait dans la majorité des logos des centres de compétences. Mais finalement...

Moodboard.jpg

LOGO
ET MINI CHARTE

La couleur a changé, on est partie sur quelque chose de plus pétillant et de plus moderne. On s'affranchit des centres de compétences pour s'ancrer dans le numérique grâce au logo rappelant les icônes d'app.

La typo reste ronde, simple et accessible grâce au choix de la Poppins avec de "O" ronds comme notre objectif, la lune.

IMPLANTATION

Un logo, un moodboard, un wireframe et une volonté. Il s'agit maintenant de construire et d'implanter la partie graphique. Ce sera chose faite en travaillant de concert tant sur les parties desktop que mobile. Il y aura encore de nombreux ajustements et modifications, tant au niveau parcours que ergonomie.

ACCEUIL UI-80.jpg
COMMUNAUT2 UI-80.jpg
PROJET UI-80.jpg

LE DÉBARQUEMENT

CE N'EST QUE LE DÉBUT DE L'AVENTURE...