Pour concevoir sa propre plateforme vidéo l’UX et l’UI deviennent des incontournables pour assurer la pérennité de son interface.
Dans cet article vous trouverez une étude de cas qui compare les stratégies UX et UI de Netflix et Amazon prime video. Mais aussi les explications clarifiées des deux termes, leurs différences et les complémentarités. En bref, les rouages de l’UX et UI appliqués à un service VOD.
L’UX et UI design
L’UX Design se réfère au terme expérience utilisateur, et l’UI Design à l’interface utilisateur. Les deux éléments sont essentiels à la création d’un produit et travaillent en étroite collaboration ; mais leurs rôles sont distincts, se référant à des éléments différents du processus et de la discipline de conception. L’UX Design est un domaine plus analytique et technique, l’UI Design est plus proche de ce que nous appelons la conception graphique, bien que les responsabilités soient un peu plus complexes.
UX / UI : concrètement, ça marche comment ?
L’UX intervient en amont de l’UI et du développement même de l’application. Voici un schéma expliquant leurs rôles par différents métiers :
@crédit : Esokia
L’UX designer commence donc à travailler bien avant le reste de l’équipe. 5 étapes doivent être respectées :
Définition d’une stratégie : c’est là que débute la réflexion sur les utilisateurs, ce qu’ils recherchent, pourquoi ils se rendent sur votre site ou votre application.
Liste des besoins : et surtout définition de ce qu’il est possible de faire ou non.
Définition de la structure : on prépare les plans et on essaie de se mettre à la place de l’utilisateur.
Création des premiers schémas : c’est ici que le dessin des wireframes intervient en esquisse.
Création du visuel : c’est à ce moment-là que l’UI designer commence son travail pour harmoniser les décisions prises par l’UX designer avec un côté plus technologique que son partenaire.
Bien que parfois confondue, la répartition des tâches entre UX designer et UI designer est relativement nette. L’UI doit toutefois tenir compte de certains aspects de l’UX dans son travail :
@crédit : Esokia
UX et UI sont donc des concepts interconnectés qui doivent être inclus dans le processus de création des agences web notamment.
Etude de cas Netflix vs Amazon Prime video
Pre Play
- Landing pages
Les landing pages de Netflix et Amazon Prime vidéo sont similaires, on voit le catalogue vidéo en arrière-plan et les deux géants proposent un essai gratuit de 30 jours.
- Forfait
Après la période d’essai Netflix propose 3 forfaits mensuels différents, alors que son concurrent Amazon prime video après les 30 jours d’essai, valider automatiquement l'abonnement, au tarif de 49,00 EUR par an.
- Processus d’achat
Le but de cette partie est d’effectuer un comparatif entre le parcours d’achat sur Netflix et sur Amazon de façon distincte.
Chez Netflix
Lorsqu’on n’est pas un utilisateur enregistré sur Netflix, on tombe sur la page ci-dessus. Cette page est assez épurée, il n’y a rien d’autre que les informations concernant la période d’essai gratuit de 30 jours. En effet, la page explique qu’il y a une période gratuite de 30 jours durant laquelle l’abonné aura accès à tout le contenu Netflix. On y trouve aussi une frise chronologique représentant l’échéancier des paiements à venir si l’utilisateur décide de rester sur la plateforme, en insistant sur le rappel de la fin de la période d’essai 3 jours avant que celle-ci ne soit effective.
Hormis, cela, Netflix a opté pour un fond noir et un jeu de couleurs et de polices qui dirige l’œil vers l’essentiel.
Pour commencer la période d’essai, Netflix a configuré un bouton rouge qui dirigera l’intéressé vers les différentes étapes du processus d’achat.
Etape 1 : Choix du forfait
Une fois que vous avez cliqué sur le bouton « Essayez gratuitement pendant 30 jours », vous êtes redirigé vers l’étape 1 du processus d’achat. Celle du choix du forfait. Elle se déroule sur deux pages : la première page vise à rassurer le lead au sujet de la période d’essai qui est totalement gratuite et aussi sur le fait que le lead peut décider de se désabonner à tout moment pendant cette période. Toujours très épurée celle-ci n’affiche que les informations importantes. On y trouve encore un gros bouton rouge « Voir les forfaits » qui nous dirige vers la seconde page de la première étape.
La seconde page présente les différents forfaits et les différentes options auxquelles vous avez accès.
Netflix en propose 3 : Essentiel, Standard et Premium qui sont des offres qui donnent accès à différentes fonctionnalités.
Tous les forfaits donnent accès à des fonctionnalités basiques; à savoir: accessibilité sur tous les appareils, Films et séries en illimité, annulation de l’abonnement à tout moment, gratuité du premier mois.
En revanche, en fonction du forfait choisi, l’utilisateur va avoir des restrictions. Pour le forfait Essentiel l’abonné a uniquement droit à un écran en simultané, deux pour le Standard, et 4 pour le Premium. En ce qui concerne les visionnages en HD et Ultra HD, il s’agit d’options uniquement accessibles via les forfaits Standard (qui comprend la HD uniquement) et Premium (HD et Ultra HD comprises).
Une fois le forfait choisi, vous pouvez cliquer sur « Continuer » en rouge pour aller à l’étape suivante.
Etape 2 : Création de compte
Après avoir choisi le forfait qui lui convient, l’utilisateur est alors redirigé vers une page de création de compte : c’est la deuxième étape. Cette étape se fait également sur deux pages, la première visant à expliquer les raisons pour créer son compte Netflix (personnalisation et accessibilité permanente à son compte), la deuxième étant plus concrète et visant à renseigner les informations qui vont permettre à l’utilisateur de créer son compte (E-mail, mot de passe, autorisation d’envoi de notifications.
Etape 3 : Paiement
Une fois le compte d’utilisateur créé, l’étape finale est de définir son mode de paiement. Netflix propose deux types de paiement comme la majorité des acteurs de la toile ; à savoir par carte bancaire ou par PayPal. Ajouté à cela, l’utilisateur peut aussi bénéficier d’un code cadeau de la part d’un proche qui pourra lui donner accès à tous les contenus de la plateforme, code qu’il peut renseigner comme mode de paiement pour la plateforme.
En ce qui concerne le processus d’achat sur Netflix, le site a parié sur une stratégie UX/UI qui repose sur ces différents points : l’efficacité, la simplicité, la crédibilité.
Ces trois points ont une grande importance dans le processus d’achat car, ils permettent à l’utilisateur d’être rassuré au sujet de son achat, d’aller rapidement droit au but sans aucune complication ou ambiguïté.
Chez Amazon Prime
Le processus de paiement est pratiquement le même. L’une des grandes différences se trouve au niveau de l’UI design de la page d’accueil qui met en évidence le contenu de la plateforme de streaming en fond. L’autre différence se trouve au niveau de l’UX. Prime video, au lieu des forfaits mensuels de Netflix, propose un paiement annuel de 49 euros qui donne accès non seulement aux films de Prime mais aussi à d’autres avantage sur Amazon en général.
Etape 1 : Page d’accueil
Lorsqu’il va sur Prime, l’utilisateur tombe sur la page d’accueil et a deux options : il peut se connecter s’il a déjà un compte ou commencer l’essai gratuit. Ces deux choix sont mis en évidence grâce à deux gros boutons bleus. L’utilisateur peut également entrevoir les films et séries que propose la plateforme dans le but d’éveiller la curiosité et d’appeler à l’action.
Etape 2 : Création de compte
Contrairement à Netflix, le processus de création de compte est plus long chez Amazon : premièrement, on a deux champs en plus à remplir (nom et confirmation de mot de passe) en ce qui concerne la première page de cette étape. Ensuite, lorsque les informations sont renseignées Amazon va demander à les vérifier en envoyant un code à l’adresse mail de l’utilisateur ; ce qui validera la création du compte Prime.
Etape 3 : Paiement
Dès que l’utilisateur valide son adresse e-mail, l’étape finale est de définir son mode de paiement. A l’inverse de Netflix, Amazon ne propose qu’un type de paiement, par carte bancaire pour son forfait annuel de 49 euros. Il n’est donc pas possible d’utiliser son compte Paypal.
- Processus d’identification
Le processus d’identification du nouvel utilisateur est très similaire sur les deux sites. Les deux players demandent les mêmes informations pour s’identifier (mail ou numéro de téléphone, mot de passe) et offrent à l’utilisateur la possibilité d’enregistrer ses informations pour ne pas avoir à les renseigner à chaque fois qu’il veut se connecter.
- Home pages
Les home pages sont assez similaires dans leur construction avec les catégories en haut à gauche, la section recherche en haut à droite permet d’effectuer une recherche de produits dans le catalogue, mais aussi un grand slider pour annoncer les nouveautés et le catalogue vidéo déroulant par section vers le bas.
La seule grande différence est la taille du slider, plus grand chez Netflix mais avec une seule proposition de contenu, alors que celui de son concurrent Amazon Prime vidéo est plus petit mais défilant donc une pluralité de propositions de nouveaux contenus.
- Catégories
Les deux géants de la SVOD ont misé sur la même stratégie en ce qui concerne leurs catégories. Le catalogue est répertorié avant tout en séries et films. Netflix propose également dans son header une classification par genre comme ci-dessous.
Au-delà de ces catégories classiques Netflix et Amazon Prime video possèdent respectivement des catégories tierces de types favoris et/ou recommandations pour l’utilisateur.
- Présentation des fiches de vidéo
En ce qui concerne la présentation des fiches de vidéos, on retrouve à la fois chez Netflix et Prime video une brève description du film ou de la série, le genre, le bouton play et reprise de lecture et aussi un bouton qui permet d’ajouter le contenu à sa liste de favoris. Les métadonnées sont pratiquement disposées de la même façon (titre en haut à gauche de l’image, puis la description et le reste également à gauche).
Par contre il existe bien quelques différences à ce niveau. Par exemple, lorsqu’on clique sur le contenu qui nous intéresse sur Amazon prime video, on tombe sur une page totalement dédiée au contenu qui nous intéresse. Aussi, dans la présentation de la vidéo, Amazon rajoute la liste des acteurs principaux, des langues audio et sous-titres; ce qui n’est pas le cas pour Netflix.
Du côté de Netflix, la première différence qui apparaît lorsqu’on clique sur la vidéo est qu’elle s’agrandit et on a accès à la fiche de présentation encadrée des autres vidéos de la page d’accueil. Dans cette présentation on y trouve une bande annonce qui démarre aussitôt la vidéo agrandie et également le nom du réalisateur. Y figure aussi un bouton pour accéder aux titres similaires à celui de la vidéo sur laquelle vous avez cliqué.
- La lecture vidéo
Sur la plateforme de streaming Netflix, la vidéo se lance dès que l’utilisateur effectue son clic. Cependant, son concurrent Amazon Prime Video utilise souvent cette opportunité pour promouvoir des titres originaux en affichant des clips ou des bandes-annonces avant que la plateforme ne commence à jouer le titre souhaité.
Bien que certains utilisateurs apprécient le fait que Prime Video aide les utilisateurs à découvrir son contenu, certains utilisateurs n'aiment pas être obligés de regarder en premier lieu une bande-annonce, les utilisateurs veulent être tout de suite plongés dans leur film et non dans des bandes-annonces promotionnelles ou commerciales.
Netflix avait récemment commencé à tester des vidéos promotionnelles entre les épisodes d'une saison et a reçu des réactions très négatives des utilisateurs. Globalement les utilisateurs n’ont pas apprécié cette expérience :
Sources : The New York Time
- La disposition des contrôles de l'interface utilisateur
Prime Video a présente les commandes de l'interface utilisateur aux coins et au centre de l'écran : la lecture / la pause et l'avance / le recul par 10 secondes se situent au centre et les autres commandes utilisent les quatre coins de l'écran.
Au contraire, que Netflix affiche toutes les commandes de l'interface utilisateur (à l'exception du bouton de retour en haut à gauche) en bas de l'écran.
Selon Medium magazine une majorité d'utilisateurs apprécient davantage la disposition de Prime Video, principalement parce qu'elle donne la priorité aux commandes les plus utilisées au centre, dont la taille est également beaucoup plus importante. La disposition de Netflix introduit un certain niveau de charge du moteur lors de l’utilisation des commandes.
- Contrôles d'interface utilisateurs supplémentaires
La plupart des commandes de l'interface de lecture sont identiques pour les deux services (lecture et pause, saut ou retour en arrière de 10 secondes, contrôle du volume, plein écran, épisode suivant, sous-titres et audio), à l'exception de quelques-uns.
Prime Video a développé une fonctionnalité appelée Rayons X en haut à gauche de l'écran qui numérise les vidéos et fournit des informations sur la diffusion et la musique jouée et permet de passer directement à une scène spécifique. Cette fonctionnalité est très appréciée des utilisateurs car elle est utile parfois lorsqu’on veut connaître le nom du personnage intéressant.
Netflix, en revanche, permet de basculer entre les saisons et les épisodes du titre dans l'interface de lecture. Cette fonctionnalité n’est pas disponible sur Prime Video. Il faut sortir de l'interface utilisateur de Playback et parcourir la page de titre pour basculer entre les saisons ou les épisodes...
Netflix permet également à l'utilisateur de faire des commentaires en cas de problème avec la vidéo, ce qui facilite l'exploration et l'amélioration du service. On ne peut pas donner de tels commentaires sur Prime Video.
- Binging sur Netflix
Netflix a quelques fonctionnalités supplémentaires dans l'interface utilisateur de lecture qui séduisent les utilisateurs.
La possibilité de sauter l’introduction et les crédits au début de chaque vidéo est un gain de temps (et de bande passante pour Netflix) considérable et renforce encore davantage le cercle vertueux de la boucle d’engagement. L'épisode suivant commence à jouer automatiquement après 15 secondes.
- Traduction et audio en plusieurs langues
Prime Video pour rivaliser avec Netflix, doit développer son UX. La plupart du contenu ne comporte que des sous-titres anglais et l'audio est uniquement dans la langue originelle, alors que Netflix propose à la fois des sous-titres et de l’audio dans plusieurs langues pour la majorité de leur bibliothèque de contenus.
Post Play
Lorsque l’utilisateur regarde un film ou le dernier épisode de la dernière saison sur Prime Video, une recommandation de vidéo apparaît en bas à droite. Il est difficile de savoir de quoi parle le titre et pourquoi cette vidéo a été recommandée en premier lieu.
En comparaison, sur Netflix les crédits ne prennent qu'une petite partie de l'écran avec des commandes pour aimer ou non la vidéo. Le reste de l’écran est utilisé pour suggérer le titre suivant à regarder avec une description et quelques mots sur les raisons pour laquelle l’utilisateur apprécierait ce contenu.
L'expérience semble plus intéressante post-lecture sur Netflix que sur Prime Video, car elle donne la priorité aux informations les plus importantes pour l'utilisateur et facilite l'engagement.
En conclusion, globalement les utilisateurs préfèrent l'expérience utilisateur (UX) de Netflix et l'interface utilisateur (UI) d'Amazon Prime Video.
- Devices
L’interface change selon les appareils (web, TV et applications mobile), en effet l’interface va être adaptée du fait de sa différence d’utilisation. Par exemple, l’utilisation sera différente sur l'ordinateur avec une souris, sur la TV avec une télécommande ou encore sur un mobile avec une navigation tactile. L’interface utilisateur est donc adaptée à chaque type d’utilisateur.
- Méthode de paiement
Le paiement sur ce type de plateforme se fait généralement par carte de crédit ou de débit.
Les numéros de cartes ainsi que les coordonnées bancaires sont retenus au moment de l'inscription.
- L’espace personnel utilisateur
Concernant l’espace utilisateur, on peut remarquer plusieurs différences chez les deux plateformes.
La première est que Netflix permet de créer différents profils d’utilisateurs sur un même compte. Ces différents profils peuvent être configurés différemment et Netflix peut adapter le contenu qu’il va proposer en fonction de ses réglages et préférences. Par exemple, on peut déterminer la langue du site et adapter le contenu à l’âge de celui à qui appartient le profil; c’est ainsi que Netflix pourra proposer du contenu jeunesse à des enfants et de tout âge pour ceux qui n’ont pas fixé de limite d’âge. Chez Amazon l’espace personnel est plus basique, un compte unique dont on peut profiter seul, le contenu pour enfant quant à lui est un onglet que propose le site.
UX de Netfilx met en avant le partage et a donc disposé son site pour que cela soit rendu possible.
Lorsqu’on entre dans les comptes et paramètres, on peut constater que l’affichage des onglets principaux n’est pas le même chez les deux leaders de la VOD. Chez Netflix, on doit scroller vers le bas pour accéder aux onglets alors que sur Prime les onglets sont tous alignés ; ce qui facilite la navigation chez la plateforme streaming d’Amazon. Alors que Netflix organise l’espace utilisateur en 4 parties différentes, l’espace utilisateur de Prime repose sur 8 onglets différents. Néanmoins, on retrouve les mêmes éléments de part et d’autre.
Chez Netflix
Abonnement et facturation : ici l’abonné peut retrouver toutes les informations liées à ses identifiants et son abonnement tout en ayant la possibilité de les modifier s’il le souhaite. Il peut également gérer ses informations de paiement et les modifier si jamais elles ne sont plus d’actualité et accéder à ses factures en ligne à tout moment
Détails du forfait : dans cet onglet, l’abonné a accès aux informations liées à son forfait. Il peut aussi le modifier pour passer sur une offre supérieure ou inférieure en fonction de ses envies.
Paramètres : dans cet onglet Netflix permet aux utilisateurs de paramétrer plusieurs choses. Ils peuvent activer un contrôle parental pour empêcher le visionnage de contenu inapproprié.
Les abonnés peuvent de même choisir de participer ou non à des tests de nouvelles options ou features que la plateforme veut mettre en place. Ce faisant les abonnés se sentent davantage impliqués dans le développement de la plateforme qu’ils utilisent.
Par ailleurs, les utilisateurs peuvent gérer les appareils connectés avec leur compte Netflix en les activant ou en les désactivant à distance s’ils constatent une utilisation abusive de leur compte. Ils peuvent aussi retracer toute l’activité de streaming sur le compte, tout utilisateur confondu et donc savoir dans quelle ville un appareil s’est connecté, etc.
Mon profil : à cet endroit, les abonnés peuvent gérer les paramètres liés à la communication. En effet, ils peuvent choisir à la fois le canal par lequel ils souhaitent que Netflix leur communique certaines informations (e-mail, messages, pop-up) relatives aux offres et nouveautés, tout comme ils peuvent gérer l’utilisation de leurs données en précisant s’ils souhaitent que celles-ci soient exploitées à des fins commerciales ou non.
Ils peuvent aussi retrouver l’historique des visionnages et retrouver des titres que les autres utilisateurs et eux-mêmes ont vu depuis l’ouverture du compte. Il est aussi possible de paramétrer l’affichage des sous-titres en modifiant la police de caractère, la couleur etc.
Netflix permet en fait une autogestion des compte, favorisant ainsi autonomie et contrôle des utilisateurs.
Chez Amazon Prime video
Chez Amazon on retrouve les mêmes onglets que chez Netflix. Le plus d’Amazon est l’onglet « Chaînes » qui regroupe quelques chaînes de TV en streaming. L’utilisateur a donc la possibilité de retrouver du contenu de chaînes sur la plateforme, ce qui n’est pas le cas chez Netflix.
Pour conclure sur cette étude de cas, les deux géants de l’OTT ont chacun de leur part des bons points et des points à améliorer pour davantage satisfaire les utilisateurs et faciliter la navigation sur leurs plateformes. Chez Netflix on comprend que l’amélioration est à faire au niveau de son UI design comme la disposition des contrôles de l'interface utilisateur ou encore plus de contenu dans le slider. Chez Prime Video en revanche, l’amélioration serait plus au niveau de l’UX design comme une meilleur présentation post play, la possibilité de laisser des feedbacks ou la suppression de publicité en début de visionnage.
Si vous souhaitez créer une plateforme vidéo à votre image et répondant aux standards de l’UX et de l’UI design, contactez Kinow !