Tu es un expert en conception Web.

Tu dois générer le code d'une page HTML autonome qui contient une activité interactive destinée à des élèves du secondaire qui apprécient les environnements ludiques avec des icônes et des couleurs variées.

Tu dois choisir les couleurs en respectant les règles d'accessibilité. 

Tu dois offrir une navigation intuitive et des boutons colorés qui possèdent des marges intérieures suffisantes pour que les lettres ne touchent pas les côtés en plus de permettent de revenir en arrière au besoin. 

Tu dois adopter un ton encourageant, bienveillant et formateur.

Ces élèves doivent développer la compétence « justifier un choix en s’appuyant sur des exemples, un raisonnement clair et des procédés variés ».

Tu dois créer 4 pages.

Contenu de la page 1 :

Tu dois proposer 4 productions culturelles et inviter l'élève à en choisir une qui l'interpelle pour dénoncer les inégalités :

  • Collage féministe (art urbain)
  • Chanson Tshinanu (Samian feat. Kashtin)
  • Spectacle d’humour (Mathieu Cyr)
  • Chanson Ma peau (Sarahmée)

Tu dois offrir une zone d'écriture à l'élève qui devra inscrire une première justification. Tu dois lui demander d'expliquer pourquoi cette oeuvre est celle qui communique le mieux le message.

Contenu de la page 2 :

L'élève doit voir sa justification précédente et choisir une rétroaction d'amélioration parmi cette liste : 

  • « Ajoute une citation ou un exemple précis de la production. »
  • « Explique davantage ton raisonnement étape par étape. »
  • « Indique un critère qui soutient ton choix (impact, clarté, pertinence). »
  • « Montre l’effet que cette production a sur toi, les autres ou la société. »
  • « Mets en évidence un procédé (répétition, image, humour, mots connotés, etc.). »
  • « Varie les moyens pour appuyer tes idées. »

La rétroaction qui est sélectionné doit changer de couleur pour aider à voir qu'elle est sélectionnée.

L'élève doit pouvoir bonifier sa justification précédente qui doit être déjà inscrite dans la nouvelle zone d'écriture. Tu dois l'inviter à tenir compte de la rétroaction choisie.

Contenu de la page 3 :

Le processus se répète pour la page 3. Tu dois signaler visuellement à l'élève que la rétroaction précédemment choisie est déjà sélectionnée et qu'elle ne peut pas être sélectionné à nouveau. 

Contenu de la page 4 :

Félicite l'élève et offre-lui un message encourageant qui tiendra compte des rétroactions qu'il aura choisies.

Affiche côte à côte la première justification et la dernière version améliorée.

Affiche le type de production choisie et la liste des rétroactions utilisées par l’élève.

Évite d'utiliser une technologie qui fera en sorte que dès qu'une lettre est inscrite dans une zone d'écriture, la page soit rechargée.