Figures that tell

Après une matinée informative accompagnée d’une conférence de Martin De Wulf sur l’interactivité en Javascript à travers RaphaëlJS, nous voilà prêts pour ce troisième workshop!

Feuilles blanches, crayons, bancs ajustés en fonction des besoins et la team “Figures That Tell” peut dès à présent se lancer dans le projet.
Le premier objectif: définir le concept. Après avoir étudié quelques pistes, notre seule solution est d’établir nous-même les questions afin d’avoir notre propre base de données.

Dès lors un problème se pose: comment faire complèter un formulaire personnalisé aux étudiants des trois classes? Nous pensons en premier lieu à un formulaire Google que l’on aurait partagé par email mais cette idée est vite tombée à l’eau car nous n’aurions eu aucune certitude sur la participation des étudiants.
Dès lors, un petit “back to basics” s’impose: un formulaire papier (en web… étonnant oui!).

Petite mise en page sur Indesign, export PDF… le formulaire est prêt à être complété!

Après un week-end de seconde réflexion, une mise au point s’impose. Nous décidons d’établir un planning et d’entamer la répartition des tâches.

Nous nous séparons en deux équipes: une dédiée à l’interface et son intégration et l’autre à la conception du poster et à la création des graphiques interactifs.

C’est à ce moment-là aussi que nous allons nourrir nos pages en rédigeant le contenu du site.

L'intégration du site commence!

Pour celui-ci nous nous basons sur la grille que Jean-François a confectionnée pour que le layout du site soit un minimum responsive. Pour ceux qui ne savent pas encore (parce que, oui, il y en a…), cette notion de responsive design induit que le layout d'un site s’adapte visuellement en fonction de la résolution de l’écran.
Pierre, toujours sur le poster, se concentre sur l’aspect visuel de celle-ci en rapport avec la charte graphique établie.

Pendant ce temps, Jean-François écrit toujours les algorithmes qui serviront à établir votre niveau par rapport à la moyenne du groupe DWM.

La page “Making of” est réservée à Bastien pendant que Steve s’occupe du formulaire et de son ergonomie. C'est en fin de soirée que nous nous occupons des textes de la page “Bonus”.

Pas de répit durant la dernière ligne droite: l’intégration se termine petit à petit et les derniers éléments se mettent en place. La mise en page du poster est peaufinée afin de valoriser au mieux son contenu.

Durant toute la nuit, nous travaillons sans relâche. Une attention particulière est portée à l’expérience utilisateur et à l’ergonomie de nos interfaces. Sont alors ajoutés: des titres pour chaque abbréviation et un curseur particuliers pour celles-ci, une navigation depuis le footer et enfin, une validation du formulaire avec information relative aux champs incomplets et, le cas échéant, redirection automatique au premier de ceux-ci. Nous nous assurons alors que tous les liens mènent au bon endroit et que l’orthographe de l’entièreté du site est irréprochable. Cette relecture est par ailleurs indispensable: faire lire du contenu non (re)lu par ses propres auteurs est pour nous inconcevable.

Au terme de cette nuit, le poster est imprimé en A1 et est exposé au B-hall dès 12:00, juste au-dessus d’une table sur laquelle nous laissons un de nos ordinateurs à disposition afin que les visiteurs puissent vivre la version interactive de notre visualisation.