Main Lettering Comment Vectoriser vos lettres

Ce que vous allez créer

Je me souviens il y a un an que j'avais tellement de difficulté à vectoriser mes lettres. J'avais une compréhension décente de l'outil Plume, mais je ne savais pas qu'il existe des techniques mineures qui font des merveilles pour votre type afin de créer les courbes lisses que vous recherchez.. 

Espérons que ce didacticiel répondra à toutes vos questions concernant la vectorisation de formes de lettres et la vectorisation de presque n'importe quoi d'autre. Le même processus peut être utilisé pour tout ce que vous composez dans Illustrator. En cas de lettrage, la clé est d'avoir relativement peu de points d'ancrage tout en utilisant le placement correct des points et une variété d'autres astuces pour perfectionner ces courbes, angles, largeurs, etc..

Trois choses à noter avant de commencer:

Premièrement, le processus ci-dessous utilise certains travaux que j'ai déjà créés dans un tutoriel précédent. Pour votre pratique et votre expérience, je suggère de créer / utiliser votre propre lettrage, plutôt que de recréer le mien. C'est vraiment la meilleure façon d'apprendre! Je veux que vous preniez les informations ci-dessous et les appliquiez à votre propre lettrage afin que vous ayez un morceau fini que vous pouvez vraiment appeler le vôtre.! 

Deuxièmement, ce tutoriel n'a pas pour objectif de vous apprendre à utiliser / comprendre l'outil Plume. Si vous ne comprenez pas comment ça marche ou ses fonctionnalités, je vous suggère de lire ça avant de commencer, cela ne fera que rendre les choses plus faciles plus tard..

Troisièmement, je veux que vous sachiez tous que ce didacticiel peut sembler un peu embrouillé, mais je vous promets que c’est pour le plaisir d’enseigner! Je veux juste partager tout et n'importe quoi pour aider votre processus de vectorisation. Bref, ce ne sera pas un début et une fin simplifiés. Il y aura un début et il y aura une fin, mais il nous faudra du temps pour y arriver!

Gardez l’esprit ouvert et je vous promets que nous créerons de grandes choses. Commençons!

1. Préparer les outils dont vous aurez besoin

  • Ordinateur-PC ou Mac. Soit on fera le travail!
  • Adobe Illustrator 
  • Esquisse / numérisation initiale du lettrage que vous souhaitez vectoriser
  • Stylo ou crayon

Pour ce didacticiel, vous allez utiliser une esquisse de certains lettrages précédents que vous avez peut-être réalisés à partir des didacticiels précédents. Nous allons nous concentrer sur le dessin et le redessiner au format vectoriel. 

2. Tracer vos points sur les Extrema

Avant de commencer à travailler sur l'ordinateur, nous allons nous exercer à vectoriser à la main! Avec du papier! Fou, non? Je vous promets que cela vous donnera une compréhension beaucoup plus grande et une plus grande reconnaissance pour le merveilleux outil de stylo.

Maintenant, qu'est-ce que "extrema"moyen? Premièrement, il est pluriel pour extremum. En mathématiques, cela signifie généralement le maximum ou le minimum. Dans le cas du lettrage, nous parlons des extrêmes opposés de la lettre pour la composer avec des poignées plus fines. Par exemple, les extrema de la lettre "O" seraient les points d'ancrage nord et sud qui forment la courbe. Les points d'ancrage est et ouest sur le côté permettent de répartir le poids et la largeur.

Regardez ce cercle ci-dessous. Vous pouvez voir que la forme est créée uniformément par quatre points principaux. Ce sont les "extrema" de la lettre "O".

Remarquerez que les poignées sont uniformément équilibrées et distribuées ainsi que. Cette même technique devrait être appliquée dans votre lettrage. Assurez-vous que vos poignées équilibrent toutes la charge de travail et ne permettent pas qu'une seule poignée soit extrêmement longue et supporte tout le poids.

Étape 1

Téléchargez le lettrage ci-joint si vous souhaitez utiliser le mien. Si non, n'hésitez pas à utiliser les vôtres! À partir de là, commençons à dessiner où vont les points d’ancrage. Allez-y et utilisez un crayon ou un stylo etdessinez des cercles partout où vous pensez placer ces points d'ancragedans Adobe Illustrator. 

Ne vous inquiétez pas si vous avez raison ou tort, allez-y et voyez ce que vous pensez actuellement être juste. Tout au long de ce tutoriel et de cette pratique, vous serez étonné de votre croissance / vos nouvelles connaissances..

Étape 2

Ensuite, prenez ce même lettrage et commencez à dessiner des rectangles autour de chaque lettre. Nous utilisons une astuce simple pour comprendre où vous allez inscrire vos points sur les "extrema" de vos lettres.. Partout où les rectangles touchent votre lettre, c’est le point d’ancrage. Cela ne veut pas dire que votre lettre ne devrait avoir que quatre points d'ancrage, car un rectangle a quatre côtés. Cela vous donne juste un bon point de départ. 

Ensuite, nous commencerons par tracer les extrema dans Illustrator, puis en ajoutant des points d'ancrage supplémentaires pour des courbes particulières ou en augmentant éventuellement le poids de votre lettre. Chaque lettre sera différente, ce processus n'est donc pas figé. En fin de compte, cela vous donnera une longueur d’avance dans la bonne direction, et c’est ensuite à vous de déterminer ce qui vous paraît "bon" ou ce qui vous semble "correct". 

3. 0 °, 45 °, 90 °: Angles de la poignée

Maintenant, avant d'entrer trop profondément dans cette section du tutoriel, je tiens à dire que 0 °, 45 ° et 90 ° ne sont pas nécessairement les seuls angles dans lesquels vous devriez placer vos poignées. Encore une fois, tout se résume à ce qui semble bon et à votre propre jugement pour déterminer s'il peut utiliser un angle aléatoire de 15 °, par exemple.

Alors, quel est l’intérêt des angles horizontaux, verticaux et diagonaux (45 degrés)? Premièrement, l'utilisation d'angles similaires permet de conserver la même cohérence dans vos lettres. Deuxièmement, ces angles sont essentiels pour former les courbes les plus lisses. Avez-vous déjà remarqué des points ou des bords dans votre lettrage causés par des points d'ancrage? Eh bien, cela peut facilement être corrigé avec le bon placement des points d’ancrage et le bon angle de vos poignées. 

Mettons-nous au travail!

Étape 1

Ce processus simple ci-dessous montre l’importance des poignées de point d’ancrage horizontales et verticales. Ce processus devrait être utilisé pour presque tous les projets de vectorisation que vous avez à partir de maintenant. Commençons par vectoriser le "Le" ci-dessous. Je souhaite décomposer le processus de vectorisation afin que vous puissiez voir comment je procéderais normalement pour vectoriser un mot simple tel que celui-ci.

Si vous le souhaitez, vous pouvez commencer par appliquer la technique du "rectangle" avec votre lettrage avant de commencer afin que vous puissiez déterminer où placer vos extrema.

Étape 2

Après avoir tracé votre lettrage "The", nous allons maintenant commencer à le séparer pièce par pièce en vecteur. 

Je vais commencer par la tige du "T". Comme vous pouvez constater, J'utilise ces poignées de point d'ancrage horizontales, ainsi que deux angles pas si mathématiques. N'oubliez pas que toutes les poignées ne doivent pas nécessairement être horizontales. C'est vraiment ce que vous pensez peut-être mieux. Pour cette tige, j'ai commencé avec toutes les poignées horizontales, puis les ai ajustées pour les adapter à mon goût.

Au total, toute la tige a été créée avec seulement quatre points d’ancrage et quelques essais et erreurs.. 

Étape 3

C'est là que les choses deviennent un peu folles. Pour cet exemple particulier, j'ai décidé de vectoriser la connexion "Th" ensemble pour créer une seule forme. Chaque point d'ancrage est également équilibré et distribue également la courbure. Pour savoir par où commencer pour tracer vos points d'ancrage, tout est une question de préférence. Les formes de lettre dictent généralement par où commencer. Pour moi, je travaille de gauche à droite, alors j’ai commencé pardessiner la connexion en boucle du "T" et se terminer à la tige du "h".

Continuons à avancer!


Étape 4

Suivant,J'ai formé l'épaule du "h"(la deuxième tige si vous voulez). Chaque pièce de ce lettrage est décomposée en formes distinctes afin que vous puissiez ultérieurement éditer des pièces individuelles plutôt que la pièce entière..

Étape 5

La dernière étape consiste à créer le "e".En utilisant seulement huit points d’ancrage, j’ai pu créer le bon formulaire sans ajouter plus de points pour ajuster la largeur, le contraste, etc..

Commencez où bon vous semble, mais pour moi personnellement, j’ai commencé par former la barre transversale du "e", puis j'ai encerclé cette forme pour former le bol et je l'ai finie avec la queue..

Et là nous l'avons! Notre fini "Le". N'oubliez pas de tracer ces points sur les extrema, finissez ces poignées jusqu'à la perfection, et vous êtes en or! La patience est la clé!

J'ai également inclus l'exemple ci-dessous afin que vous puissiez voir un style complètement différent du mot "The" tout en utilisant des poignées similaires horizontales et verticales.


4. Trucs et astuces de vectorisation supplémentaires

La vectorisation est certes fastidieuse, même pour un maître. Quoi qu’il en soit, c’est beaucoup de réglages et de corrections à apporter aux courbes, points d’ancrage, etc..

Dans cette section du didacticiel, j'espère pouvoir apporter un peu plus de sagesse pour accélérer un peu plus le processus. Pour plus de simplicité, je vais utiliser la lettre "O" ou une forme de cercle pour illustrer beaucoup de ces astuces. Même s’il s’agit d’une forme simple, la méthodologie et la pratique derrière la pointe peuvent être utilisées pour chaque lettre..

Étape 1

J'appelle cette technique la croisement. Au fur et à mesure que vous commencez à tracer votre lettrage, il vous sera peut-être plus facile d’appliquer cette technique de croisement pour contrôler les largeurs et les angles de parties de vos formes de lettre. Dans l'exemple ci-dessous, vous pouvez voir que j'ai créé un point d'ancrage supplémentaire pour me permettre de contrôler ce qu'on appelle "l'entrejambe" du "N". Essentiellement, il vous permet de déplacer et de modifier une partie de votre lettre sans déranger une autre.. 

Dans l'exemple du bas, cela montre exactement ce que je veux dire par modifier un côté sans déranger l'autre. Maintenant, cette construction "A" n'est absolument pas correcte par tous les moyens. C'est juste un moyen idéal pour montrer ce que la technique du crossover peut accomplir.


Étape 2

L'outil Ellipse et l'outil Rectangle d'Illustrator peuvent devenir vos meilleurs amis si vous pensez uniquement aux formes composant chaque forme de lettre. Par exemple, la lettre "O" a deux ellipses: une pour la largeur et une autre pour les poids à l’intérieur. Ainsi, si vous créez simplement deux ellipses, empilées l'une sur l'autre, vous pouvez former la lettre "O" en quelques secondes. 

En outre, si vous souhaitez continuer et créer une autre lettre telle qu'un "H", vous pouvez utiliser l'outil Rectangle. Chaque tige et la barre transversale de la partie inférieure "H" étaient formées de trois rectangles distincts. Vous pouvez ensuite les développer et les fusionner si vous souhaitez une forme complète..

Espérons que le processus accéléré ci-dessous montre exactement ce que je veux dire. J'utilise simplement des formes simples pour former ces lettres. 

Étape 3

Dans l'exemple ci-dessous, j'ai utilisé le Outil de largeur dans Illustrator. Cela peut certainement être utile parfois. Avec cet outil, vous tracez essentiellement l'emplacement où vous souhaitez que votre largeur soit distribuée. Dans cet exemple, je voulais que les côtés gauche et droit du trait soient de 0,525 pouce, tandis que les parties supérieure et inférieure restent de 0,125 pouce. Cela répartit le poids uniformément et forme une belle lettre "O" très contrastée..

Comme vous pouvez le voir dans l'exemple, la gauche est juste un trait - c'était avant l'application de l'outil Largeur, tandis que la droite correspond après l'application de l'outil Largeur..

Cet outil peut certainement aider à accélérer la vectorisation de certaines lettres, en particulier des scripts. N'oubliez pas de dessiner avec des "traits" et d'ajouter le contraste à vos formes de lettre avec l'outil Largeur après.

L'inconvénient de l'outil de largeur est que lorsque vous allez développer votre trait, il forme un quantité massive de points d'ancrage supplémentaires dont vous n'avez pas besoin. Vous pouvez voir ce que je veux dire dans l'image ci-dessous. Tous ces petits points rouges sont des points d'ancrage!

Donc, si vous vouliez apporter des modifications après l’extension, il serait plutôt difficile de ne pas modifier le trait original..

5. Pièce finale de vecteur

Bon les gars, il est temps de mettre au point le projet de vectorisation final, car nous venons tout juste d’apprendre à vectoriser! Nous allons commencer là où nous nous sommes arrêtés plus tôt dans le didacticiel et mener à bien ce projet à New York..

Étape 1

Prendre ce morceau par morceau, commencez à vectoriser vos lettres une à une. Utilisez la technique de croisement pour pouvoir ajuster une zone de votre lettrage sans déranger une autre partie de celle-ci. Pour ce lettrage, j'avais très peu de poignées verticales et horizontales. Mais j’ai quand même tracé mes points sur les extrema ce qui m’a permis de créer les formes que vous voyez. 

Étape 2

Après avoir vectorisé le "Nouveau", commençons le mot suivant: "York". Utilisez le même processus et vectorisez chaque pièce. Vous pouvez probablement voir la collection de points d'ancrage dans le "K". C’est parce que j’ai dessiné chaque partie du "K" sous forme de formes distinctes à éditer ultérieurement si besoin est. Donc, la tige et les deux jambes sont toutes dessinées individuellement, créant un total de trois formes pour former le "K". 

Notez que ça va si tout se chevauche, car nous allons remplir ces formes plus tard.

Étape 3

Le dernier mot à vecteur, "Ville". Vous savez quoi faire: commencez à dessiner ces points et affinez avec soin vos poignées à votre goût. Dessinez chaque lettre séparément comme vous pouvez le voir ci-dessous - cela facilitera le processus d'édition plus tard.

Étape 4

Là nous l'avons! Une fois que vous avez terminé la vectorisation de la pièce entière, vous pouvez attribuer un remplissage au lettrage au lieu d'un trait afin de voir comment les espaces positif et négatif interagissent..

Étape 5

Même après avoir pensé que vous avez terminé la vectorisation, vous n'êtes probablement pas!

Il y a des tonnes de modifications à faire après avoir "rempli" les formes car vous pouvez alors voir ce qui nécessite plus de contraste, plus de crénage, etc. Dans cet exemple, j'ai effectué de nombreuses modifications mineures pour améliorer la couleur globale. De plus, j'ai modifié la forme du "Y" pour qu'il s'étende dans l'espace négatif du "N".

Étape 6

La dernière étape! Pour cette pièce, j’ai ajouté de petites "encoches" aux traits d’entrée et de sortie des lettres. Comment pourrait-on vectoriser quelque chose comme ça? Rappelez-vous simplement de décomposer à nouveau les choses en formes simples ou en traits. Pour moi, je savais qu'il serait parfait d'utiliser quelques traits simples créés avec l'outil Plume, mais j'ai changé le "Profil à largeur variable"du trait pour créer la forme triangulaire. Vous pouvez voir ce que je veux dire dans le processus ci-dessous.

Conclusion

J'ai pris la liberté de filmer une vidéo très rapide de tout le processus de lettrage. Il m'a fallu deux bonnes heures pour terminer ce travail. Encore, la patience est la clé si vous voulez que votre lettrage de vecteur regarde exactement comment vous l'avez esquissé! Ne hésitez pas à regarder le processus ci-dessous et voir le pas supplémentaire que j'ai pris pour prendre les lettres vectorisées au prochain niveau.

La pièce ci-dessous, New York City, est le vecteur fini après avoir ajouté de nombreux détails supplémentaires. Si vous êtes curieux de savoir comment créer de la profondeur, de la texture, des combinaisons de couleurs, etc., alors mon prochain tutoriel sera parfait pour vous! Restez à l'écoute pour cela dans un mois ou deux.

Je suis sûr que, à ce stade, vous avez beaucoup travaillé pour devenir encore plus à l'aise avec la vectorisation que vous ne l'étiez déjà. Nous avons couvert beaucoup de matériel et il est temps que vous mettiez ces connaissances à l'épreuve. Continuez à pratiquer ce que vous avez appris car cela ne fait que s'améliorer avec le temps, je le promets! Continuez!

Comme toujours, si vous avez des problèmes ou des questions, n'hésitez pas à laisser un commentaire ci-dessous et je serai en mesure de vous aider. Bonne chance!

Ressources supplémentaires

Si vous souhaitez obtenir de l'aide pour votre lettrage, Envato Studio possède une excellente collection de spécialistes des lettres et calligraphies que vous voudrez peut-être explorer..