Liens

Page drag and drop réalisé avec Jquery

L'objectif de cette page est de présenter mon dispositif "drag and drop", en détaillant l'objectif pédagogique de mon application.

Objectifs

Le but de ce dispositif est d'apprendre à des enfants les différentes classes possibles d'animaux(mammifère, oiseau, poisson et reptile) en déplaçant des images d'animaux dans les boîtes correspondantes. Lorsque c'est juste, la boîte accepte l'animal. Si c'est faux, elle le rejette, permettant ainsi de rapidement donner un feedback à l'élève. Ce dispositif a été imaginé comme introduction à un cours de biologie dans un cours en primaire. Une description des caractéristiques des mammifères est donnée avant de jouer. Au sein du dispositif, il y a beaucoup plus de mammifères que d'autres types d'animaux, c'est pour cette raison que j'ai choisi de ne décrire que la classe des mammifères, apportant ainsi un peu de challenge aux élèves qui ne connaissent pas les caractérestiques des autres types.

Il a été choisi de ne donner aucune description des différents animaux, mais simplement de laisser une image avec le nom de l'animal, afin de faire travailler la perspicacité de l'enfant. Ainsi, en regardant les caractéristiques des mammifères, l'enfant observe l'image de l'animal en question et passe en revue les différentes caractérstiques: Est-il poilu? Ovipare (terme expliqué)?En bas de page, un lien est donné si l'enfant souhaite continuer à apprendre sur les animaux, c'est le lien à l'ex6. Encore une fois j'ai couplé les deux exercices.

Design du dispositif

Il a été imaginé pour attirer l'intérêt d'un enfant. Pour cette raison, les consignes sont données à la deuxième personne du singulier et rendue le plus simple possible. Le drag and drop semble également particulièrement adapté pour un public jeune, car l'interaction est très simple à comprendre. Les couleurs des deux dispositifs sont principalement bleu, afin de garder un thème similaire. Un bouton "recommencer" a été créér, qui rafraichit simplement la page si l'utilisateur clique dessus. Il était en effet important pour moi d'avoir un bouton permettant à l'enfant de recommencer l'exercice s'il le souhaitait.

Petit bémol, les images sont un trop éloignées des boîtes, mais le dispositif fonctionne quand même, et l'on peut voir l'intégralité des boîtes et des images sur la même page.

Production

J'ai commencé par regarder les productions des élèves des années précédentes. Cela ne m'a pas tout de suite permis de développer une idée, mais c'est pendant la nuit que j'ai pensé à créer un dispositif pour classer des animaux. J'ai ensuite cherché des images d'animaux relativement petite, puis, en reprenant le document "drag and drop" déjà présenté en cours, j'ai modifié les classes afin de les adapter aux images et aux différents animaux. Cela n'a pas été très compliqué. La mise en page m'a donné un peu de fil à retordre, car j'ai du changé les dimensions des images et des boîtes pour qu'elles apparaissent sur deux lignes consécutives.

Auto-évaluation

Cet exercice m'a permis de prendre en main l'utilisaiton du "drag and drop" de Jquery. J'ai eu du plaisir à créer un exercice qui pourrait être potentiellement utilisé par des enfants souhaitant en apprendre plus sur les animaux.

Bibliographie

pas de documents utilisés

Ressources

Jquery pour les fonctions javascripts utilisées ainsi que Wikipédia pour les textes explicatifs sur les animaux.

Contribution Wiki

Correction de fautes d'ortographes à la page Jquery et à la page Symbole et clips