XSI Cross System Interface

Cross System Interface

Defmonk

Site internet interactif

Defmonk Red Velvet

Un groupe. Un concept. Une expérience.

Vue d'ensemble

Defmonk est un groupe de musique originaire de Bruxelles. Ils jouent du "Belgian Groove" et s'appliquent à cultiver un univers fort.

Pour leur nouvel album, ils décident de représenter les chansons par des personnages stéréotypés apparaissant au fur et à mesure sur une fresque.

Portée du projet

  • Développement web
  • Design web
  • Design de l'UX
  • Intégration graphique
  • Hébergement

Challenge

Transformer un concept fort

Un budget serré

Une expérience musicale

Sublimer l'univers

Processus

Choix des priorités

Le site ne comporte que quelques pages. Le but étant de pouvoir concentrer un maximum de temps à l'expérience de la fresque et d'en faire la pièce maîtresse du site.

Pour offrir une expérience fluide et rendre le changement de page dynamique, le site est construit d'un seul bloc.

arrière plan rougeBones, the undertaker

Travail Graphique

Pour que le projet soit un succès, il était primordial de rester fidèle aux réalisations graphiques de Defmonk.

Nous avons réalisé l'identité visuelle dans cet esprit. Avec pour objectif de sublimer l'univers monochrome du concept. Le choix s'est porté sur des couleurs fortes, le rouge et le vert, utilisées dans des tons plus sombres.

Les 15 personnages ainsi que l'arrière-plan ont dû être nettoyé soigneusement. Il était important de pouvoir les incorporer par couches, en respectant la profondeur, pour donner un aspect vivant à toute la scène.

évolution du décor
Du 24 décembre au 26 janvier, les personnages sont apparus au fur et à mesure.

Fresque interactive

Nous avons voulu rendre l'expérience dynamique et simple d'utilisation. Pour cela nous avons fait en sorte que la fresque prenne toujours le maximum d'espace vertical disponible.

Un défilement horizontal est déclenché par la position de la souris et permet de se déplacer dans l'image.

Stratégie
Expérience utilisateur
Lecteur de musique

Une campagne de publications régulières a été mise en place sur Facebook.

Les publications suivent un schéma précis. Un bref texte donne le background du personnage et une image permet aux visiteurs de repérer facilement le nouvel ajout.

L'expérience utilisateur est le plus grand défi lié à la réalisation de la fresque. Son parcours sur le site se doit d'être intuitif et directement compréhensible.

Pour cela, nous avons mis en place un système de surbrillance sur le personnage lié à la musique jouée ainsi que de faire clignoter tous les personnages présents sur la fresque au clic de l'utilisateur.

Le lecteur de musique a été réalisé pour être simple et intuitif. Pour augmenter la signification entre un morceau et un personnage, une vignette est présente à côté du morceau.

Par ailleurs, la fresque se centre automatiquement sur le personnage actif.

Gallerie

C'est là que l'on découvre l'ampleur de l'univers de Defmonk. On y trouve un texte avec des mises en situations et des dialogues par musique.

gallerie
responsive

Responsive

Toute l'expérience est conçue pour être vécue aussi bien sur ordinateur que sur téléphone.

Pas de compromis, le site est entièrement adapté à l'appareil utilisé pour le visionner.

XSI

Ce message s'affiche car vous utilisez un navigateur obsolète. Cela signifie d'une part, que votre expérience utilisateur sera limitée sur la plupart des sites internet récents et d'autre part, que vous vous exposez à des risques de sécurité. Nous vous conseillons de mettre à jour votre navigateur actuel ou d'utiliser l'un des navigateurs suivants :
Google Chrome, Firefox ou Opera afin de profiter pleinement de notre site.


L'équipe XSI