Affichage des articles dont le libellé est SVG. Afficher tous les articles
Affichage des articles dont le libellé est SVG. Afficher tous les articles

dimanche 13 février 2011

Avez-vous l'heure ?

Je viens de tomber sur un truc qui m'a fait penser à ma rubrique des modèles qui ne servent à rien.

C'est un modèle qui s'appelle {{horloge analogique}} et qui affiche le cadran d'une horloge à l'heure.

Il y a plein de paramètres sympas qui font des tas de trucs qui ne servent pas vraiment le but encyclopédiste de Wikipédia, mais qui sont toujours utiles pour avoir l'heure (au cas où on n'aurait pas l'heure sur son PC ou son smartphone). On me glisse à l'oreille que ça permet de décorer les infobox fuseaux horaires comme les lobbies des grands hôtels de bande dessinée des années 1930.

Quand on va voir sous le capot, on réalise que c'est fait avec la méthode la plus barbare qui soit : il y a 720 fichiers, avec les 720 heures du tour de cadran (60 × 12, si je ne me trompe). Pas question de calculer à la volée l'angle des aiguilles pour les afficher (ou comment faire grimper le nombre de fichiers).

Mais c'est tout en SVG, donc c'est bien (je ne sais pas bien pourquoi, mais c'est ce qu'il faut dire, enfin on m'a dit ça…)

Pour ceux qui ont perdu leur montre et qui traînent sur Wikimedia Commons, il y a le même modèle : {{horloge analogique}}.

Vous n'avez plus aucune excuse pour être en retard.

vendredi 16 octobre 2009

Où l'on reparle de SVG

Maintenant que j'ai raconté mes ampoules aux pieds, on peut revenir aux choses sérieuses.

J'ai parlé il y a quelques semaines de la librairie svgweb développée par google qui doit mettre la honte intersidérale à Microsoft en faisant lire le SVG par IE contre le gré de ses concepteurs.

SVG Open 2009

Au début du mois s'est tenu quelque part en Californie la septième conférence internationale sur le SVG, SVG Open 2009.
Brion Vibber a fait une intervention pour la Wikimedia Foundation sur le thème : SVG in Wikipedia and Wikimedia Commons (diaporama commenté en pdf).

Le SVG sera la solution à tous nos problèmes, c'est entendu, mais il faudrait faire attention à ne pas gonfler pour le plaisir les fichiers.
C'est un problème récurrent du dessin vectoriel : l'aspect zoomable à l'infini peut faire perdre de vue l'utilisation, du coup on se perd dans des détails qui resteront invisibles et ça alourdit le fichier sans améliorer le dessin. Il faut donc éviter de surinformer les schémas (voir les slides 24 à 32).

On attend que svgweb et svg-edit (éditeur de SVG en cours de développement par google et qui fonctionne dans le navigateur1) atteignent une certaine maturité pour les intégrer. Ça devrait simplifier le travail sur les illustrations en évitant d'avoir à télécharger les images à modifier, les ouvrir dans inkscape, les bricoler, les enregistrer et finalement les re-téléverser (on gagnerait sur les étapes pas passionnantes).

SVG et MediaWiki

Sur les projets Wikimedia, le SVG sert presque uniquement à faire des icônes et des drapeaux (éventuellement des cartes). Il y a moyen d'aller un peu plus loin dans l'utilisation du SVG.

JSXGraph est une librairie Javascript de géométrie interactive et de visualisation des données dans un navigateur web. Sous MediaWiki, ça peut donner des trucs comme ça.

Notes

1. Pour les curieux, on peut essayer le truc ici.

vendredi 21 août 2009

Google s'intéresse au SVG

Comme on le sait déjà (je dis ça pour avoir l'air de parler à des initiés, mais je vais expliquer un peu), il existe deux types d'image numérique : l'image matricielle et l'image vectorielle (voir Wikipédia pour les explications).

L'image matricielle (à chaque pixel est allouée une couleur) est bien supportée par à peu près toutes les applications dans une foultitude de formats (JPEG, PNG, GIF, etc.) qui ont chacun leurs spécificités (mais ce n'est pas de ça que je veux parler), peut-être parce qu'un écran est matriciel (il est constitué d'une grille de pixels qui s'allument ou s'éteignent, pour la couleur, on utilise la synthèse additive mais le principe est le même). Bref, c'est ce qui sort d'un appareil photo numérique ou d'un scanner.
Du point de vue de l'affichage, si on veut zoomer il faut un fichier plus gros fichier. Sinon on voit apparaître le crénelage (certaines applications le masquent avec un flou). Ci-dessous une image montrant la même photo à différentes résolutions (nombre de pixels).
D'autre part, l'image vectorielle stocke les données sous forme d'objets : un segment de droite aura la forme des coordonnées de ses extrémités et des attributs de mise en forme (couleur, épaisseur, etc.) Ce type d'image peut s'afficher à toutes les échelles sans flou et sans augmentation de la taille du fichier. Si pour une photo, une image matricielle est assez adaptée, pour la cartographie, l'image vectorielle est plus performante (par exemple la carte des résultats d'une élection peut être mise à jour en changeant les attributs de couleur des différentes circonscriptions), le copier-coller d'éléments de dessin est également plus facile que sur une image matricielle. Ci-dessous, la différence entre image matricielle et vectorielle avec différentes tailles.
Il existe différents formats d'image vectorielle, les projets Wikimedia utilisent le SVG.

Le format SVG a l'avantage d'être un format ouvert (sa documentation est librement accessible). Ce qui veut dire que, pour un peu qu'on s'y intéresse, on sait le lire et l'écrire, contrairement à un format propriétaire pour l'utilisation (écriture et/ou lecture) duquel il faut passer par le logiciel du propriétaire.
C'est un format orienté sur le web design, mais il a le désavantage de ne pas être supporté par tous les navigateurs (en particulier IE). D'ailleurs MediaWiki convertit les SVG en PNG (format matriciel) pour l'affichage.
Bien que ce format soit développé depuis 10 ans, l'usage du SVG relève — pour le moment encore — du militantisme.

Et là, j'apprends que Google travaille justement sur le SVG. Ce n'est bien sûr pas la solution à tous les problèmes du monde : il s'agit d'une bibliothèque JavaScript qui fournit le support SVG aux navigateurs web les plus courants (en particulier IE). C'est destiné aux web designers, qui pourront donc répandre le SVG sur le web.

Ce n'est pas une révolution pour les projets Wikimedia, mais le SVG pourrait gagner des parts de marché, ce qui veut dire que (je ne m'emballe pas, bien sûr, mais c'est ça que j'ai derrière la tête) Inkscape va peut-être sortir de la sphère libriste-geek.
Ou pas.

mardi 21 juillet 2009

Illustrer Wikipédia avec Inkscape


Ça a débuté comme ça. Moi, j'avais jamais rien dit. Rien.1 Je glandais sur l'Oracle (c'est dire si ça remonte2) quand j'ai voulu faire étalage de ma science triangulaire en citant une curiosité des géométries non euclidiennes. Ça nous aurait entraîné dans des explications compliquées, donc j'ai fait une petit dessin. Et j'ai été encouragé par des wikigraphistes qui passaient par là à continuer et à participer à l'atelier graphique.

Et je me suis mis à tourner autour de l'atelier graphique. Je n'ai jamais été vraiment assidu, mais à l'occasion, je traite une requête. J'ai commencé par des retouches photo. Bien sûr, je connais Photoshop depuis longtemps (je me rappelle encore avec émotion l'époque où il n'y avait pas d'historique3), je pratique à l'occasion quand celui qui me paye a Photoshop. Mais comme ne j'ai pas l'intention de payer la licence, il a fallu apprendre GIMP4.

Puis j'ai essayé Inkscape et j'ai commencé à faire des plans. Le plan n'est plus une langue étrangère pour moi depuis quelques années maintenant. On peut dire que j'en mange à tous les repas. En fait, c'est plus Inkscape qui coince. J'ai l'habitude d'utiliser (professionnellement parlant) un logiciel de dessin technique5, un logiciel où toute la saisie se passe au clavier, où on entre des cotes d'une précision à faire peur (quelque chose comme 11 décimales), où le fin du fin est de virer toutes les icônes et de travailler devant un écran noir en faisant beaucoup de bruit avec le clavier.
Et je me retrouve à me débattre contre Inkscape, où il est impensable de rentrer une cote, où il n'y a pas de ligne de commande, où il y a des icônes énormes. Toutes mes petites habitudes sont des handicaps : impossible de sélectionner toutes les lignes bleues pour les mettre en pointillé (c'est un exemple), il faut aller à la pèche à la souris, impossible de savoir si j'en ai oublié. J'ai un peu l'impression de jouer au Lego Technic de mon adolescence avec des Duplo6.

Je me plains, mais visiblement, je fais illusion7. En plus des félicitations d'usage, on vient me demander des conseils et on m'apporte le boulot directement sur ma page de discussion. Donc je continue à perdre mes cheveux sur ce logiciel qui devrait sortir des SVG qui respectent les spécifications W3C si on croit ce qui est écrit dessus, mais qui oblige à ne pas utiliser le format du logiciel (celui qui est par défaut) et à tripatouiller à la main le code pour faire des fichiers valides8.

Bref, je suis passablement énervé par ce logiciel (en plus il plante) que je subis plus qu'autre chose, vu que c'est la seule solution libre raisonnable pour produire des dessins vectoriels9 pour illustrer Wikipédia.

Tout ça pour dire que le slogan « Draw Freely », j'en suis loin ; je préfère de loin un papier et un crayon.

Pour me désénerver, je vais aller supprimer quelques images sur Commons.

Notes
1. Bon, ça, c'est une citation littéraire.
2. Ça fait un moment que je n'y mets plus les pieds.
3. On ne pouvait annuler que la dernière opération, ce qui poussait à avoir des stratégies assez complexes et gourmandes en termes de ressources pour se donner le droit à l'erreur.
4. Personnellement, je trouve bizarre de promouvoir le libre en utilisant des logiciels crackés, donc en ce qui concerne ma participation wikimedienne, j'utilise des logiciels libres/gratuits dans la mesure du possible. Ça demande d'apprendre des logiciels moins performants, c'est somme toute formateur.
5. Un logiciel qui n'a pas de concurrent libre à ma connaissance, et qui ne sait pas sortir un SVG, donc inutilisable (moralement et techniquement) dans le cadre des projets Wikimedia.
6. Oui, j'ai eu une vie traumatisante avant d'arriver sur les projets Wikimedia.
7. Il y a plus fort que moi, en matière de SVG. Sans doute des gens qui ont compris comment penser devant Inkscape et qui n'essayent pas d'y plaquer un mode de fonctionnement inadapté.
8. À ce propos, il existe un validateur pour vérifier que les SVG sont bien valides selon les spécifications W3C, les "SVG Inkscape" ne passent pas le test, et ils sont plus gros que les fichiers valides.
9. L'intérêt de l'image vectorielle, c'est qu'on peut l'imprimer de la taille qu'on veut sans se retrouver perdu dans un nuage de flou en grand format, avec un fichier dont la taille reste relativement modeste (elle est fonction de la quantité d'information, pas de la taille d'impression comme pour les images matricielles). L'utilité de la chose à l'écran n'est pas évidente, à tel point que MediaWiki les transforme en PNG pour les afficher.