L'objectif est double. D'une part, la page a pour but de présenter le béhaviorisme aux étudiants. D'autre part, elle avait pour but de tester différentes petites amélioration ergonomique par des codes : inclusion d'icônes, de lightbox et d'une animation pour faciliter la lecture.
Le design de ce projet implique une reprise du design de la page Edutechwiki. Nous avons donc une présentation du concept du béhaviorisme. Toutefois, 3 améliorations ont été mises en place. Tout d'abord des icones aparaissent derrière les noms de personnages pour un apport graphique mais aussi pratique dans la mesure où elle envoient vers les pages Wikipédia de ces personnages. Une icône "université" est aussi présente derrière le lien vers Edutechwiki. Ces icônes correspondent à une application de la loi de Fitts. Cela permet d'améliorer la lisibilité et la vitesse de navigation. Ensuite Lightbox a été inclue pour agrandir les images d'une manière plus agréable. Enfin l'animation "elevator" en bas de page permet de remonter en haut de la page pour reprendre la lecture, remontée en musique qui plus est. Cela peut être vu comme une sorte de récompense à la lecture de la page et le son final symbolise le cloche utilisée par Pavlov.
Cette production a suivi plusieurs étapes :
Tout d'abord, une relecture de l'énoncé a été faite puis un choix de sujet cohérent avec le module Bases puis une récupération du "fond" des précédents rapports afin d'avoir une base de travail existance. Il s'en est suivi une recherche d'idées pour essayer d'améliorer l'ergonomie de la page. Cette recherche s'est mixée avec la recherche de code pour le résultat final. Il a fallu ensuite implémenter les codes ce qui a occasionné un travail de syntaxe. Le retour de Mattia a également été utile pour l'amélioration finale.
Les difficultés ont porté sur la recherche des codes relativement simples et accessibles permettant d'améliorer la page. De plus un erreur a été commise : pour créer la page html j'ai copié/collé le texte depuis Edutechwiki alors que j'aurais pu directement récupérer le code : bref une perte de temps dispensable. Enfin un problème de balise à souligner la moitié de la page en rouge. Grosses difficultés non résolues : je n'ai pas trouvé comment modifier la taille des vignette et il faudrait que je centre les images.
Dans cet exercice délicat de prise de recul, voici l'auto-évaluation de mon travail : L'objectif d'introduction au béhavisme est acquis mais en faisant du copié-collé l'enjeu n'était pas là. Pour l'ergonomie de la page : les icônes apportent un petit plus visuel et fonctionnel, lightbox (voir difficultés) doit encore être peaufiné visuellement. En revanche, je trouve que le code elevator apporte un aspect ludique intéressant. Cet exemple présente un texte un peu trop court mais on peut imaginer son intérêt dans des pages plus longues qu'il faut relire à plusieurs reprises (un article scientifique par exemple?).
A proprement parler, il a été fait usage des éléments de cours STIC et d'Edutechwiki (Bases)
A proprement parler, il a été fait usage des éléments de cours STIC et d'Edutechwiki (Bases), et indirectement de wikipédia.
Les éléments "third party" suivants ont été utilisés.
Comme contribution au Wiki, quelques très modestes modifications
Page "Animation avec CSS" Page légèrement modifiée
Page Canvas Page légèrement modifiée
Page Niveaux et types d'apprentissage Page légèrement modifiée