Dans le cadre du projet Dataplay, nous avons dû créer par groupe une expérience interactive à partir d’une base de donnée exploitable par un site web.
Le sujet
La première étape a été d’identifier un sujet. On s’est dit qu’on voulait quelque chose qui nous parlait à tous les trois dans le groupe, donc on s’est dit que le projet aurait un rapport avec la musique.
Notre première idée de sujet était de faire une analyse de ce que les gens écoutaient comme musique partout dans le monde par rapport aux crises en cours. Seulement, Mr Bourgaux nous a dit que ça allait être compliqué de mettre ça en place, il nous fallait quelque chose de plus simple. On a alors pensé à montrer le nombre de fois qu’un mot revenait dans une musique, sur une certaine période. On pourrait voir si des mots reviennent beaucoup ou pas sur une période. On s’est dit qu’on allait faire ça pour les 10 premiers “Top Hits” de chaque année. Pour ne pas avoir trop de données, on s’est dit qu’on allait commencer en 1970 jusqu’en 2025 et qu’on allait passer 5 années à chaque fois.
Les données
Maintenant qu’on sait de quoi on parle, il faut regrouper les données. Pour trouver les top hits de toutes les années, on a trouvé un site qui les regroupait justement. Pour chaque année, il faut aller prendre les paroles des 10 premières musiques. Au début, on ne savait pas trop comment compter le nombre de fois qu’un mot apparait. Puis on a trouvé un site qui le faisait automatiquement, on avait juste à mettre les paroles de chaque musiques et le site nous donnait les mots qui revenaient le plus souvent. Ca nous a fait gagner beaucoup de temps. On a regroupé toutes les données dans un fichier Google Sheets pour bien s’y retrouver.
Le design
Pour le design, on s’y est d’abord mis à trois pour essayer de s’imaginer comment présenter le site. On s’est dit que ce serait sympa d’avoir une visualisation comme les tables de Dj pour rester dans le thème de la musique. On a chacun créer une frame Figma pour tenter un premier design.
Ils n’étaient pas super avancés, le problème était qu’ils avaient toujours le “style Figma”.
J’ai refait le design et c’était déjà un peu plus avancé. Il y avait quand même trop d’infos sur la page.
J’ai fait une Xème version du design et il nous convenait mieux. On a gardé celui-là pour la suite. On a aussi décidé de faire une deuxième page sur laquelle on mettrait les stats d’un mot choisi sur la première page.
Le code
Pour le code, on devait utiliser GitHub pour travailler en équipe. J’ai mis un peu de temps avant de comprendre bien comment ça fonctionnait (pour les merges et les branches). J’ai commencé le tableau JSON pour après commencer le javascript.
Le groupe
