Version textuelle

Présentation :

Cette application sur les noms de couleurs est proposée aux parents pour jouer avec de jeunes enfants. Le joueur doit cliquer sur le carré de couleur qui correspond au nom affiché. Les couleurs sont tirées au hasard dans une liste.

Le jeu et l'application ont été créés par Emeline, John et Yousra à l'occasion d'un atelier de programamtion au CNAM, puis remixés par Pierre pour jouer avec la palette des couleurs de wikipedia.

Vous pouvez télécharger l'application (smartphones et tablettes android) en scannant le QR code depuis votre smartphone ou tabette Android.

Ce que vous allez faire :

Vous allez réaliser ce jeu avec des notions qui doivent vous être familières

• les variables,
• les boucles, les conditions,
• les procédures.

et d'autres que vous devez avoir déjà abordées

• les listes, les index, les valeurs (voir § "notions de référence" du cours)
• et les blocs qui permettent de les manipuler (créer, choisir, ...)

ce qui sera peut-être nouveau, c'est :

• l'utilisation des listes de listes pour organiser les données
• et l'utilisation du format JSON pour définir les données puis les décoder en variables App Inventor.

Ce que vous allez apprendre (notions abordées) :

Si vous ne connaissez pas les listes et les blocs qui les manipulent, nous vous recommandons de regarder le chapitre "notions de référence" de ce cours et la première vidéo sur ce sujet.

Ce que nous allons voir, qui sera probablement nouveau, c'est la manière de récupérer une liste de 200 couleurs depuis un site web, sous forme de table, de les convertir dans le format JSON, pour ensuite les importer dans des variables App Inventor.

JSON (ou Javascript Object NOtation) est un format très utilisé dans les échanges de données sur internet. Vous aurez l'occasion de l'utiliser dans les échanges avec les serveurs de données, dont les votres (Dropbox, drive, ...). Les serveurs de données JSON sont très nombreux sur le Web. On trouve à peu près tout ce qu'on veut.

Ressources en entrée :

Vous pouvez créer un nouveau projet et suivre la vidéo, mais il sera plus pratique de partir d'un canevas dans lequel on a déjà défini le design, la liste des couleurs au format JSON et les principales variables. Ce sont les mêmes que dans la vidéo.

Ce canevas est accessible à l'adresse suivante :
http://onvaessayer.org/appinventor?repo=colorWorld_start

Si vous souhaitez accéder à la liste des couleurs au format JSON, elle se trouve ici

Réalisation :

Pour la réalisation, vous pouvez suivre la vidéo qui suit ou vous appuyer sur la version textuelle accessible via le bouton en haut de page.

Extensions proposées

• énoncer la couleur à haute voix avec un bloc "texte à parole"
• retrouver une couleur par synthèse additive
• retrouver une couleur par synthèse soustractive
• à compléter

Quiz (auto contrôle):

à compléter