Mon Design Process

Cette page vous présente ma méthode de travail et vous explique l'élaboration et la réalisation de A à Z du projet choisi 'eCampus'.

L’univers eCampus

Ce projet est réalisé dans le cadre du cours de dessin.

Suivez le guide !

Le point de départ

Recherche d'idées

Ma première étape dans un projet est de trouver des idées, des concepts autour du sujet. Je cherche les éléments qui pourraient rendre le projet original, intéressant pour le client et pour le site. Je prépare le contenu qui sera utile au projet.

Pour ce faire, j'ai besoin d'inspiration en naviguant sur la toile.

icone de recherche

La phase de conception

Réalisation de croquis

Une fois l’idée bien présente, je réalise des croquis de ce que j'ai imaginé, je fais plusieurs versions afin d'avoir diverses possibilités à ma disposition. C'est une étape importante que j'ai parfois tendance à zapper pour passer directement à un logiciel de vectorisation.

Mais lorsque je me rends compte que je perds beaucoup de temps, je dois alors revenir à l'étape croquis.

Les croquis établis et le contenu trouvé, je les soumets auprès du client. Des retouches peuvent à ce moment être apportées au projet afin de le peaufiner, de l'améliorer ou le cas échéant de le recommencer totalement.

Une fois validé, je peux commencer la création et le design du site sur wireframes puis layouts.

Les croquis, première étape de conception eCampus-croquis1
eCampus-croquis2

La phase de création

L'accord du client en fusion avec mes idées me permet alors de passer à cette étape en commencant par la création d’une grille indispensable au bon ordonnancement du contenu.

eCampus-wireframe
eCampus-layout1
eCampus-layout2
eCampus-layout3
eCampus-layout4
eCampus-layout5

La phase de réalisation

Je cherche la typographie la plus adéquate au thème du projet ainsi qu'aux bonnes pratiques du web et place mon contenu dans mes layouts. J'obtiens ainsi un aperçu du design final.

Je passe ensuite à la codification du site internet. J'intègre du rythme où cela peut apporter une plus value au contenu présenté.

eCampus-grillé eCampus "grillé"

Pour vivre avec son temps, l'optimisation du site selon les différents écrans existants est vivement conseillée (tablettes, smartphones, grands écrans...). En un mot, le rendre responsive.

eCampus-responsive eCampus responsive
eCampus-sur differents écrans

Mise en ligne

Avant de mettre en ligne le site, je vérifie que mon code est bien valide 'w3c'. Ensuite, si j'en ai la possibilité, j'effectue un test d'expérience utilisateurs. Ce test est toujours le bienvenu afin de vérifier si le site est compréhensible par notre public cible !

En finalité, une fois que le site est terminé, débogué, optimisé et validé, il reste à le présenter au client et à le mettre en ligne.

eCampus-online