star_cursor
star

Data Clash

Who's ruling the game?

star Vers le site web
star
01

Mise en situation

Nous passons de plus en plus de temps à générer des données, encore et encore. Ces dernières sont devenues le nouvel or noir, à extraire coûte que coûte.

dataplay

Dans le cadre du projet Data Play, il nous a été demandé de réaliser, en groupe de quatre personnes, un site web responsive exploitant un jeu de données de notre choix afin de créer une expérience interactive pour l’utilisateur.

Le choix du thème restait libre tant qu’on obtenait un nombre suffisant de données à exploiter lors de ce projet.

On pouvait également choisir un thème précis dans un domaine assez large et créer nous-mêmes un tableau de données à exploiter ensuite dans le site.

star
02

Phase de recherches

Première étape : Choisir le thème. Et pourquoi pas la musique ?

dataplay

Avant de commencer les recherches, on s’est d’abord concerté afin de choisir quel thème nous voulions exploiter : la musique.

Après avoir cherché plusieurs idées, nous avons décidé de créer une sorte de Clash entre différents artistes (d’où le nom du projet “Data Clash”) sur base de leurs statistiques musicales.

Ensuite, nous avons donc récolté toutes les données nécessaires pour commencer le travail.

Des posts Instagram étaient également demandés pour montrer l’avancée du projet.

star
03

Création du design

Des couleurs plein la tête, et pourtant... Rendons tout cela très classe, comme si le projet allait sortir pour de vrai.

dataplay

Pour le design, nous avons décidé de partir sur quelque chose de très sobre et minimaliste.

Premièrement, le projet entier a été rédigé en anglais pour donner un style « américain » plus axé pour l’international.

Pour les couleurs, nous sommes partis sur des textes blancs sur fond noir. Pour illustrer le vainqueur de chaque round lors de l’utilisation des données, ces dernières étaient affichées en rouge.

Nous avons évidemment gardé les mêmes couleurs pour les posts Instagram et autres goodies du projet.

star
04

Développement du site

Une fois le design créé, il ne restait plus qu’à lui donner vie. Plus facile à dire qu’à faire...

dataplay

Bien qu’il s’agissait de notre troisième site, nous découvrions de nouvelles manières de le coder.

Premièrement, vu qu’on était plusieurs à travailler sur ce projet, l’utilisation de GitHub était nécessaire pour partager les avancées en code.

Ensuite, pour l’exploitation des données, l’utilisation d’un tableau JSON était également nécessaire tout au long du code.

Pour finir, on découvrait également de nouvelles animations en JS (comme le slider sur la page d’accueil).

star
star

Autres projets

Envie de découvrir mes autres projets ? Cliquez sur les cartes afin de voir ce qu’elles renferment.

Janus

2024

Site critique du streamer ZeratoR

Log Pose

2025

Chasse au trésor pour le One Piece