Petit aperçu de mon approche pédagogique

Le texte qui suit est extrait d'un document que j'avais rédigé dans le cadre d'un bilan de compétences (janvier 2004) et que vous pouvez consulter en intégralité au format PDF ici.

Mon approche pédagogique

Lorsque j'ai commencé à travailler à la FOL de la Vienne, j'avais déjà 8 ans d'animation derrière moi dont un et demi en milieu hospitalier. Mais je n'avais encore jamais été le porteur d'un projet pédagogique complet comme celui des classes découvertes. Dès le départ, il m'a été demandé de rédiger le nouveau projet pédagogique. Cela m'a permis de structurer, avec l'aide de mon chef de service, mon approche de l'animation multimédia. Un mois après le début de mon contrat, je commençais l'accueil des premières classes.

Cette animation de grande envergure soumise aux contraintes de l'outil informatique m'a complètement rigidifié. Pendant mes deux premières années, j'étais très directif, centré sur la réalisation à rendre aux professeurs à la fin du séjour, tendu vers la maitrîse de l'ordinateur par les enfants. Ce n'est qu'au milieu de ma deuxième saison de classes que j'ai « levé le nez du guidon ». Je me suis rappelé que l'informatique n'était qu'un moyen, et non une fin en soi. Je me suis alors recentré sur les enfants et sur l'animation plutôt que sur le projet et la technique.

Mon approche s'est trouvée plus libre et mes objectifs se sont précisés. Les seules évolutions qui suivirent ont concerné les outils que j'utilisais pour les atteindre. Voici quelques bribes de l'esprit qui m'habitait lors de mes 3 dernières années et demi d'animation multimédia :

  • Initier, démocratiser l'accès à l'informatique : appréhender l'informatique autrement que par la technique, apprendre à décrypter et à comprendre les informations proposées sur Internet ou un Cd-rom, démystifier et développer l'esprit critique en passant du côté de la réalisation.

  • Placer l'enfant en confiance : dédramatiser l'utilisation de l'outil informatique, créer des binômes de travail.

  • Épanouir l'enfant acteur et créateur, développer son autonomie : établir un projet simple et facilement compréhensible permettant à l'enfant de se l'approprier, lui expliquer les objectifs du projet et ses différentes phases, alléger la charge de l'enfant pour lui permettre d'appréhender tous les domaines du projet tout en ne dénaturant pas son travail.

  • Valoriser l'enfant à travers le groupe : valoriser son opinion tout en développant le dialogue, respect de la parole et du travail de l'autre, souligner l'intégration de son travail dans l'oeuvre collective, permettre le droit à l'erreur c'est à dire rendre l' erreur « éducative ».

  • Responsabiliser l'enfant dans la réalisation collective : favoriser l'entraide et l'échange de savoirs, lui faire comprendre que sa création (dans sa forme et son contenu) diffusée sur Internet dépasse sa sphère personnelle, celle du groupe et même de l'école.

  • Respecter les rythmes naturels de l'enfant : travail par demi classe en périodes d'une heure, tenir compte de la fatigue de fin de semaine ou de l'excitation de l'arrivée.

Colloque Européen sur les nouvelles pratiques philosophiques

En avril 2005, j'ai une nouvelle fois été mis à contribution par le CRDP de Poitiers. J'avais déjà réalisé une couverture pour eux mais là on me demandait de prendre en charge toute la partie web du 5ème Colloque Européen sur les Pratiques Philosophiques.

Cet évènement se déroulait sur 2 jours sur le modèle des débats-philo. Les ateliers étaient organisés parallèlement exceptés deux conférences-débats à l'espace Mendès-France.

Il me fallait donc assurer la création et l'animation du site Internet mais aussi, et surtout, offrir la possibilité pour les internautes d'écouter et d'intervenir en direct à certains débats proposés pendant l'évènement. Pour m'épauler je pouvais compter sur les structures techniques du CRDP de Poitiers et de l'espace Mendès-France, plus 2 stagiaires du CRDP.

Pour le site internet, je me suis rapidement orienté vers le CMS Spip. En effet, il y avait beaucoup de contenus, de traductions et plusieurs rédacteurs.
Les débats étant axés sur la parole, j'ai cherché des images de bouche, de nombreuses bouches... mais c'était stérile. Ce qui fait le débat philo, c'est la confrontation des opinions. Des opinions qui se tissent et constituent une réflexion qui atteint au philosophique. J'ai appliqué cette idée directement et elle a été bien reçue bien qu'elle me donnait plus l'impression de se détricoter plutôt que l'inverse.

J'ai proposé plusieurs visuels, c'est la seconde version qui a été retenue. J'ai donc développé un squelette basique pour Spip puis y ai ajouté les différentes rubriques ainsi que les textes et traductions qui m'étaient fournis par Jean-François Chazerans, responsable de l'organisation du colloque. La souplesse de Spip nous a permis de rapidement proposé et corrigé les contenus.

Le visuel qui n'a pas été retenu

La version choisie par les organisateurs

Pour le colloque lui-même et la participation des internautes, j'ai mis en place, à plus grande échelle, une solution que j'avais déjà expérimenté un été en colonie de vacances : le serveur Shoutcast. Plutôt qu'un long discours, j'avais créé à l'occasion du colloque, une page expliquant aux curieux la structure que j'avais mise en place.

Pour faire court, j'avais branché la table de mixage son de la salle sur un ordinateur équipé de Winamp et d'un plug-in transformant la source audio en flux streamé. Ce dernier était envoyé au serveur Shoutcast hébergé au CRDP (qui nous allouait la bande passante). Il suffisait aux utilisateurs de se connecter avec un lecteur audio à l'adresse IP communiquée sur le site pour écouter en direct les débats.

Leurs interventions étaient ensuite gérées via Skype sur un autre ordinateur qui les diffusaient sur haut-parleurs dans la salle et vers la table de mixage pour fair partie du flux envoyé

Afin de minimiser les complications techniques pour les internautes, j'avais réalisé de courts tutoriaux vidéo en flash.

Vous pouvez consulter le site internet tout en étant avertis que ce n'est qu'une version statique réalisée par capture (le nom de domaine et l'hébergement n'ayant pas été reconduits).

La page <em>Appels à contribution</em> traduite en portugais La page <em>Accès en train</em> Explications pour écouter les débats en direct

Les classes découvertes

Le ste d'un été 2001 : Colostory

Entre février 2000 et février 2005, j'ai animé une soixantaine de classes découvertes multimédia. Pour résumer, j'aidais les élèves d'une classe de primaire à réaliser un site internet. Une partie du travail était préparé par correspondance (via mail, chat ou téléphone) puis les enfants accompagnés venaient passer 5 jours au Village Vacances de Vouneuil sur Vienne.
Si on enlève une journée pour le trajet et une autre pour visiter le Futuroscope, il ne restait que 3 jours pour concrétiser notre projet ! Les groupes avaient tous un profil différent et selon leur niveau de connaissance, je leur présentais le fonctionnement d'un ordinateur, d'un réseau, d'Internet. Nous tracions ensuite le plan du site sous forme d'arbre, ce qui nous permettait généralement de désigner des équipes pour chaque page.
Après une rapide introduction à Dreamweaver 2 (licence gratuite), nous réfléchissions à l'apparence d'un site, sa navigation, sa lisibilité. Enfin le travail pouvait commencer et vu le nombre de petits travailleurs, il était achevé assez rapidement :) En 5 ans, je n'ai jamais rendu un projet en retard. Les enfants sont toujours repartis avec leur création en ligne ou sur CD. Les appréciations que recevait Jacques Demiot, mon "chef de service" ont toujours été excellentes.

Vous pouvez consulter ICI la documentation pédagogique (au format PDF) qui permettait de présenter les Eclasses aux professeurs des écoles

Voici quelques exemples de sites internet  réalisés avec les scolaires et les colonies de vacances :

L'école de Caudebec   L'école Ste Thérèse   L'école de Lisses   L'école Marie Louise   Le ste d'un été 2001 : Colostory   Un autre site d'été : Didi le cochon

La Fédération des Oeuvres Laïques de la Vienne

La page des <em>archives des classes découvertes</em>

Durant les 5 années où j'ai travaillé à la FOL86 mes tâches ont été très variées. J'étais employé pour animer les classes découvertes pendant la saison haute de mars à septembre. Je consacrais la "saison basse" à préparer la "saison haute" (!) mais aussi à la mise en place du réseau, au maintien du parc matériel et logiciel et surtout les dernières années à la communication de la FOL.

J'ai ainsi créé en novembre 2002 le site internet de la FOL. La commande était exigeante : les différents responsables de secteur devaient pouvoir changer le contenu à leur guise. Les CMS à l'époque n'étaient pas aussi ergonomiques qu'aujourd'hui et le choix était restreint. Mes connaissances en web dynamique étaient très faibles. Par nécessité et curiosité j'ai pourtant choisi de développer une interface basique d'administration d'une part de news, d'autre part d'évènements.

Bien qu'elle ait été fonctionnelle, je ne l'ai jamais vraiment terminée : les différents responsables ne prenaient jamais le temps de se former et de mettre les contenus à jour. Je me retrouvais donc à mettre moi même le contenu dans le site. La seule partie vraiment administrée était la mienne, celle des classes découvertes :) J'avais développé de petit bouts de PHP/MySQL qui permettaient l'affichage d'une carte de France avec les différentes classes découvertes en cours ou passées.

Au niveau graphique, je m'étais orienté sur des couleurs vives correspondant à l'esprit tourbillonnant du logo de la FOL. Les différentes rubriques étaient immédiatement accessibles et un menu contextuel venait la compléter à gauche. Un autre menu, permettant une navigation transversale, le complétait.

Le drame c'est que je ne peux pas vous proposer grandchose sur ce site : tout était dans les bases de données que je n'ai pas sauvegardées en partant. Le site ayant disparu (la FOL86 n'a un site que depuis quelques mois après 2 ans d'absence sur le web !) je n'ai plus les données qui s'affichaient. J'ai pu plus ou moins reconstituer la partie sur les classes découvertes. Attention gruyère !

L'interface sortie de Photoshop  L'accueil des Eclasses  La visite guidée des Eclasses

Mes réalisations PAO

Voici quelques exemples (au format PDF) de ce que j'ai réalisé pour le service vacances, les eclasses et autres services de la FOL de la Vienne :

Plaquette publicitaire (2004)   Plaquette publicitaire (2004)   Brochure d'information (2002)   Affiche 80x60 (2004)   Le calendrier des formations de la FOL (2003)   La documentation pédagogique Eclasses (2000-2004)

Un CV full "CSS"

Après deux jours sur les langages HTML et CSS (ce qui me permet de structurer mes connaissances), voici ma première réalisation entièrement écrite avec un éditeur texte. Je ne croyais pas pouvoir en être capable mais le résultat est là :).
Je n'ai pas grand chose à raconter sur la création de cette page. Je n'ai pas utilisé Photoshop pour créer un modèle que j'aurais ensuite adapté. Je l'ai construite au fur et à mesure. Je suis parti sur les couleurs et les idées que j'avais appliquées à ma carte de visite : des pavés bleus, une punaise rouge en @ et un fil "branché" orange. J'aime l'assortiment de ces couleurs et le décalage qu'introduit cet insecte. On dirait une petite idée qui vient de s'échapper de l'univers numérique.

Edit (25 sept. 2007) : Après avoir créé mon CV, j'ai adapté ma feuille de style au blog Dotclear que vous consultez actuellement. J'ai aussi modifié les fichiers template et list du thème pour qu'ils affichent mon image de header en balise et des ancres pour chaque article. Enfin, j'ai légèrement francisé Lightbox ("image X sur X" et non plus "image X of X").

Dépliant d'information AFPA

Euh... petite marche arrière... on se retrouve à refaire de l'Illustre Ator pour de la PAO...
Donc, par groupe de 3 tirés au sort, nous devons réaliser une maquette A3 d'un dépliant en 3 volets recto-verso en Quadrichromie. Les textes sont fournis ainsi qu'un rough. En fait, rien de nouveau (si ce n'est qu'on fait plus d'interface web...) sauf un plan 3D des trois étages de l'AFPA. Après un travail d'équipe sur le l'apparence général du document, c'est moi qui m'attaque au plan de l'AFPA.
Pour le faire, nous avons utilisé l'outil Extrusion 3D d'Illustrator. Foin des considérations techniques, nos choix se sont tournés une nouvelle fois sur la lisibilité de l'ensemble. Nous avons décidé d'adopter un code couleur pour les différents types de salle : bureaux, salles de formation et salles collectives.
Les flèches d'information sont minimalistes afin de porter un maximum d'informations sans gêner la lecture. Pour un meilleur repérage visuel, elles portent un rappel de la couleur de leur salle.
Les accès sont indiqués par des icônes pour une meilleure orientation.
Le mobilier est volontairement réduit pour ne pas gêner l'ensemble.
Quelques petits visuels :

     

Bien manger les cibles

Probablement les dernières interfaces de site réalisées pendant le module Photoshop. En fait il s'agit d'un thème commun "manger des légumes" destiné à différentes cibles : enfants, seniors, famille et femmes. Les textes fournis sont différents selon la cible. Avant de commencer cet exercice, nous avons épluché la presse magazine et les sites internet pour recenser les signes visuels propres à chaque public. J'ai choisi de traiter les seniors et le public féminin.

Pour le premier, j'ai choisi des couleurs franches, tranchées, en à-plats pour un meilleur contraste des éléments. Le titre du site "Restez jeunes" m'a invité à créer une forme de vague qui part du logo afin d'en souligner le caractère impératif. Dans cette impulsion, j'ai placé du maïs, un élément visuel de la nutrition : en bref, "restez jeunes en faisant attention à l'alimentation". Au-dessus de la vague, pour en souligner le souffle, j'ai placé des ombelles de pissenlit, symbole de seconde vie. Pour que le logo reste lisible, la typo est stable mais la forme carrée est légèrement penchée pour plus de dynamisme.
J'ai choisi une navigation classique et claire. Les liens sont bien dégagés et les liens utiles ont juste changé de couleur. Une petite forme carrée vient rappeler la rubrique actuelle.
Dans le texte, la taille des caractères est assez importante pour une meilleure lisibilité.

Pour le public féminin, je me suis orienté vers des couleurs pastels pour évoquer le bien-être et la diététique. Impression renforcée par les volutes (peut-être trop nombreuses). Pour prolonger l'effet, j'ai choisi une typo calligraphie "Chopin".
La navigation principale est classique. Mais il y avait quantité de mises en avant imposées par le sujet : chocolat, compléments alimentaires, news, quizz,... J'ai traité certaines en images, d'autres en blocs, d'autres juste avec leur titre afin d'éviter qu'elles interfèrent les unes avec les autres et ne fassent une présentation en "tapis". Le but n'est ici pas l'apport d'information mais l'invitation au butinage.
Il m'a fallu gérer quantité de problèmes de lisibilité due à "Chopin" sur un fond d'image mais je pense que çà passe.
Enfin le contenu, comme dans la plupart des sites féminins (je rigole), est relégué en bas de page.