Share
Dans ce didacticiel, nous examinerons un flux de travail professionnel permettant d’illustrer des images d’en-tête de site Web dans un style bande dessinée, destinées à être intégrées dans des thèmes Wordpress. C'est un excellent moyen de faire en sorte que votre blog se démarque et soit promu dans les meilleures galeries de conception de sites Web. Commençons!
Vous trouverez ci-dessous l'image finale sur laquelle nous allons travailler. Vous voulez accéder à l'intégralité des fichiers Vector Source et aux copies téléchargeables de chaque didacticiel, y compris celui-ci? Rejoignez Vector Plus pour seulement 9 $ par mois. Vous pouvez afficher l'illustration finale, la conception finale du site Web en taille réelle ou visiter le site en direct..
Ci-dessous, mon thème Wordpress, comme vous le voyez, se compose de quelques zones, comme l’en-tête. Ici, je veux changer l'image d'en-tête de fond et poster quelque chose qui puisse en dire plus sur moi en tant que designer et illustrateur.
Je commence toujours par quelques croquis sur papier. Cela m'aide vraiment à mieux cibler certaines idées et à pouvoir ensuite retracer quelque chose dans Illustrator. Voici une vidéo amusante que j'ai faite pour ce tutoriel.
Mon idée est donc de créer un monde futur étrange avec des travailleurs de robots et une fille en tant que commandant. Les croquis préliminaires sont montrés ci-dessous.
L'image ci-dessous montre la dernière esquisse au crayon à publier dans Illustrator en tant que modèle..
Je suis maintenant prêt à m'asseoir devant mon PC et à commencer avec Adobe Illustrator CS4. J'ouvre un nouveau document et place l'esquisse en tant que modèle (en double-cliquant sur le calque et en vérifiant le modèle).
Maintenant, je crée un nouveau calque au-dessus du calque "modèle". Ensuite, je commence à tracer les lignes de base de l’esquisse. Je trace toujours avec la palette de l'outil Plume ouverte pour travailler plus vite (petite astuce).
Suivez les premières étapes de la vidéo ci-dessous.
Avec l'outil crayon, je fais le noir encrage; J'aime me référer à cela comme encres parce que je suis dans l'art de la bande dessinée. Voir la vidéo ci-dessous.
En fin de compte, vous pouvez voir la couche avec les caractères encres.
Voir aussi sous l'encre de fond.
La couche "modèle d'esquisse" n'a plus besoin d'être utilisée, je l'ai donc supprimée. Ici toutes les couches placées ensemble.
Après avoir encré, il me faut de la couleur de base, voici le calque "caractères de couleur de base".
Sous la couleur de base est indiquée ci-dessous.
Voici toutes les couches de couleurs de base ensemble.
Après les couleurs de base, il me faut un peu de profondeur et d’ombre pour rendre l’illustration plus réelle. Voici une étude rapide sur la manière dont la lumière tombera dans cette illustration..
Je reviens dans illustrator et je commence à tracer les ombres si nécessaire. Pour ceux que je copie et colle souvent les formes puis applique Divide de la palette Pathfinder.
En fin de compte l'image finale est affichée ci-dessous, ou affichez l'illustration finale.
A partir de cette image, j'avais besoin de deux parties pour mon thème Wordpress, une pour l'en-tête et une pour le corps. Avec les guides je dessine les deux zones.
Après avoir placé les guides, je crée les tranches en allant dans Objet> Tranche> Créer à partir de guides.
Maintenant, je sauvegarde les deux images en allant dans Fichier> Enregistrer pour le Web (je ne sauvegarde que les images et pas de HTML). Ensuite, je télécharge la dernière image exportée dans le pli du thème Wordpress. Maintenant, il est prêt à être codé dans le thème.
Vous pouvez voir les résultats finaux ci-dessous, qui ont été entièrement intégrés au thème final de Wordpress. Vous pouvez afficher l'illustration finale, la conception finale du site Web en taille réelle ou visiter le site en direct..
Abonnez-vous au fil RSS Vectortuts + pour rester au courant des derniers tutoriels et articles sur les vecteurs.
Accentsconagua