Rapport TFE #2
Note: Retrouvez mon MVP ici: https://docs.google.com
Nouvelle semaine, nouvelle présentation:
Avant de commencer la rédaction de ce rapport, je vais faire un petit aparté pour rappeler ce qui s’était dit lors de la première semaine du TFE
Durant la première présentation, j’ai pu récupérer pas mal de retours intéressants de la part des différents étudiants de ma classe:
- L’idée de faire un site web d’énigmes est intéressante mais ce qui pourrait être bien, ce serait de rajouter un chronomètre permettant de voir le temps qu’il nous a fallu pour terminer le site.
- Ajouter un côté storytelling.
- Pop-up pour demander le prénom de l’utilisateur, pour lui afficher des messages par la suite genre “Bien joué x”.
Comme déjà indiqué dans mon premier rapport TFE, Toutes ces remarques m’ont permis de revoir certaines choses de mon projet à venir ou tout simplement d’y rajouter des petits composants intéressants.
C’est donc avec ces différentes propositions en tête que je me suis lancé dans un brainstorming début de semaine. Avoir une idée concrète de ce que l’on veut est plus qu’important avant de commencer tout autre chose.
L’idée de Storytelling proposée durant la semaine 1 est fort intéressante, cependant je me vois mal élaborer une telle chose pour mon travail de fin d’étude. La raison principale ? Le manque de temps. En effet, en connaissant ma vitesse de production, je sais d’avance que devoir rédiger une histoire, des illustrations, créer différentes énigmes, coder tout ça me demanderait beaucoup trop de temps !
Cet exercice de brainstorming m’a permis de mettre les choses au clair assez rapidement.
- Mon TFE: Création d’un site composé d’énigmes, le but sera de se challenger en arrivant à finir le site en ayant résolu toutes les énigmes le plus rapidement possible. Pour ce faire, un chrono présent sur le site pourra être lancé et s’arrêtera une fois le jeu terminé.
- Ma cible: 10–99 ans, mon site touchera toutes les personnes peu importe leur métier, leur sexe, leur âge, etc
=> Ne visera donc pas une niche en particulier
Cela étant fait, j’ai pu participer à la nouvelle présentation organisée par Monsieur Thronte et Monsieur Distefano de la meilleure des façons qu’il soit.
Au cours de cet appel, j’ai dû présenter mon travail en un bref pitch afin de travailler sur mon “Elevator pitch”. Pour finir, j’ai pu avoir un nouveau retour sur mon projet. Deux choses sont ressorties durant cet entretien:
- Est ce que ton site sera utilisable qu’une fois ? Autrement dit, est ce qu’une fois le site terminé, l’utilisateur aura fini le jeu ou pourra t-on, une fois les énigmes terminées, en choisir de nouvelles ?
- La deuxième chose qui a été mise en avant a été : le partage du site. Vu que mon but premier est de se challenger à résoudre le site le plus rapidement possible avec la présence d’un chronomètre ainsi que de challenger ses amis pour voir s’ils le résoudront plus rapidement nous. Il va falloir penser à un moyen de partager le site sans passer par une capture d’écran manuelle, aller sur son réseau social préféré et envoyer sa capture d’écran à son ami en lui demandant de faire mieux que nous !
Voilà de quoi me faire réfléchir les prochains jours sur ma manière d’aborder ces différentes problématiques.
Un peu de design
Une chose est sûre, il va me falloir un landing page. C’est pourquoi avant de passer à la création de mon site avec le jeu. Je vais réaliser dans un premier temps la landing page, celle-ci me permettra d’avoir déjà une certaine base graphique.
Je passe donc une partie de ma journée à rédiger le contenu de la dite page. Une fois cela fait, je passe donc une le reste de mon temps à la création du design. J’avais déjà en tête l’idée de réaliser quelque chose d’assez épuré, avec une typo assez ronde, des couleurs assez pastelles ainsi que la présence d’illustrations SVG voire en 3D.
La présence de 2 boutons “jouer” n’est pas une erreur de ma part mais bien une action réfléchie de ma part. Un call to action dès le début pour permettre à l’utilisateur qui n’a pas envie de scroller tout en bas de ma page d’être dirigé vers le jeu. Ainsi qu’un call to action à la fin de manière à renvoyer l’utilisateur vers le jeu une fois la lecture de la landing page terminée.
Pour finir je suis parti sur des illustrations SVG afin de rester dans le même style que le lottie présent de la section «Un jeu d’énigmes». Vous remarquerez assez rapidement qu’il manque encore un peu de texte ici et là. Mais pas de stress je compte bien finir tout cela durant les semaines à venir.
Press Start
Il est enfin temps de passer à la création du jeu d’énigme. Enfin… je dis « il est enfin temps » mais en vrai cela fait déjà un moment que j’ai commencé à y travailler. Vu que je faisais très peu de code durant mon stage j’ai décidé de coder le soir en rentrant chez moi afin de ne pas trop perdre la main. J’ai donc eux l’idée de commencer à coder une sorte de jeu « énigmes ».
Bon ok le site ne présente que 2 sections et n’est clairement pas abouti. Mais tout ceci m’a donné envie de faire mon travail de fin d’étude sur ce sujet !
La première étape a donc été de retrouver mon dossier avec mes fichiers et de le rouvrir dans Visual Studio Code. Analyser mes fichiers afin de me remettre dedans (ainsi que de corriger quelques erreurs de syntaxe HTML) et ensuite me mettre à coder.
La première chose que je décide de faire concerne une remarque qui m’a été faite lors de la première présentation : Ajouter une section qui demande à l’utilisateur son prénom dans le but qu’au moment d’une bonne réponse le site lui indique : “Bonne réponse” + prenom_utilisateur.
La deuxième chose sur laquelle je décide de me concentrer concerne l’option du chrono. Il me semblait plus judicieux de laisser l’opportunité à l’utilisateur d’activer ou non le chronomètre.
Résultat:
PAUSE ! Souvenez-vous de ce que j’avais dit plus haut concernant ma cible:
- Ma cible: 10–99 ans, mon site touchera toutes les personnes peu importe leur métier, leur sexe, leur âge, etc
=> Ne visera donc pas une niche en particulier
Mon site ne touche donc pas de niche en particulier, donc demander à l’utilisateur de sortir la console de développement ainsi que l’inspecteur ne sera pas nécessaire !
Il m’a donc été obligé d’indiquer à l’utilisateur que l’utilisation de l’inspecteur n’était pas autorisée
Dans le futur je compte également intégrer des clés qui permettront à l’utilisateur d’accéder à la suite du jeu. Ces différentes clés ouvriront des serrures et ainsi de débloquer la suite du jeu. Ces clés seront stockées dans l’inventaire de l’utilisateur.
Stay positive, work hard, make it happen
Les semaines qui suivent vont s’annoncer assez chargées:
- Réaliser la suite de mon contenu de ma Landing Page et terminer son intégration.
- travailler sur la suite du jeu: réaliser de nouvelles énigmes, mettre en place l’inventaire de l’utilisateur, ajouter les clés, mettre en place l’interaction: énigme trouvée -> Vous gagnez une clé.
“ Stay positive, work hard, make it happen ”
