Lorsque nous avons chez emagin dĂ©marrĂ© notre rĂ©flexion sur ce projet, nous ne disposions d’aucun brief prĂ©cis ni besoin clairement exprimĂ©. Avec notre regard de professionnel, en analysant / comparant les grands sites de productions cinĂ©matographiques, en rĂ©flĂ©chissant aux diffĂ©rentes options technologiques, graphiques et fonctionnelles, nous avons-nous-mĂŞme dressĂ© le pĂ©rimètre et les contraintes du projet.

Avant tout, que pouvions-nous leur proposer d’intĂ©ressant et de sĂ©duisant ? Quel “plus” apporter Ă  ce projet ? Comment dĂ©montrer qu’une refonte du site actuel est nĂ©cessaire et qu’elle serait un vĂ©ritable atout pour la communication et l’image de l’entreprise ?

En tant que professionnels cela nous apparut Ă©vident : la version en ligne d’Europacorp propose une interface un peu “vieillotte”, les Ă©lĂ©ments graphiques sont peu soignĂ©s et les outils fonctionnels mal exploitĂ©s ou incomplets. Une simple refonte graphique nous semblait insuffisante et nous souhaitions leur proposer des outils adaptĂ©s Ă  leur mĂ©tier et Ă  leurs besoins. Des fonctionnalitĂ©s utiles qui prĂ©senteraient une rĂ©elle valeur ajoutĂ©e au contenu prĂ©sentĂ©, le tout habillĂ© dans une interface cohĂ©rente et de qualitĂ©.

La place qu’occupe aujourd’hui EuropaCorp sur le marchĂ© de la production cinĂ©matographique, la qualitĂ© visuelle et l’orientation rĂ©solument moderne des productions de la sociĂ©tĂ© ont très largement influencĂ© notre proposition et nos choix fonctionnels.

Notre dĂ©marche crĂ©ative peut ainsi se rĂ©sumer en 3 mots : design, utile et utilisable. Ces 3 mots clĂ©s rĂ©sument les principes de base de l’ergonomie web et sont pour nous la clĂ© d’un site Internet rĂ©ussit :

Design, car le beau, bien que subjectif, vĂ©hicule avant toute chose l’image d’un site ; c’est ce qui nous touche et nous interpelle en premier. Il se doit donc d’ĂŞtre en accord avec l’identitĂ© du projet ; sans prendre le pas sur le contenu, il doit ĂŞtre pertinent et au service de l’information prĂ©sentĂ©e.
Utile, parce que l’Internaute qui visite votre site s’attend Ă  trouver une certaine information. Il faut donc que l’interface propose des accès pertinents et que l’information recherchĂ©e soit clairement identifiĂ©e et identifiable.
Utilisable, pour faciliter la satisfaction de ce besoin : ces accès doivent ĂŞtre clairs et aĂ©rĂ©s ; les fonctionnalitĂ©s doivent simplifier l’accès Ă  l’information et ĂŞtre d’une utilisation intuitive, pratique et si possible ludique.

Nous avons essayé - à travers cette proposition - de présenter un projet avec une réflexion aboutie au niveau ergonomique et graphique tout en offrant de grandes valeurs ajoutées fonctionnelles.

La nouvelles interface Europacorp

Nous avons optĂ©s pour une interface full-flash, en accord avec l’univers graphique d’EuropaCorp. Le design est soignĂ© et les diffĂ©rents composants sont au service de l’information pour une lisibilitĂ© ou une comprĂ©hension optimale. Les accès, illustrĂ©s par des visuels, sont identifiables rapidement. La prĂ©sentation de l’information est quant Ă  elle hiĂ©rarchisĂ© et aĂ©rĂ©e, et les modules fonctionnels simples, performants et ludiques.

L’interface se dĂ©compose en 5 parties distinctes :

• 1 - La zone marque/navigation
• 2 - L’espace “A l’affiche” mis en avant via le “Player emagin”.
• 3 - Les accès prochains films / prochaines sorties DVD.
• 4 - La zone “push infos” proposant les actualitĂ©s ainsi que le catalogue DVD
• 5 - le menu footer.

1 - La zone marque

Elle propose en premier lieu le logo, placĂ© en haut Ă  droite le rendant ainsi immĂ©diatement visible. Sur la droite au mĂŞme niveau sont proposĂ©s les diffĂ©rents accès de premiers niveau de l’arborescence. Nous avons identifié 5 grands accès : les films Ă  l’affiche - Les prochaines sorties - Les films en production - Le catalogue DVD/BLU-RAY - Le catalogue des bandes annonces. Cet espace hĂ©berge Ă©galement les accès Ă  l’espace Corporate ainsi que la connexion Ă  l’Intranet EuropaCorp.

2 - L’espace “a l’affiche”

Emagin a dĂ©veloppĂ© un Player (lecteur) multimĂ©dia qui permet, dans un module unique, la diffusion des diffĂ©rents mĂ©dias disponibles sur internet : l’image, la vidĂ©o et le son. Ce module, adaptĂ© ici pour ce projet, est imposant et prĂ©dominant sur la page d’accueil. Il permet ici de mettre en avant de manière ludique et intuitive les films à l’affiche. Il offre un grand nombre de fonctionnalitĂ©s très utiles qui sont autant de valeurs ajoutĂ©es Ă  l’information proposĂ©. Ce Player et ses fonctionnalitĂ©s sont dĂ©crits un peu plus bas. L’accès “A l’affiche” propose, en plus du grand visuel de Player, 3 gros accès qui invitent Ă  accĂ©der au dĂ©tail des films prĂ©sentĂ©s : voir la fiche de dĂ©tail du film - visionner la bande annonce - voir le mini site du film.

3 - Les accès prochains films / prochaines sorties DVD

IllustrĂ© par de simples visuels, ces accès proposent au simple survol (cf image accueil 2) la consultation de la fiche du film, la bande annonce ainsi que l’accès au mini site (le cas Ă©chĂ©ant).

4 - La zone “push info”

ComposĂ©e de 2 parties, elle propose en premier lieu la consultation des actualitĂ©s d’EuropaCorp. Ludique, ce module prĂ©sente les diffĂ©rentes actualitĂ©s sous forme de titre et de date d’entrĂ©e. Au clic (mais Ă©galement via les flèches situĂ©es sur la droite), la bande de titre glisse dans l’espace central, dĂ©plaçant de ce fait les autres titres, et laisse apparaĂ®tre le dĂ©tail de l’actualitĂ© sĂ©lectionnĂ©e. Elle est composĂ©e d’une date, d’un titre, d’une texte de descriptif ainsi que d’un visuel relatif Ă  l’actualitĂ© (ici l’image B13-U en fond).

La seconde partie de cette zone prĂ©sente le catalogue DVD. PrĂ©sentĂ©es comme une galerie d’images en perspectives, les couvertures de DVD dĂ©filent sur un plan horizontal au clique sur l’image de la couverture DVD ou via le petit pilote situĂ© sur la droite. Les mĂŞmes informations essentielles se retrouvent pour chacun des films avec ici en plus la possibilitĂ© de commander le DVD en 1 clic.

Chacune des 2 parties offre la possibilitĂ© de consulter l’intĂ©gralitĂ© des entrĂ©es de ces modules : Voir toutes les actualitĂ©s - Voir tout le catalogue DVD.

5 - Le menu footer.

Ce menu situĂ© en bas de page prĂ©sente de manière concise l’intĂ©gralitĂ© des accès proposĂ©s sur le site et offre, sous forme de cartouche, un espace de mise en avant d’une rubrique, (ici l’accès Ă  l’espace Corporate). Ce menu footer propose Ă©galement le module de recherche sur le site.

Le player emagin

Emagin a développé un player multimédia dont voici le descriptif et les fonctionnalités :

- 2 modes de visualisation : une vue standard s’intĂ©grant dans vos pages. Un affichage fullscreen de la galerie multimĂ©dia qui occupe alors tout l’Ă©cran.
- 2 modes de lecture : automatique - manuelle - suivant/précédent.
- Personnalisation via le fichier de configuration : couleurs des Ă©lĂ©ments graphiques, taille et mode de dĂ©filement des vignettes, auto hide de la barre d’aperçu, temps d’affichage des mĂ©dias etc…
- Titre + descriptif des médias proposés.
- Vote des médias.

1 - Visuel d’aperçu qui s’adapte Ă  la rĂ©solution dĂ©finie pour le player, quelque soit la taille de l’image uploadĂ©.
2 - Bouton d’accès Ă  l’information sur le mĂ©dia en cours (titre de l’image + descriptif).
3 - Bouton de passage en mode plein Ă©cran.
4 - Bouton pause. Stopper la lecture automatique du média.
5 - Boutons média suivant / média précédent.
Au passage de la souris sur le bas du player, l’onglet d’aperçu de la galerie des mĂ©dias s’ouvre. Il propose :
6 - Indication du défilement de la lecture automatique.
7 - Aperçu visuel du média + titre.
8 - Pour les mĂ©dias son et vidĂ©o, un icĂ´ne reprĂ©sentatif s’affiche au dessus de l’image d’aperçu.
9 - Bouton de défilement des aperçu suivants ou précédent.

PrĂ©sent sur la quasi totalitĂ© des pages, ce player est une rĂ©elle valeur ajoutĂ©e Ă  l’information proposĂ©e. Que ce soit pour la prĂ©sentation des films Ă  l’affiche, des bandes annonce, des fiches de dĂ©tail de films ou tout autre espace, ce module permet de constituer, dans une interface unique, une vĂ©ritable galerie multimĂ©dia proposant de l’image, de la vidĂ©o et des extraits sonores.

Chaque mĂ©dia placĂ© dans le Player est visible, en mode standard, Ă  une taille adaptĂ©e Ă  la rĂ©solution dĂ©finie pour le Player. Quelque soit la taille initiale de l’image, elle s’adapte automatiquement. Le Player se charge de gĂ©nĂ©rer une image rĂ©duite en dimensions tout en conservant sa qualitĂ© visuelle afin d’optimiser les temps de chargement.

Lors du passage en mode plein Ă©cran vous disposez alors d’une visualisation optimale et bĂ©nĂ©ficiez des images et des vidĂ©os en tailles rĂ©elles. Vous pouvez ainsi diffuser une multitude de mĂ©dias de grandes qualitĂ©s visuelles ou sonores.

Nous proposerons très bientôt sur ce blog une démonstration en ligne de notre player.

> Voir les maquettes en taille réelle