Quel est le meilleur format de documents pour un TBI (ou VPI) ?

Le tableau blanc interactif (TBI) est de plus en plus utilisé dans le cadre scolaire.  Nous pouvons y trouver de nombreux avantages pour améliorer les enseignements.

  • Meilleure présentation de certains contenus théoriques.
  • Variété des modes d’enseignement et d’apprentissage; contenus enrichis.
  • Moins de temps investi grâce à la mutualisation des ressources.
  • Favorise les interactions entre les apprenants et l’enseignant.
  • Permet une mémorisation visuelle
  • Facilite les travaux de groupe
  • Modifications en temps réel.
  • Intérêt, motivation, stimulation.
  • Interactions, collaboration, espaces d’interactions partagés.

La question à laquelle j’aimerai répondre ici est la suivante :

Quel est le format des données le mieux adapté à une diffusion sur TBI ? L’Education Nationale et le domaine de l’entreprise utilisent dans une grande majorité des publications type Powerpoint :

Les résultats sont de qualité très variables…

Mais ce n’est pas tant les mauvaises présentations qui m’agacent que le fait même que toutes ces présentations aient un même schéma et utilisent les mêmes karaoké visuels : Diapositive après diapositive j’ai l’impression d’être gavé…

Alors pourquoi ne pas innover ?

J’ai choisi de m’orienter vers le format vectoriel pour plusieurs raisons:

Avant même inkscape, les moins jeunes se souviennent de sodipodi qui ouvrait à l’époque le chemin vers ces graphismes qui ne souffraient pas d’une pixellisation quelque soit le zoom effectué !

D’après Wikipedia :

Une image vectorielle (ou image en mode trait), en informatique, est une image numérique composée d’objets géométriques individuels, des primitives géométriques (segments de droite, arcs de cercle, courbes de Bézier, polygones, etc.), définis chacun par différents attributs (forme, position, couleur, remplissage, visibilité, etc.) et auxquels on peut appliquer différentes transformations (homothéties, rotations, écrasement, mise à l’échelle, extrusion, inclinaison, effet miroir, dégradé de formes, morphage, symétrie, translation, interpolation, coniques ou bien les formes de révolution). Elle se différencie en cela des images matricielles (ou images bitmap), qui sont constituées de pixels.

Et pour transformer un contenu vectoriel en « présentation »,  je me tourne vers sozi . Je dispose alors d’un document HTML 5 que je peux uploader vers un site web.

Quelques exemples

Niveau sixième :

Les entiers naturels :
Les éléments de géométrie

Niveau troisième :

Statistiques et probabilités
La propriété de Thalès

Dans certains de ces documents j’ai ajouté du son, en modifiant le code html avec le très bon notepad++

Vous vous posez des questions, ou vous avez un avis, même éloigné du mien, n’hésitez pas commenter !

Inkscape, devoir de vacances pour infographiste débutant

cahier
Vue pleine page

Nous avons aborder précédemment les courbes de Bézier. Les maitriser est un challenge, un passage obligé pour parvenir à effectuer des travaux de qualité.

Et pas de maitrise sans travail, sans entrainement.

Je profite des vacances scolaires pour vous proposer cette tâche, ludique mais formatrice : Apprenons à former les lettres (en lié, comme dit ma fille) à l’aide des courbes de Bézier.

lettre-a

La lettre « a » est ainsi constituée d’une courbe à trois noeuds, réalisée dans l’exemple ci-dessus en 5 étapes.

Première étape :

Dans inkscape en utilisant l’outil « Tracer des courbes de Bézier et des segments de droites » (SHIFT F6), créez une courbe de Bézier à trois noeuds (clic – clic – double clic). Les deux segments serviront à fabriquer respectivement le ventre et le dos de notre « a ».

Deuxième étape :

En utilisant l’outil d’édition des noeuds et des poignées de contrôle (F2), jouer avec les deux segments pour les arrondir.

Troisième étape :

Dès que vous avez touché aux segments (et que vous les avez transformés  en courbes) les poignées (ou points de contrôle) sont apparus. Si ce n’est pas le cas, pour les rendre visibles il suffit de cliquer sur le bouton dans la barre supérieure. Cette barre d’édition des noeuds est pratique ! Je vous engage à lire les infobulles par survol du curseur.

En jouant avec les points de contrôle, essayer d’adoucir les noeuds (Plus le noeud intermédiaire est aligné avec ses deux poignées, plus il est doux : la tangente à gauche venant se confondre avec la tangente à droite)

Quatrième étape :

Sélectionnez ensuite l’objet, puis avec un « clic-droit » choisissez « remplissage et contour » dans le menu conceptuel. (SHIFT CTRL F)

Dans le sous-menu « Style du contour » donnez un peu d’épaisseur à notre « a » et choisissez l’option « terminaison arrondie ».

Cinquième étape :

Pour donner une impression d’écriture à l’encre on peut, pour conclure, en choisissant une couleur dans le sous-menu « remplissage du contour » et en sélectionnant un dégradé linéaire, modifier le rendu visuel de notre travail.

VISUEL SVG et téléchargement :

Si votre navigateur lit le SVG, en cliquant sur les liens suivants vous allez voir les travaux en SVG. Vous pourrez alors les enregistrer pour éventuellement les modifier avec Inkscape.

lettre a seule

cahier avec les lettres abc

a-seul

Allez au travail, postez moi en commentaire des liens vers les lettres b à z que vous aurez préalablement uploadé… (Un lettre par personne, ne vous disputez pas ). C’est marrant je n’ai pas l’impression que ce billet sera beaucoup commenté 🙂

Courbe de Bézier, on débroussaille !

Avant tout les courbes de Bézier appartiennent au vocabulaire mathématique :

Les courbes de Bézier sont des courbes polynomiales paramétriques décrites pour la première fois en 1962 par l’ingénieur français Pierre Bézier qui les utilisa pour concevoir des pièces d’automobiles à l’aide d’ordinateurs. Elles ont de nombreuses applications dans la synthèse d’images et le rendu de fontes. Elles ont donné naissance à de nombreux autres objets mathématiques.

L’amateur d’infographie vectorielle se doit de les maitriser, et ce billet vise à débroussailler un peu le contenu hétéroclite de la toile mondiale, afin d’en tirer les informations primordiales, substantifique moelle qui permettra à chacun de mieux les appréhender.

Nous n’évoquerons ici que les courbes de Bézier cubiques, à deux nœuds (terminaux).

bezier2

Si on plonge dans le champ lexical de l’infographie, les points A et B sont des noeuds. Ils déterminent l’origine et l’extrémité de notre première courbe de Bézier. Les points E et F sont des poignées (ou points de contrôle).

Dans inkscape, pour tracer ceci,  j’ai sélectionner l’outil courbe de Bézier dans le menu (ou SHIFT F6), j’ai cliqué pour engendrer le premier point (A) et double cliqué pour terminer la courbe et créer le deuxième point (B)

J’ai ensuite sélectionné l’outil d’édition des noeuds (F2) puis cliqué sur la courbe (en maintenant le bouton appuyé) et déplacé légèrement la souris.  Les poignées sont alors apparues et je les ai légérement bougé en utilisant la même technique.

Il y a quelques années, lorsque j’ai rencontré ma première courbe de Bézier, j’ai trouvé ça amusant, mais il me faut l’avouer : Je travaillais à tâtons pour parvenir à un résultat (médiocre) sans comprendre ce que je faisais…

Ce qu’il faut comprendre :

Les points E et F servent respectivement à indiquer comment la courbe part du point A, et comment elle arrive au point B.  Sans parler de vecteur ou de tangente pour ne pas vous faire fuir, on peut considérer que ces points E et F sont des étapes sur un certain trajet, et que la courbe, fainéante et un peu tricheuse, donne l’illusion aux observateurs placés au départ et à l’arrivée qu’elle y passe, alors qu’elle s’évertue à couvrir la distance la plus courte possible.

C’est cette façon un peu enfantine de voir les choses qui m’a (un peu) aider à maitriser ce fabuleux outil !

Je n’ai évoqué ici que les courbes possédant deux noeuds terminaux, (un clic pour le premier, un double-clic pour le deuxième ) mais on peut construire des courbes ayant plusieurs noeuds intermédiaires.(clic,clic,et double clic pour terminer, pour une courbe de Bézier à trois noeuds). On considèrera alors que c’est une course par étape, avec les même règles!

Fort de ce que nous avons appris, le petit exercice suivant ne devrait pas poser de problème.

Dans les courbes suivantes, seules deux d’entre-elles ont plus de deux noeuds.

bezier

Lesquelles ?

(Un indice, les deux chiffres donnent alors mon département de naissance, postez simplement son chef lieu en commentaire et vous êtes mon héros)