Case-study

IOL... quoi?

J’ai dit IOLCE! Ça veut dire «Input, output, lire et communiquer sur écran». Ce projet va donc nous aider à communiquer un contenu sur base d’une conférence choisie. Qui sera suivie d’un travail de groupe pour résumer brièvement (500 caractères) la conférence. Mon choix s’est porté sur le conférencier Jeffrey Zeldman et sa présentation sur le “Slow design for an anxious world“.

La conférence

J’ai, bien sûr, commencé par faire une première écoute de la conférence sur le Slow Design afin d’avoir un premier avis sur le thème que j’ai sélectionné. Après cette première heure de visionnage, j’en ai tiré pas mal d'informations sur le sujet et Jeffrey Zeldman, notamment sur sa perception actuelle du web.

Pour la seconde écoute, j’ai fait une prise de note la plus exhaustive possible afin de bien comprendre le contexte dans lequel le conférencier veut mettre en place ce fameux “Slow design”.

img conférence

Conférence de Jeffrey Zeldman

Il nous explique donc le fast et le slow design ainsi que ses critères, dont nous avons déjà fait le détail dans la partie personnelle. La rédaction du résumé collectif a été faite avec le reste du groupe (Dimitri, Chaimae, Cyril, Morgan).

img resumé collectif

Résumé collectif

Les premiers pas

Sur base des critères du Slow design que j’ai acquis lors de la conférence de Jeffrey Zeldman, je commence à penser à des designs qui reprennent ces différents critères au maximum tout en respectant les consignes du projet IOLCE.

img critères slow design

Critères du Slow design

Les couleurs

Pour commencer, j’ai d’abord choisi une palette de couleur minimaliste. Il me fallait simplement deux couleurs récurrentes et une couleur de contraste.

img couleurs

Mon choix de couleurs

Le logo

Ensuite, j’ai développé le logo qui doit contenir des formes géométriques simples. Je me suis donc basé sur un mélange de typo et de triangles simples, toujours dans un esprit minimaliste.

img dev logo

Développement de mon logo

La typo et les fonts

Après avoir fini ces deux éléments-là, je me concentrais alors sur la partie écrite. Grâce à mes notes sur la conférence, j’ai pu faire une rédaction personnelle sur ce que j’ai appris lors de cette conférence.

Ensuite il a fallu décider des différentes fonts que j’allais utiliser pour mes titres et pour mes paragraphes. Je suis parti sur une font sans-serif pour les titres et une avec serif pour le contenu écrit. Le but de la sans-serif est de mettre de grande typo tout en gardant une bonne lisibilité et évidemment rester coller aux critères du Slow design.

img des fonts

Les fonts choisies

J’ai mis en place une hiérarchie de titre, sous-titre, etc. Comme conseiller par Jeffrey Zeldman.

img hierarchie

Ma hiérarchie

UI-Kit et prototype

Ce n’est qu’ici que commencent vraiment les premières maquettes du projet. Mon premier objectif était de faire un maximum d’espace blanc afin d’aérer le plus possible le contenu de mes rédactions pour augmenter la concentration et la compréhension du visiteur. Voilà un autre critère de Jeffrey Zeldman. On enlève tout ce qui pourrait créer une friction avec la lecture du contenu.

img des prototypes

Les prototypes et UI-Kits

Les problèmes

J’ai rencontré plusieurs soucis lors de l’intégration des visuels notamment à cause de la contrainte de l’utilisation des CSS grid. Ce qui m’a obligé à changer la disposition de mes éléments et de là, réduire les espaces blancs qui étaient beaucoup plus importants lors des premières versions.

img HTML/CSS

HTML/CSS

Ensuite une légère contrainte dans le temps qui m’a obligé à ne pas pouvoir éprouver mon design et mon ergonomie comme je le voudrais. Notamment dans le contenu et sacompréhension.

img montre

Contre la montre

Je pense que ces différents problèmes pourraient contribuer à l’échec de ce projet. Mais peut-être est-ce l’inverse et se sera des critères de réussite ?

img interrogation

Interrogation

Conclusion IOLCE

Pour conclure, je me suis fortement inspiré des critères principaux du Slow design, mais tout en gardant un visuel et un contenu qui va faire en sorte que ce site reste unique dans sa conception et dans la réflexion derrière. Malgré ça, j’ai rencontré quelques problèmes.