Netflix Redesign, une leçon de design UI raffiné - Podcast

Redesign de l'application mobile Netflix

Dans cet épisode de Parlons Design, Romain Vaginat parle du redesign de l'application mobile Netflix qui a été dévoilé en janvier 2023. Il explique comment cette mise à jour a permis à Netflix de remonter la perception de qualité renvoyée par la plateforme.

Restée hyper user friendly

• La mise à jour est restée hyper user friendly.

• La navigation et la structure de contenu n'ont pas changé sur la page d'accueil.

• Les mêmes boutons sont présents aux mêmes endroits, ce qui évite que les utilisateurs soient perdus ou perturbés par le changement.

• Les petits changements ont été peaufinés avec des animations qui contextualisent ces derniers.

Un choix fort d'identité

• Le redesign n'est pas juste un MVP (Minimum Viable Product), c'est vraiment un choix fort d'identité.

• C'est une mise à jour bien finie jusqu'au bout qui apporte un raffinement déployé en masse du jour au lendemain.

• Cette mise à jour brute classique traditionnelle a été approuvée et poussée par Netflix avec une vraie décision stratégique.

Une réussite globale

• À première vue, le redesign semble avoir été très réussi et très bien accueilli par le public pour des raisons multiples.

• Le but était probablement de remonter la perception de qualité renvoyée par Netflix.

• Cette mise à jour est une véritable leçon de design qui vient replacer l'image de marque dans le haut du panier.

• Netflix a réussi à garder la même expérience utilisateur tout en apportant des changements significatifs.

Les transitions de Netflix

Cette section décrit les changements dans l'interface utilisateur de Netflix, en se concentrant sur les transitions. Trois transitions principales sont présentées.

Ouverture et fermeture d'une fiche de film

• Lorsqu'on clique sur une affiche de film, l'animation est extrêmement bien travaillée.

• La fiche va partir un petit peu en profondeur comme si on appuyait dessus.

• La carte gardera le coin radio de la fiche présentée au début pour maintenir la consistance du fait que c'est cette affiche qui a été zoomée.

• Dans la transition d'ouverture, il y a un jeu de flou pour créer une transition agréable visuellement entre les deux états.

Fermeture d'une carte

• On peut tirer glisser notre doigt vers le bas pour refermer la carte et on a vraiment l'animation de refermeture qui suit le doigt au fur et à mesure de la progression.

Filtrage des films et séries

• Les filtres ont été perfectionnés avec des animations légères pour renforcer ce sens physique des différents tags qui sont côte à côte.

• Il y a également du feedback à petit donc le téléphone va taper un petit peu une fois qu'on sélectionne le filtre ce qui permet déjà d'être sûr que ça ait bien été sélectionné.

Navigation entre les tables

• Quand on va cliquer d'une table à l'autre, l'ancienne Tab va slider sur le côté et la nouvelle qui va revenir de l'autre côté avec une très légère animation en animation hyper forcée où ça traverse tous l'écran.

• Il y a également un petit feedback à petit pour être sûr qu'on a bien sélectionné la bonne table et que ça a été pris en compte rapidement.

Conclusion

• Cette mise à jour est intéressante d'un point de vue design car elle montre que l'animation est importante pour renforcer la qualité perçue de l'application.

La sélection du profil sur Netflix

Dans cette section, l'orateur parle de la sélection du profil sur Netflix et comment cela a été utilisé pour transmettre une image de marque plus raffinée et plus concrète.

Animation de la photo de profil

• Lorsque vous entrez dans l'application Netflix, vous pouvez sélectionner un profil qui peut être par exemple les différents membres de votre famille.

• Il y a un mouvement ample de déplacement de cette photo de profil qui va partir du milieu de l'écran pour aller dans le coin en haut à droite. Il va faire un espèce d'arc de cercle pour s'y retrouver en mouvement complètement étonnant.

• Cette animation est réutilisée dans toutes les transitions intégrant la photo de profil quand on va naviguer entre les différents profils.

• Ce choix fort permet à Netflix de transmettre qu'est-ce que devait représenter Netflix pour les utilisateurs à travers cette bête interaction par laquelle les gens passent plutôt régulièrement.

Les décisions fortes chez Netflix

Dans cette section, l'orateur explique comment Netflix prend des décisions fortes pour se placer sur le marché du streaming en termes d'image de marque.

Vision long terme

• Netflix a été peu frileux et affirmé les décisions pareilles avec une mise à jour coûteuse en dev probablement avec un changement impactant sur le long terme.

• Netflix a décidé de transmettre qu'est-ce que devait représenter Netflix pour les utilisateurs à travers cette bête interaction par laquelle les gens passent plutôt régulièrement.

• Les décisions fortes actées comme ça résul dans des résultats complètement remarquable.

Leçon produit

• Il est important de réussir à trouver la balance entre les actions court terme à impact et les visions long terme porteuse de sens.

• Rajouter ce genre de détails visuels qui vont raffiner le produit peut être des choix qui vont permettre de rendre le produit avec une image beaucoup plus qualitative tout simplement.