Archives par étiquette : courbes de Bézier

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é :)

Lire aussi:

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)

Inkscape
Mathématiques et TICE , passionnément

Lire aussi: