/Astro

Astro, le futur support de datavisualisation astronomique à visée pédagogique

Primary LanguageJavaScript

Astro - Projet Dataviz

Astro, le futur support de datavisualisation astronomique à visée pédagogique

Astro, c'est quoi ?

Astro est un site intéractif de Datavisualisation, présentant de nombreuses données sur certains astres qui peuplent notre ciel, comme la Lune, l'ISS, et la planète Mars. Il a pour objectif une visée éducationelle, dans le but de familiariser notre cible avec les prémises de l'observation spatiale.

Contenu

Système de recherche en balayant l'écran grâce au pointeur de la souris qui éclaire le ciel pour découvrir les astres dissimulés. Système d'animation au scroll pour chaque astres, avec un menu de navigation, et un questionnaire sur les données incluses dans l'animation. Système d'astrodex (dérivé du pokedex) qui permet de recenser les astres découverts tout au long de l'expérience. Un robot (Astrobot) qui explique le storytelling et explique comment naviguer sur les différentes pages en fonction de la progression de l'utilisateur.

Cibles

Le site est développé pour une cible précise: des élèves de CE2 à CM2 (entre 8 et 10 ans) Il a donc fallut adapter les assets, les données et le vocabulaire utilisé pour que notre expérience corresponde à leurs besoins, aux besoins des professeurs et au programme scolaire du 3ème cycle. Ce qui explique également le style cartoonesque de l'expérience, puisque notre cible n'est pas insensible au dessins animés et jeux vidéo.

Contexte d'utilisatioin

Le site est voué à être utilisé lors d'une introduction au cours d'astronomie, en salle informatique, où chaque élève pourrait parcourir l'expérience et en apprendre plus sur l'astronomie. L'expérience est linéaire, pour éviter que les élèves partent dans des directions différentes, et ils sont guidés par l'Astrobot qui explique quoi faire dans chaque situation.

technologies utilisées

  • Technologies web de base: HTML, CSS, JavaScript
  • Librairies utilisées : Lottie-js, Smooth-Scrollbar, State-Machine
  • Stockage des données: fichier JSON (datasets personnalisés)

crédits

Site réalisé dans le cadre du projet de 2ème année de bachelor developpeur et designer interactif web, l'Ecole by CCI.

  • assets: Axel SAGRADO
  • animations: Théo LANGLADE
  • Conception du site: Nils Boisson