Orange

UX / UI & Product Design

Designer l'expérience qui unifie les sites web boutique et portail d'Orange au service de la promesse d'opérateur multi-services.

Client

Orange

Période

2018 - 2022

Compétences

UX/UI Design
Product design
Design thinking

Outils

Axure
Sketch & Zeplin
Usabilla / Get Feedback
Contentsquare
Optimal Workshop

Projet One-i

Devant la nouvelle stratégie et promesse d’Orange de s’imposer comme un opérateur multiservice, le projet de refonte web à été lancé. L’idée est ambitieuse : agréger 2 sites avec des utilisateurs, des usages et des contenus totalement différents en un seul. Le premier site est le portail d’actualité composé essentiellement de contenu éditorial, tirant la plus grande partie de sa monétisation par la publicité; le second site est la boutique d’e-commerce, vendant principalement téléphones et abonnements à ses clients.

Axure construction de page
Atelier ideation
Experience map

Mon rôle chez Orange

En tant qu’UX designer freelance puis en tant que Product Designer salarié, j’ai rejoins la Direction Digitale Grand Public d’Orange fraichement restructurée en organisation produit. Avec la création de différentes features teams s’ordonnançant selon les méthodes SaFe, la DDGP à pour objectif de répondre aux nouvelles ambitions de la marque en matière d’innovation digitale et d’expérience utilisateur.

Dans ce contexte dynamique en pleine évolution, je mets mes compétences au service de projets stratégiques s’articulant autour de 3 features teams : les accueils et vitrines (principales et N-1 du site), les éléments communs (header, footer) et le centre de notification.

En collaboration étroite avec ces équipes pluridisciplinaires, mon rôle consiste à contribuer à la transformation produit au service de la nouvelle stratégie de l’entreprise. Je prends en charge la conception de solutions intuitives, engageantes et adaptées aux besoins des utilisateurs finaux tout en assurant une expérience utilisateur fluide et cohérente à travers les différents services et parcours que l’ont ma confié.

Comprendre

Concevoir

Tester

Identifier les usages et les besoins, concevoir des interfaces segmentés à la croisée des attentes utilisateurs et business.

Mot de passe d'accès au proto : iTrustU

Les raisons du projet

  • Répondre à la stratégie d'opérateur multi-services et apporter une diversification de l'offre aux utilisateurs
  • Restructurer et redesigner le site Orange.fr
  • Factoriser les principaux sites et usages d'orange.fr : le portail d'actualité et le site d'e-commerce.
  • Proposer une expérience unifiée qui réponde aux attentes du grand public, engendrant des revenus publicitaire et marchand.

Mon rôle dans le projet

Accueil du site orange.fr

  • Concevoir la nouvelle vision de la page d’accueil en identifiant les attentes des utilisateurs
  • Analyser les données d’utilisation des sites existants et définir les usages majoritaires
  • Proposer une segmentation de la page d’accueil (web et mobile) par usage : « régulier », « occasionnel » et « prospect »
  • Marketer l’offre d’opérateur multiservice en : affichant des points d’entrée vers les parcours marchand en fonction des contrats détenu par les clients; informant des dernières actualités afin d’assurer du traffic vers les entrées financées par la publicité; proposant différents équipements et services pour mettre le cross-sell à l’honneur
  • Effectuer des recherches sur les utilisateurs (prospects et clients) : tests de prototypes, test quantitatif, test d’intérêt
  • Décliner en version desktop

Tests utilisateurs qualitatif

Exemple de process & méthodo

Dispositif

Afin de tester la pertinence des pages créées, de leur contenu et d’analyser les éventuels problèmes d’ergonomie, j’ai organisé une multitude de tests utilisateurs en 1to1 à partir d’un prototype.

Objectif

Evaluer la compréhension et la pertinence du classement des items du méga-menus ainsi que les entrées vers les pages en profondeur. Tester l’accès vers les vitrines (mobiles et forfaits, TV et divertissements...), l’accès vers les pages en profondeur et les parcours marchands depuis la page d’accueil. Evaluer la compréhension et la perception des vitrines (TV et divertissements et mobiles et forfaits) pour les différents profils / personas.

Mon rôle

  • Créer un prototype haute fidélité
  • Définir les cibles du test et le screener pour le recrutement
  • Réaliser le guide d’entretiens utilisateurs et définir les scénarios de tests
  • Définir une grille d'évaluation et des critères de succès
  • Faire passer les entretiens
  • Analyser les réponses des utilisateurs
  • Proposer des améliorations graphiques et ergonomiques en fonction du retour des tests utilisateurs

Cible

  • Homme / femme, 19 à 63 ans
  • 6 prospects
  • 6 clients Orange "Open" et "TV"
  • 6 clients Orange mobile

Création de personas

Principaux et secondaire

Objectif

Créer des personas représentant les utilisateurs principaux basé sur leurs usages de navigation.

Méthodologie

  • Utilisation de Goggle Analytics pour apporter des réponses chiffrés sur les comportements et sur la démographie.
  • Utilisation de Getfeedback / Usabilla comme outil de collecte de verbatim
  • Création de sondage de satisfaction et analyse des répondants aux sondages de NPS pour en tirer des attentes et freins utilisateur.
  • Entrer en empathie avec les utilisateurs grâce à la connaissance dû aux nombreux tests et interviews utilisateurs passés révélant des anecdotes représentatives et constructives de leurs vies.

Mon rôle dans le projet

Mobiles et forfaits

  • Analyse des parcours marchand existant afin de proposer une structure cohérente en fonction des usages des utilisateurs et des objectifs business d’Orange qui diffèrent en fonction des contrats détenu par les clients
  • Création d’interfaces proposant des points d’entrée en corrélation avec les grandes typologies de contrat clients : le contrat Mobile ou le contrat Open (Internet + Mobile).
  • Création d’une version de la page destinée aux prospects ou aux utilisateurs non connectés afin de les aiguiller sur des parcours d’achats qui leurs son propre.

Exemple d'amélioration continue
Connaissance multicontrats

Certains clients possèdent plusieurs contrats mobile ou internet. Le site Orange ne s’adresse à eux de manière personnalisée que via leur contrat prioritaire : celui avec lequel ils se sont connecté.

D’après les données que j’ai extraites de CS et GA, les clients ont tendance à effectuer des allers-retours entre leur espace client et la page «Mobiles et forfaits ».

De nombreux verbatims sous-entendent que les clients ont du mal à identifier clairement l’intégralité de leur contrat et ne comprennent pas quelles offres leurs sont dédiées.

Wireframe Multicontrat
Maquette Multicontrat
Solution

  • Etudier les points de douleurs, les attentes et les freins sur les parcours existants
  • Proposer de nouvelles features pour les clients en multicontrats.
  • Prioriser et mettre en avant les parcours marchands en fonction de la valeur business et utilisateurs, du risque et de la faisabilité
  • Afficher dans la page les contrats mobile détenus par l'utilisateur et les intentions qui leur sont rattachées.
  • Tester l'appétence des solutions proposée via 2 prototypes se différenciant au niveau des fonctionnement et affichage (12 utilisateurs testés)

Mot de passe d'accès au proto : iTrustU

Prototype desktop

Designer le mega-menu d'Orange.fr

UX research : Tri de cartes

Mon rôle dans le projet

  • Agréger deux mega-menu en un seul
  • Trier et prioriser les liens en fonction des valeurs utilisateurs et business
  • Permettre une navigation total et intuitive au milieu des nombreux liens éligibles au menu
  • Proposer une vision globale des univers de services et de la boutique aux utilisateurs
  • Personnaliser le mega-menu en fonction des abonnements détenu par les clients
  • Organiser et analyser plusieurs tri de cartes pour valider les hypothèses créées

Tri de cartes

Exemple de process & méthodo

Dispositif

Pour réorganiser le menu principal du site internet Orange.fr, j’ai préparé un tri de cartes afin de tester les wording, les catégories, l'importance des items et les liens que les utilisateurs définissent eux- mêmes.

  • 12 sessions individuelles de tri de cartes
  • 8 clients Orange
  • 4 clients de la concurrence

Nature du test

Tri de cartes ouvert. Chaque utilisateur trie un jeu de cartes afin de les organiser dans une arborescence qui leur semble logique. Chaque carte présente le titre d’un contenu, page ou fonction, du site Orange.fr.

Etapes clés

  • Regroupement et priorisation des services en fonction du business et de la valeur utilisateur afin de ne pas noyer les utilisateurs dans un tri de cartes trop difficile, présentant un trop grand nombre de terme.
  • Distribution des 59 cartes et présentation de la consigne. Durée : 5 min
  • Le participant trie, nomme, regroupe (post-it jaunes) et potentiellement regroupe encore (post-it verts). Bilan final. Durée : 55 min
  • Récupération du tri effectué, bref temps d’échanges avec l’équipe projet (sans le participant). Durée : 15 min
  • Analyse en s'appuyant sur l'outil Optimal Workshop

Dendogramme & Matrice de similarité

Maquettes finales après tests utilisateurs

Tests de pertinence et d'utilisabilité

Le centre de notifications

Amélioration continue

Constat

Dans le centre de notifications du site Orange.fr, les utilisateurs qui possèdent plusieurs abonnements sur la même typologie de contrat (exemple deux contrats mobiles ou deux contrats internet) se retrouvent noyés d’informations, avec certaines notifications en double. Les notifications ne sont pas clairement rattachées à un contrat, se fondent dans la masse et perdent en signification. Les utilisateurs rapportent la difficulté à s’y retrouver et à hiérarchiser l’importance des notifications.

Exploration & hypothèses

  • Proposer une amélioration graphique du centre de notifications.
  • Proposer des filtres permettant de trier les notifications.
  • Proposer un regroupement des notifications par typologie de contrats
  • Proposer une différenciation graphique entre les contrats Orange et Sosh.

Évaluation

  • Création de 3 prototypes et de guides d’entretien en corrélation.
  • Nature du test : mi quanti / mi quali.
  • L’utilisateur essaie le prototype du nouveau centre de notifications et répond à des questions fermées. 300 utilisateurs

Mot de passe d'accès aux protos : iTrustU