Crée ton quizz

Description de l’activité : Dans cette activité, les makers créent une première application sur Thunkable avec pour composant principal le bouton.

Objectifs pédagogiques

Compétences techniques

  • Créer une première application
  • Saisir le principe de construction par écrans
  • Manipuler des boutons, labels, images, et leurs propriétés
  • Coder un changement d’écran conditionnel (si je réponds bien à la question, je vais sur tel écran, sinon je vais sur tel écran)

Compétences design

  • Importer et manipuler des images

Compétences projets

  • Créer une application avec des bascules d’écran de A à Z

La place dans le module

Cette activité est la première activité du module et vient avant l’activité des défis.

Jour 1

Jour 2

Jour 3

Jour 4

Jour 5

1h

🤩

30 min

🤩

30 min

🤩

1h

🤩

Ressources

  • Ressources makers: ici

Matériel

Déroulé de l'activité

Segment 1 (1h): Présentation et introduction à thunkable

 
1/Introduction au module et présentation (10 minutes) 

On démarre l’atelier par un tour de présentation, vous pouvez demandez aux makers s’ ils ont déjà fait de la programmation, avec quel outil / logiciel ?

Vous pouvez également leur demander de parler de leurs centres d’intérêt, cela pourra être très utile pour adapter les projets que vos makers créeront lors de ce module. Si c’est un premier atelier ou le premier jour de stage vous pouvez finir cette introduction en présentant la charte.

Une fois les présentations faites , vous pouvez très rapidement présenter le module et ce que vous allez faire durant ces 10 ateliers / 5 jours.

 

2/Brainstorming (10 minutes)

[Animateur]

Qu’est-ce qu’une appli mobile selon vous ? Pouvez-vous me citer des applications que vous utilisez au quotidien?

C’est un logiciel développé pour un smartphone ou une tablette qui peut être compatible avec différents systèmes d’exploitation tels que android ou encore ios

Que retrouve-t-on dans une appli ?Si on devait décortiquer de façon basique l’interface d’une application qu’est ce qu’on y trouverait?

Des boutons, du texte, des images, plusieurs écrans, du son…

Connaissez vous des logiciels qui permettent de créer des appli?

Appmachine, Thunkable……

N’hésitez pas à laisser les makers s’exprimer lors de ce brainstorming afin de pouvoir par la suite introduire votre présentation de thunkable.

 

3/ Présentation de thunkable / Conception: ( 40 minutes)

Tout au long de ce module, nous allons utiliser un logiciel qui s’appelle Thunkable. Ce logiciel va nous permettre de créer des applications plus ou moins complexes à l’aide d’une partie design et d’une partie programmation par bloc un peu comme dans scratch.

  • La connexion
    On va dans un premier temps se connecter.

 

NB: Il faut que les makers aient impérativement une adresse gmail pour pouvoir se connecter. 

 
  • Présentation de l’interface
 
 Puis, on va découvrir ensemble l’interface de thunkable. Vous pouvez indiquer aux makers que sur thunkable, on a une partie design où l’on va ajouter tous les éléments graphiques de notre application et une partie blocks: où l’on va pouvoir programmer notre application.

 

Revenons à la partie design qui est composée en 3 grandes parties: 

Les composants “components”: Ce sont les fonctionnalités que l’on va pouvoir ajouter à nos applications, on  va avoir des composants visibles que l’on trouvera directement dans la partie design et des composants invisibles qui se trouve dans la partie blocks

Les écrans “ screens” : C’est l’endroit où on va pouvoir glisser nos composants et les déplacer pour créer le design de notre application, autrement dit là où se situe le rendu de l’application

Les propriétés: qui permettent de modifier les caractéristiques des composants et des screens

Pour cette présentation de thunkable, vous pouvez faire une démonstration

  • En montrant comment on ajoute un titre (label) 
  • Des boutons
  • Une image
  • Un écran supplémentaire
  • Comment renommer ses composants et les modifier.

Vous pouvez vous aider de ce tuto pour votre démo : ici

  • Présentation de la première activité et conception 

On va  donc créer comme premier projet, une application que l’on agrémentera au fil des séances. On va commencer par la partie design. On va partir sur une application avec un format quizz, c’est-à-dire qu’on aura plusieurs  questions,  et des propositions pour chacune de ses interrogations. Celles-ci nous permettront de basculer sur un écran quand on cliquera sur un bouton. Vous pouvez montrer aux makers quelques exemples de quizz pour qu’ils puissent se projeter dans l’activité.

Vous pouvez, au choix,  proposer aux makers de remplir une fiche de conception avec les éléments suivants:

  • Quel est le thème de mon quizz?
  • Quelles sont les questions et les réponses de chacun de mes écrans ?
  • Comment est ce que je passe d’un écran à un autre ?

 N’hésitez pas à limiter au départ le nombre d’écrans pour la conception de cette appli ( 5 screens maximum pour un début est amplement suffisant pour appréhender l’ajout des composants et pour découvrir la partie blocks de thunkable.) 

[Makers]

Les makers remplissent leur fiche de conception

Segment 2 (30 min): Design de l’application

[Animateur]

Vos makers vont pouvoir passer au design de leur application . Vous pouvez leur indiquer de procéder étape par étape, en commençant par créer le screen avec le titre de leur quiz, puis d’ajouter les screen avec les questions et les propositions et de finir avec un screen de victoire et pourquoi pas de défaite pour les makers les plus avancés. Il est important de bien rappeler aux makers que les composants qu’ils vont ajouter serviront pour la partie programmation. Insistez bien sur l’importance de renommer les composants les plus importants pour éviter d’être perdu à la prochaine étape.

N’hésitez pas à faire des tours de table avec les makers avec partage d’écran si vous êtes en distanciel pour vous assurez que les makers ont bien compris cette étape

[Makers]

Les makers créent le design de leur application

Segment 3 (30 min): Programmation du projet

[Animateur]

Les makers terminent d’ajouter les éléments de design et on passe à la partie block du projet.

Vous pouvez leur présenter comment se composent la partie blocks, en indiquant que cette partie va nous permettre de donner des instructions claires à notre projet.

 

L’objectif est de montrer aux makers comment passer d’un screen à un autre lorsque l’on clique sur un bouton. Pour ce faire, on va se rendre sur deux catégories:

La partie components et la partie control pour pouvoir programmer la bascule sur un screen;

N’hésitez pas à faire des tours de table avec les makers avec partage d’écran si vous êtes en distanciel pour vous assurez que les makers ont bien compris cette étape.

[Makers]

Les makers programment leurs projets.

Segment 4 (1h): Introduction aux variables et partage en grand groupe

Découverte des variables (40 min)

Les makers terminent la programmation de leur projet et découvrent comment ajouter à leur projet une ou des variables.

Vous pouvez leur montrer comment on ajoute une variable qui comptabilise le nombre de bonnes ou de mauvaises réponses par exemple afin de basculer sur un écran de victoire ou de défaite. Vous pouvez vous aider de ce tutoriel ou de cette base ci dessous, pour découvrir comment ajouter une variable au projet quizz.

Variable simple:

On va dans un premier temps , nommer notre variable ( ici score) et l’initialiser. Dans cet exemple, on l’initialise à 0.

On va dans un deuxième temps indiquer à quel moment on change la valeur du score, ici lorsque je clique sur un bouton, la valeur de ma variable change.

Enfin, on indique le score dans un texte ( label) dans notre screen victoire.

Partage des projets (20 min)

On arrive au bout du projet, place aux partages en grand groupe. Ce temps de convivialité et d’échange permet de souder ton groupe. Vous pouvez profiter de ce temps de partage pour indiquer aux makers que vous ajouterez dans quelques séances des composants qui permettront d’agrémenter ce quiz.

Tips et REX

Tips

  • Il est recommandé de laisser thunkable en anglais pour éviter les bugs
  • Le nombre de projets sur thunkable est limité à 10 , pour créer plus de projet il faudra une autre adresse mail
  • Pour la création d’un compte , gmail est recommandé. Vous pouvez créer une adresse de secours pour les makers sans mails à Mohmal.
Retour en haut