Popcorns

Popcorns est une application développée par le site SensCritique, une plateforme communautaire de partages et de découvertes d'œuvres culturelles, particulièrement axée film et série.

L’application se positionne pour répondre à la problématique de l’hyper offre des plateformes de SVOD (Netflix, Amazone Prime Video, OCS…). En s'appuyant sur l’expertise du site SensCritique, popcorns filtre les catalogues de ces plateformes et fait ainsi des recommandations de films et séries sous forme de sélections.

Parmi les projets menés pour SensCritique, le défi popcorns était multiple. Il a fallu en quelques mois concevoir et dessiner l’interface utilisateur, mettre en place un design system afin de faciliter la mise en œuvre par les développeurs et assurer une certaine homogénéité, définir une image de marque qui se distingue de SensCritique, et enfin, décliner cette dernière en plusieurs formats de communication.

Concept

Guillaume Boutin, gérant de SensCritique, lance un concept de départ : popcorns, une application cherchant à répondre à la question “Qu’est-ce que je regarde ce soir ?”.

En partant d’un catalogue de plateforme SVOD, type Netflix, popcorns recommande un nombre réduit d'œuvres reconnues (selon SensCritique).

Autre élément distinctif, l’application tente de qualifier un titre autrement qu’à travers une note. L’objectif est d’apporter un commentaire qualitatif, un “label”, définissant au mieux chaque œuvre.

Architecture
de l’information & Navigation

Au regard de ce concept, l’application s’inscrit dans une temporalité courte, l’utilisateur doit passer le moins de temps possible sur l’application... le postulat fut le suivant :

Au lancement de popcorns, on doit pouvoir accéder immédiatement à des propositions, le choix est donc de rentrer directement dans une sélection. Au sein de celle-ci, le nombre de titres proposé est volontairement restreint, chaque suggestion a son importance. Le parti pris est donc de s’émanciper de ce qui se fait traditionnellement dans ce type de solution en demandant à l'utilisateur de traiter les éléments un à un.

Navigation dans une sélection - S’il souhaite avoir plus d’informations concernant un titre, l’utilisateur peut se déplacer de haut en bas au sein de la page.

Le passage d’une sélection à une autre se fait via un menu de navigation positionné en haut de l’écran, l'emplacement du bas étant occupé par les boutons d’actions qui ont un impact immédiat sur le contenu en cours d’appréciation. 

Traditionnellement, le menu de navigation permettant de se déplacer dans les sections principales d’une application se trouve en bas. Cela dit, un menu positionné en haut est conventionnel sur le web, ce n’est donc pas une rupture d’usage.

Architecture de l’information

Dans un second temps, l’application permet d’accéder aux rubriques suivantes :

Une page de recherche, lorsque l’on souhaite atteindre un titre en particulier.

Une page de paramètres (profil) qui concerne la modification des préférences : sélection des plateformes, préférence pour la catégorie film et/ou série, ainsi que la gestion du compte.

Affordances

4 boutons pour 4 actions, dans l’ordre de présentation : check, reject, wish, play. Un appui long sur le bouton chek permet d'attribuer une note au titre.

Le site SensCritique, par sa dimension outil, offre un certain nombre de possibilités d’actions qui sont à la base de son fonctionnement. On a par exemple la possibilité de noter une œuvre, de l’ajouter à une liste, de rédiger une critique, ou encore d’ajouter le titre aux “envies”, c’est-à-dire une liste dans laquelle nous retrouvons les titres qui ont piqué notre curiosité.

D’une part parce que popcorns s’inscrit dans l'écosystème de SensCritique, et d’autre part pour permettre d’améliorer ses recommandations d'œuvres, on retrouve dans l'application certaines de ces actions. Cette fois-ci exclusif à popcorns, il est également possible de lancer directement le titre sur son mobile.

Les labels,
une approche qualitative

Le problème de la note réside dans son échelle de valeurs qui est à priori inconnue du nouvel utilisateur. Une œuvre notée 7/10 sur SensCritique n’a pas la même signification que sur un site comme Allociné par exemple.

C’est pour cette raison que les “Labels” font leur apparition dans popcorns. En s’appuyant sur les caractéristiques d’un titre (date de parution, genre, réalisateur(s), casting...), on le positionne par rapport à d’autres œuvres similaires. De cette façon, en plus de suggérer des œuvres pertinentes car globalement appréciées, l’application cherche à expliquer en quoi elles se distinguent. Voici les labels, par ordre d'apparition :

1

Bloc principal, contenant le meilleur label, la plus forte distinction que l’on peut donner à un titre.

2

Bloc secondaire, ce sont les labels communs, leur nombre est compris entre 0 et 3.

3

Le bloc tertiaire contient le reste des informations. Ce ne sont pas des labels à proprement parler, bien qu’ils soient appelés labels bruts.

Affiche les caractéristiques nationalité et genre si elles n'ont pas été utilisées pour les blocs 1 et 2.

4

Le quatrième bloc est exclusif aux casting et on y retrouve les labels correspondant.

Design
& Conception de marque

En mettant l’accent sur la présentation des œuvres avec un affichage plein écran, le premier parti pris graphique dans la conception de l’interface est de mettre l’accent sur l’image.

Les recherches graphiques ont donc abouti à la conception d’une interface sombre (dark mode). Ce type d’interface a l’avantage de magnifier les couleurs, souvent très présentes sur les affiches de films. Par ailleurs, un thème sombre fait écho à l’univers cinématographique.

Un autre parti pris fort est de positionner le meilleur label avant le titre du film, les labels étant au cœur de l’application. L’idée est de qualifier une oeuvre avant tout par ce qui la caractérise.

La note SensCritique est mise en retrait, au même niveau de hiérarchie que les autres métadonnées (durée, date de parution).

Le travail graphique de la designeuse Na Kim est une source d’inspiration sur la façon dont un fond sombre fait vibrer les couleurs.

SET (revised edition) Na Kim, Roma Publication

À ce stade, l’application commence à se rapprocher de sa forme Bêta : La hiérarchie de l’information et le rendu graphique des labels sont équilibrés. Le menu de navigation est revu et les boutons d’actions possèdent une forme qui limite leur impact visuel sur l’interface.

En parallèle de ces réflexions graphiques, la conception du logo fut externalisée à partir des recherches ci-dessous :

Parmi les propositions effectuées, celle retenue prend la forme d’un pop-corn pourvu de jambes pour signifier la vitesse : “Trouvez rapidement votre film ou votre série”. Le logo est efficace, il apporte une touche chaleureuse et ludique, à l’image du nom de la marque. Sa forme sert de gimmick visuel pour accompagner le bouton play et de support pour concevoir les illustrations représentant les filtres par “humeur”.

Filtrer les sélections par "humeur" - Développée dans un second temps, ce sont les tests utilisateurs de la version Alpha qui ont confirmé l'intérêt de cette fonction.

La couleur primaire prend une teinte orangée pour s’adapter à l’arrivée du logo, le système de couleurs de l’application s'affirme à cette occasion.

La représentation du système de couleur de popcorns s’appuit sur les baselines Material color theme de Google.

Supports de communication

La version Bêta étant terminée, une landing page est créée pour accéder aux stores iOS et Android.

Landing page

Stores

Conclusion

Cette première version de l’application a globalement reçu un bon accueil, ce qui est évidemment toujours encourageant.

Aujourd’hui popcorns a pris un autre tournant auquel je n’ai pas pris part. SensCritique souhaite tester d’autres paradigmes de navigation afin d’en comparer l’impact. La version actuelle de l’application propose désormais de choisir parmi plusieurs sélections dès l’accueil, au lieu de plonger directement l’utilisateur dans une seule.

La dernière version de popcorns est disponible ici.

Bon film !

+33 6 21 31 27 37

sim.ernould@gmail.com