Retrouvez cet article dans : Linux Pratique Hors série 7

Didacticiel » est un terme un peu barbare, convenons-en ; aussi peut-on l'appeler « exercice dirigé » ou « pas à pas », bien plus explicite pour un francophone que « guidance » ou « step by step ». C'est ce qui sera fait parfois au cours du présent exposé dont l'objectif est d'aller à la découverte des principales fonctions du programme et de leur mise en œuvre.

Décodage du sujet

Nous nous proposons de réaliser l'image illustrant la Figure 1 des pages consacrées à la présentation de Skencil (voir article précédent). Il s'agit d'un travail assez simple, que j'ai effectué, il y a fort longtemps, lorsque j'étais en phase d'apprentissage du programme. Pour cette raison, il me semble bien indiqué.

Note : Pour cet exercice, il sera proposé d'employer certaines couleurs, de composer certains dégradés pour remplir des zones. Bien évidemment, il ne s'agit que de suggestions. Chacun procédera selon ses goûts personnels. Il en est de même pour les dimensions indiquées, qui s'expriment toutes en points, dont l'abréviation est pt dans Skencil.

L'image de référence est composée d'éléments qui pourraient être autonomes et provenir d'ailleurs (c'est un des avantages majeurs du vectoriel que de pouvoir récupérer des parties de travaux déjà réalisés pour les incorporer dans un travail en cours, sans aucune perte de qualité). On y distingue :

• un fond ;
• trois sphères symbolisant le mode RVB ;
• un moniteur cathodique ;
• un texte en 3D qui sort de l'écran.

On comprend aisément que l'image globale pourrait comprendre au minimum quatre calques contenant chacun un des éléments cités. Mais pour des raisons de commodités, notamment pour l'agencement
dessus-dessous de certaines entités, le moniteur, qui est l'assemblage d'un pied, d'une rotule, d'un boîtier, d'un écran, d'un ensemble de boutons de commande, résultera d'un empilage de plusieurs calques supportant chacun un de ces composants. Au total, dix calques, sans compter « Grille » et « Lignes Guides », seront utilisés.
Cette décomposition en sous-ensembles ou en éléments séparés doit être présente à l'esprit lorsque l'on entreprend une composition vectorielle. D'ailleurs, elle s'impose également en DAO technique, et l'on sait l'importance des calques en retouche bitmap. C'est une notion essentielle.

Préparation de la page

Il importe peu de composer une image vectorielle sur un timbre-poste ou sur un format A0. La qualité rendue sera toujours la même du fait de la nature mathématique des entités représentées. Toutefois, si l'on veut imprimer son travail sur un support physique de dimensions standardisées, il vaut mieux, pour respecter les proportions longueur/largeur, choisir de travailler sur un format normalisé.
Ici, on se rendra dans Disposer -> Mise en Page -> Format de page : A4 Paysage -> Appliquer. Puis, on préparera la pile des calques par Fenêtres ->Couches. Double clic sur le nom « Couche1 » pour le renommer en « Fond ».

Dessin du fond avec dégradé

Un simple rectangle fera l'affaire. Sa position dans la page, ainsi que ses dimensions n'ont pas pour l'instant de véritable importance, car il s'agit d'un élément vectoriel. Il sera donc toujours éditable en taille et en position, à n'importe quel moment d'avancement du travail. Procédons ainsi :

• Choisir l'outil Rectangle (1).
• Cliquer sur l'espace de travail et déplacer la souris en maintenant le bouton gauche de la souris enfoncé.
• Suivre dans la barre d'état les dimensions du rectangle en cours de tracé, et relâcher le bouton de la souris pour une taille de 565 x 416 (2) suggérée. Un rectangle vide est alors dessiné.
• Activer Fenêtres -> Remplissage, ou appuyer sur [F6]. La boîte de dialogue « Remplissage » apparaît.
• Sélectionner Remplissage Dégradé (3)
• Sélectionner Dégradé Circulaire (4) et positionner à la souris le centre du dégradé dans le coin inférieur droit. Il faut cliquer dans la fenêtre d'aperçu du dégradé et garder le bouton gauche enfoncé pour disposer d'un réticule désignant le centre du dégradé à déplacer. C'est également vrai pour orienter un dégradé linéaire.

Le dégradé qui vient d'être posé ne correspond pas à celui de l'illustration : en effet, le clair et le sombre sont inversés, et il ne s'agit ni d'un noir ni d'un blanc purs. Pour remettre les choses dans l'ordre :

• Cliquer sur Éditer le gradient. La boîte de dialogue d'édition apparaît.
• Cliquer alors sur Inverser. La couleur sombre 5 et la couleur claire 6 changent de position sur la barre d'édition, et le dégradé dans la fenêtre d'aperçu est mis à jour.
• Changer la couleur sombre 5 soit en cliquant sur la couleur 5 dans la boîte de remplissage, soit par un clic droit sur le triangle à gauche de la barre d'édition, et en choisissant Sélectionner la couleur de la poignée. Dans les deux cas, la palette des couleurs apparaît avec possibilité de choisir une couleur à la souris, ou d'entrer les valeurs de ses composantes RVB ou HSV.
• Changer de la même façon la couleur claire 6. (Fig. 2)

Cette étape nous a permis d'aborder l'édition d'un dégradé de couleur.

Note : Par la suite, nous ne reviendrons plus sur la mise en œuvre du dégradé, sauf nécessité.

Sphères RVB avec dégradés

4 couleurs
Les trois sphères sont identiques en taille et en type de dégradé. On comprend donc que l'on va recourir aux facilités de duplication. Mais que va-t-on dupliquer ? Car il y a en effet plusieurs façons de procéder dans le cas présent :

• Soit on trace un cercle, que l'on duplique, préservant ainsi la taille, et l'on crée un dégradé pour chaque cercle en utilisant la fonction Mise à jour à partir de.
• Soit on définit entièrement une sphère, dégradé compris donc, et on la duplique deux fois avant de modifier leur dégradé propre.

On choisira la première méthode, sans raison particulière. Pour cela :

• Créer un nouveau calque (1).
• Le renommer RVB (2).
• Choisir l'outil Ellipse (3).
• Dessiner un cercle de rayon 140 environ, en maintenant appuyée la touche [Ctrl] (sinon on trace une ellipse).
• Puis Éditer -> Copier, Éditer -> Coller, et enfin poser la copie à l'endroit voulu.
• Recommencer l'opération. Peu importe la disposition pour l'instant. (Fig. 3)

Note : L'opération Copier/Dupliquer pose automatiquement la copie à proximité de l'original ; la duplication peut se faire en série par la commande [Ctrl]+[D]

Les cercles tracés sont vides. Pour leur donner une apparence de sphère, il convient de les remplir d'un dégradé de couleurs allant de la teinte la plus sombre possible (c'est l'ombre propre de l'objet) à un éclat blanc (reflet spéculaire, créant l'illusion de l'aspect des surfaces : plus il est petit et brillant, plus la
surface semble polie et brillante ; plus il est large et diffus, plus la surface apparaît mate). Pour ce faire :

• Sélectionner un cercle, puis Fenêtre -> Remplissage, puis Dégradé et Dégradé circulaire et enfin Appliquer. Le cercle est rempli d'un dégradé centré blanc vers noir, qui est à l'inverse de ce que l'on désire.
• Choisir alors Éditer le gradient, puis Inverser et OK.
• Positionner le centre blanc comme dans la Figure 4.
• Choisir de nouveau Éditer le gradient.
• Effectuer un clic droit sur la poignée 1, choisir sa couleur telle que R0, G64, B22, puis OK.
• Effectuer un clic droit sur la poignée 2, choisir sa couleur telle que R255, G255, B255, puis OK.
• Effectuer un clic droit sur la barre entre les deux poignées existantes, puis Insérer une poignée.
• Recommencer.
• Affecter à la poignée 3 une couleur telle que R0, G64, B22 et à la poignée 4 telle que RO, G255, B92
• Disposer les poignées sur la barre pour obtenir un rendu de sphère convenable.

Il faut maintenant attribuer un dégradé du même type aux autres sphères. Il est donc judicieux d'utiliser la disposition déjà élaborée pour la sphère verte, en se contentant de modifier les couleurs. Pour ce faire :

• Sélectionner un cercle vide.
• Choisir dans la boîte de remplissage la fonction Mise à jour à partir de et désigner la sphère verte. Le cercle vide se remplit avec le même dégradé vert.
• Choisir Éditer le gradient et attribuer les couleurs suivantes pour la poignée 1= R79, G4, B0, pour la poignée 2 = R255, G255, B255, pour la poignée 3 = R113, G6, B0 et pour la poignée 4 = R255, G15, B0.
• Procéder de même pour le cercle restant avec les valeurs suivantes pour la poignée 1= R9, G0, B79, pour la poignée 2 = R255, G255, B255, pour la poignée 3 = R9, G0, B79 et pour la poignée 4 = R30, G0, B255.

Note : Les sphères représentées sont pourvues d'un contour par défaut, celui du traçage préliminaire. On le supprime par Fenêtres -> Ligne -> Couleur -> Aucune, et Appliquer. L'objet à traiter doit être sélectionné, bien sûr.

À ce stade, on n'oublie pas de positionner les sphères les unes par rapport aux autres, puis de sauvegarder le travail, même si Skencil, et Python qui tourne derrière, sont très stables et ne risquent pas de fermer intempestivement l'application.
Cette étape nous a permis d'aborder la création de dégradés multicolores.

Embase à rotule du moniteur

Le moniteur est orientable dans toutes les directions grâce à une rotule reposant dans une embase lui servant de pied. Il s'agit donc d'un sous-ensemble, puisqu'il est constitué de plusieurs éléments, réunis par la fonction commune qu'ils ont à assurer (dans la réalité du moniteur). Il est donc logique de les dessiner sur un même calque, que nous appellerons « Rotule ».
Dans un espace réel à trois dimensions, l'embase est constituée par :

• une sphère A (la rotule, donc) ;
• un tronc de cône B (le siège de la rotule) ;
• un tronc de cône C ;
• un tronc de cône D.

Dans l'espace de dessin à deux dimensions, la sphère est représentée par un cercle rempli d'un dégradé circulaire, et un tronc de cône est représenté par un trapèze rempli d'un dégradé linéaire. (Fig. 5)

Transformer un rectangle en trapèze

Il y a plusieurs façons de dessiner un trapèze : soit à partir de 3 segments que l'on duplique et symétrise horizontalement, avant de ressouder les demi-trapèzes, soit à partir d'un rectangle que l'on déforme.
C'est la solution qui a été adoptée ici (Fig. 6). Pour ce faire :

• Activer Disposer -> Coller à la grille magnétique.
• Tracer un rectangle (1) avec l'outil adéquat.
• Choisir Mode Edition (2). Les points de contrôle apparaissent, mais leur déplacement est contraint au fait que la figure résultante doive rester rectangulaire. Donc :
• Activer Courbe -> Convertir en courbe (3). Seules quatre poignées apparaissent alors.
• Disposer un guide magnétique horizontal (5) en cliquant sur la règle horizontale, et en tirant un guide jusqu'à le disposer sur le segment supérieur du rectangle.
• Déplacer le coin supérieur gauche, puis le coin supérieur droit d'une valeur identique (à contrôler dans la ligne d'état lors du déplacement, le calage sur la grille aidant à l'opération).

Empiler les trapèzes B,C et D

Nous allons appliquer la méthode qui vient d'être décrite. Le trapèze (D) est réalisé à partir d'un rectangle de taille 270x15, dont la petite base mesurera 262 après transformation. Cela nécessite d'avoir désactivé la grille ou de l'avoir paramétrée de sorte que le calage sur des multiples de 2 soit permis.
Le trapèze (C) est réalisé à partir d'un rectangle de 262x6, dont la petite base mesurera 108 après transformation. La grande base doit correspondre à la petite base du trapèze précédent. Il est hasardeux de vouloir obtenir cette coïncidence à « vue de nez ». On sera rigoureux en activant Disposer -> Coller aux objets magnétiques. De la sorte, les points de contrôle du rectangle en cours de tracé correspondront à ceux du trapèze sur lequel on s'appuie lors du tracé.
Le trapèze (B) est réalisé à partir d'un rectangle de 108x14, dont la petite base mesurera 98 après transformation. Ce rectangle est dessiné avec la contrainte Coller aux objets magnétiques.

Poser le cercle A

Aucune difficulté à cette opération. Pour travailler sans filet, et découvrir d'autres fonctionnalités, désactiver toutes les contraintes d'accrochage (grille, objets, guides), et tracer un cercle, avec la touche [Ctrl] enfoncée, de rayon 88 à 90. Le cercle ayant été dessiné n'importe où, il convient de l'aligner verticalement avec les autres éléments de l'embase. Pour ce faire, sélectionner les éléments A, B, C et D (clic + [Shift]), puis ouvrir Fenêtres -> Aligner -> Aligner Vertical -> Appliquer.
Si maintenant on attribue une couleur de remplissage différente au cercle (A) et au trapèze (B), on s'aperçoit que le cercle se situe au-dessus du trapèze, ce qui est normal : il a été dessiné en dernier. Il se trouve donc au sommet de la pile des objets présents sur le calque actif. Il descendra (ou reculera), étant sélectionné, grâce à la commande Disposer -> Déplacer vers le bas.

Donner du modelé aux éléments

Comme pour les sphères RVB, le réalisme est induit par le dégradé de couleur qui simule le volume. Ici ne seront utilisées que des nuances de gris, du plus clair au plus sombre, en essayant de reproduire l'aspect mat propre aux matières plastiques (Fig. 7).

La sphère (A) est remplie par un dégradé circulaire à trois couleurs telles que pour la poignée 1= R59, G59, B59, pour la poignée 2 = R116, G116, B116 et pour la poignée 3 = R241, G241, B241.
Le trapèze (B) est rempli par un dégradé linéaire à trois couleurs telles que pour la poignée 1= R249, G249, B249, pour la poignée 2 = R67, G67, B67 et pour la poignée 3 = R67, G67, B67.

Note : On obtient des poignées 2 et 3 identiques en déplaçant la poignée 3 vers la 1 sur la barre, ce qui a pour effet de la dupliquer.

Le trapèze (C) est rempli par un dégradé linéaire à trois couleurs identique au précédent, mais orienté différemment. Il sera donc créé par la fonction Mise à jour à partir de déjà évoquée à propos des sphères RVB, puis orienté à la souris.
Le trapèze (D) est rempli par un dégradé linéaire à deux couleurs telles que pour la poignée 1= R234, G234, B234 et pour la poignée 2 = R90, G90, B90.

Note : La position des poignées influe grandement sur l'apparence du dégradé, en modifiant la taille de la zone lumineuse et de la zone d'ombre propre. Le matériau simulé apparaît plus ou moins brillant et lisse

Donner une touche de réalisme

Le réalisme, en 3D, est apporté en grande partie par l'abattage des arêtes, à l'aide soit de chanfreins soit de congés (arrondis). De fait, dans la réalité, il n'y a pas d'arêtes vives, hormis sur les lames coupantes. Dans une scène rendue, les chanfreins et les rayons captent la lumière. Ils apparaissent alors sous forme de traits plus ou moins clairs et diffus.
Il y a possibilité de simuler cela en vectoriel, tout simplement en repassant par un trait clair d'épaisseur 1, ou moins, les arêtes supposées être éclairées, et par un trait sombre les arêtes dans l'ombre (Fig. 8). Seul inconvénient dans Skencil : le dégradé de couleur ne s'applique pas aux contours, et il faudra représenter une arête illuminée par une succession de segments dont on fait varier progressivement la clarté. De plus, l'estompage qui permettrait de fondre l'arête dans les surfaces environnantes n'est pas possible, contrairement à XaraLX et au regretté Artstream, grâce à la fonction Feather

Cette étape, dont vous pouvez visualiser le résultat sur la figure 8.1, nous a permis d'aborder les fonctionnalités suivantes :
convertir en courbes ;

• mode Édition de points ;
• coller aux objets magnétiques ;
• coller aux guides magnétiques ;
• coller à la grille magnétique ;
• aligner (distribution horizontale-verticale) ;
• disposer (position verticale).

Corps du moniteur

Le moniteur présente une forme presque carrée, avec l'arête supérieure courbe, alors que les autres arêtes sont rectilignes (Fig. 9). Les coins sont arrondis. Il sera dessiné sur un nouveau calque « Corps ». Son image est celle d'un rectangle de 310x317pt, rempli d'un dégradé à deux gris tels que pour la poignée 1= R249, G249, B249 et pour la poignée 2 = R67, G67, B67, et orienté à 30° environ. Le contour du rectangle est conservé pour une largeur de ligne de 2pt de couleur R59, G59, B59.

Un demi-contour en haut et à gauche de couleur blanche simule la lumière, que l'on considérera comme étant toujours issue d'une source située dans le coin supérieur gauche de l'image. Il n'y a rien d'inconnu dans cette étape sinon la méthode d'arrondissement des angles et de la courbure d'un segment.

Arrondir les angles et courber un segment

• La chose est simple à réaliser, puisqu'une fonction, non accessible par menu, existe (Fig. 10, page suivante). Procéder ainsi :
• Tracer un rectangle, en l'occurrence de 310x317pt (1).
• En Mode Sélection, tirer sur un des points de contrôle situé dans un angle, le point d par exemple. Les quatre angles s'arrondissent alors en même temps (2).
• Passer en Mode Edition, et cliquer sur le milieu du segment supérieur. Un point temporaire est indiqué. Appuyer sur la touche [+] : un point vient d'être ajouté (3).
• Déplacer ce nouveau point vers le haut, puis sélectionner les points a, b et c. Transformer le segment en courbe à partir de la commande Fenêtres >Commandes de courbes (4).
• Sélectionner le point b seul, puis sélectionner Tangentes symétriques (la boîte de commandes des courbes doit être ouverte) (4).

Poser l'ombre portée

Il s'agit de l'ombre projetée par la façade du moniteur qui se trouve sur un plan décalé en avant du corps. La logique aurait voulu que la façade fût mise en place avant de positionner son ombre. Mais rien n'empêche véritablement de la créer dès maintenant si l'on connaît sa forme et sa position, et la façon de procéder.
On partira d'un rectangle dont on courbera le segment inférieur par la méthode qui vient d'être exposée précédemment (Fig. 11). La position du rectangle et ses dimensions données seront facilement respectées si des guides magnétiques activés sont mis en place : les points de contrôle s'y colleront.

Note : Surveiller la ligne d'état, et disposer les guides en fonction des coordonnées qui s'y trouvent.

Puis, le rectangle étant transformé, le remplir avec un dégradé linéaire de gris 157 (ce qui signifie R157, G157, B157) à un gris 46.
Il ne reste plus qu'à poser le filet de lumière en gris 250 de largeur 2.5 pour terminer une étape qui nous aura permis d'aborder :

• l'arrondissement des angles ;
• la courbure d'un segment ;
• l'illumination d'une arête.

Façade du moniteur

Celle-ci est constituée d'un rectangle qui présente les mêmes caractéristiques que le précédent, mais avec des dimensions différentes. On va donc procéder par recopie et redimensionnement selon la chronologie suivante (Fig. 12) :

• Créer un calque « Façade ».
• Sélectionner le rectangle et le filet de lumière sur le calque « Corps ».
• Les copier dans le presse-papiers, puis les coller sur le calque « Façade ». Celui-ci doit être actif pour toute l'opération.
• Mettre en place des guides magnétiques actifs pour contraindre le redimensionnement à 375x316pt et le positionnement à 34pt du bas du rectangle précédent.

Note : La ligne d'état donne la position absolue du pointeur lorsqu'on transporte un guide. Il faut avoir calculé auparavant la distance entre deux guides pour obtenir l'espacement voulu qui contiendra la largeur ou la longueur désirée de l'objet.

• Redimensionner la copie en la faisant coller au guide.
• Désolidariser les objets copiés par Disposer -> Dégrouper.
• Modifier le dégradé de remplissage par un gris 234 allant au gris 90.

Cette étape nous a permis d'effleurer la composition d'image par utilisation d'éléments déjà existants.

Logement de l'écran

Le logement étant un creux rectangulaire, du vide donc, autant dire que ce qui le matérialise, c'est le cadre autour, qui en réalité résulte de l'ouverture dans la façade. Sa représentation est aisée (Fig. 13). Procéder ainsi :

• Créer un calque « Cadre ».
• Tracer un rectangle de 313x253pt.
• L'aligner horizontalement et verticalement par rapport à la façade.
• Arrondir les angles.
• Le remplir avec un dégradé linéaire à deux couleurs telles que pour la poignée 1 = RGB 249, et pour la poignée 2 = RGB51.
• Orienter le dégradé vers le coin inférieur droit.
• Simuler l'abattage de l'arête du logement par un effet d'ombre et de lumière.

Simuler l'ombre et lumière sur l'arête abattue

Selon ce qui a déjà été défini, la source lumineuse se situe en haut et à gauche de l'image. Donc, les arêtes supérieure et à gauche du logement sont dans l'ombre, tandis que les arêtes inférieure et à droite sont illuminées. Il suffit de les représenter chacune avec des nuances de gris appropriées pour réaliser l'effet (Fig. 14).

Cependant, le rectangle aux coins arrondis dessiné précédemment ne peut recevoir qu'une couleur de contour, puisque celui-ci n'est pas dissociable en deux demi-contours. On surmontera la difficulté en superposant au contour du rectangle deux demi-contours symétriques par la diagonale. Chaque demi-contour pourra recevoir une couleur différente. Pour ce faire :

• Dupliquer le rectangle par Éditer -> Dupliquer.
• Le positionner sur l'original.
• Supprimer le remplissage par Fenêtres -> Remplissage, et cliquer sur la croix Suppression.
• Le convertir en courbe par Courbe -> Convertir en courbe.
• Ajouter un point de contrôle au milieu de l'arrondi du coin supérieur droite.
• Le sélectionner, si ce n'est pas fait.
• Couper la courbe en ce point avec Fenêtres -> Commandes de courbe -> Couper la courbe.
• Recommencer l'opération dans l'arrondi du coin inférieur gauche.
• Séparer les deux éléments par Courbe -> Découper les Bézier.
• Attribuer une épaisseur de ligne 1.5 à 2 et une couleur gris164 à la courbe Ombre.
• Attribuer une épaisseur de ligne 1.5 à 2 et une couleur gris203 à la courbe Lumière.

Cette étape nous a permis d'utiliser la fonction de découpage d'une courbe de Bézier.

Écran bleuté

Le logement étant réalisé, il doit pouvoir contenir l'écran. De ce fait, celui-ci sera représenté par un rectangle de plus petite taille avec coins arrondis. Ce qui vient immédiatement à l'esprit, c'est de dupliquer le rectangle du logement sur un calque spécifique, de le redimensionner et de changer les couleurs de son dégradé de remplissage (Fig. 15). Dans l'ordre des opérations, cela donne :

• Créer un calque « Écran ».
• Copier le rectangle contenu dans le calque « Cadre ».
• Le coller dans le calque « Écran ».
• Redimensionner pour 303x243pt.
• Positionner à égale distance (5pt) des bords du rectangle cadre.
• Éditer le contour par Fenêtres -> Ligne, largeur 1pt, et couleur R67, G100 et B113.
• Éditer le dégradé pour couleur de la poignée 1 = R143, G177, B206 et couleur de la poignée 2 = R60, G63, B74.

Note : Le dégradé gris en sous-couche apparaît tout autour de l'écran sur une largeur uniforme de 5pt et crée l'illusion d'un chanfrein, éclairé selon la source lumineuse mise en place.

Boutons de commande

Les boutons seront disposés sous la partie inférieure de la façade, que l'ombre tracée précédemment propose de voir comme une surface bombée située en retrait par rapport à la façade. Les boutons eux-mêmes doivent rester cohérents dans leur représentation avec l'éclairage supposé (Fig. 16).

Ainsi, si l'on suppose que les boutons ont une surface bombée, ils seront rendus par un dégradé circulaire dont le point lumineux se situe en haut et à gauche. Si, de plus, ces boutons sont incrustés dans des cavités avec une bordure chanfreinée (ce qui est le cas : il n'y a pas d'arêtes vives sur les objets usuels, avons-nous déjà dit), ladite bordure doit apparaître autour du bouton avec un éclairage approprié, c'est-à-dire qu'il sera rendu par un dégradé d'orientation inversée par rapport à celle du bouton. C'est logique : l'un simule une surface convexe (bombée), l'autre une surface concave (creuse).
Sur le moniteur de l'exercice, il y a quatre boutons de réglage ovales, un témoin lumineux vert et un bouton circulaire de marche-arrêt. Encore une fois, chacun ajoutera le nombre de boutons qui lui convient : il suffit d'en réaliser un, et de le dupliquer autant de fois que nécessaire. Il n'y a aucune difficulté à réaliser cette étape, et, pour cette raison, elle ne sera pas décrite.

On dira seulement que :

• Les boutons sont réalisés sur un calque « Boutons ».
• Les cavités 1 recevant les boutons 2 sont dégradés un gris59, gris116 et gris241, orientés vers le bas à droite, avec une bordure largeur 0.2 en gris 187.
• Les boutons 2 sont dégradés en gris59, gris116 et gris241, orientés vers le haut, à gauche, avec une bordure largeur 0.2 en gris133.
• Le témoin lumineux est constitué d'une cavité, d'une surface bombée en dégradé de vert, auquel on a ajouté un reflet jaune.

Dans cette étape, il a été mis en application les acquis précédents.

Ajouter du texte

Le texte est une possibilité de Skencil, mais pas une des plus aisées. On peut bien sûr faire épouser une courbe à un texte ou le disposer à son gré dans la page. Il est cependant impossible, sans avoir recours à des greffons externes, de composer des blocs de textes, comme dans OpenDraw ou XaraLX.
D'autre part, on retiendra que le texte appelle toujours la fonte qui a été choisie pour être affichée : celle-ci ne fait pas partie de l'image. Si donc vous cherchez à afficher une image contenant du texte sans disposer de la bonne fonte, l'image ne s'ouvrira pas. Il est pourtant facile de lever l'obstacle : il suffit de transformer le texte en entités de dessin, par la commande Courbe -> Convertir en courbe. Dès cet instant, il n'y a plus d'appel à une fonte de caractères, et l'image pourra être lue par tout le monde.
Par défaut, la fonte utilisée est le Roman, en taille 12. Pour écrire « Linux » en URW Chancery sur notre moniteur, procéder comme suit :

• Créer un calque « Texte ».
• Sélectionner l'outil Texte.
• Cliquer n'importe où sur l'image, entrer la chaîne de caractères voulue.
• Choisir l'outil de sélection.
• Pour changer la taille, tirer sur les poignées, ou Fenêtres -> Fonte -> Choisir une taille -> Appliquer.
• Pour changer de fonte, en choisir une nouvelle dans la même boîte de dialogue, puis Appliquer.
• Transformer le texte en courbe par Courbe -> Convertir en courbe.
• Dimensionner à la souris selon convenance.
• Pour traiter chaque image de caractère indépendamment des autres, choisir Disposer ->Dégrouper.

Dès lors, chacune de ces images se travaille en contour et surface comme n'importe quelle autre surface pleine (Fig. 17).
Cette étape nous a permis d'aborder l'utilisation des fontes de caractères comme élément de dessin, ce qui eût été plus démonstratif avec des fontes de type Dingbats, ou des fontes 3D telles que Umbra, Vineta, Xtrusion, etc.

Note : Skencil ne reconnaît que les fontes type 1 ; il importe donc de convertir les TrueType avant utilisation, de les installer au bon endroit, et de générer les fichiers de configuration, grâce au script en Python appelé mkfontdb.py.

Le texte qui sort de l'écran

Il n'y a aucune fonction 3D dans Skencil, contrairement à OpenDraw. Le texte SKETCH en 3D n'est ni du texte ni du 3D, mais une extrusion simulée de caractère (Fig. 18). Comment s'y prendre, sachant que les caractères de la chaîne finale devront être construit un à un ?

• Créer un calque « Texte3D ».
• Entrer le premier caractère, X dans l'exemple explicatif. Il est en Roman de taille 12.
• Choisir une fonte droite et grasse, telle Arial Black (1)
• Convertir en courbes.
• Redimensionner, italiser (avec un double clic pour avoir les poignées), faire pivoter, etc. (2)
• Dupliquer le X et disposer la copie sous l'original (3)
• Sélectionner Disposer -> Coller aux objets magnétiques (indispensable !).
• Choisir l'outil Dessiner un polygone.
• Cliquer sur les points caractéristiques A, B, C, D des deux X pour créer la surface latérale les reliant (4)
• Procéder de même pour toutes les surfaces latérales, en vidant le X supérieur pour voir tous les points caractéristiques, puis supprimer finalement le X inférieur qui n'a plus d'utilité (5).
• Remplir de nouveau le X supérieur, pour vérifier qu'il se trouve au sommet de la pile des objets créés. Si ce n'est pas le cas, le faire monter avec Disposer > Déplacer vers le haut.
• Remplir chaque surface avec un dégradé de couleur ou un aplat selon la source lumineuse définie en début de l'exercice dirigé (6). Cette phase fait évidemment appel au sens logique et artistique du dessinateur. Aucune consigne ne peut être donnée, puisque l'éclairage des objets dépend de leur position supposée dans l'espace.
• Supprimer les contours de toutes les surfaces, en ne leur octroyant pas de couleur.
• Cette étape nous a permis d'aborder les fonctionnalités suivantes :
• Dessiner des polygones (fermés avec certitude).
• Coller aux objets magnétiques (pour un positionnement précis).
• Disposer dessus-dessous (déjà vu !).
• Remplir avec des dégradés multiples et des aplats (déjà vu !).

Et au final ?

L'étape précédente est certainement la plus longue, et la moins assistée par le programme. C'est du cousu main. Mais avec un peu de patience, le principe étant assimilé, chacun devrait parvenir à un résultat original et personnel en fonction du texte ou des objets en pseudo 3D qu'il aura élaborés.
Pour ce pas à pas (Fig. 19), c'est le mot SKETCH, parce que le logiciel s'appelait ainsi lorsque j'ai conçu cette image (1999), qui devait jaillir de l'écran afin de lui conférer quelque dynamisme. On pourrait refaire un texte SKENCIL, non ?

Bon courage à tous les « sketcheurs » !

Retrouvez cet article dans : Linux Pratique Hors série 7