Elles nous avaient manqué depuis la sortie de la version 0.47, mais elles sont de retour ! Grâce au travail d’Uwe Schöler (par ailleurs tout récent auteur d’un nouveau livre sur Inkscape en Allemand), vous pourrez retrouver et tester les versions de développement en paquets 7zippés pour Windows à l’endroit habituel : http://inkscape.modevia.com/win32/?M=D.

Pour un accès plus rapide, ce lien est désormais accessible depuis la page d’accueil de ce site, sous le lien pointant vers la version stable.

N’hésitez pas à télécharger, tester, signaler des défauts et proposer des évolutions, ou tout simplement profiter des nouveautés de la 0.48, dont le nouvel outil Spray, les évolutions de l’outil Nœuds (avec sélection multi-chemins !) et de l’outil Connecteur, et plein d’autres choses encore (voir les notes de version ). Mais nous en reparlerons plus tard…

Il est temps d’annoncer le gagnant du concours Inkscape-fr 2009.

Tout d’abord, je remercie sincèrement tous les participants. Cela fait plaisir de constater l’intérêt croissant vis-à-vis d’Inkscape par le biais, entre autre, d’autant de participations.

Il ne faut pas croire, mais choisir entre toutes ces réalisations ne fut pas une mince affaire. Vous avez tous passé du temps sur le logiciel pour en extirper ce dont vous aviez en tête. Les résultats sont visibles dans ce précédent article. Comme vous pouvez le constater, les styles sont très différents.

Le but du concours est de vous pousser à utiliser le logiciel. C’est pourquoi il était ouvert aux débutants et aux initiés. Tout le monde avait sa chance. Le livre de Cédric Gémy s’adressant aussi bien aux débutants qu’aux confirmés, nous souhaitons seulement que le gagnant apprécie sa lecture et réalisera des dessins satisfaisant.

Le gagnant du concours est Madeg avec cette illustration.

Félicitation Madeg !

Pour les autres, j’espère que vous ne serez pas trop déçu. Je vous encourage à continuer à utiliser Inkscape, pour vectoriser librement.

Voici comment l’illustration a été réalisée :

1. Propriétés du document

Fichier > Propriétés du document > Couleur de fond.

Choisir la couleur souhaitée.
Des dimensions de 1000*1000 pixels ont été ici utilisées (page carrée en fait).

2. Le texte

Cliquer sur l’icône pour activer l’outil texte.

Cliquer sur la feuille de dessin (peu importe où) et taper le texte souhaité (ici « attention », « le  piment… », « pique !!! ». Texte > Texte et police pour mettre en forme le texte (taille, police…). Ici, la police utilisée est « Abiscuos » et la taille est de 50 px pour le 1er mot, 120 pour les deux autres.

L’objet étant sélectionné, un simple clic sur la couleur souhaitée (rouge #FF0000) de la palette (juste au-dessous de la barre de défilement) définira la couleur de remplissage du texte. (Remarquer qu’un clic droit permet de définir aussi la couleur du contour).

Pour centrer le texte par rapport à la page :
Objet > Aligner et distribuer Aligner relativement à : Page.
Cliquer sur la 3ème icône de la 1ère ligne (Regarder les dessins, c’est logique !).

Déplacer enfin les éléments de haut en bas pour leur donner la place souhaitée (avec la combinaison Maj+↑ d’abord, puis ↑ tout seul pour préciser).

Les deux traits autour du mot « attention » se font à l’aide du simple crayon (on simplifie juste le tracé une fois ou deux : Chemin > Simplifier ou Ctrl+L)

3. Les cases

Créer 1 carré de côté 300 pixels et le remplir avec la couleur rouge #FF0000 comme expliqué récédemment.Le placer à gauche de la page sous le mot « Piment ».
Pour donner un effet irrégulier au contour : Convertir le rectangle en chemin (Chemin > Objet en chemin).  Ajouter des nœuds (Extensions > Modification de chemin > Ajouter des nœuds) : le
choix des paramètres ici importe peu, du moment que le nombre de nœuds (visibles lorsque le chemin est sélectionné) reste relativement peu élevé (une centaine de nœuds semble raisonnable).
Déplacer les nœuds aléatoirement (Extensions > Modification de chemin > Déplacer les
nœuds aléatoirement) en réglant le déplacement maximum sur les axes X et Y à 1,0 px.

Dupliquer 2 fois la case en appliquant 2 « coups de tampon » :
Sélectionner l’objet en gardant le bouton de la souris pressé et appuyer deux fois sur la
barre d’espace (sans déplacer la souris). Là où il y avait tout à l’heure 1 seule case, il y
en a 3.

Déplacer horizontalement les deux cases supérieures, avec la combinaison Maj+↑ par
exemple, ce qui permet d’obtenir un espace identique entre chaque case.
Sélectionner enfin les 3 cases, les grouper et les centrer par rapport à la page comme
vu précédemment.

4. Les dessins

Dessiner sur papier l’histoire souhaitée.
Prendre soin d’accentuer les contours du dessin au feutre noir.

Prévoir 4 dessins séparés facilite la suite.

Scanner les 4 dessins.
Importer les scans vers Inkscape (Fichier > Importer). Vectoriser les dessins : Chemin > Vectoriser le bitmap (Utiliser de préférence le mode « Détection de contour » et ajuster le seuil selon la qualité de l’image (d’où l’utilité de l’accentuation des contours sur papier) et/ou jouer avec les options suppression des parasites, optimisation des chemins…)
Essayer toutefois de préserver cet effet « naturel » du dessin papier.

Ajuster les dimensions des nouveaux chemins formés et les disposer aux emplacements souhaités (les 3 premiers dans les cases et le dernier sous la 3 ème case).
Définir le rouge comme couleur de remplissage du dernier dessin.

Pour les « crounch » : Créer un texte « crounch » près du visage du personnage.
Choisir sa police et sa taille (Century, 20, par exemple)
Convertir le texte en chemin : Chemin > Objet en chemin.
Convertir les contours du chemin en chemins : Chemin > Contour en chemin.
Ajouter des nœuds (vu précédemment) et les déplacer aléatoirement (vu précédemment aussi) avec des déplacements horizontaux et verticaux de 0,5 px au maximum.

Pour finir, dupliquer 3 ou 4 fois ce « crounch » avec des « coups de tampon » comme vu précédemment (ou plutôt, répéter la procédure pour éviter l’impression artificielle du copier-coller).

5. La flamme

Tracer au crayon la silhouette d’une grande flamme (ce sera la forme approximative de la flamme finale), d’une plus petite à l’intérieur, et d’une troisième à l’intérieur de la deuxième.

Simplifier (Ctrl+L) les tracés. Si la silhouette semble trop arrondie, passer en mode d’édition de nœuds et rendre dur les nœuds au bout des pointes de la flamme :

Noeud doux

Noeud dur

Choisir un remplissage rouge (#FF0000) pour la flamme, orange (#FF6600) pour la seconde et jaune (#FFFF00) pour la dernière. Veiller à ce que la rouge soit située sous l’orange, et elle-même sous la jaune.

Ajouter des nœuds et les déplacer aléatoirement avec une amplitude de 20 px sur les deux axes.

Appliquer l’effet « Clapotis » aux trois flammes (Filtres > Déformation > Clapotis) puis l’effet « Aquarelle » (Filtres > Textures > Aquarelle).
Attention à avoir bien positionné les 3 chemins car leur nombre important de nœuds
rend les modifications du document difficiles.

6. Export

Fichier > Exporter en bitmap > Page

Choisir les dimensions du bitmap, la résolution (attention plus elle est élevée, plus l’export sera long) et le nom. Le fichier final sera ainsi au format png.

Conclusion

Merci Madeg pour ces explications et bonne continuation !

La communauté Inkscape annonce la sortie de la version 0.47 :: http://www.inkscape.org :: Dessiner librement.

Après plus d’un an de développement intensif et de réusinage, Inkscape 0.47 est disponible.

Cette version de l’éditeur de graphismes vectoriels orienté SVG apporte des améliorations de performance et de nombreuses nouvelles fonctionnalités, telles que l’enregistrement automatique, les splines spiro, les nœuds automatiques, l’outil Gomme, des nouveaux modes pour l’outil Ajuster, une barre dédiée au magnétisme et de nouvelles fonctionnalités liées au magnétismes, des nouveaux effets de chemin (dont l’enveloppe), une gigantesque collection de filtres prédéfinis, de nouvelles exportations PS et EPS basées sur Cairo, un correcteur d’orthographe, de nombreuses nouvelles extensions, des options d’optimisation du code SVG, et beaucoup d’autres encore.

Bien entendu, cette version corrige également plusieurs centaines de bogues relevés dans les versions précédentes.

Référez-vous à la note de version complète pour de plus amples informations, profitez des captures d’écran, ou téléchargez tout simplement le logiciel pour Windows, Linux ou Mac OS X.

–

Téléchargement : http://inkscape.org/download/?lang=fr

Notes de révision complètes pour Inkscape 0.47 : http://wiki.inkscape.org/wiki/index.php/ReleaseNotes047

Captures d’écran réalisées par la communauté : http://inkscape.org/screenshots/

31 Octobre, billet mis-à-jour.

Le concours pour le livre Inkscape efficace est maintenant terminé ! Je remercie tous les participants. Vous avez été nombreux cette année et très originaux. Je vérifie que toutes les participations sont bien postés ici, si ce n’est pas le cas, faites moi signe ! Est venu l’étape de la réflexion pour le jury ! Ohlala c’est pas facile.

Nombreux sont les personnes qui souhaitent voir ces fameuses participations. Pour le plaisir des yeux voici toutes les participations.

Les participants & leurs créations

• Antoine
• Mathieu
  

  Participation de Mathieu

• Raphaël
  

  Participation de Raphaël

• Nohjan

  

  Première participation de Nojhan

  

  Deuxième participation de Nojhan

  

  3ème participation de Nojhan

• Christiane
  

  Participation de Christiane

• Yannick
  

  Participation de Yannick

• Jérémie
  

  Participation de Jérémie

  lien vers la source du fichier

• Jean-louis
  

  Participation de Jean-lou

• Bob
  

  Participation de Bob

• Luc
  

  Participation de Luc

• Mathieu H.
  

  Participation de Mathieu (un autre)

• Olivier
  

  Participation d'Olivier

• fffourmi
  

  Participation de fffourmi

• Madeg
  

  Participation de Madeg

• Bruno
  

  Participation de Bruno, variation bronze, existe en de nombreuses couleurs

• Charlotte
  

  Participation de Charlotte

Vous avez sans doute déjà aperçu les publicités pour Apple iPod qui sont symbolisées par une silhouette en mouvement sur un fond de couleur chaudes.

Ce genre d’illustration est assez facilement réalisable avec Inkscape, grâce à ses puissants outils vectoriels et sa facilité à vectoriser des bitmaps.

Le fond

Il nous faut d’abord créer un fond qui va nous servir comme base, la première astuce est de faire un dégradé de couleurs chaudes, comme un rouge/orange, un bleu ou un vert clair, un mauve/rose, …

N’hésitez pas à utiliser des calques pour vos différents objets.

Commencez par remplir votre surface de travail (préférez un espace de travail en mode paysage plutôt que portrait) avec un rectangle . Vous pouvez légèrement arrondir les bords de celui-ci en touchant le point circulaire situé sur le coin supérieur droit de votre rectangle avec l’outil édition de nœuds .

Remplissez votre rectangle avec un dégradé linéaire de couleurs chaudes et placez-le sur une de ses diagonales.

Ensuite, dessinez quelques formes non régulières (triangles, quadrilatères, …) avec l’outil courbes de Bézier et appliquez-leurs un dégradé linéaire de blanc opacité 255 à blanc opacité 0. Jouez sur le position du dégradé et sur l’opacité générale de la forme pour que certaines arêtes de la forme ne soient que très peu visible.

Vous pouvez également essayer d’appliquer un motif sur certaines formes, Stripes 1:1 white par exemple.

La silhouette

Pour réaliser notre silhouette, nous avons besoin d’un modèle à vectoriser. On en trouve facilement sur internet dans les moteurs de recherches avec des mots clés comme, par exemple, hip hop dance, mais vous pouvez utiliser une image réalisée par vous même. L’essentiel est de choisir une photo où la personne est en mouvement, et de préférence vue de profil. Avoir un fond uni et d’une couleur bien différente de celles des vêtements de la personne facilitera également le détourage.

Vous pourriez ouvrir la photo directement avec Inkscape et faire le détourage à la main à l’aide de l’outil courbes de Bézier , mais il est plus facile d’utiliser un éditeur d’image bitmap, comme The Gimp et d’ensuite vectoriser le bitmap détouré avec Inkscape.

Pour le détourage de la silhouette du personnage, je vous laisse rechercher des tutoriels dédiés à cela consacrés à votre éditeur sur Internet. Prêtez une attention particulières pour les zones entre les doigts/jambes et les cheveux. Arrangez-vous pour que le reste de l’image soit sur un fond transparent et non sur un fond blanc.

Ensuite, utilisez l’outil remplissage avec un seuil de tolérance élevé de votre éditeur pour rendre la silhouette monochrome. Enregistrez la silhouette et ouvrez-là dans une nouvelle fenêtre avec Inkscape.

Dans Inkscape, sélectionnez la silhouette bitmap que vous venez d’ouvrir et rendez-vous dans le menu Chemin → Vectoriser le bitmap.

Sélectionnez Seuil de luminosité et réglez le aux environs de 0,5, appuyez sur Mettre à jour pour avoir un aperçu, et si la silhouette apparait parfaitement, validez, sinon, ajustez le seuil de luminosité.

La silhouette a alors été vectorisée, il vous suffit de la sélectionner et de la coller dans votre autre document qui contient déjà notre fond. Adaptez sa taille si nécessaire.

Ensuite, rajoutez un simple dégradé linéaire sur la silhouette, de haut en bas, avec une autre gamme de couleurs chaudes que celle utilisée pour le fond.

Rajout de l’iPod et des écouteurs

Que serait une pub pour iPod, sans iPod ?

L’iPod est un simple rectangle blanc, légèrement arrondi, que nous allons placer, soit au niveau de la ceinture, soit dans une des mains de notre personnage.
Pour donner un léger effet de perspective, je vous conseille d’utiliser l’outil courbes de Bézier plutôt que l’outil rectangle . Attribuez un blanc légèrement grisé comme fond et comme bordure à votre iPod. Dans l’onglet style de contour de l’éditeur de couleurs , mettez une taille de contour à 2px et activez le raccord arrondi .

Pour les écouteurs, utilisez simplement l’outil courbes de Bézier pour dessiner le cordon, en commençant de l’iPod pour vous arrêter (clic droit) vers l’emplacement approximatif de l’oreille visible. Dessinez ensuite une deuxième section du cordon au partant de la précédente partie, au niveau des poumons, en vous dirigeant vers l’oreille non visible, mais arrêtez-vous au moment où le cordon ne doit plus être visible. Sélectionnez les deux sections de votre cordon mais ne mettez pas de couleur d’arrière plan, sélectionnez plutôt un contour de la même couleur que celui de l’iPod et ajustez son épaisseur.

Pour l’écouteur en lui-même, utilisez également l’outil courbes de Bézier pour créer un triangle et arrondissez-le avec l’outil édition de nœuds .

Sélectionnez ensuite les 3 chemins que vous venez de tracer et faites Objet → Grouper.

Rajout d’un halo

On peut rajouter une petite lueur autour de la silhouette, et accessoirement sur les formes que nous avons créées au début, pour rajouter un peu de dynamisme dans l’illustration.

Pour cela, dupliquez la silhouette avec Ctrl + D, une deuxième silhouette est alors créée à l’emplacement de la première. Donnez lui un fond blanc et réglez son opacité (~75%) et son flou (~25%) général.

Vous remarquerez que le nouvel objet se trouve devant la silhouette colorée, utilisez Page Down et Page Up pour le faire descendre ou monter dans la superposition des objets. Vous pouvez également naviguer dans les objets avec TAB.

Si vous le souhaitez, vous pouvez effectuer la même opération sur les formes du fond.

Améliorations

Vous pouvez jouer sur les couleurs et sur les filtres de la silhouette et du fond pour obtenir un rendu différent.

Ajoutez si vous le souhaiter du texte en blanc et en gras.

A propos de ce tutoriel

Petit mot d’Elisa :

Souhaitons la bienvenue à notre nouvel auteur de tutoriel : Raphael. Je le laisse se présenter s’il le souhaite en commentaire de son article. Raphael participe au concours Inkscape avec cet article. Sa très belle réalisation est accompagnée d’un excellent article sur lequel aucune retouche n’a été appliquée (quasiment, j’ai surtout retiré la référence à un logiciel propriétaire ). Raphael a accepté de publier sa participation au concours pour offrir à Inkscape-fr cet article. Merci Raphael et n’hésite pas à nous en écrire d’autre !

Mais qui est Raphael ? J’ai trouvé son blog et il m’a également envoyé ce lien.

Participez au concours d’Inkscape-fr.org pour gagner le livre Inkscape Efficace de Cédric Gémy !

1. 1. Créez une illustration 100% avec Inkscape ;
2. 2. Ecrivez un texte pour nous expliquer votre processus de réalisation ;
3. 3. Envoyez le tout à ou indiquez nous par mail où votre participation est déposée sur la toile ;
4. 4. Soyez “libre” et placez votre création et son texte sous licence LAL.

Informations sur le concours

Le thème de l’illustration est “piquant“. Les dates du concours sont du 31 août au 31 Octobre 2009.

Le jury est composé de Dominique, Cédric Gémy et moi-même. Nous déciderons sur des critères précis quelle illustration remporte le concours. Ensuite nous vous recontacterons pour connaître l’adresse postale à laquelle vous adresser le livre.

Le livre

Cédric Gémy, graphiste, auteur et formateur a publié chez Eyrolles en février 2009 Inkscape Efficace.

Pour en savoir plus sur cet ouvrage :

• lisez l’article de ce blog consacré à ce livre
• lisez l’article de Dominique consacré à ce livre
• visitez la page du livre chez Eyrolles

Cédric Gémy vous guide dans l’apprentissage du logiciel de façon didactique. Inkscape-fr est heureux de pouvoir vous offrir ce livre grâce à Dominique et Cédric Gémy. Vous ne connaissez pas Dom ? Il est passionné par le graphisme libre, retrouvez ses articles sur son blog, où il contribue régulièrement sur Inkscape.

N’hésitez pas à diffuser l’information du concours pour assister à un festival de création libre francophone.

Février 2009, Cédric Gémy publie avec Eyrolles un livre sur Inkscape : Inkscape Efficace.

Le sommaire

• Pourquoi Inkscape ?

• Premiers pas avec Inkscape

• Dessiner des formes géométriques et les combiner

• Dessiner à main levée

• Modifier des courbes

• Couleurs et contours

• Travailler avec du texte

• Transformer des parties du dessin

• Optimiser sa méthode de travail

• Travailler avec des photos

• Inkscape et la 3D

• Les effets visuels

• Publier sur le web et sur papier

• Les coulisses d’Inkscape : SVG

Ouvrage papier ou ebook ?

La version ebook contient les figures en couleurs, épargne la transformation de l’arbre en papier et l’utilisation de l’encre (pas vraiment biodégradable) (ah bon ? Cela se voit que je milite pour l’e-book ?).

Qui est Cédric Gémy ?

Si vous vous intéressez aux logiciels libres graphiques, il y a des chances pour connaître sa réputation. Il est graphiste, auteur et formateur en logiciels libres graphiques et également quelques logiciels propriétaires. Il s’adapte aux systèmes d’exploitations de ses clients même s’il préfère de loin rester sur Gnu/Linux.

Voici quelques liens pour en connaître plus sur lui :

• son site professionnel
  
• initiateur du réseau formation libre
• son blog
• et enfin notre portfolio commun (nous collaborons sur quelques projets).

Cédric Gémy m’a fait l’honneur de m’offrir un exemplaire de son dernier livre.

Allez Elisa donne nous ton avis sur ce livre !

Vous rendez-vous compte de l’audace de cette demande ? Je suis l’auteur du premier ouvrage français sur Inkscape, un livre concurrent pourrait on dire. Il m’est difficile d’avoir un avis objectif sur mon propre travail, alors n’attendez pas de moi un simple comparatif ou une critique acerbe dans le but de cracher sur le livre.

Tout d’abord, même si nos livres sont sortis dans des maisons d’édition traditionnelles (c’est-à-dire sous licence fermée), ils ne sont pas en concurrence pour autant. Auteur n’est pas notre activité principal à tous mais graphiste-formateur. Plus de gens s’initieront au charme d’Inkscape, mieux le logiciel se portera.

Revenons à l’ouvrage Inkscape Efficace. Cédric Gémy aborde tous les points clefs du logiciel (et même davantage). Il s’appuie sur ses années de formation pour être didactique. De nombreux apartés jalonnent le livre pour les habitués à Illustrator. Il nous livre également ses astuces (j’ai adoré)!

Soulignons la performance de l’auteur dans la réalisation d’un site (actuellement indisponible) dédié au livre : entièrement en SVG ! La différence de l’interprétation du site selon les navigateurs est énorme. Vivement que le SVG intéresse les concepteurs de navigateurs pour profiter pleinement de son potentiel.

Ce livre s’adresse aux débutants et aux confirmés (même s’ils l’ignorent). Si vous devez en acheter qu’un, le choix peux être difficile, regardez peut être sur des paramètres factuels tels que les maquettes, les éditeurs, les tarifs, les disponibilité en librairie ou sur internet, les poids, les tailles du livre, les auteurs (oui, pourquoi pas), l’objet livre ou l’ebook… en tous les cas l’un ou l’autre, vous finirez par apprendre à utiliser Inkscape efficacement !

Autre nouveauté notable, Inkscape 0.47 embarque un beau paquet de filtres prédéfinis que vous pourrez utiliser directement sur vos objets, sans vous poser la question (épineuse !) de leur création.

Rappels sur les filtres SVG

Rappelons que les filtres SVG permettent, en combinant des primitives simples (flou, remplissage, turbulence…) d’obtenir des modifications plus ou moins complexes du rendu des objets auxquels ils s’appliquent. Ils reprennent en partie les filtres d’image contenus dans le menu Effets>Image Raster (en 0.46) ou Extensions>Images matricielles (0.47), mais à la différence de ces derniers, qui s’appuient sur ImageMagick, les filtres SVG ne sont pas destructifs et peuvent donc être enlevés n’importe quand de l’objet, même si celui-ci à subi d’importantes modifications.

Les filtres SVG, définis dans la spécification SVG 1.1 (elle prévoit en tout 16 primitives ; deux seulement, feTile et feComponentTransfer, n’ont pas encore été implémentées dans Inkscape), ont été introduit dans la version 0.45 du logiciel. Mais jusqu’à présent, il fallait les réaliser à la main avec l’éditeur de filtres, ce qui n’est franchement pas simple, ou télécharger les créations disponibles sur le web (relativement peu nombreuses).

Merci Ivan !

Mais Ivan Louette, un passionné qui passait par là, a trouvé judicieux de se lancer, après quelques essais proposés sur sa galerie Open Clip Art, dans la création massive de filtres. Et depuis qu’il est parti, plus moyen de l’arrêter ! À l’heure actuelle, la version en développement contient plus de 170 spécimens uniques, répartis dans 17 catégories. Du coup, tout cela étant devenu trop volumineux pour le menu Effets où ils étaient prévus initialement, les filtres ont été déplacés dans un menu rien qu’à eux, nommé (sans surprise) Filtres. Et puis tant qu’ils y étaient, les développeurs en ont profité pour y déplacer les entrées Éditeur de filtre et Supprimer les filtres, qui étaient précédemment hébergés par le menu Objets. Mais tout ça c’est de la popote, et ça ne nous montre rien de bien concret.

Le nouveau menu Filtres

Quelques exemples

Je n’ai pas trop envie de vous montrer de capture ici. D’abord, il faudrait choisir, et c’est trop dur. Et puis c’est l’occasion de vous amener à visiter le manuel officiel sur le site FLOSS Manuals (si vous voulez nous aider à compléter le manuel, ou simplement le relire, votre aide est bienvenue…). Tous les filtres prédéfinis y sont documentés (opération en cours !) par leur auteur lui-même. Vous y retrouverez, pour chaque filtre, une capture, une petite explication et quelques détails sur le paramétrage, dès fois qu’il vous viendrait à l’idée d’aller tripatouiller à l’intérieur…

Bon, allez, juste une, pour vous faire plaisir.

Le filtre bosselage TSL

Et pour modifier un filtre ?

Bon, puisque vous insistez, ce n’est pas si compliqué. Il suffit d’ouvrir la boîte de dialogue qui va bien à partir du menu Filtres>Éditeur de filtres. Après, c’est un peu plus touffu, et il est préférable de suivre les instruction dans la documentation d’Ivan pour savoir où aller exactement (pour en savoir un peu plus sur l’éditeur de filtres, voir également le récent tutoriel du site Dom-web.net).

Modifier un filtre

La capture précédente montre la décomposition du filtre ABC>Agitation. Comme l’ensemble des filtres du sous-menu ABC, il est extrêmement simple, et peut servir de base à des filtres plus complexes, ou être additionné à d’autres filtres.

Les filtres des autres sous-menus sont souvent plus compliqués. Ils contiennent des primitives qu’il est préférable de laisser fixes (à moins de vouloir faire un effet vraiment très différent), et d’autres que vous pouvez ajuster pour diminuer ou renforcer l’effet désiré. Pour certains filtres, des indications (succinctes) sur ce point précis sont disponibles dans la barre d’état et d’informations lorsque vous survolez le filtre dans le menu.

Après, tout dépend de votre inspiration !

L’heureux gagnant est…sko !

Il a récolté de nombreux votes sur Deviantart, cela a continué parmi les développeurs d’Inkscape.

Pour le plaisir des yeux, regardons encore une fois sa création.

Félicitations !

sko

La version 0.47 approchant à grand pas, c’est le moment ou jamais (enfin, pour la 0.47 en tout cas…) de nous pencher sur un sujet déjà fort ancien : la taille des boîtes de dialogue. Certaines sont excessivement encombrantes, en particuliers lorsqu’elles sont paramétrée en attachable (par opposition à flottantes). C’est le cas précisément de la boîte de dialogue Remplissage et contour.

Le débat a déjà suscité quelques réactions et propositions sur la liste de diffusion de l’association des utilisateurs francophones (et sur la liste des développeurs, l’interface en anglais posant également des problèmes de taille, mais moins marqués), en voici un résumé.

Raccourcir le titre

Il s’agit sans doute de la proposition la plus ancienne, mais sans doute aussi la moins efficace. Si l’on regarde bien, le titre est long, certes, mais pas tant que ça. En tout cas, son raccourcissement ne modifie pas la taille de la boîte, même lorsque d’autres paramètres (que nous allons étudier dans les prochains chapitres) sont optimisés.

Cependant, les idées émises ont permis de lancer le débat, et seront sans doute réutilisables à l’avenir. Nous avons eu, sans ordre particulier :

• Fond et contour (mais on peut reprocher à « Fond » de ne pas être tout à fait équivalent à remplissage, puisqu’il donne en plus une impression de profondeur dans le plan) ;
• Styles (avec le risque de confusion par rapport aux styles de texte) ;
• Peinture (qui reprend le « Painting » utilisé dans la recommandation SVG pour représenté le contenu des trois onglet, mais avec un risque de confusion vis-à-vis de l’outil remplissage au seau).

Dans la mesure où jusqu’à présent nous n’avons pas réussi à nous mettre d’accord, et que l’impact de cette modification est dans le meilleur des cas très limité, ma proposition est de le conserver tel quel pour cette version, ce qui aura en plus l’avantage de ne pas perturbé les utilisateurs habitués.

Raccourcir les onglets

L’impact des onglets sur la boîte est beaucoup plus fort que le titre, et il y a sans doute pas mal à gagner de ce côté là. Voici ce qui a été proposé :

• Remplacer « Remplissage » par « Fond ». On reprend l’idée déjà formulée pour le titre, mais ça semble plus efficace ici car, avec l’intitulé actuel du titre, nous savons déjà qu’il s’agit d’une boîte qui concerne le remplissage. On évite la répétition et on gagner de la place. Bingo !
• Remplacer « Remplissage du contour » par « Contour ». Même idée que dans le cas précédent, avec un gain encore plus fort.
• Conserver « Style du contour ». « Style » est déjà assez court, et il faut bien expliquer à quoi il s’applique. Et plus on a déjà bien gagné avec les deux premiers onglets, alors ce n’est pas trop grave.

Voici ce que ça donne en pratique :

Impact des onglets (seuls) sur la boîte

Raccourcir les paramètres

Damned ! Même en ayant bien réduit les onglet, la taille de la boîte est restée identique. C’est que les paramètres, et en particulier leurs intitulés, ont aussi une influence ! Rien à dire sur les deux premiers onglets, qui sont assez souples, mais pour le troisième, c’est un peu la catastrophe. Voyons pourquoi, avec cette petite capture :

Manifestement, les marqueurs ont pris leurs aises, et il serait grand temps de les cantonner aux espaces dont ils ont vraiment besoin. Deux propositions ont été formulées :

• remplacer « Marqueurs de début » par « Marqueurs initiaux », « Marqueurs intermédiaires » par « intermédiaires » et « Marqueurs de fin » par « terminaux » ;
• pareil, mais en supprimant « Marqueur » sur les trois lignes.

Le second choix apporte un gain un chouïa plus grand, mais il n’est plus indiqué nulle part qu’il s’agit de marqueurs. Il peut convenir à des utilisateur habitués, mais risque de larguer ceux qui le sont moins (sans parler des problèmes de documentation). Pour profiter pleinement de cette seconde réduction, il faudrait aussi réduire la ligne « Limite de raccord », mais « Limite » tout court pose est sans doute un peu abrupt.

Voilà ce que ça donne (en haut l’original) :

Impact des paramètres sur la boîte

Notez que les deux derniers cas profitent de la réduction effectuée sur les onglet. Sans ça, leur taille aurait été identique à l’original. Par contre, la taille du titre n’a aucune influence, quels que soient les raccourcissements effectués sur les paramètres.

Autres pistes

Une solution particulièrement efficace consisterait grouper les paramètres. On pourrait ainsi disposer l’intitulé Marqueur au dessus (et non pas à côté) des trois paramètres relatifs, et faire de même pour les raccords. Mais cette option n’est pas réalisable dans l’immédiat (en tout cas pas pour la version 0.47), car elle nécessiterait une modification plus profonde de la boîte qui aurait un impact sur l’IHM et sur l’ensemble des traductions. Il faudrait donc qu’elle s’inscrive dans un débat plus global avec les développeurs du logiciel. C’est pourquoi nous devons donc nous contenter pour l’instant de ce que nous permet la traduction et elle seule.

La taille et le style des polices peut également avoir effet sur la largeur de la boîte, et les développeurs préconisent régulièrement leur diminution comme solution de contournement. Mais il s’agit ici de paramètres réglables par l’utilisateur, alors c’est vous qui voyez !

Aidez-nous !

Voilà où nous en sommes. Nous pouvons, si un consensus se dessine rapidement, introduire ces modifications, ou une partie, dans la version 0.47 (la traduction actuelle ne contient aucun de ces changements). Sinon, nous conserverons la traduction actuelle, quitte à remettre ça pour la prochaine version (et à pousser pour une évolution plus radicale de l’interface…).

Nous vous demandons votre avis sur les points suivants :

• Approuvez-vous les modifications proposées sur les onglets et les paramètres (sachant que les deux doivent implémentées pour avoir un effet sur la boîte) ?
• Dans l’affirmative, quelles solution souhaitez-vous pour les marqueurs ?

Le titre pouvant être laissé tel quel pour l’instant du fait de son impact mineur sur la taille.

Bien sûr, si vous avez d’autres idées, elles sont les bienvenues !

Ajout du 14 juin 2009, 19 h 49

Quelques réponse à vos réactions :

• Concernant le rôle de la traduction (Quentin), ce n’est effectivement pas son rôle d’améliorer l’ergonomie, mais elle ne doit pas, comme ici, la dégrader. Si tu regardes les textes en anglais, ils sont plus courts sur toute la boîte (tu peux comparer « Mid Markers » à « Marqueurs intermédiaire », pour le pire des cas…). Il faut donc, à mon avis, trouver une astuce pour, sans perte de sens, conserver une taille la plus réduite possible.
• Labels sur deux lignes (Quentin encore). J’ai testé, mais c’est assez moche car les lignes du label sont alignées à gauche, puis le tout est aligné à droite, ce qui génère des creux entre les labels et les valeurs.
• Refonte de l’interface (tous, ou presque). Nous ne sommes pas les seuls à nous plaindre des boîtes de dialogue, et la question de la taille de Remplissage et contour a été évoquée y compris pour la version originale en anglais (sans qu’une solution n’ai été trouvée pour l’instant). Une refonte générale de cette boîte (et de plusieurs autres) semble inéluctable. Plusieurs demandes d’évolution ont été formulées, et je compte bien profiter de vos remarque pour compléter ce qui a été suggéré voir en faire une synthèse sous forme de maquette. Mais comme il s’agit d’un travail assez lourd, et que les développeurs semblent plus motivés par l’ajout de fonctionnalités que par des questions d’ergonomie (l’actuel n’étant pas non plus complètement monstrueux), il va falloir être particulièrement fort et patient pour faire bouger les choses. Mais pour l’instant, notre seul levier est la traduction.