Stic - II



cours


Exercice 13


Avril 2012


Résultats


Objectif de la page

L'objectif de cette page consiste à introduire l'apprentissage de la notion du temps et de l'heure. Sur la base d'un svg d'horloge déjà existant, légèrement modifié, j'ai crée (avec l'aide de l'enseignant pour la formulation du code et découvert d'un nouveau processus d'animation combinée). Le principe démontre que si on comprend avec la première horloge la notion et l'usage de chacunes des aiguilles, alors on peut comprendre le svg suivant. Celui-ci démontre graphiquement le temps écoulé depuis le chargement de la page. Elle s'intéresse à un public mixte de tout âge dès le moment où l'individu peut lire l'heure.


Discussion du design

Afin de délimiter l'image, j'ai créer deux rectangles dans l'idée de réaliser les bords de l'image. Ensuite, il a fallut créer la notion de seconde et de minute. Pour cela, j'ai décider d'utiliser une figure simple comme unité, le carré. Cependant, il fallait un intérêt quant à ce que le temps soit graphiquement montré. L'usage de l'opacité en dit long. En effet, l'apparition diffère entre les secondes et les minutes. Si vous observez l'image, une seconde apparait immédiatement. On peut compter la seconde dès le moment où le carré noir se voit. La seconde est révolue au moment où il atteint une oppacité de 100% et que le carré suivant se fait voir. Par contre, pour la minute, l'apparition du carré n'indique pas la minute mais son écoulement. En effet, son oppacité atteint les 100% après 1 minute. Ainsi, on peut compter 1 minute lorsque le carré est opaque et que le carré suivant apparait. En somme, pendant l'apparition du carré bleu des minutes, les carrés noir progressent.


Démarche de production

Copie et modification de la première horloge (Voir sources). Pour le chronomètre, production personnelle avec aide de l'enseignant pour solution d'un problème. Découverte et solution faite par l'enseignant en combinant nos deux solutions. Mes solutions viennent de forums trouvés sur le net. Je n'ai malheureusement pas gardé mes sources. Cependant, un tutoriel pour la réalisation de ce chronomètre sera réalisé sur edutechwiki.


Difficulté, auto-évaluation, remarques

Je suis content du résultat. Mais une amélioration du svg pourrait être faite. En effet, l'image indique le temps passé sur la page mais pour lire les secondes c'est une autre affaire. Un affichage et un code plus complexe devrait indiqué la numération des secondes. Quant à la difficulté, le challenge était sympa. La collaboration avec l'enseignant à permis de solutionner une procédure décortiqué par moi-même. J'ai découvert que les deux solutions ensembles s'assemblaient avec logique. J'aurai pu y penser mais je n'avais pas compris le notion et l'utilité de la balise "set". Je pense avoir compris partiellement son usage.


Ressources utilisées


Valid XHTML 1.0 Strict