L’avenir du Canada en réalité virtuelle

Prérequis :

Recommandé : Initiez les personnes apprenantes au HTML et au CSS avant d’enseigner cette leçon. Pour ce faire, nous vous conseillons les leçons « Site Web sur l’innovation », « Site Web de tourisme » ou « Profil de superhéros ».

Technologie :

• Vous aurez besoin d’ordinateurs et d’une connexion à Internet pour cette leçon.

Avant la leçon...

• Révisez les concepts de programmation et exercez-vous à les expliquer au groupe avec assurance.
• Visionnez la vidéo « Content 101 : Glitch ».
• Demandez aux personnes apprenantes de se créer un compte Github à l'adresse github.com → Nous n’irons pas directement sur Github, mais nous utiliserons ce compte pour enregistrer nos sites Web.
• Consultez cet exemple de projet d’apprenant.
• Imprimez le corrigé d'avance.
• Réalisez le projet principal de la leçon et assurez-vous de bien comprendre les étapes de création.

Conçue en partenariat avec ImagneNATIVE.

Introduction

Profil de l'artiste tiré d’ImagineNATIVE :

Scott Benesiinaabandan est un artiste intermédia anishinabe travaillant principalement avec la photographie, la vidéo, l’audio et l'estampe. Il a fait des résidences d’artiste à l’étranger, notamment au Parramatta Artist Studios en Australie, à la Context Gallery à Derry en Irlande du Nord, à l’Université Lethbridge et à l’Institut royal de technologie. Il a aussi réalisé des projets collaboratifs au Royaume-Uni et en Irlande. Scott est actuellement installé à Montréal.

À propos de « 2167 » : À quoi ressemble l'avenir du Canada? Pour le projet « 2167 », cinq artistes autochtones ont reçu le mandat d’imaginer le Canada dans 150 ans à l'aide de médias immersifs. Scott Benesiinaabandan a répondu à l'appel en créant une expérience de réalité virtuelle nommée « Blueberry Pie under the Martian Sky » (Tarte aux bleuets sous le ciel martien).

Description du site d’ImagineNATIVE : « ”Blueberry Pie Under the Martian Sky” nous fait vivre une légende anishinabe prophétique dans laquelle un jeune garçon traverse un passage (trou de ver) le ramenant au lieu d’origine de son peuple. L’histoire aborde aussi la revitalisation, la croissance et l’évolution de la langue anishinabe. »

Visionnez l'enregistrement de l'expérience de réalité virtuelle de Scott.

Remarque : Il s’agit d’un enregistrement vidéo du projet, pas de l'expérience de réalité virtuelle elle-même.

Réflexion

Écrivez au tableau des symboles et des thèmes communs ainsi que des mots décrivant l’œuvre.

Questions potentielles :

• Quelle a été votre première réaction en voyant cette œuvre virtuelle?
• Si vous deviez résumer l'expérience en un mot, quel mot choisiriez-vous?
• Quels symboles ou thèmes ressortent le plus souvent dans cette œuvre?
• Quels liens pouvez-vous faire entre le choix de média de l'artiste et le thème de l'œuvre?

Si vous n’avez pas eu besoin d’initier les personnes apprenantes au HTML et au CSS avant la leçon et qu’il vous reste un peu de temps, poursuivez la discussion en parlant de l’empathie et des enjeux éthiques et sociaux liés à la réalité virtuelle. Par exemple, vous pourriez parler de Mark Zuckerberg et de sa visite en réalité virtuelle à Puerto Rico controversée (bit.ly/facebook-puerto-rico).

• Pourquoi certaine personnes ont jugé que la démo de réalité virtuelle de Facebook était inappropriée?
• Quelles sont les différences entre la démo de Facebook et l’expérience de réalité virtuelle de Scott Benesiinaabandan?

Nous allons créer notre propre œuvre virtuelle dans A-Frame qui sera basée sur l’un des thèmes ou des symboles abordés.

*Décidez d’un thème en grand groupe ou laissez chaque personne choisir son propre thème inspiré de l'exemple de projet de réalité virtuelle.

Programmation en groupe

1. Allez à l'adresse glitch.com/~aframe.
2. Sélectionnez « View Source » pour ouvrir le projet.
3. Cliquez sur « Show Live » pour avoir un aperçu du projet.
4. Naviguez sur la scène en appuyant sur les touches W, A, S et D ou les flèches du clavier. Cliquez et faites glisser pour tourner.
5. Revenez à l’onglet du projet et ouvrez « index.html ».
6. Faites quelques-uns des exercices suivants :
   1. Modifiez la couleur de la sphère.
   2. Modifiez la position du cylindre.
   3. Changez les propriétés de rotation de la boîte.
7. Rappelez aux personnes apprenantes de toujours essayer leur projet en affichant l’aperçu chaque fois qu’elles modifient le code.
8. Demandez à des volontaires de partager leur solution avec le reste du groupe.
9. Question : « Qu'avons-nous appris à propos de l'attribut de position? »
   1. Il est mesuré en mètres.
   2. X = gauche-droite
   3. Y = haut-bas
   4. Z = avant-arrière

Activité

Demandez aux personnes apprenantes d’ouvrir le projet de départ.

Utilisez le corrigé pour réaliser les étapes suivantes avec les personnes apprenantes :

• Changer l'image d’arrière-plan
• Ajouter plus de formes 3D
• Ajouter des textures
• Ajouter des animations (si le temps vous le permet)
• Enregistrer et partager les projets

*Pour toute question concernant A-Frame, consultez la documentation.

*Plan d’urgence (option hors ligne) : Installez un éditeur de texte (comme atom.io) et téléchargez les fichiers du projet.

• Demandez aux personnes apprenantes d’écrire un commentaire d’artiste sur papier ou en commentaire dans leur code. Par exemple : « Cette œuvre s'appelle [Titre de l'œuvre]. Il s'agit d’une expérience de réalité virtuelle WebVR créée avec A-Frame en HTML. J'ai décidé de [décision de conception] parce que [raison]. »
• Ensemble, établissez des critères de réussite après avoir exploré l’outil et fait l'exercice de programmation en groupe. Demandez aux personnes apprenantes d’évaluer leurs pairs et de faire des commentaires constructifs afin qu’elles puissent réviser et corriger leur œuvre avant de soumettre la version finale.

• Si vous avez accès à des casques Google Cardboard, demandez aux personnes apprenantes d’essayer les projets de réalité virtuelle créés par d’autres personnes de la classe afin de vivre l'expérience d’immersion complète.
• Consultez le portfolio de Scott et faites une petite « chasse aux trésors » pour trouver des thèmes et des symboles communs à ses différentes œuvres.
• Écoutez ce que l'artiste a à dire sur le sujet! Regardez cette vidéo de Scott expliquant son projet de réalité virtuelle à des personnes apprenantes après un exercice d’interprétation de l'œuvre.
• Intégration des mathématiques : Calculez l’aire et le volume des solides 3D des projets des personnes apprenantes ou du projet de programmation en groupe avec A-Frame en utilisant les pixels comme unité de mesure. Comparez l'aire et le volume à ceux de prismes, de cylindres, de cônes ou de sphères.

ImagineNATIVE:
http://www.imaginenative.org/

Scott Benesiinaabandan
http://www.benesiinaabandan.com/

Expérience RV de Scott
https://fabricofdigitallife.com/index.php/Detail/objects/3604

Scott Benesiinaabandan: Discussion d’artiste + Conversation avec Danielle Printup
https://vimeo.com/247365954

TIFF
https://www.tiff.net/

Pinnguaq
https://pinnguaq.com/

Initiative For Indigenous Futures
http://indigenousfutures.net/

AbTec
http://abtec.org

Mark Zuckerberg visite un Puerto Rico ravagé par Maria en réalité virtuelle
https://fr.news.yahoo.com/mark-zuckerberg-visite-puerto-rico-093025886.html

Enseignez des leçons qui sont liées à votre programme existant! https://bit.ly/ActivitésCLC_FR