Share
Ce que vous allez créerDans les didacticiels précédents, nous avions créé un personnage de pixel art et lui avions attribué une voiture et des endroits où vivre. Maintenant, donnons-lui un lieu de travail.
Un immeuble de bureaux est une excellente chose à faire dans le pixel art isométrique, car vous pouvez ajouter autant d'étages que vous le souhaitez et vous retrouver avec un assez grand bâtiment qui demande à peu près la même quantité de travail à faire qu'une maison ou un bâtiment plus petit..
Vous devrez avoir suivi le didacticiel Isometric Pixel Art Character et Isometric Pixel Art House avant de poursuivre..
Faisons une hauteur au sol et une empreinte qui correspondent à notre personnage.
Nous allons donc utiliser le personnage comme un bâton de mesure, comme d'habitude. Ici, la hauteur que j'ai choisie est de 60 px pour un étage.
J'aime utiliser des multiples de 10 px parce que déplacer les éléments à l'aide des flèches du clavier tout en maintenant enfoncée la touche Maj survient par multiples de 10 px, afin que les choses se mettent en place beaucoup plus rapidement et facilement..
Décidons maintenant de la largeur de la partie entrée du bâtiment. Il aura de très larges doubles portes, donc la largeur de l'entrée devrait leur permettre de pénétrer dans l'espace..
Je garderai également la plupart de ces distances par multiples de 10 px, pour les raisons expliquées ci-dessus; cela facilite les choses plus tard (et si vous êtes capricieux, ça fait du bien de mesurer ses distances en chiffres ronds).
Les tirets verticaux ici sont simplement utilisés comme guides - nous pouvons les supprimer ou les dessiner par la suite, ils ne sont donc pas nécessaires, mais ils sont généralement utiles..
La zone d'entrée fera un peu saillie, alors donnons-lui de la profondeur.
Ajoutez une autre ligne parallèle à l'entrée. Ce sera le mur de verre. Avec l'entrée, ils feraient à peu près la largeur totale de notre bâtiment..
Nous ajouterons quelques coutures au mur de verre, voilà pourquoi ces tirets sont là.
Ajoutons maintenant plus de profondeur: le mur latéral du bâtiment. Ça va être plus court que la face avant.
Finissons l'empreinte. Vous pouvez déplacer les lignes de guidage vers un autre calque pendant un moment. Ici, j'ai fermé la zone et l'ai remplie de blanc afin que les prochaines étapes soient un peu plus faciles.
Maintenant, nous dupliquons l’empreinte et la déplaçons à la hauteur que nous avions déjà choisie pour le niveau..
Comme la surface était remplie de couleur, nous avons légèrement moins de lignes à supprimer.
Nous devons encore supprimer le reste des lignes que les murs vont bloquer.
Ajoutez quelques lignes de coin verticales et votre volume est terminé.
Nous allons maintenant nous occuper de la plupart des coloris et des détails nécessaires au premier étage, qui resteront quasiment identiques pour le reste des étages..
Ajoutons la plupart des lignes verticales dont nous aurons besoin: une à chaque coin et quelques lignes supplémentaires pour les bords des vitres murales en verre..
Trouvez les couleurs que vous aimez pour les différentes sections du bâtiment. J'ai choisi de faire en sorte que l'entrée ressemble à du béton. Les murs de verre ont à peu près la même couleur que celle qui a été définie pour les fenêtres du didacticiel précédent, et la petite zone sur le bord sera une couleur de brique sombre..
Vous devriez essayer de jouer avec le Teinte / Saturation / Luminosité curseurs pour trouver les couleurs finales.
Définissons une largeur pour les doubles portes et repoussons légèrement cette surface dans le volume. Comme d'habitude, vous voudrez rendre les coins supérieurs une teinte plus claire que les murs.
Maintenant nous réglons la hauteur des portes.
Et ici, j'ai tracé une ligne légèrement sombre juste à côté d'une ligne légèrement claire pour ressembler à de petites rainures. Cela semble être courant sur ce type de bâtiments et cela rend les murs en béton pas trop plats / ennuyeux..
Nous allons également appliquer ces rainures horizontalement, plus tard.
Les portes d'entrée étant principalement en verre, remplissez-les de la même couleur que le mur de verre parallèle. Ajoutez également des lignes de bordure verticales pour les portes, l’une au coin intérieur et l’autre au centre. Pour trouver le centre, vous pouvez mesurer toute la rupture dans le béton avec le Sélectionner l'outil (vous aurez la largeur dans le panneau d'information), puis divisez-le par 2 et vous connaîtrez la distance entre le coin intérieur et l'endroit où doit aller le coin central.
Parce que les murs autour des portes en recouvrent une partie, ne vous attendez pas à ce que les deux rectangles de verre aient la même largeur.
Ajoutons un cadre autour du verre. J'ai choisi un gris foncé, avec une teinte légèrement froide.
Un pixel de gris suffisait verticalement. Pour la ligne du bas, j'ai laissé une hauteur de 3 px. Ajoutez également les lignes sombres entre le gris et le verre.
Voici les portes finies. J'ai ajouté un petit surlignage pour la partie inférieure des zones grises / métalliques, quelques pixels à peu près à la hauteur des bras du personnage (ce sont les serrures) et quelques lignes de verre plus foncées, pour obtenir une sorte d'effet de verre..
Maintenant, sur le mur de verre. Rendez le coin avant plus clair et ajoutez une zone avec une nuance plus foncée de la couleur du verre. Vous pouvez utiliser le Outil Baguette Magique pour sélectionner la surface supérieure blanche, puis déplacez cette sélection d'environ 10 px vers le bas de manière à ce que la sélection croise les zones du mur de verre que vous souhaitez peindre.
Terminez les lignes pour toutes ces pièces en verre. La plupart des coins ne doivent pas nécessairement être noirs et les coutures du verre doivent être légèrement plus sombres que les couleurs environnantes..
Aussi, repoussez un peu le mur marron.
Ajustez les couleurs du mur marron, maintenant qu'il est sorti.
Le rez-de-chaussée est presque fini.
Maintenant, copiez le niveau et collez-le sur un nouveau calque (ou Alt-Maj-Flèche Haut) et placez-le juste au-dessus du rez-de-chaussée.
Bien sûr, il n'y aura pas de portes aux niveaux suivants, alors commencez à les transformer en fenêtre en les joignant et en ajustant la taille. Ici, c'est déjà beaucoup plus court, verticalement.
Le bord inférieur épais du cadre n'est plus nécessaire, maintenant que c'est une fenêtre. Débarrassez-vous et rendez la fenêtre plus étroite. Assurez-vous de le garder centré; si vous le raccourcissez de 12 px à droite, réglez-le également de 12 px à gauche.
Ensuite, terminez les zones autour de la fenêtre. Remplissez la couleur du mur en béton.
Et faites les détails supplémentaires sur le mur. Nous allons ajouter quelques rainures supplémentaires au béton, cette fois horizontalement. Comme les précédents, ceux-ci sont fabriqués avec une nuance de couleur de mur légèrement plus sombre, juste à côté d'une couleur légèrement plus claire. Ils devront être appliqués au haut et au bas de ce niveau.
Maintenant pour le verre. Nous voulons conserver les coutures, mais celles du haut et du bas sont en noir et nous les voulons avec la même couleur que le reste des coutures..
Finalement, nous ferons la même chose avec le mur marron, mais c'est encore plus simple pour celui-ci car il n'y a pas de rainures ni de coutures. C'est juste une continuation des mêmes couleurs. Le moyen le plus simple de résoudre ce problème consiste à utiliser Outil Baguette Magique; en sélectionnant les trois couleurs, puis Alt-Nudging 1 px en haut et aussi en bas.
Ajoutons une petite fenêtre à ce mur marron. Ce sera un joli petit accent - la fenêtre sera dans un style différent. Commencez avec un rectangle. Si vous le faites comme ça, on dirait que les coins sont arrondis et que cela semble plus propre.
Remplissez le rectangle de gris foncé (de la même couleur que dans la porte), puis ajoutez une surbrillance en haut et quelques lignes parallèles au bord supérieur et supérieur.
Donnez-lui de la profondeur. Ici, j'ai aussi ajouté un point culminant sur la bordure inférieure.
Ajouter une couleur de verre et une ligne sombre entre le verre et le métal.
Et puis il suffit de le dupliquer pour qu'il soit également au rez-de-chaussée.
Le deuxième étage est terminé.
Le deuxième étage ressemble en quelque sorte à une tuile. Vous pouvez le répéter autant de fois que vous le souhaitez et créer un bâtiment de 100 étages si vous le souhaitez..
Mais nous ne ferons pas 100 étages. Pour ce bâtiment, cinq étages semblent à peu près corrects. Quoi qu’il en soit, si le bâtiment est trop haut et que chaque étage est le même, cela gaspille l’espace d’illustration avec plus de.
Vous pouvez sélectionner le deuxième étage et appuyer sur Alt-Maj-Flèche Haut le dupliquer à la volée. Ou vous pouvez copier / coller, puis placez simplement où il appartient. Comme je l'ai déjà mentionné, il est possible de déplacer des sélections de 10 pixels dans n'importe quelle direction en appuyant sur Décalage et le Touches directionnelles.
Nous ne répéterons qu'une partie du sol pour le sommet, de sorte que nous ayons un morceau du bâtiment qui est là simplement pour donner accès au toit-terrasse. Il suffit d’évoquer la partie concrète.
Vous voudrez peut-être faire cela sur un nouveau calque.
Terminez le volume.
Ajouter les détails correspondants.
Ici, j'ai ajouté une petite section pour couronner la petite boîte en béton. Il m'a semblé un peu brusque sans ça.
Remplissez le dessus avec une nuance claire de la couleur du béton et fixez toutes les lignes qui pourraient avoir besoin d'être réparées. Nous ajouterons un peu de texture granuleuse sur le toit, comme nous l'avons fait pour l'immeuble d'habitation. Commencez avec un rectangle, centré sur le dessus.
Trouvez la couleur que vous aimez, puis appliquez la texture granuleuse douce et adoucissez les bords.
Si nous le voulions, nous pourrions supposer que la porte de la terrasse se trouve du côté du cube que nous ne pouvons pas voir, mais ajoutons-le plutôt du côté visible. Nous allons copier les portes que nous avons déjà faites et les ajuster à ce nouveau mur.
Il suffit d'une porte. J'ai gardé la petite serrure visible, et à part enlever une des portes, j'ai aussi fait celle que je gardais un peu plus étroite.
La porte d'origine faisait face au côté le plus clair du bâtiment. Vous devez donc ajuster les couleurs pour correspondre au nouveau côté..
Ensuite, retirez simplement le morceau de mur sous la porte.
Et pour terminer les volumes de la terrasse, ajoutons une balustrade, qui devrait correspondre à la hauteur de la taille du personnage. Commencez avec celui à l'arrière et donnez-lui les couleurs du mur marron.
Ensuite (vous voudrez peut-être mettre cela dans une nouvelle couche), faites en sorte que la balustrade fasse le tour et sur les bords avant.
Il suffit ensuite de rendre les bordures qui entrent en contact avec le mur ou le sol un peu plus claires que le noir..
Et tous les volumes sont complets.
Il est temps de finir notre bâtiment en ajoutant quelques textures simples.
C'est la texture que nous allons ajouter aux murs bruns. Ce ne sera pas en noir et blanc, mais pour le créer, faites alterner ces lignes de 2 px. Vous ne pouvez dessiner que quelques pixels, puis sélectionner et dupliquer plusieurs fois jusqu'à couvrir une grande surface. Vous pouvez également le faire comme un pinceau en sélectionnant la tuile, puis en allant à Édition> Définir un motif.
Une fois que vous avez suffisamment de texture, placez-la dans un nouveau calque, couvrant toutes les zones brunes. Idéalement, les parties noires de la texture doivent recouvrir la plupart des lignes noires du dessin..
Modifiez l'opacité du calque de texture à 20% ou à votre guise..
Raccourci: vous pouvez modifier les opacités des calques en appuyant sur les chiffres du clavier lorsque l'outil de déplacement est actif..
Ensuite, sur les couches avec le mur marron, sélectionnez toutes les zones de la couleur marron avec Outil Baguette Magique. Si vous avez ces zones réparties sur plusieurs couches, il vous sera utile de définir la Outil Baguette Magique à Échantillon toutes les couches.
Revenez au calque avec la texture et inversez la sélection (Sélectionnez> Inverse) et supprimer.
Il ne vous restera plus qu'une texture qui ne recouvre que les murs.
Maintenant, trouvez une couleur pour la surface du toit.
Et faisons une autre texture simple. Pour cette surface nous ferons des carreaux.
Commencez avec un rectangle en utilisant une nuance plus foncée de la nouvelle couleur de surface. Ensuite, à l’intérieur de ce rectangle plus foncé, créez un autre rectangle mais avec une nuance plus claire que la surface. Puis dupliquer et organiser plusieurs fois.
Dupliquez jusqu'à ce que vous puissiez couvrir tout le sol de la terrasse avec la texture. Le contraste ne doit pas être trop élevé pour cette tuile.
Répétez ensuite le même processus que précédemment pour éliminer les zones de texture indésirables..
Vous pouvez maintenant, si vous le souhaitez, fusionner toutes vos couches de construction.
Toutes nos félicitations! L'immeuble de bureaux est terminé, et maintenant le ciel de pixels est la limite!
Accentsconagua