Workshop #2 :


dwm.re/reboot factory

En ce 16 décembre 2015, la nouvelle se répand, l’avènement du second Workshop sonne à nos oreilles.

“Have you tried to turn it off and on again ?”


Nos professeurs, tels des guides spirituels, nous indiquent à nouveau la voie. Nous devons créer une webapp. Mais qu’est-ce ? En quoi est-ce différent d’une mobileapp ?
Je m’en vais te l’expliquer, cher lecteur.
Une webapp est une application mobile écrite en html/css, une mobileapp est écrite en langage natif au device lui-même.

Nos enjeux sont clairs : parvenir à créer une application qui répond aux besoins des utilisateurs mobiles. Outre l’aspect technique lié à notre support, nous devons observer les règles précises du monde mobile.

Cessons de divaguer, passons au vif du sujet !



Nos professeurs nous ont fournis une méthode de conception de projet.
Je ne l’expliquerais que brièvement, car le marcheur a qui on donne une lumière pour éclairer la voie ne prend pas forcément le bon chemin.

  1. Par deux, puis par quatre, nous réfléchissons, nous pesons, mesurons nos différentes idées et faisons un choix. Nous décidons de créer une webapp qui permettrait à notre utilisateur de trouve rapidement une recette aisée et peu chère à réaliser, puis de lui en fournir la liste de course ainsi que les détails de préparation.
  2. A l’aide de nos camarades de classe, nous recherchons les fonctionnalités qui correspondent le mieux à notre utilisateur, nous utilisons notamment la méthode du tri de carte pour parvenir à dégager les fonctionnalités nécessaires, et la manière dont nous devons les hiérarchiser.
  3. Nos fonctionnalités bien organisée en main, nous constituons un premier wireframe. Vous pouvez les consulter sur redpen
  4. Nous avons énormément itérer notre wireframe, redéfinit notre hiérarchie de contenus. Il est cependant difficile de nous tenir nos premières idées, nous constituons alors une charte.

“Gimme six hours to chop down a three and I will spend the first four hours sharpening my axe.” — Lincoln, dit Monsieur Haut-de-forme


Alors que nous avançons, nous réalisons soudain que nous nous sommes perdus. Nous prenons le temps de reconsidérer une dernière fois nos objectifs, itérons notre wireframe pour parvenir à en faire émerger le design.

L’élément le plus important dans notre projet est de parvenir à communiquer de manière efficace avec notre utilisateur. Nous souhaitons d’une part que notre application réponde à ses besoins, mais surtout qu’il prenne du plaisir à l’utiliser. Pour cela, nous avons essayer de mettre en place plusieurs principes :

  1. Le choix des couleurs est complexe. Nous devions parvenir à trouver une palette de couleur qui conviennt à l’imagerie de la nourriture. Chacun sait que chaque couleur a une série d’émotion qui lui est associée. Le rouge, par exemple, est associé au sang, à la colère, mais aussi au sucre, aux fruits, et donc au plaisir de manger. Le vert, allié au blanc, évoque la fraîcheur des aliments, le bleu évoque le calme, etc. Nous avons donc employer les couleurs adaptées au sentiment que nous essayions de faire transparaître.

2. Dans le livre “Designing for Emotion”, Aarron Walter a écrit : “To engage your audience emotionally, you must let your brand’s personality show”.
Nous avons donc adapter notre manière de rédiger les recettes, de sorte à ce qu’il touche le persona que nous nous sommes fixés: Des gens de notre âge. Nous avons ajouter de petites blagues, et ajouter des notes à l’intention du lecteur, pour qu’il ai le sentiment de discuter avec un humain, et non une machine.

3. Nous avons essayer de faire en sorte que l’utilisation de notre application soit rapide, de sorte à ce que notre utilisateur ne perde pas patience, et continue d’utiliser nos services. Mais il fallait également qu’il ai un feedback de l’interface, nous avons donc ajouter des animations sur les différentes icônes.

4. Le plus complexe, en définitive, est d’appliquer toutes nos bonnes idées.

Puis vient l’étape du code :

Après avoir définit l’application dans son ensemble l’application, nous sommes enfin passés au code. Nous avons d’abord isolés et codés les différentes fonctionalités tels que le swipe, ou le slide, les différentes animations, puis nous avons réunis le tout sur l’adresse finale de notre application. Nous devrons y appliquer le design, et l’application serait terminée.
Nous avons crées une landing page présentant l’application utilisée sur trois étapes différentes, et repris notre baseline et notre affiche.

Notre plus grand adversaire ? Le temps

Je pense que nous aurions gagner a avoir un peu plus de temps pour parfaire notre intégration, les deux semaines de vacance ne nous ont pas aidés à garder un rythme sain dans la création de notre appli.
Nous avons eu également des difficultés à prendre les décisions finales quant au design, peur d’écraser l’élan des uns, et des autres, et particulièrement lorsqu’il s’agissait de se répartir les tâches.

Nous aimerions tout de même remercier Arno pour son suivis, et Mr.Kishi pour son aide javascriptienne précieuse.


—L’équipe Zinui —