IOLCE — Case study

From AI to robots, from apps to wearables — let’s design for everyone, OK? — Robin Christopherson

Yassine Karim Allah
7 min readNov 4, 2018

Mise en contexte

14/09/2018

Ça y est la première c’est fini ! Il est temps d’entrer en deuxième année, en DWM ! Et à peine arriver que voilà déjà notre premier gros projet : IOLCE (ou input/output Lire et communiquer sur écran).

Ce projet consiste concrètement à regarder une parmi quatre conférences sur le web (en anglais sinon c’est pas drôle). Il faut ensuite la traduire et la résumé en un site de deux pages. On est tout de suite mis dans le bain et il faut maintenant former un groupe de quatre.

Notre groupe est donc composé de Fiona Miele, Maxime Fondu, Mary Lucien et de moi même. Certains d’entre nous (dont moi) ne maîtrisent pas forcément le web contrairement à d’autres mais cela va permettre de nous améliorer et d’apprendre les uns des autres. Nous avons donc commencé par choisir notre conférence : From AI to robots, from apps to wearables — let’s design for everyone, OK? — Robin Christopherson

L’élaboration du contenu

05,12,19/10/2018

Au début, on a décidé chacun de notre côté de visionner une première fois la conférence puis plusieurs fois afin de prendre individuellement des notes pour les mettre ensuite en commun.

Ensuite nous avons établi une table des matières dans un google doc avec lesquels développer et on s’est réparti différentes parties pour commencer à les approfondir.

On a eu chacun un professeur qui s’occupait de suivre notre progression sur notre conférence. Dans notre cas c’était monsieur Thronte notre coordinateur durant cet atelier. Il a jeter un oeil une première fois à notre travail et il avait remarqué des problèmes de sens dans nos phrases. En effet, notre formulation n’était pas très claire bien que le message était présent. Ensuite le second problème qui se dressait devant nous c’était le manque cruel de titre dans nos sujets ainsi qu’un fil conducteur solide entre les sujets.

On a donc commencé les modifications ! Et au bout du troisième et dernier jour de workshop on avait enfin terminé cette première étape ! Joie ! Il était temps maintenant de partir chacun de notre côté pour réfléchir à l’étape suivante du travail…

Le design

La décision la plus dure selon moi c’était celle concernant quelle typographie employer… Je voulais une typo qui colle bien avec le thème de la conférence qui est la technologie donc après quelques essais de combinaisons de typographies maladroites, j’ai choisi de choisir une valeur sure en prenant la Lato pour les titres et l’Open Sans pour mes paragraphes

Ensuite, mon réflexe a été d’aller sur le net (Pinterest, Dribble, etc) m’inspirer et de voir ce qui se faisait niveau design. À savoir que pour le moment nous devons seulement en élaborer un sous format mobile. J’ai voulu reprendre les couleurs du site d’Abilitynet (la société où bosse notre confériencer) et me les réapproprier pour mon site.

Après quelques essais pas fameux sur le logiciel Sketch, je trouve enfin une idée simple mais efficace et je décide de rester sur celle ci.

J’ai illustré ma page à l’aide d’images libres de droit et de photos du conférencier.
Le noir pour les citations.

Une fois cela fait, il ne restait plus que l’ultime étape du travail et que je redoutais le plus…

Le code

Vous l’aurez compris, la partie code fut rude… On a dû faire deux exercices avec monsieur Thronte “Roon” et “Visionnary” et ils m’ont pas mal aidé à m’exercer sur tous ce qu’on avait appris au cours de Front D. J’ai donc appliqué tous ça sur mon site et au début tout se positionnait plutôt bien mais lorsqu’il fallu ajouter des interactions avec du css via les boutons (une idée de quizz que l’on a eu avec le groupe durant le workshop) ça a commencer à pas mal se compliquer. Ajoutez à cela le javascript qui est aussi pas mal problématique pour moi.

En conclusion, la conception de ma page web fut rude et j’ai probablement fait énormément de mauvais choix mais je pense que ça m’a appris ce qu’était le travail de groupe et ses avantages ainsi que ces inconvénients. Et surtout je me suis rendu compte que malgré les difficultés, j’ai réellement adoré travailler sur ce projet ! Je suis un peu déçu de ne pas avoir pu transposer tous ce que je voulais à cause de mon niveau en code mais ça me motive à m’améliorer pour en donner encore plus !

iolce, le retour

17/01/2019

Après moulte péripéties, nous voici en 2019 et arrive enfin la veille de la remise finale du projet. Lors du premier jury, ilnous avait été demandé de faire la rencontre de différents groupes et de les interviewer sur leur iolce.

#7 From AI to robots, apps to wearables…

Je décide d’interviewer en premier une membre du groupe 7 qui a travaillait sur la même conférence que moi. Au niveau du matériel ça a été dur pour eux car certains n’avait pas de portable sous la main mais heureusement il y avait une très bonne entraide au sein du groupe. Pour la partie individuelle elle a été pas mal handicapée par le fait de n’avoir jamais codé auparavant. Malgré ça le code l’intéresse pas mal bien qu’elle ait préféré le design et la composition du contenu. Elle aurait préféré que l’atelier commence plus tard durant l’année pour qu’elle puisse mieux acquérir de connaissances et mieux s’y préparer. Et la conférence lui semblait assez dispersée dans son contenu.

#5 What History’s female internet Pioneers can teach us about tomorrow

Le second groupe à plutôt bien commencer l’atelier en se répartissant les tâches puis en mettant en commun leur contenu. Lors de la partie individuelle, ils se sont senti livré à eux-mêmes. Leur partie préférée du projet est le design. Ils ont eu pas mal de difficultés avec le code mais ont reçu de l’aide de la part des professeurs. Comme le groupe précédent ils auraient préféré une période de transition avant d’être lâché dans la nature. Et enfin ce qu’ils ont retenu de cette conférence c’est que les femmes aussi ont eu leur place dans l’histoire d’internet et qu’il ne faut pas l’oublier.

#12 The internet of natural things

Le troisième groupe a eu la mal chance de perdre un membre qui a abandonné durant l’atelier mais malgré ça ils ne se sont pas laissé décourager et ont bossé dur. Chacun d’entre eux a dû individuellement apprendre à coder et ils ne viennent pas du milieu du graphisme à la base mais ils ont appliqué la matière vue en cours. La partie code fut donc assez compliquée pour eux. Sinon hormis cela, au niveau du travail en général ils se sont plutôt bien débrouillés et ils ont aimé l’atelier même s’ils avaient certaines difficultés en anglais pour comprendre la conférence. Et ce qu’ils retiennent de cette conférence c’est que la technique et internet progressent jusqu’à utiliser la nature et les animaux.

#14 How to build an Atomic Bomb

Le dernier groupe s’est pas mal rapproché durant l’atelier et a trouvé qu’ils se complétaient bien. Malheureusement, le travail seul était plus compliqué durant les vacances. Ils ont en majeure partie préféré la partie design du projet. Le temps était un gros souci pour eux car ils ont eu chacun pas mal de bugs à corriger au niveau du code. Ajouter à ça qu’ils ont voulu faire dès le début un site complexe mais très vite ils se sont rendu compte que ça n’était pas forcément la meilleure chose à faire. Mais au final ils ont plutôt aimé l’atelier car je cite : “on ressent un certain sentiment d’accomplissement”. Ce qu’ils retiendront de cette conférence est qu’un designer doit prendre conscience de l’impact de son travail sur le monde.

La fin d‘une ère et le début d’une nouvelle

Personnellement la suite et fin de ce projet furent enrichissantes car je me rend compte que j’ai faits des progrès aussi minces soient-ils. Je me sens plus à l’aise dans la conception d’un site web bien que je me rende compte que je ne fais pas encore tous correctement. Pour ce qui est de rédiger du contenu, je prends de plus en plus de plaisir à écrire et par-dessus le marché j’améliore mon écriture ce qui est bénéfique au final. Et pour ce qui est du design j’ai eu la chance d’avoir de très bon feedback de la part de mes professeurs et grâce à cela j’ai pu amélioré un design que je pensais terminé. Bien que je me trouve encore limité dans cette partie du projet à cause du fait que je ne sache pas encore coder à la perfection et c’est assez frustrant…

Voilà donc la fin de l’atelier iolce, notre premier vrai site internet. J’espère avoir été à la hauteur des attentes des professeurs et si ce n’est pas le cas je ne perds pas espoir car j’aime vraiment cette option et je compte tout donner pour arriver au bout de l’aventure DWM.

--

--