Viaccess-Orca, filiale d’Orange, est un fournisseur international de systèmes de contrôle d’accès aux chaînes de télévision payantes.
Depuis 2 ans, leur pôle de Rennes, dont le cœur de métier est la consultation de flux en ligne sécurisés (vidéo, audio, data), travaille sur Virtual Arena, un prototype d’application de réalité virtuelle pour les amateurs de matchs de sport et les fans de concerts.
Après quelques essais et dans un souhait d’homogénéité, d’accessibilité et d’une meilleure expérience utilisateur en contexte de réalité virtuelle (ou VR pour les intimes), Viaccess-Orca nous a sollicité pour réaliser la refonte des interfaces 2D et 3D.
Coup d’envoi
Au préalable, les responsables projet de Viaccess-Orca nous ont présenté les réalisations qu’ils avaient déjà fait, l’importance des données consommées et collectées dans le flux. L’objectif de notre client étant de permettre l’accès à l’application au plus grand nombre et de proposer de multiples services à termes.
Ces premiers échanges nous ont permis de capter les spécificités de la demande et les attentes de notre client :
- Création d’une interface dans un environnement de réalité virtuelle,
- Interface pouvant afficher une série de statistiques et du contenu média,
- Permettre une navigation dans l’espace dédié, vues 360° et catalogue,
- Interface exploitable en mode 2D sur les terminaux sans casque ou cardboard et 3D pour les autres terminaux compatibles,
- Mettre en avant le partage entre tous les utilisateurs, VR et non VR,
- Interface aux couleurs de Viaccess-Orca mais déclinable facilement en marque blanche pour d’autres clients.
Première contrainte qui en ressort, mais non des moindres : l’environnement et sa dimension de support physique.
D’un côté, nous avons le casque de réalité virtuelle dont il existe une large variété de modèles, plus performants les uns que les autres, tels que HTC Vive, Oculus Rift, Samsung Gear VR, le Google Cardboard (en carton éco, une autre approche de la VR), etc. D’un autre côté, on peut également se connecter sans casque à l’application, via son smartphone. On regarde alors sur son écran comme si on était sur un jeux vidéo. Cette version est la moins utilisée, mais elle permet aux utilisateurs de tester avant d’investir dans un casque.
Nous avions également pour impératif une deadline à respecter. Il était en effet important pour Viaccess-Orca de présenter son prototype au salon de l’IBC (International Broadcasting Convention) qui se tenait en Septembre dernier aux Pays-Bas. Il s’agit d’un salon très influent dans le domaine de la VR, dédié aux nouveaux médias et flux d’informations ainsi qu’aux nouvelles technologies qui les diffusent.
Les objectifs étant actés, nous déterminons alors la répartition des actions à mener auprès des acteurs du projet. Ainsi, notre équipe est en charge de la conception UX, du design et de l’architecture des interfaces.
L’univers de la VR étant un environnement de travail nouveau pour l’agence, nous avons fait appel à la société Tailora pour nous accompagner dans la création des espaces 3D. Du côté de Viaccess-Orca, les développeurs ont pour mission d’ajouter à l’application la 3D créée par Tailora et de faire tout le développement des interfaces que nous leur livrons.
Immersion à 360°
D’emblée une première phase s’avère indispensable à la bonne manœuvre du processus : une immersion intensive dans l’environnement VR et un investissement ciblé pour comprendre tous les tenants et aboutissants du projet.
Notre équipe projet s’est équipée et organisée en conséquence : acquisition d’un casque de réalité virtuelle Samsung GEAR VR et d’un smartphone Samsung S7, ainsi que la création d’un compte sur l’oculus store.
Le but de cette étude étant de consommer un maximum d’applications récentes, de faire du benchmark et d’observer comment les autres marques font aujourd’hui. Avec pour intérêt également de détecter et d’anticiper les problèmes que nous pouvions rencontrer. En terme d’accessibilité notamment, les smartphones ont une meilleure résolution qu’avant, mais cela reste encore limité quant au confort visuel. La vigilance est alors de rigueur lors de la conception afin d’éviter les scintillements à l’écran qui donnent mal au cœur.
Dans cette démarche, nous avons demandé à Viaccess-Orca de mettre en place, assez rapidement, une application à environnement 360° afin d’expérimenter nos essais en amont. Ce qui nous a permis de faire des tests en temps réel, via le casque VR, de voir l’interface que Florentin, notre designer web, était en train de concevoir.
Nous avons pu ainsi vérifier de suite ce qui fonctionnait ou pas, et faire les premières propositions rapidement. Car même aujourd’hui, c’est un domaine tellement précurseur, il n’existe pas de bonnes pratiques, de guides ou de tutoriels tel que “comment apprivoiser l’environnement 3D” ou “comment éviter l’effet de scintillement”. Pour l’équipe du projet, tout a été une vraie découverte.
De manière à accélérer le processus, pendant deux mois, un vrai travail de co-conception entre les équipes LunaWeb, Tailora et Viaccess-Orca, s’est coordonné au travers d’ateliers réguliers, sur fond de méthode agile.
Après notre phase d’immersion qui a duré plus d’un mois et une fois les bonnes pratiques adoptées et validées, nous avons pu décider quels éléments mettre en place. Ce qui a permis, d’un côté au client de faire leurs spécifications techniques pour commencer à faire le développement. De notre côté, d’en sortir des templates et de faire une première proposition pour le panel, le fond d’écran, ainsi que les petites interactions.
Dès lors, nous avons avancé par itérations jusqu’au salon de l’IBC, afin de réaliser une version qui a été présentée en interne. Une version qui a d’ailleurs fait sensation au sein des collaborateurs Viaccess-Orca, venus nombreux à la présentation, très satisfaits du résultat.
Champ de vision
Concernant l’environnement 3D, nous avons conçu une architecture axée sur 3 espaces définis afin que l’utilisateur puisse se déplacer facilement et intuitivement d’une pièce à l’autre.
Dans un premier temps nous avons élaboré des mockups de l’architecture en 2D sur papier et tableau blanc. Nous sommes ainsi arrivés à la réalisation d’une forme à 3 segments avec un point d’entrée central. Le choix de la forme de l’architecture s’est déterminé après diverses réflexions autour des différents éléments à placer, des environnements à créer.
L’architecture s’organise ainsi selon les deux thèmes de l’application :
1. L’environnement sport comprenant 1 pièce avec 3 espaces ouverts
- Espace principal avec la vue sur le stade et le dashboard,
- Les moments forts du match mais aussi les statistiques poussées des équipes,
- Espace jeux avec le tir de penalty, proposition de goodies à l’effigie des équipes.
2. L’environnement concert comprenant 1 pièce avec 3 espaces ouverts
- Espace principal avec la vue sur la salle et le dashboard,
- Les moments forts de la tournée mais aussi les informations poussées sur les artistes et groupes,
- Espace jeux avec un blindtest.
Des rampes d’accès, menant au stade et à la salle de concert, ont également été pensées dans la vue 360°.
L’architecture a été réalisée en étroite collaboration avec Tailora. Ils nous ont aiguillé dans nos idées et nos choix, en nous indiquant ce qui était réalisable physiquement ou pas dans un environnement VR. De plus, leurs conseils avisés d’expert nous assuraient de se démarquer de ce qui se fait actuellement en réalité virtuelle.
À ce stade du projet, il s’agissait pour Florentin, notre designer UX, de voir comment il pouvait interagir avec tous ces éléments, afin de contrôler ce qu’on pouvait afficher, définir la position du placement de produit, disposer les interfaces.
Du côté des technologies utilisées, les équipes projet ont là aussi œuvré de concert. Florentin a travaillé sur Sketch et Zeplin pour pouvoir livrer les éléments à Tailora. Les interfaces ont été ainsi conçues en 4K, les flux video étant en 8k dans ce genre d’application, voire en 12K comme il s’agit de flux 360°.
Quant à Tailora, ils ont développé la 3D sur Unity SDK (kit qui permet de développer l’appli dans le casque). Ils ont optimisé la vue 3D pour qu’elle soit la plus réelle possible tout en étant ultra légère, afin que l’application ne rame pas dans le casque. Sur le très haut de gamme, le problème ne se pose pas, par contre sur un modèle comme le Galaxy S7, c’est plus compliqué à gérer comme on a pu le constater lors de nos premiers essais. Par conséquent, il fallait concevoir en pensant aux différents niveaux de performance produit supportant l’application.
De même, un travail a été poussé sur l’audio, dans l’optique de spatialiser le son par de multiples points de diffusion.
L’application visant à être présentée lors de salons professionnels internationaux et proposée à de grands groupes telecom en France et à l’étranger, toute la conception s’est faite directement en anglais.
Au fil des avancées du projet, tout en respectant le timing, d’autres idées ont émergées telles que l’ajout d’un accès à des goodies en 3D et à des commandes, de manière à déclencher, à terme, de l’achat en ligne.
But atteint
Tel un match de football mené en cohésion, chacun avait son poste d’action bien défini, dans son domaine de compétences (UX, Dev, expert 3D), ce qui nous a conduit à atteindre notre but : créer une application répondant aux besoins du client, en offrant à l’utilisateur une expérience immersive unique.
Le projet a été livré ainsi dans les temps, à la deadline prévue pour le salon IBC.
Nous devions prioriser la partie sport, nous avons pour autant amorcé la partie concert. En effet, Tailora et notre équipe projet avons réalisé et livré la 3D et l’interface.
Viaccess-Orca travaille actuellement sur la partie concert afin d’étendre leur produit aux évènements musicaux. Ils renforcent également toute leur base de métier qui comprend la transmission, la consolidation de flux vidéo et d’infos pour les intégrer dans des applications telle que celle-ci. L’interface conçue étant déclinable en marque blanche, ils peuvent la dériver comme ils le souhaitent.
Nous avons pris soin de leur livrer le projet avec un guide de style pour les accompagner dans cette démarche.
Le temps des prolongations
Ce projet a été un sacré challenge, aussi bien au niveau de l’exploration à mener qu’au degré d’innovation à atteindre.
L’univers de la VR est effectivement un sujet que nous ne maîtrisions pas jusque là en tant que concepteurs. Ce fut l’occasion de sortir des écrans 2D traditionnels, de revoir les usages au casque qui n’ont rien à voir avec ceux d’un écran d’ordinateur ou un smartphone. Une expérience réellement enrichissante et inspirante.
Un sujet qui a également permis à notre équipe de se diversifier des projets habituels, de changer d’environnement de travail. Un projet très séduisant et motivant, pour lequel nous avons passé beaucoup de temps avec le casque sur les yeux pour comprendre, appréhender tout ce que ça impliquait comme procédé.
Une collaboration qui doit sa réussite à un véritable esprit d’équipe. Nous remercions vivement Viaccess-Orca pour leur confiance renouvelée et Tailora pour leur investissement et professionnalisme.