TeamE

Published in

DWM - Reboot Factory

6 min readJan 12, 2015

Ça y est, comme l’année dernière, les professeurs du groupe de travail DWM de la Haute Ecole Albert Jacquard de Namur nous présentent le workshop « Reboot Factory ». Ce workshop a pour but de « rebooter » notre façon de penser au niveau de l’interfaçe en nous faisant développer une web app.

Contrairement à l’année dernière où le thème nous était imposé, le thème de cette année était libre.
Premier objectif : faire valider notre projet.

Le projet

Dans un premier temps, nous avons fait un groupe de deux et réalisé une liste de dix projets. Nous avons ensuite choisis les deux idées qui nous paraissaient être les plus utiles dans la vie courante. À notre grande surprise notre idée a été directement validée. Vous vous demandez sûrement quelle était notre « super » idée ?

Romain et Shervin suivent les actualités sportives des équipes qui leur tiennent à coeur. Le seul problème c’est que chaque matin, ils doivent aller sur beaucoup de sites différents pour avoir les informations nécessaires à leur soif de résultats. Ce n’est évidement pas bien pratique et la perte de temps est considérable. C’est en discutant de cela que l’idée de TeamE nous est apparue.
Pourquoi ne pas faire une application qui recenserait tous les sports d’équipes, les classer par championnat et récupérer un fil d’actualité propre à l’équipe sélectionnée. Voilà donc notre idée.

Le regroupement

Peu de temps après, Auriana et Victor ont rejoins le projet imaginé par Romain et Shervin. Nous voici donc au complet, l’équipe des « Web Coast » deuxième du nom est née. Nous sommes prêt à tout déchirer !

Après le regroupement physique, le regroupement mental a eu lieu. Expérience étrange de tout workshop, ce regroupement permet l’amélioration de nos premières idées grâce au regard nouveau des deux compagnons de notre groupe.

Nous voilà donc avec une application qui permet d’obtenir un fil d’actualité d’une équipe mais qui va beaucoup plus loin maintenant. Il est possible aussi d’obtenir les résultats des matchs, le classement par championnat, les informations de l’équipe, et surtout de se faire un fil d’actualité par équipe.

Les nouvelles idées rassemblé, nous préparons la structure.

L’itération

Nous nous lançons donc dans la conception des prototypes sur papier: l’étape de la mort, l’étape de l’itération massive. Après environ 983.383.234.237 essais, nous avons notre prototype papier qui ne pose plus de problème. Mais plus tôt que de vous écrire tout le déroulement, nous préfèrons vous laisser visionner cette vidéo.

https://vimeo.com/116527077

Le graphisme

Une fois les prototypes papiers finis, nous nous sommes attaqué aux prototypes HTML et au graphisme pour en retirer un design agréable procurant la meilleure expérience possible.

Etant donné la quantité d’information textuelle que requiert une application parlant de sport, nous avons décidé de ne pas la surcharger en terme de couleur. Le bleu étant la couleur que nous pensions la plus adéquate nous avons décidé de colorer uniquement les éléments avec lesquels nous pouvons interagir.

Nous avons obtenu un résultat plutôt satisfaisant malgré les nombreux essais ratés et les itérations. Avec les conseils des professeurs, nous sommes arrivé au graphisme idéal. En somme, un graphisme simple mais pas simpliste.

Les retrouvailles et la conception

En cette fin décembre 2014, l’heure n’est pas à la fête mais bien au travail. Au diable les diners de Noël en famille. Il faut s’enfermer dans notre chambre et travailler.

Voilà ce que nous nous étions dit en quittant l’école la veille du congé. Deux semaines plus tard, nous nous retrouvons un peu honteux chacun avec deux kilos en plus et un projet pas beaucoup plus avancé.

Nous avons tout de même fait les animations et transitions qui seront présentes dans notre application (oui on a pas fait que bouffer). Nous avons toute la base en HTML. (hourra !)

Nous nous répartissons donc les tâches de ce qu’il nous reste à faire. Romain prend en charge le code de l’application pendant que le reste du groupe s’occupe de l’affiche, le site de présentation et le case study. En parallèle, Shervin l’aide sur certains points en javascript notamment sur l’outil de recherche pour la sélection des équipes et des sports. De leur côté, Victor et Auriana s’occupent du site web.

L’affiche

Dans un premier temps, nous avons voulu réaliser une affiche sur base de photographie. L’idée était de mettre en scène une personne dans la vie de tous les jours et dans plusieurs situations. Par exemple, regarder son smartphone en levant les bras, l’air joyeux. Seulement voilà, nous avions déjà un logo avec un graphisme “flat”. Nous avions donc un problème. Nous n’arrivions pas à faire en sorte que notre affiche colle bien avec notre logo. Après différents essais, nous nous sommes résolu à changer d’idée.

Nous étions tous d’accord pour ne pas faire quelque chose de trop chargé en terme de contenu mais il fallait que l’on puisse comprendre de quoi il s’agissait du premier coup d’oeil.

C’est à ce moment là que nous avons eu l’idée du logo en grand avec le titre par dessus et une petite base line. Simple mais efficace, après tous les essais que nous avions fait, c’était pour nous le meilleur moyen de faire comprendre sous forme d’une affiche le but de notre application.

Le final

Le meilleur moyen de finir ce case study est de savoir ce que chaque membre du groupe retire de ce workshop. Ce qu’il n’a pas aimé, ce qu’il a appris ou encore ce qui l’a marqué.

Romain :

Notre web app étant assez volumineuse en terme de contenu, j’ai appris que l’organisation primait sur tout le reste pour ne pas perdre de temps inutilement. Le déroulement du workshop en deux semaines continues était donc un plus par rapport à l’année passée. Pour la suite, j’espère rendre l’application totalement fonctionnelle et si c’est les cas, je serais son premier utilisateur.

Victor :

Lors de la fin du dernier Workshop Story Telling je me réjouissais déjà d’être au Workshop suivant et je dois dire que je n’ai pas été déçu ! Je ressors de ce Reboot Factory avec une expérience incroyable et de nouvelle connaissances en matière de Webdesign qui me donnent envie d’avancer encore plus loin. Mais ce Workshop n’aurait pas été aussi magnifique sans l’équipe avec laquelle j’ai travaillé, l’ambiance au sein du groupe était parfaite.

Auriana :

Avant de commencer le workshop, je n’y conaissais rien en web app. Je me disais que ça devait être un travail énorme pour en faire une. Et c’est véridique. J’ai beaucoup aimé réfléchir à la conception du projet et réaliser les différents étapes de celle-ci. Ce workshop m’a appris à m’adapter à de nouvelles situations et sujets. Le groupe avait une très bonne cohésion. J’en ressors enrichie.

Shervin :

Comme pour le précédent workshop, j’ai bien plus appris que par rapport à l’année dernière. Le fait que deux semaines de workshop nous soient accordé m’a grandement aidé à mieux visualiser et créer l’application. Je n’en retire que du bien. Cette seconde expérience de conception de web app me donne plus qu’envie de continuer pour des projets personnels.
D’ailleurs, Romain et moi même aimerions dans un premier temps rendre cette application complètement fonctionnelle.