Retrouvez cet article dans : Linux Pratique Hors série 9
Dans cet article, nous allons voir dans les grandes lignes, comment on peut utiliser OpenOffice.org pour générer des documents HTML comme un classique traitement de texte tout en y incorporant des images statiques et des animations interactives. Prenez-le comme une petite expédition d'exploration ; il est tellement excitant de faire les choses avant les autres ou différemment...
Imaginez que l'on vous demande d'envoyer le descriptif d'un produit (diaporama), commentée (en audio), que votre destinataire peut consulter (navigation dans le document) à l'aide de sa souris. Des explications complémentaires sont à prévoir, accessibles à la souris, tout comme un questionnaire à vous renvoyer. On termine en précisant que vous " imprimez " ce document sur le site Internet de votre entreprise... !? Et si je vous précise que vous utilisez OpenOffice.org pour faire ce travail... Un document qui mélange texte, images, interaction, souris et clavier de votre lecteur, de plus imprimé sur un site ?! Il ne manque plus que votre directeur commercial demande de temporiser la consultation de votre document sur 30 secondes au nom d'une raison fraîchement glanée dans un séminaire sur la communication... Vous sentez monter en vous une furieuse envie de congé formation !
Comme vu dans l'article sur OpenOffice Impress, le diaporama dans sa version Internet, bon candidat à ce type de document n'est pour l'instant pas très dynamique, même en l'exportant au format Flash. Pourtant, le format Flash permet de faire mieux et OpenOffice.org nous a habitués à faire mieux aussi ! Donc, on peut espérer mieux. Le processus poussant à mettre dans vos mains des logiciels générant des documents animés et interactifs est en route par le biais de la guerre des formats de fichiers qui se joue dans l'ombre. Peut-être que le prochain format sera le SVG, puisqu'il est libre (L'organisme W3C en assure le suivi), permet l'animation vectorielle et qu'il s'inscrit dans la politique européenne des formats informatiques ouverts (open document). Dans cette guerre des formats, la politique de dématérialisation des documents, dans les marchés publics (http://www.marches-publics.gouv.fr/ [fr]) par exemple, ne peut qu'accélérer le processus. Par un effet prescripteur induit, les entreprises changent leurs outils et leurs processus de travail, donc les utilisateurs aussi ! Vous n'y échapperez pas. Déjà les enseignants sont confrontés au besoin de réaliser des supports de cours informatisés et interactifs. Ce n'est pas un cas d'école !
Dans cette chaîne des conséquences, tôt ou tard, vous serez confronté à l'usage des documents informatisés (dématérialisés ET animés) et l'intérêt de savoir les générer vous sautera aux yeux... En attendant que votre quotidien soit concerné, que faire ?
Pour l'instant vous avez l'habitude de traiter votre document comme une feuille de papier, de l'imprimer sur du papier et de le stocker sur votre ordinateur. Demain, on vous demandera de montrer (document animé) plus que d'écrire, de laisser le lecteur cliquer et voir plus que de lire. Soyez en avance grâce aux Logiciels libres ! Commencez à réaliser des documents interactifs avec le module HTML d'OpenOffice.org.
Vous savez télécharger un fichier sur votre ordinateur, décompresser un fichier
.zip et installer un logiciel ? Alors, nous pouvons commencer...
Les cliparts
Tout d'abord, la matière première : l'image ou clipart pour reprendre le terme souvent employé. OpenOffice.org a une bibliothèque d'images (Gallery) sommaire. Avec OpenClipart.org, agrémentez votre Gallery sans vous soucier des licences. Tous les cliparts sont libres de redevance pour droits d'auteurs ! Pas de souci sur les formats (SVG et PNG), ils sont libres et non assujettis au bon vouloir d'une société commerciale.
Donc, rassuré sur la pérennité de votre travail, rendez-vous sur le site officiel (http://openclipart.org/downloads/ [en]) et téléchargez le fichier de votre choix incluant les formats PNG (Fig. 1). Openoffice.org ne lit pas, pour l'instant, les fichiers SVG
Fig. 1
Note : la capacité d'utiliser (lecture, écriture) les fichiers SVG n'est pas au rendez-vous pour OpenOffice.org. Cela ne peut que changer, bien sûr, puisque le format SVG est libre et conforme à la politique de développement d'OpenOffice.org. Le format SVG est encore en phase de maturation.
Décompressez le fichier dans un dossier qui vous appartient. OpenOffice.org aura besoin de piocher dans ce dossier à chaque fois que vous utiliserez votre Gallery. A vous donc de choisir l'emplacement approprié, car il faudra le conserver. Vous obtenez un dossier contenant plusieurs sous-dossiers, dont un qui sera notre cible :
computer/.
Fig. 2
Attention
Openoffice.org pioche dans le dossier désigné y compris les sous-dossiers ! Cela peut faire beaucoup d'images...
Ouvrez un document Openoffice.org (un dessin par exemple) et affichez la Gallery (via le menu Outils -> Gallery ou via un clic sur l'icône Gallery de la barre d'outils) (Fig. 2), puis cliquez sur Nouveau thème. Dans l'onglet Général, donnez un nom à votre thème et, dans l'onglet Fichiers, désignez le dossier contenant les images (Fig. 3).
Fig. 3
Quand la lecture des dossiers est finie, la liste proposée peut être modifiée. Quand c'est bon pour vous, cliquez sur Ajouter tout. Voilà c'est tout ! Vous avez une superbe rubrique qu'il vous suffit de parcourir pour y trouver votre bonheur (Fig. 4).
 Fig. 4
Si vous avez besoin d'images plus grandes ou de meilleure qualité, utilisez le logiciel Inkscape (http://www.inkscape.org/ [en]) pour éditer les fichiers SVG et les exporter au format PNG.
Lorsque votre Gallery est affichée, un simple glisser/déposer avec votre souris suffit pour insérer l'image choisie dans votre document (Fig. 5).
 Fig.5
À présent, intéressons-nous à la partie animée de notre futur document...
Une animation
Pour réaliser une animation au format Flash ou Java, nous allons faire appel à un autre Logiciel libre :
E-Anim. Rendez-vous sur le site officiel (http://www.phildes.com [fr]) et installez sur votre poste la version (Windows ou Linux) de votre choix.
Si ce n'est déjà fait, il vous faudra installer JAVA. Une fois lancé, consultez l'aide, toute en animation, c'est un vrai régal ! Cela vous donnera une idée de ce que l'on peut faire avec ce logiciel.
On va faire bref. Le site de Phildes vous propose un forum où vous recevrez toute l'aide nécessaire pour l'installation du logiciel et la réalisation de vos premières animations. Soyez sans crainte, ce n'est pas une usine à gaz ! E-anim est très simple d'usage. La complexité du résultat ne dépend que de votre imagination, même si les programmeurs y trouvent leur bonheur (ActionScript).
Attention ! La version Linux, bien que fonctionnelle, demande à être adaptée. L'auteur d'E-Anim est d'ailleurs à la recherche de compétences Linux pour l'aider dans ce travail.
Pour simplifier l'explication des procédures de travail, nous allons en rester à la plus évidente :
-   Vous réalisez une animation avec E-anim.
-   Vous créez un fichier HTML incluant votre animation avec E-anim.
-   Vous utilisez OpenOffice.org pour modifier ce fichier HTML (texte et images).
Pour alléger cet article, nous examinerons deux principes majeurs d'E-anim :
-   la barre temps ;
-   l'évènement objet.
Vous avez toujours une feuille HTML ouverte dans OpenOffice.org ? Vous avez installé et lancé E-anim ? Désormais, considérez-le comme un module d'OpenOffice.org. Au fil du temps, vous ne pourrez plus vous en passer. C'est tellement plaisant de pouvoir réaliser des animations interactives pour compléter vos textes ! On finit même par envisager de remplacer tous les textes par une animation... Vous êtes prêts à choper le virus " E-animatus " ? On commence :
Fig. 6Â
Cliquez sur l'onglet Ecran de base pour régler la taille de votre animation (en pixels) (Fig. 6). N'oubliez pas que ce premier jet est destiné à illustrer du texte ; 200 x 200, c'est bien. Par sécurité, E-anim vous propose sûrement d'enregistrer votre fichier de travail (.phi). Faites-le, de préférence dans un dossier à part sur lequel vous avez les droits d'écriture, lecture
et exécution.
Cliquez sur le bouton Text de la barre d'outils ; nous écrirons par exemple : " Pour de plus amples explications sur les animations... " (Fig. 7).
Fig. 7Â
La barre temps
Vous remarquerez que la création du texte a posé sur la barre temps un repère. C'est un joyeux événement : la naissance au temps zéro de votre texte ! Vérifiez que vous êtes toujours au temps zéro (on dit aussi " Frame 0 "), sinon cliquez dessus.
Note : la valeur d'un temps ou frame est réglable par Fichier -> Préférences -> Préférences. Le réglage se fait en millième de secondes. Si vous désirez que dix frames fassent une seconde, réglez le temps à 100. Pour des animations fluides, je vous recommande de régler à 50. Tant que vous y êtes, dans les réglages, désignez le navigateur préféré.
L'évènement objet
Si ce n'est fait, cliquez une fois sur le texte (l'objet) pour le sélectionner. Cliquez sur le bouton Rotation de la barre d'outils et réglez la transparence à zéro (l'évènement) (Fig. 8). Validez. Les évènements dans la vie d'un objet sont signalés par un repère sur la barre temps.
Cliquez sur la frame 10 de la barre temps. Elle change légèrement de couleur entre les deux. Cela signifie que l'objet (texte) a désormais une durée de vie de 10 temps ou frames. Réglez la transparence à 100.
Fig. 8, Fig. 9, Fig. 10, Fig. 11
 Au temps 40, faites de même, mais en bougeant le curseur de la transparence. Cela provoque l'apparition dans la barre temps d'un repère ou événement et confirme la transparence 100. Au temps 50, réglez la transparence à zéro.
Résumons la situation : au début de " sa vie ", le texte est transparent. Il devient progressivement opaque et du temps 10 à 40 il le reste, puis redevient complètement transparent au temps 50.
Bon, nous ne recevrons pas le prix Nobel pour cela, mais c'est le début d'un changement majeur dans vos habitudes de travail ! Vous venez d'affecter la notion temps à du texte. Votre texte vit pendant 50 frames et connaît quatre évènements majeurs durant ce laps de temps. Que se passe-t-il après ? On boucle, par défaut, en revenant à zéro.
Créons un autre événement dans sa vie. Au temps 10, il devient bon à cliquer pour faire le lien vers le site de Phildes.com.
Vérifiez que votre texte est sélectionné, positionnez le curseur temps sur la frame 10, puis choisissez dans le menu Objet -> Ajouter une action. Dans la boîte de dialogue qui apparaît, sélectionnez l'option Lien vers la page Html. Nous écrivons alors l'adresse suivante : http://www.phildes.com (Fig. 9). Validez.
Vous pouvez vérifier votre animation en cliquant sur le bouton idoine (Fig. 10). Depuis OpenOffice.org, vous pouvez importer des cliparts dans E-anim par le biais d'un copier/coller. Dans E-anim, l'importation du presse-papiers s'effectue avec la combinaison de touches [Ctrl]+[Maj]+[V].
Il est temps de fabriquer l'animation Flash dans un fichier HTML à l'aide du bouton HTML de la barre d'outils (Fig. 11). Faites attention en donnant un nom à votre fichier, de bien ajouter l'extension appropriée (.htm ou .html), car E-anim ne l'ajoute pas à votre place. Dans la foulée, il vous propose de voir le résultat avec le navigateur mentionné dans Fichier -> Préférences.
Maintenant, nous allons relooker le tout dans OpenOffice.org.
 Un document HTML
Pour réaliser un document visible sur Internet, OpenOffice.org nous aide grâce à son module HTML. Toutefois, ce document est la version Internet du traitement de texte à quelques fonctions près. N'espérez pas faire des miracles ou des prouesses technologiques. L'objectif ici est le résultat. Donc OpenOffice.org fabrique pour vous un document conforme aux directives du W3C en HTML 4.0 (Fig. 12, page suivante).
Pourquoi ? OpenOffice.org se conforme à la norme HTML et non aux petits délires des navigateurs Internet qui font leurs sauces avec le code HTML de votre document (et l'on ne parle pas des sociétés commerciales qui préfèrent générer des sites féodalisés à Internet Explorer). Les responsables de site Internet s'arrachent les cheveux pour faire des sites qui fonctionnent chez tout le monde. Et vous ? Vous ne comprenez pas pourquoi tout ceci n'est pas plus simple ? Bienvenue au club !
Fig. 12, Â Fig. 13
Si les choses restent simples, il y a fort à parier que votre document passe l'épreuve du feu des navigateurs de tous bords. Le code HTML d'OpenOffice.org n'est pas salué comme un modèle de légèreté, mais il est conforme à la norme.
Par le menu Fichier -> Ouvrir, allez chercher le document HTML généré par E-anim. Ne soyez pas surpris de voir une page blanche. Votre animation au format Flash est bien là . OpenOffice.org n'est pas équipé d'un lecteur Flash, donc il vous montre seulement le cadre de l'objet si ce dernier est sélectionné (Fig. 13).
A partir de là , reprenez vos habitudes en traitement de texte, rédigez votre texte, utilisez la Gallery pour insérer des images. En fait, il n'y a plus grand-chose à vous dire... N'oubliez pas que votre document est visualisé sur un écran (le vôtre), mais, qu'au final, ce seront les écrans des lecteurs qui seront utilisés. Prévoyez que la moyenne des écrans affichera au maximum du 800x600.
Fig. 14
Petit truc classique : faites votre mise en page à l'aide de tableaux, dont vous cacherez les traits (décochez l'option Bordure) (Fig. 14).
Tenez compte aussi du fait que la connexion Internet de vos lecteurs n'est pas forcément à haut débit. Il vaut mieux limiter le nombre d'images (cliparts ou autres) et le nombre d'animations Flash. Découpez vos documents en plusieurs fichiers HTML si nécessaire. Avec un peu de pratique, cela peut donner le résultat que vous pouvez observer Figure 15.
Fig. 15
Conclusion
E-anim vous ouvre la voie de l'animation interactive au format Flash et OpenOffice.org vous simplifie la rédaction des documents en HTML. Quant à OpenClipart.org, il vous fournit de la matière première. Tout ce beau monde vous aide à devenir plus performant avec internet.
En ne perdant pas de temps (prise en main) ou d'argent avec des logiciels propriétaires, vous vous formez quand même à leur usage. Par exemple, avec E-anim vous apprenez l'essentiel de l'animation Flash. Libre à vous, plus tard, d'acheter les logiciels commerciaux ou d'en rester à vos outils. Et ne croyez pas qu'il soit nécessaire d'en savoir bien plus ! En entreprise, pour être performant, on n'utilise jamais 100% d'un logiciel, mais 100% de ce qui est utile.
Restez performants et en phase avec les professionnels grâce aux Logiciels libres. Dans les prochains numéros de Linux Pratique, vous entendrez sûrement parler des documents interactifs...
Note de l'auteur :
Mes remerciements à Phildes.com pour son logiciel E-anim et les images de Zeimer son chien de l'espace.
Retrouvez cet article dans : Linux Pratique Hors série 9
