Comment créer un arbre d'art pixel isométrique dans Adobe Photoshop

Ce que vous allez créer

Si vous avez créé votre propre ville de pixels isométrique ou des scènes extérieures plus petites, ou si cela vous intéresse, vous aurez éventuellement besoin d'arbres. C'est un excellent élément de décoration à avoir dans votre inventaire de pixel art car ils peuvent égayer presque toutes les scènes et ils sont tout simplement nécessaires pour les grandes villes ou les paysages urbains, sans oublier les parcs et les scènes de la nature..

Pour la cime des arbres, votre premier instinct sera peut-être de tracer à la volée quelque chose de déchiqueté et d’irrégularité de manière à obtenir un aspect "naturel", mais nous l’éviterons car une forme aléatoire ne sera pas belle, dupliquée encore et encore.

Nous allons essayer d’obtenir le meilleur rapport qualité-prix avec notre conception en arbre, avec une forme relativement simple, symétrique, éventuellement géométrique, qui a l’air organique mais qui reste harmonieuse lorsqu’elle est dupliquée plusieurs fois..

Si vous ne l'avez pas encore fait, consultez le didacticiel relatif aux personnages de pixel art, pour obtenir des conseils de base et des guides d'esthétique, ainsi que le caractère toujours utile..

1. Dimensions

Nous ferons de notre arbre assez grand pour être plus qu'un arbuste mais pas vraiment énorme.

Étape 1

Moins de deux fois la hauteur de notre personnage devrait suffire. Ici, j'ai réglé les hauteurs pour le tronc et la cime des arbres.

Ce sont des directives peu rigoureuses, et nous pouvons ajuster les tailles plus tard.

Étape 2

La largeur du tronc devrait probablement être supérieure à la jambe de notre personnage. Celui-ci a 4 px entre les contours.

Étape 3

Et c'est à peu près ce que la largeur de la cime des arbres sera.

2. formes

Nous allons faire la forme de notre cime d'arbre à partir d'un groupe d'ovales. Il est possible de choisir une forme plus simple, comme un cercle parfait ou même un carré, ce qui est parfaitement réaliste si l’arbre a été élagué. Mais la solution de cluster sera plus naturelle et nous apportera une belle complexité..

Étape 1

Voici la base ovale que nous utiliserons. C'est 24 x 18px, mais essayez différentes tailles si vous voulez.

Vous pourriez faire l'ovale avec le Outil de chapiteau elliptique (anti-alias désactivé). Ensuite, vous pouvez le remplir avec la couleur de contour et contracter la sélection (Sélectionnez> Modifier> Contrat… ) d'un pixel à remplir en vert. Mais j'ai préféré dessiner mon propre ovale avec le Outil Crayon avoir une forme légèrement plus carrée et moins irrégulière.

Étape 2

Nous utiliserons à nouveau le même ovale pour l'ajouter à notre cluster. Nous allons faire trois ovales en haut et cinq en bas.

Étape 3

Essayez autant d'alternatives que vous le souhaitez pour positionner les ovales. Cette ligne aura trois.

Étape 4

Le troisième ovale de cette rangée sera légèrement plus bas pour donner à l'ensemble de la grappe un peu plus de dimension.

Étape 5

Enfin, ajoutez un couple pour le fond, mais placez-les sous ceux déjà terminés. vous pouvez les coller dans un nouveau calque, déplacer le calque sous le calque d'origine, puis fusionner vers le bas.

Étape 6

Supprimer les lignes directrices.

Étape 7

Comme le fond forme un rectangle assez large et arrondi, j’ai adouci un peu la courbe, juste au-dessus du tronc ici:

3. Ombrage

Nous avons obtenu les formes de base de notre arbre, alors maintenant travaillons sur l'ombrage pour obtenir les volumes de notre arbre à travers.

Étape 1

Nous pouvons nous débarrasser de la plupart des lignes ovales intérieures; il est assez facile de se rappeler comment nous allons les ombrager. Pour l'instant, nous ne garderons que les lignes pour la rangée avec trois ovales.

Étape 2

Comme d’habitude, le sommet de nos formes sera celui des zones les plus éclairées. Cette nuance est 10% plus brillante et a également une teinte légèrement plus chaude.

Étape 3

Appliquez la même teinte précédente mais sur des zones plus petites sur les côtés des deux ovales inférieurs.

Étape 4

Ajoutez un peu plus de cette nuance uniquement sur l'ovale central de la rangée avec trois ovales.

Étape 5

Nous ajoutons maintenant une nuance plus foncée pour couvrir plus de la moitié des trois ovales. L'ombre est 10% plus sombre que la couleur de l'arbre principal et a une teinte légèrement plus froide. Essayez les variations comme bon vous semble.

Étape 6

Et la dernière ombre pour la cime des arbres ira sur la zone inférieure. Encore une fois, la nuance est 10% plus sombre que la précédente et a une teinte légèrement plus froide..

Étape 7

Ajoutons un peu de brun pour le tronc d'arbre. Essayez des couleurs alternatives à votre guise et souvenez-vous que vous pouvez facilement essayer les variations de couleur avec le Image> Réglages> Teinte / Saturation… curseurs.

Étape 8

Enfin, ajoutez un peu d’ombrage au coffre. Il devrait être plus sombre juste en dessous de la cime des arbres à cause de l’ombre que cette dernière devrait projeter. Contre les bords, il peut être plus foncé ou plus clair selon vos préférences. Ici il fait plus sombre:

4. Dithering / Patterns

Le dithering consiste à utiliser des motifs pour faciliter la transition d’une couleur à l’autre. C'est assez courant dans le pixel art, bien que pour le style isométrique que j'utilise, j'ai tendance à le garder au minimum. Dans ce cas, nous allons l’utiliser et le rendre surdimensionné de manière à atténuer l’ombrage et à donner à notre arbre une texture feuillue. C'est un gagnant-gagnant pour nous!

Étape 1

Habituellement, les modèles de dithering utilisent des pixels individuels, mais comme je l'ai dit, nous allons rendre nos modèles surdimensionnés. Comme vous devez le constater ici, le dithering utilise des blocs de 4 pixels à la fois, ainsi que des blocs de 2 pixels collés ensemble. Essayez d'imaginer avoir à respecter une grille en damier.

Travaillez en effectuant un zoom avant et vérifiez vos progrès en effectuant un zoom arrière. Les résultats sont à votre goût?

Étape 2

Ici, j'ai appliqué davantage de tramage à l'une des zones claires inférieures. Les pixels de ce motif sont devenus plus petits, mais je respecte toujours une grille de damier, comme je l'ai fait pour la zone supérieure..

Étape 3

Une fois que vous êtes satisfait de l'aspect de cette zone, copiez-la de l'autre côté et appliquez le même processus au dernier point en surbrillance, celui situé au centre de l'ovale..

Étape 4

Faites plus de même tramage pour la section centrale, où nous allons du vert principal à la deuxième nuance la plus sombre.

Étape 5

Ici, le dithering est appliqué sur l’un des côtés des arbres, légèrement plus haut qu’au milieu, pour séparer les volumes et donner à l’arbre un aspect plus rond et plus plein..

Étape 6

Ajoutez ensuite quelques pixels plus sombres pour accentuer une pause entre cette zone latérale et l’ovale moyen. Cela aidera à donner à l'arbre le look de cluster que nous avions l'intention.

Étape 7

Une fois cette zone terminée, vous pouvez simplement la dupliquer, la retourner et la placer du côté opposé..

Étape 8

Enfin, tirez le même tour sur la nuance de vert la plus sombre.

Étape 9

Et pour ajouter de la texture au tronc, vous pouvez, sur un nouveau calque, créer un motif de grille simple et plus petit en noir et baisser l'opacité à moins de 20% avant la fusion..

Cela devrait aider à donner à notre tronc une texture d'écorce.

Étape 10

Pour finir, alléger un peu le contour du bas du tronc et ajouter une ombre ronde projetée par la cime des arbres, qui devrait être noire et réglée sur environ 10% d'opacité..

Arbre fait!

Notre arbre est maintenant prêt à être collé sur n'importe quel environnement, où il se mélangera bien et égayera l'endroit!

Placez-en un devant chaque maison que vous construisez ou collez-en un tas pour créer une forêt ou remplir un parc. Modifiez la teinte / saturation de la cime des arbres et donnez à l’arbre des couleurs à l’automne, ou procurez-vous simplement une palette de nuances pour plus de variété. Espérons que vous trouverez cet élément hautement recyclable et donc un élément très précieux dans votre inventaire de pixel art.

Bonne chance et continue de grandir!