SpaceTour — L’horizon du trou noir 4/5

Étude de cas du projet iLab

Image for post
Image for post
Disque d’accrétion du trou noir M87*, photographié par l’Event Horizon Téléscope en 2017 (Source : https://fr.wikipedia.org/wiki/Trou_noir#/media/Fichier:Black_hole_-_Messier_87_crop_max_res.jpg )

Une trajectoire mal alignée

Grâce aux nombreuses remarques exprimées par nos professeurs, nous comprîmes alors que, malgré ses couleurs attrayantes et son aspect ludique, notre projet “SpaceTour” ne possédait que faiblement un aspect pédagogique, qui permettrait aux enfants de découvrir la gravité et principalement de la comprendre.

Stylisation des planètes

Il est évident que pour des raisons de droits d’auteurs, nous ne pouvions pas récupérer des images de planètes existantes. De plus, nous voulions des planètes colorées pour que ce soit plus léger et agréable à regarder pour les enfants.

Image for post
Image for post
Images de Saturne / Jupiter / Terre
Image for post
Image for post
Nos illustrations de Saturne / Jupiter / Terre

Personnification de l’espace

Grâce aux vidéos que nous avions regardées au début du projet, expliquant plusieurs méthodes pour construire des interfaces qui captivent l’attention des enfants et qui les aident à apprendre et/ou à comprendre certains aspects d’un sujet donné, l’un des éléments phares était de “mettre un visage” quand cela était possible. L’enfant sera plus attentif si la voix/le texte qui lui parle a une forme, plus particulièrement la forme d’un visage humanoïde.

Image for post
Image for post
Voici une première ébauche de discussion avec notre petit alien. Une autre idée pourrait être de changer le cadre de couleur en fonction de ce qu’il raconter (par exemple, bleu pour contenu, rouge pour astuces de jeu). À noter que le personnage n’est pas nôtre, et qu’il aura une toute autre forme par la suite. (Source : https://www.deviantart.com/d-mac/art/Star-Wars-Aliens-429619506)

Le code et les difficultés qui l’accompagnent

Une fois que le concept du jeu était clair dans nos têtes, il fallait qu’on s’attarde sur le code. Nous devions rendre différentes choses fonctionnelles. La priorité était de faire en sorte que le vaisseau soit pilotable. Après s’être renseigné via plusieurs articles ou vidéos, on parvenait à faire bouger le vaisseau via des écouteurs d’événements. Cependant le déplacement était très peu fluide et réactif et rappelait trop les vieux jeux arcades comme Space Invaders ou Pacman. Le résultat était donc loin d’être satisfaisant. On s’est donc dirigé vers une autre option : utiliser un canvas. Ce dernier est un composant permettant d’effectuer des rendus dynamiques d’images en HTML. C’est exactement ce dont nous avions besoin afin de rendre notre jeu plus smooth.

De la physique dans le code

Concernant le développement même de notre jeu, une autre remarque de nos professeurs attira notre attention : utiliser des véritables équations mathématiques afin de mettre en œuvre un moteur physique authentique et fonctionnel.

Image for post
Image for post
Voici un exemple d’équations physiques mises en oeuvre pour donner une vraisemblance de collision et de gravitation (source : https://towardsdatascience.com/implementing-2d-physics-in-javascript-860a7b152785)

Le tableau de bord du vaisseau

Concernant notre application physique, l’une des idées que nous avions était d’opter pour un ensemble de joysticks différents, destinés à deux joueurs : l’un dirigerait le déplacement sur l’axe des abscisses, et l’autre, permettrait de contrôler la vitesse de déplacement.

Un logo spatial

SpaceTour c’est bien, avec un visuel c’est mieux.

Image for post
Image for post
Quelques pistes de logos
Image for post
Image for post
Le logo choisi
Image for post
Image for post
Le logo final

Premières images

Image for post
Image for post
AstronautesEnDevenir.jpg

Written by

Testeur de cookies & jeune apprenti en infographie

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store