Case Study

01

Introduction au TFA

Peu avant les vacances de Pâques 2019 on nous annonce en quoi consiste notre TFA. Pour ce travail, contrairement aux autres travaux majeurs de l’année, nous étions libres du choix du sujet. Tout en gardant en tête qu’il s’agit d’un side project qui a pour but de mettre en avant nos compétences et qualités dans l’ultime objectif de trouver un stage pour l’année prochaine.

02

Que faire ?

L’objectif dans ce projet était pour moi de trouver un sujet qui me plaisait avant tout. J’avais l’envie dès le début de faire un site plus axé “historique”, en illustrant que ce soit un objet, un domaine, ou quoi que ce soit d’autre. Je me suis alors attelé à la recherche d’un sujet qui me plaisait. Le thème du cinéma c’est assez vite détaché comme étant celui dont je voulais traiter.

image représentant une caméra de cinéma vectorisée
03

L'idée concrètement

L’idée étant donc d’illustrer de façon historique le thème du cinéma. En premiers lieux j’ai imaginé utiliser le principe d’une ligne du temps pour guider mon projet. Après un petit peu de réflexion et de recherche d’inspiration, je me suis penché sur le modèle d’un calendrier pour illustrer mon domaine.

image représentant un calendrier vectorisé
04

Par où commencer ?

Une fois mon idée un peu plus concrète, la première chose que j’ai dû faire était d’imaginer comment je voulais agencer les informations et le contenu. Après ça est venu le temps de préparer le contenu que je voulais sur le site. Voulant illustrer un événement pour chaque jour de l’année, il me fallait donc un total de 365 événements. J’ai donc utilisé différents sites répertoriant des événements par date et en extraire 1 fait jugé par moi “marquant” dans le cinéma. J’ai ainsi créé ma propre base de données contenant tous les événements sélectionnés avec les informations dont j’avais besoin.

image représentant l'icone d'un fichier de type JSON qui contiendrait les informations nécessaires
05

Le design

Pour ce projet j’imaginais un style graphique minimaliste et épuré principalement basé sur de la typographie, avec de grands titres ayant une graisse de caractère assez importante. Pour les couleurs, je suis resté dans quelque chose de très sobre en incluant exclusivement des nuances de noir et de blanc.

06

Le développement

La première étape dans le développement du site était de créer le Javascript qui allait servir de base au site sachant qu’il allait générer la majorité du contenu. C’est probablement l’étape qui m’a pris le plus temps dans le développement, le JS n’étant pas le langage avec lequel je suis le plus familier, il m’a fallu un certain temps pour faire fonctionner à 100% le site. Cependant je n’ai pas vécu cela comme une perte de temps, je voyais ça plutôt comme un exercice d’apprentissage dans un langage dans lequel j’ai la volonté de m’améliorer.

Ensuite est venu le temps de coder le CSS du site, un langage avec lequel je suis un peu plus familier et qui rendit cette étape moins laborieuse que la précédente.