Maintenant que les élèves savent comment traiter l'écran du cerveau comme un seul gros bouton, ils peuvent transformer l'écran en deux boutons. Cette activité présentera aux élèves l'utilisation d'instructions imbriquées if-else pour mieux gérer les instructions conditionnelles et la logique sous-jacente de leur action. Les étudiants sont d'abord guidés dans la construction du projet permettant aux presses à écran de faire tourner le robot à gauche ou à droite. Mais il leur est ensuite demandé d’inverser les boutons pour que ce qui faisait tourner le robot à gauche le fasse maintenant tourner à droite, et vice versa.

Pour plus d'informations sur les instructions if et if-else ou autres utilisées dans cette activité, consultez les informations d'aide dans VEXcode V5. Pour plus d'informations sur cet outil d'aide intégré, consultez cet article.

Voici un aperçu de ce que vos élèves feront dans cette activité :

• Revue du projet StopOrDrive et de la disposition de l'écran du cerveau en pixels.
• Construire un nouveau projet LeftOrRight tout en étant guidé dans le raisonnement de la programmation.
• Réviser le projet pour que les boutons de l'écran fonctionnent à l'opposé.
• Étendez votre apprentissage : divisez l'écran en deux boutons qui, lorsqu'ils sont enfoncés, font tourner le robot à gauche ou à droite.
   

Pour des suggestions sur les stratégies d’enseignement pour cette section, consultez la colonne Livraison du Guide de stimulation à faire ou à ne pas faire ! (Google Doc / .docx / .pdf)

La valeur x au centre de l'écran est égale à la moitié de la largeur de l'écran en pixels. La valeur x du point central est donc de 240. Les étudiants auront besoin de ce numéro pour programmer le conditionnel selon lequel l'écran est enfoncé à gauche ou à droite. Assurez-vous donc de vérifier qu’ils ont tous la bonne valeur.

Pour l’avenir, le défi de l’interface utilisateur de la section Repenser demandera aux étudiants d’appliquer ce qu’ils ont appris pour créer quatre boutons sur l’écran. Donc pour cela, ils auront besoin des valeurs x et y.

Pour obtenir de l'aide supplémentaire, consultez la bibliothèque VEX pour des articles d'aide supplémentaires.

Lors des tests, les étudiants doivent reconnaître que l'interface utilisateur, lorsqu'elle est utilisée derrière le Clawbot, semble fonctionner à l'envers. Du point de vue de l'utilisateur, le Clawbot se détourne du côté sur lequel l'utilisateur appuie. Ce n'est pas une expérience utilisateur optimale.

Les étudiants doivent planifier, tester et affiner ces modifications du projet tout en les documentant dans leurs cahiers d'ingénierie. Pour la rubrique individuelle du cahier d'ingénierie, cliquez sur l'un des liens suivants (Google Doc / .docx / .pdf), ou cliquez sur l'un des liens suivants pour les cahiers d'équipe (Google Doc / .docx / .pdf). N'oubliez pas d'expliquer la notation aux élèves avant qu'ils ne commencent à travailler.

Il existe deux manières possibles de résoudre le problème posé ci-dessus. La première méthode est celle écrite dans l'instruction : examinez le projet LeftOrRight et révisez-le de sorte que lorsque l'utilisateur appuie sur les boutons derrière le Clawbot, le robot tourne à droite lorsque l'utilisateur appuie sur le côté gauche de l'écran. Ou bien, le Clawbot tourne à gauche.

L'autre solution consiste à changer l'instruction de l'opérateur de sorte que lorsque la valeur x est supérieure à 240, le Clawbot tourne à gauche. 
 

Vous deviez utiliser les coordonnées d'un plan de coordonnées lorsque vous programmiez l'instruction conditionnelle lorsque la valeur x était inférieure à 240 (côté gauche de l'écran). Pour que l'écran du cerveau dessine des boutons visuels, vous devrez également utiliser des coordonnées.
Revenez à l'étape 2 où l'on vous a montré les coordonnées de l'écran du V5 Robot Brain.

Q : Quelle est la valeur x sur le bord droit de l'écran ?
A : La valeur x augmente de 0 sur le bord gauche à 480 sur le bord droit.

Q : La plage de la valeur x est donc de 480 (0 à 480). Quelle est la plage de la valeur y ?
A : La plage de la valeur y est 240 (0 à 240).

Q : Où est l'origine (0, 0) de ce plan de coordonnées ?
A : L'origine se trouve en haut à gauche.

Q : Vous êtes en haut de l'écran lorsque la valeur y est égale à 0. Pourquoi est-ce inhabituel ?
A : Habituellement, la valeur y augmente à mesure que vous montez, mais sur l'écran V5, la valeur y augmente à mesure que vous descendez. Mais vous pouvez y voir la valeur y augmentant à mesure que vous vous éloignez de l'origine (0, 0) en haut à gauche de l'écran.

Dans le défi de l'interface utilisateur de la section Repenser, les étudiants seront invités à développer un projet qui crée quatre boutons sur l'écran pour contrôler la griffe et le bras du Clawbot. Pour ce défi, il leur est également demandé d'afficher ces quatre boutons à l'écran. Cette extension de votre apprentissage, comme celle de la page précédente, les aidera à se préparer à ce défi, car celui-ci comporte quatre boutons à programmer, alors que celui-ci n'en a que deux.

Demandez aux élèves d'ajouter un événement au programme afin que l'écran affiche deux boutons visibles lors de l'exécution du projet. Suggérez aux étudiants d'utiliser la fonction d'aide de VEXcode V5 pour obtenir des informations sur les événements, en particulier les informations de la commande draw rectangle . Demandez aux élèves de revoir comment l'écran du cerveau est organisé en un système de coordonnées basé sur le nombre de pixels lorsqu'il est utilisé dans la commande dessiner un rectangle . Ils devront comprendre cela afin de définir les paramètres dans cette commande. De plus, ils devront comprendre comment diffuser des événements. Dans ce cas, l'événement dessine des boutons.

Les étudiants doivent planifier, tester et affiner ces modifications du projet tout en les documentant dans leurs cahiers d'ingénierie. Pour la rubrique individuelle du cahier d'ingénierie, cliquez sur l'un des liens suivants (Google Doc / .docx / .pdf), ou cliquez sur l'un des liens suivants pour les cahiers d'équipe (Google Doc / .docx / .pdf).

Voici un exemple de solution :

Pour une expérience professionnellement réaliste supplémentaire, demandez aux élèves de demander à leurs camarades de classe leurs commentaires sur leurs deux choix de couleurs.

Les couleurs choisies vous donnent-elles envie d’utiliser l’interface, ou quelles couleurs préféreraient-ils en tant qu’utilisateurs ?

Une partie du développement d'une excellente interface utilisateur consiste à collecter des données sur l'expérience utilisateur, voire sur les préférences esthétiques.