Cet article vous donnera une idée générale de la façon de dessiner des graphismes 2D sympas pour les jeux. Ce n'est pas un tutoriel étape par étape, c'est quelque chose de beaucoup plus cool !
L'article est destiné à ceux qui ont une certaine familiarité avec les graphismes de jeu 2D. Tout d'abord, cela s'applique aux personnes impliquées dans la programmation et qui souhaitent créer des ressources de jeu. De plus - juste pour tous ceux qui veulent créer des graphismes de jeux. Par ressources 2D dans le texte, nous entendons toutes les images 2D pour les jeux : des sprites de personnages aux grands arrière-plans. Cet article présentera brièvement les bons concepts de conception traditionnels et comment ils peuvent améliorer votre jeu. Il est censé vous faire gagner du temps et ne pas développer de mauvais goût.
Il ne couvrira pas des éléments tels que les formats de fichiers, les comparaisons de graphiques bitmap et vectoriels, ou le logiciel utilisé dans les exemples de cet article.
Liste des sujets :
- Formes
- Anatomie et proportions
- la perspective
- science des couleurs
- Éclairage et ombrage
- Aiguiser vos compétences
Si ces points ne vous ont pas saisi, une démonstration visuelle de vos capacités « avant » et « après » suit ci-dessous :
Fait Internet ! Ce sont de vraies images. Le programmeur a dessiné celui du haut lui-même et voulait l'utiliser dans son jeu, et celui du bas est ce qui s'est passé après petit améliorations de son ami designer.
À Vie courante nous sommes habitués à voir beaucoup d'images 2D. Mais savoir qu'une chose est belle n'est pas la même chose que savoir Pourquoi C'est vrai. Toute image 2D peut être décomposée en éléments de base, vous pouvez donc penser à la création d'un graphique 2D en combinant ces éléments de sorte que : 1) Il ressemble à ce que vous aviez en tête ; et 2) n'était pas super moche. Par exemple, nous savons tous à quoi ressemblent un carré et une sphère, mais qu'est-ce que cela a à voir avec la création d'un personnage facile à comprendre ?
Pour y répondre, passons à la première partie :
Formes
Sachant quelles formes de rôle jouent réellement, vous pouvez les utiliser pour créer un environnement de jeu accueillant ou hostile, ainsi que pour que les personnages et les objets correspondent (ou intentionnellement ne correspondent pas) à cet environnement.
Commencez par les formes les plus simples : cercles, carrés et rectangles. Essayez de dessiner un personnage avec uniquement des carrés ou uniquement des triangles, puis voyez lequel ressemble le plus à un héros et lequel ressemble le plus à un méchant. En gardant vos idées initiales sous forme de croquis aux formes simples, vous pourrez générer beaucoup d'idées sans vous laisser distraire prématurément en travaillant sur les détails (ceci est beaucoup discuté dans la section "Affûtez vos compétences").
En règle générale, les formes pointues contiennent un soupçon d'artifice ou de mal, tandis que les formes sinueuses et arrondies évoquent l'origine organique et la bonté. Tel est le spectre traditionnel des personnages. Le cercle et le triangle sont à ses extrémités, et le carré est quelque part au milieu.
la perspective
La perspective consiste à créer l'illusion de profondeur sur une surface 2D en modifiant les formes et les formes des choses, et c'est un sujet assez vaste, vous verrez donc quelques sous-titres ici.
perspective géométrique
Dans la plupart des jeux 2D, les créateurs ne veulent tout simplement pas jouer avec la perspective géométrique, car la réaliser dans les graphismes demanderait énormément de travail. Pour simplifier, les développeurs utilisent l'hypothèse irréaliste que tout est également bien vu de côté (comme dans le jeu de plateforme classique Super Mario), ou déploient des graphiques dans une projection isométrique plus réaliste, mais toujours loin de la réalité.
Nous étudierons en détail le sujet de la perspective géométrique, car c'est le plus difficile à comprendre. principe général, mais même une compréhension très simple de celui-ci améliorera également considérablement les graphismes. Au cœur de la plupart des théories formelles de la perspective se trouve l'idée d'un point de fuite. Les lignes parallèles semblent converger vers un seul point à une grande distance de l'observateur. Cela ressemble à ceci :
Encore plus impressionnant serait un train se précipitant vers Avez-vous remarqué à quel point les lignes parallèles convergent (réelles et imaginaires) ?
Vous pouvez ajouter encore plus de lignes rouges, mais tout est clair Les lignes rouges se croisent au point de fuite. Vous devez également connaître la ligne qui sépare le ciel et la terre. C'est la ligne d'horizon, qui est obtenue en traversant des plans infinis (du point de vue de l'observateur).
Le point de fuite et l'horizon en leur centre incarnent une idée simple : les objets éloignés semblent plus petits que les objets plus proches de nous. Et le côté de l'objet proche de nous semble plus grand que le côté éloigné. Dans l'exemple ci-dessus, un seul point de fuite est utilisé, mais en fait, il y aura autant de points de fuite dans l'image qu'il y a d'ensembles de lignes parallèles - pour chacun. Cela semble trop compliqué ? C'est pourquoi la perspective dans les dessins est généralement simplifiée en perspective à un, deux et trois points. Dans une perspective à un point et à deux points, un ou plusieurs ensembles de lignes parallèles sont supposés rester parallèles pour toujours et ne jamais converger. Voici un exemple de cube et de boîte dans une perspective à un point :
Crayon et papier… Qu'espériez-vous ? Notez que les faces horizontales et verticales restent strictement parallèles. Regardons maintenant la perspective en deux points :
Lors de la représentation d'objets en perspective, il est souvent d'usage de dessiner leur verso afin d'avoir une meilleure idée de la tridimensionnalité. Ici, les lignes horizontales précédemment parallèles ont trouvé leur point de fuite. Les faces verticales restent parallèles. Enfin, perspective en trois points :
En perspective à 3 points, l'objet a l'air épique, du moins en termes de hauteur Désormais, toutes les arêtes ont leur propre point de fuite. Avec quoi nous les félicitons. Je dois dire que les points de fuite sont les plus faciles à tracer pour les droites parallèles. Mais dessiner des lignes directrices ou même des boîtes entières pour objets complexes, vous pouvez mieux imaginer leur profondeur. La perspective à un, deux et trois points est la plus couramment utilisée, mais il y a au moins un artiste qui a utilisé la perspective à six points pour créer des scènes sphériques folles.
Il existe une astuce importante pour dessiner des tubes et d'autres objets ronds dans la bonne perspective, car en perspective, le cercle se déforme d'une manière particulière. Vus obliquement, les cercles ressemblent à des ellipses. Plus la pente est grande, plus l'ellipse est compressée :
Le cercle se transforme en ellipse Voici une règle simple. Lorsque vous regardez le bord d'un cylindre (par exemple, le toit d'un bâtiment rond), la courbe s'incurve vers le haut. Lorsque vous regardez vers le bas, par exemple, à la base d'un tronc d'arbre, la courbe se penche vers le bas. La ligne d'horizon traverse le milieu de cette image.
Pour montrer le volume des figures, elles doivent être ombrées, mais nous la laisserons comme ça. Pourtant, nous devons nous rappeler que dans la plupart des jeux avec des graphismes 2D, ils essaient d'éviter les difficultés de représentation de la perspective géométrique. Choisissez un point de vue de côté ou directement d'en haut, ce qui en minimise le besoin.
Angle
Lorsque la figure d'un personnage est dessinée par rapport à la perspective, cela s'appelle un raccourcissement. Un poing pointé vers le spectateur n'aura pas seulement l'air plus gros que celui tenu sur le côté, il couvrira également une partie importante de la main. Exemple:
Rude mais compréhensible Souvent, les artistes dessinent des angles à l'œil, simplement parce que le calcul de tous les points de fuite prend beaucoup de temps. Mais juste pour que vous sachiez comment cela devrait être idéalement, voici une vue avec des points de fuite et des cylindres. Dans ce formulaire, des croquis sont réalisés pour les membres:
Les cylindres sont plus faciles à dessiner que les gens. N'oubliez pas que les personnages, en particulier les personnages humains, peuvent être représentés comme une série d'objets plus simples et plus faciles à composer. Ceci est normal lorsqu'une figure est esquissée sous la forme de cylindres reliés par des joints, puis qu'une personne est dessinée à l'intérieur.
Superposition et parallaxe
Avec le chevauchement, tout est simple : les objets les plus proches de nous vont se superposer aux plus éloignés et les masquer. Une chose très nécessaire pour les jeux 2D, car c'est le moyen le plus simple de montrer au joueur sa position par rapport aux objets. Prenons un exemple extrêmement simple :
L'image est entrée dans l'histoire sous la forme d'étranges collines en arrière-plan de tous les jeux de la série Super Mario. Cet ensemble de lignes vous donne l'impression que la petite chose ronde à droite (buisson ?) est devant les autres, et la plus grande derrière. L'effet est parfois appelé "règle T" parce que les lignes d'objets devant et derrière forment quelque chose comme un T. C'est simple, mais assez puissant. Dans l'exemple ci-dessus, tous les T sont à l'envers :
Les programmeurs vétérans se souviendront peut-être de l'ASCII 193 La parallaxe est un autre effet de perspective important lié à la relation entre les objets qui se chevauchent. Son essence est que lorsque le spectateur se déplace, les objets éloignés bougent moins que les objets plus proches. La parallaxe est idéale pour les jeux 2D car elle est assez facile à mettre en œuvre et vous l'avez sans aucun doute rencontrée. Assez d'informations pour commencer peuvent être glanées dans cet article de Wikipedia.
Étant donné que les jeux 2D enfreignent souvent délibérément les règles habituelles de la perspective pour la simple raison qu'ils sont plus faciles à dessiner sans eux, il faut compter sur d'autres moyens pour se faire une idée de la profondeur. Un autre de des moyens simples- rendre les objets supposés éloignés du spectateur plus flous et moins détaillés en apparence. Voici un exemple concret, dans une photographie d'un paysage urbain de la Chine industrielle :
Le smog urbain à son meilleur Vous pouvez également remarquer l'effet de perspective géométrique, bien que dans ce cas, le point de fuite principal se situe à gauche du cadre. Presque tous les jeux de plateforme 2D jamais créés utilisent une perspective aérienne. Par exemple (Super Mario World encore) :
Ainsi que le chevauchement et la parallaxe Notez que plus un objet est éloigné en arrière-plan, plus il semble flou. La proximité de l'objet avec le joueur ne peut être affirmée que par la couleur des contours. Cela revient directement à l'idée de contraste. Le contraste indiquera au joueur ce qui est important et ce qui ne l'est pas.
Regardez à nouveau la capture d'écran de Super Mario World. Des collines bleues légèrement ombragées ? Peu importe. Une pipe aux reflets blancs et aux contours noirs ? Important. Le seul objet rouge vif sur l'écran ? Hyper important. N'oubliez pas que les objets interactifs dans un jeu doivent toujours se démarquer des objets non interactifs, à moins qu'il n'y ait une raison spécifique de cacher quelque chose au joueur.
Perspective linéaire et aérienne chez ArtyFactory.com , Tutoriel de perspective-book.com
science des couleurs
La couleur est un sujet délicat, et l'un des plus subjectifs de l'art en général. Il n'y a pas de camarade pour la couleur, et les combinaisons de couleurs et leurs significations diffèrent selon les cultures. Le blanc est peut-être la couleur de la pureté en Occident, mais au Japon, il signifie souvent la mort. Cependant, il existe quelques idées de base sur la couleur qui vous aideront à comprendre ce qui se passe avec vos graphiques. Réfléchissons d'abord à la composition d'une certaine couleur.
Teinte, saturation, luminosité
Il existe de nombreuses façons de découper les couleurs, mais celle dont il est question ici est la plus simple et la plus pratique pour les artistes numériques débutants.
Commençons par comparer deux couleurs :
rouge et bleu Rouge et bleu. C'est clair que ce sont des couleurs différentes, non ? Mais en fait, il existe un terme plus précis Hue (Hue). Le carré de gauche a une teinte rouge et celui de droite a une teinte bleue. D'autres teintes incluent le vert, l'orange, le violet, etc. Bien que la teinte puisse sembler être un terme redondant pour une couleur, ce n'est pas parce que la quantité de n'importe quelle teinte dans une couleur peut changer :
Rouge et rouge pâle Alors, voici deux couleurs rouges, mais en quoi diffèrent-elles ? Celui de droite est un peu… fané. Il a moins de saturation.
La saturation fait référence à la quantité de couleur d'une couleur ou à sa teinte. La saturation peut être considérée comme la quantité de gris dans une couleur donnée. Pas de gris - couleur riche. Beaucoup de gris - désaturé. Donc, dans ce cas, le carré de gauche est complètement saturé et celui de droite est moins saturé. Le gris pur est juste une couleur sans saturation. La saturation est la propriété de couleur la plus délicate sur laquelle un débutant peut glisser. Gardez simplement à l'esprit que la saturation a un impact important sur l'atmosphère de vos graphiques. Haute couleurs saturées lorsqu'il est utilisé dans grandes quantités ont tendance à paraître plus conviviales et les couleurs désaturées sont associées à un style sérieux.
La dernière propriété est la luminosité. Parfois, Value est utilisé à la place. La luminosité est beaucoup plus facile à comprendre : elle montre à quel point une couleur est plus lumineuse. Voici le même rouge que ci-dessus et une version moins brillante (c'est-à-dire sombre) :
Rouge et rouge foncé (moins brillant) La relation entre la luminosité et la saturation nécessite un peu de compréhension :
Ces propriétés peuvent être modifiées en même temps Voici un exemple de la façon dont la couleur peut affecter l'atmosphère d'un jeu. Comparé New Super Mario (si vous êtes déjà fatigué des anciens exemples) et Castlevania : Lords of Shadow.
Notez également que Mario n'a pas lancé de morceaux sanglants lorsqu'il a marché sur le champignon. 
Rien de spécial, je voulais juste montrer à quel point les barres d'état lumineuses se détachent sur le fond général En parlant de couleur, on peut encore se souvenir de... Barney et Godzilla ! Considérez comment la couleur les rend si différents en termes de teinte, de luminosité et de saturation, et ce qui se passe si une ou plusieurs de ces propriétés sont modifiées. Que se passe-t-il si vous ne prenez qu'une seule propriété et que vous la donnez aux deux personnages ? Voulez-vous toujours faire un câlin à Barney gris ?
En bref sur RVB
Toutes nos félicitations! Vous comprenez maintenant le modèle de couleur HSB (Hue Saturation Brightness / Hue Saturation Brightness) ou HSV (Value \u003d Brightness). Presque tous les programmes d'imagerie utilisent ce terme avec RVB (modèle de couleur rouge vert bleu) et CMJN (cyan magenta jaune noir). Mais HSB semble être le moyen le plus simple d'expliquer ce qui arrive aux couleurs. Surtout en ce qui concerne la luminosité ou la saturation de la couleur souhaitée lorsque vous ombragez. Cependant, dans différentes applications, vous devrez gérer le modèle de couleur RVB, nous l'examinerons donc brièvement. RVB décrit simplement toutes les couleurs en termes de rouge, vert et bleu, puisque toutes les couleurs peuvent être décrites comme une combinaison de ces trois. De même, les informations de couleur sont traitées par l'œil humain. Prenez le temps de jouer avec les valeurs de couleur et voyez comment les valeurs HSB et RVB changent et comment elles sont liées les unes aux autres. Ici tableau standard RVB (notez ce qui se passe lorsque les couleurs se chevauchent) :
Aussi connu sous le nom de modèle de couleur additif, puisque les couleurs sont créées en ajoutant de la lumière plutôt qu'en l'absorbant (comme dans le modèle soustractif) Voyez comment la combinaison des trois couleurs donne du blanc. Vous pouvez penser que les couleurs jouent à la corde car lorsqu'elles sont de la même luminosité, les teintes s'annulent, laissant du blanc ou du gris. Mais si vous mélangez des couleurs dans des proportions différentes, vous pouvez vous perdre dans la logique d'obtention du résultat, c'est pourquoi nous conseillons HSB lorsque vous travaillez sur des graphiques.
Maintenant que nous avons compris ce qu'est la couleur, commençons à regarder les combinaisons de couleurs. La théorie des couleurs est complexe et assez subjective, donc ce qui suit ne doit pas être considéré comme une règle absolue, mais comme une direction pour un développement ultérieur.
La base de la théorie des couleurs est la roue chromatique (roue chromatique). Pour simplifier l'explication, la roue est l'arrangement subjectif des nuances de couleur par rapport au rouge, au jaune et au bleu, qui divisent la roue en trois parties (les couleurs dites primaires) et le vert, l'orange, le violet (les couleurs secondaires) en compris entre.
Roue de couleur typique Les teintes sont également généralement classées en chaudes et froides, en termes de température de couleur. De plus, les couleurs rouge-jaune sont considérées comme chaudes et les couleurs bleues sont froides, comme indiqué ci-dessous :
Un fait intéressant. Dans Doing the Right Thing (1989), le réalisateur a ajouté plus de tons orange pour montrer la chaleur dans le cadre. Une zone d'incertitude est ajoutée ici, car les couleurs qui y sont incluses sont une sorte de frontière. Mais le jaune-vert est souvent qualifié de froid et le violet de couleurs chaudes. Il est important de se rappeler que les couleurs froides sont associées à des teintes sombres, donc une ombre de couleur froide sera perçue comme plus sombre qu'une couleur chaude de même luminosité.
D'autres relations entre les couleurs peuvent également être expliquées à l'aide de la roue chromatique. Les couleurs analogues sont simplement des nuances les unes à côté des autres, telles que le vert, le jaune et les couleurs intermédiaires. Les couleurs contrastées sont des couleurs (teintes) distantes de 180 degrés qui apparaissent plus lumineuses lorsqu'elles sont utilisées ensemble. Vous les avez probablement déjà vus en action, même si vous ne saviez pas pourquoi. Le bleu et l'orange sont même devenus un trope (un dispositif stylistique standard).
Si vous utilisez Firefox, regardez l'icône. Encore bleu et orange ! Lorsque vous travaillez sur des graphismes de jeu, essayez d'associer des couleurs à des races ou des ennemis, des environnements ou des niveaux spécifiques. La coloration est facultative, mais vous pouvez l'utiliser pour influencer les perceptions des joueurs. Pensez à un ensemble de couleurs pour les méchants, mais utilisez des nuances uniques de ces couleurs pour des ennemis spécifiques, par exemple. N'ayez pas peur d'expérimenter et d'essayer d'utiliser des couleurs plus rares. Dans tout programme d'imagerie assez avancé (comme GIMP), la couleur est plus facile à modifier que toute autre propriété. C'est l'une des rares choses qui peuvent être facilement modifiées dans un dessin fini.
En bref: Les couleurs peuvent être séparées et comparées les unes aux autres différentes façons, et dans diverses combinaisons, les paires de couleurs peuvent sembler meilleures ou pires.
Nous vous recommandons de lire (en anglais): Théorie des couleurs pour les designers
Éclairage et ombrage
Dans cette partie, vous verrez de nombreux exemples de pixel art, mais ils parlent de concepts de base qui s'appliquent à tout type de graphiques 2D.
Sources de lumière
Les artistes débutants ne comprennent souvent pas pourquoi ils dessinent réellement la lumière et l'ombre. Ombrer (ou ombrager) un dessin signifie généralement appliquer différentes nuances pour donner l'illusion de la lumière dans un dessin, tout comme la perspective est l'illusion de la profondeur. Et tout comme avec la perspective, vous devez créer une sorte d'analogue 2D des effets visibles dans la réalité. Il n'y a qu'une seule règle : la lumière doit venir de quelque part. Il ne peut pas être partout, donc si vous ne faites que colorier le dessin, il n'aura pas l'air correct. Lorsque les débutants essaient de dessiner une ombre mais ne comprennent pas comment, ils se retrouvent avec des objets qui ressemblent à ceci :
Sérieusement, ne fais pas ça. Comparez avec l'option sans ombres :
Mieux vaut le laisser tel quel C'est ce qu'on appelle l'ombrage en coussinet et il est très facile de dessiner sans réfléchir. Il semble naturel d'ombrager les objets le long des contours extérieurs ... mais cela semble complètement contre nature. Pour que l'éclairage ait l'air correct, il doit avoir une direction et l'éclairage / l'ombrage de la surface doit être construit en fonction du côté où la source lumineuse est dirigée vers l'objet. La source de lumière peut être le soleil, une lampe, un lac de lave bouillante, etc., ou elle peut être laissée abstraite.
Par exemple, vous pouvez simplement supposer que presque toute la lumière provient d'une source infiniment distante à un angle de 45 degrés. C'est suffisant pour bien ombrager les objets dans la plupart des cas. Pour les sprites animés qui seront utilisés sur une variété d'arrière-plans, un peu de flou aide à le garder pertinent partout.
Voici un exemple avec une source lumineuse dans le coin supérieur gauche :
Vous devez également vous demander si l'une des parties de l'objet peut projeter une ombre sur l'autreLes parties faisant face à la source lumineuse seront plus claires et les parties opposées seront plus sombres. Quoi de plus simple ? Mais ce n'est pas toujours le cas...
Surfaces planes et courbes
Les surfaces planes ont généralement presque la même teinte partout, mais sur les surfaces courbes, nous verrons un dégradé. Exemples gracieux du monde réel :
Bombardier américain F-117. surfaces planes 
F-15 plus familier. Surfaces courbes Revenons à la section sur les formulaires. Lequel de ces méchants vous semblera bon, et lequel vous alertera avec une seule apparition ?
Vous pouvez voir le gradient réel entre la lumière et l'ombre. Faites attention à l'aile gauche, le dégradé est juste parfait dessus. Revenons maintenant à la misère mentionnée précédemment avec un ombrage d'oreiller :
La source de lumière pour un cube et une sphère n'est pas exactement la même. Quelle est la différence? Et ici, pour chaque face, le cube n'a besoin que d'une seule teinte, et la sphère en a besoin de beaucoup plus - pour simuler la nature dégradée des ombres sur les surfaces courbes.
Ci-dessus, nous avons examiné l'ombrage simplifié, car la lumière peut davantage rebondir sur les surfaces et mettre en évidence les zones ombragées. Cela signifie souvent que la partie de l'ombre la plus éloignée de la source de lumière principale est en réalité plus claire qu'ailleurs. L'effet est plus visible lorsque l'objet est grand ou très proche d'une surface réfléchissante. Ci-dessous un exemple classique :
Un tel ombrage vous permet de mieux ressentir le volume Quelques autres exemples numériques sur le même sujet.
Si les sphères étaient sur une surface bleue, la lumière réfléchie aurait une teinte bleue. Dans l'exemple de gauche, vous voyez la réflexion de la lumière située à l'extérieur du bord de l'image, comme cela se produit avec des surfaces hautement réfléchissantes. Plus la lumière incidente est forte, plus la réflexion est également visible.
Le changement de ton est lié à la réflexion de la lumière et peut très bien être représenté en pixel art. Le point principal de ce phénomène est que le ton d'une ombre ou d'une lumière réfléchie n'est pas toujours simplement une version plus sombre ou plus claire de la couleur principale de l'objet.
Le plus souvent, un changement de ton peut être trouvé dans les objets éclairés par le soleil. La lumière directe du soleil a une teinte jaune, mais le ciel bleu reflète sa couleur sur les ombres, nous obtenons donc des reflets jaunes et des ombres de teinte bleue.
Pensez aux couleurs chaudes et froides. Les hautes lumières sont chaudes et les ombres sont froides Ce concept devient important lorsque vous avez des sources de lumière supplémentaires et qu'elles diffèrent par la couleur des principales (par exemple, la lave incandescente). Rappelez-vous que la lumière colorée changera la couleur de l'objet éclairé. Cependant, changer le ton peut aussi n'être qu'une décision stylistique. En exagérant l'effet ou en substituant des couleurs supplémentaires, vous pouvez obtenir une image très intéressante :
Si vous utilisez trop de nuances, le jeu ressemblera à Instagram Il convient également de savoir que les ombres sont moins saturées et que les couleurs moins saturées peuvent apparaître plus sombres qu'elles ne le sont réellement.
Il n'y a pas de consensus parmi les artistes concernant le changement de ton. Trouvez votre solution, mais rappelez-vous que plus vous changez de ton, plus votre dessin deviendra surréaliste.
Ombrage et texturation
L'ombrage peut suggérer non seulement la forme d'un objet, mais aussi sa texture. La texture d'un objet affecte la façon dont la lumière se reflète sur lui. Par conséquent, en modifiant l'ombrage, vous pouvez parfois modifier l'impression de la texture. Pour distinguer certains types de textures, il existe des termes :
Cela vous sera utile un jour lors de l'achat de peinture de rénovation De la surface avec brillant La lumière texturée reflète bien et avec très peu de dispersion. Cela signifie que la partie éclairée du sujet sera très lumineuse (en raison d'une bonne réflexion) et la partie non éclairée sera très sombre (car l'éclairage supplémentaire provient de la lumière diffuse, et il n'y en a pas). bon exemple la texture brillante est une carrosserie de voiture fraîchement polie.
Mat la texture ne reflète pas très bien et diffuse la lumière lorsqu'elle est réfléchie. Cela signifie qu'il apparaît plus uniformément éclairé. Un bon exemple de surface texturée mate est un vieux pneu de voiture.
Lisse la texture est quelque part au milieu. Il réfléchit bien, mais diffuse fortement la lumière lorsqu'il est réfléchi. Les plastiques ont souvent une texture lisse, comme la plupart des claviers d'ordinateur.
Alors, n'oubliez pas les propriétés des matériaux que vous décrivez. Est-ce du métal brillant ou du tissu mat ? Les vêtements des personnages médiévaux ne doivent pas refléter la lumière comme le plastique, et les armures spatiales ne doivent pas être douces au toucher.
En bref: Pour que les graphiques 2D soient crédibles, la lumière doit avoir une direction.
Aiguiser vos compétences
Que faire maintenant que toutes les bases sont posées ? Vers l'avant! Commencez à essayer ! C'est vrai : n'importe qui peut dessiner. Bien sûr, certaines personnes ont plus de compétences, mais la plus grande différence entre un mauvais artiste et un bon, c'est combien ils ont pratiqué. Plus vous pratiquez, mieux vous devenez compétent. Mais pratiquez sagement. Les projets de jeux offrent une excellente opportunité pour cela. Si vous avez rêvé de votre jeu, commencez à le dessiner en lisant cet article.
Si vous n'avez pas le vôtre, rejoignez celui de quelqu'un d'autre projets de jeux! Même le plus petit jeu a suffisamment de graphismes pour que vous puissiez bien vous entraîner et dessiner sensiblement mieux la prochaine fois. Et encore une chose : pour être un artiste du jeu, vous n'avez pas besoin de dessiner comme les artistes de la Renaissance.
Crayon et papier
La seule façon de mieux dessiner est de s'entraîner, et le moyen le moins cher et le plus simple est de le faire avec un crayon et du papier. Utiliser uniquement des outils numériques est tentant, car vous obtiendrez immédiatement le résultat final. Mais ne soyez pas tenté ! Lorsque vous dessinez à la main, vous êtes plus impliqué dans le processus. De plus, vous pouvez éviter certaines des mauvaises habitudes qui accompagnent le fait de dépendre entièrement de votre ordinateur. Bien sûr, les outils d'un programme peuvent sembler très puissants. Mais si vous essayez d'abord de dessiner les sprites avec des formes automatiques, croyez-moi, vous vous retrouverez avec des choses drôles et laides qui ne pourraient pas être faites avec un croquis au crayon.
Une fois que vous aurez établi de bonnes habitudes de base, vous aurez tout le temps d'explorer sans relâche tous les outils et techniques. Cela vous semble-t-il étrange de dessiner avec un crayon sur du papier si vous êtes déjà habitué à travailler dans un programme ? Mais pas seulement puisqu'il est devenu un point de départ pour les artistes du monde entier.
Procurez-vous un carnet de croquis (il est écrit carnet de croquis sur la couverture), des crayons de couleur et une bonne gomme. Vous devrez utiliser un élastique très souvent. Mais un bloc-notes pour les croquis est facultatif. L'idée clé est que vous avez besoin de pratique, vous pouvez donc même dessiner dans les marges de votre cahier d'école. Mais dans le cahier, tout le travail sera au même endroit, vous n'aurez donc pas à regretter plus tard que le dessin le plus réussi du méchant se soit retrouvé sur un devoir.
Esquisses (ou esquisses)
Dans les croquis au crayon, il est préférable de supposer que toutes les lignes ne sont que des suggestions temporaires et non la version finale. Ne soyez pas accro à vos lignes. Dessinez, effacez et dessinez à nouveau sans vous soucier de ce qui est déjà là. Bien sûr, pour cela, vous devez rendre les lignes suffisamment légères. Commencez par la forme de base de votre objet et ajoutez progressivement des détails. La plupart des objets peuvent être approximés par des formes de base, c'est-à-dire une sphère, un cylindre et une "boîte", ce qui est particulièrement utile pour dessiner en perspective.
Par exemple, ne dessinez pas une tête plus ou moins complète, mais passez à la poitrine, puis aux bras, puis aux jambes… En rentrant dans les détails prématurément, vous risquez de perdre de vue comment tout cela s'emboîte. Dessinez le tout ensemble sur un grand croquis grossier et ajoutez des détails sur le dessus. N'ayez pas peur de continuer à dessiner sur les premières lignes jusqu'à ce que vous ayez la forme générale parfaite, et n'ayez pas peur de recommencer.
Cette vidéo fait un excellent travail en montrant comment l'artiste construit la structure de base du personnage, en superposant des formes rugueuses tout en ajoutant de plus en plus de nouveaux détails, et en effaçant et en repeignant les détails qui ne semblent pas beaux. Et voici une photo du cahier d'un artiste novice:
Croquis typique Brouillon, brouillon, brouillon encore
Cela peut sembler fou au début, mais vous devez dessiner au moins trois versions de n'importe quel personnage/objet/élément de menu au crayon sur papier. Ce n'est qu'alors qu'ils peuvent être transférés sur un ordinateur pour révision. Les grands studios créent souvent littéralement des dizaines de concepts pour un seul personnage avant même de penser à choisir. Dessiner trois versions même pour des ressources d'arrière-plan non interactives comme des arbres ou des buissons est courant. Vous courez un grand risque si vous comptez sur la première option comme la seule et la dernière. Ayant trouvé trois différentes options, vous pouvez prendre le meilleur de chacun et les combiner en finale. Voici un exemple simple où chacun des casques spatiaux cool diffère de la version finale ci-dessous (qui est basée sur des croquis encore plus approximatifs):
Passez en revue la section sur l'anatomie et les proportions. Sans connaître la structure du crâne, il est difficile de trouver un casque adapté 
La chose supérieure devrait en fait projeter une ombre sur la visière Si ce conseil semble très difficile à suivre, gardez à l'esprit que vous dessinez des croquis grossiers, très grossiers, grossiers. Ne perdez pas de temps avec eux. En fait, dans la plupart des cas, moins c'est plus. Plus vous travaillez longtemps sur une option, plus il vous est difficile d'accepter de la refaire ou de créer une autre option. Laissez de côté les détails, passez simplement idée générale et avance. Vous pouvez toujours revenir en arrière et travailler sur un croquis si vous l'aimez.
Préparez-vous au fait que vous devrez dessiner, et dessiner beaucoup, et que vous devrez parfois être frustré. Si vos dessins vous semblent incompréhensibles, cela signifie seulement que rien d'humain ne vous est étranger. La prochaine fois ce sera mieux, et encore mieux. N'oubliez pas qu'il est normal d'être insatisfait. Si le dessin était une simple activité, cet article n'aurait pas paru. En fait, si vous êtes satisfait à 100% de votre dessin, vous n'essayez pas, vous commencez à perdre des amis et à vous convaincre que c'est un gâchis flou que vous vouliez dessiner à l'origine.
En bref: Faites toujours quelques versions au crayon de votre illustration de jeu en premier, et n'essayez pas d'être parfait tout de suite.
Conclusion et lectures complémentaires
Vous connaissez maintenant les bases et êtes prêt à créer des graphismes décents pour les jeux 2D. Si vous souhaitez en savoir plus sur le sujet, vous remarquerez peut-être tout au long de l'article des liens vers des sources supplémentaires. L'article lui-même est largement basé sur le livre Drawing Basics and Video Game Art de Chris Solarsky. Vous pouvez lire quelques-uns de ses écrits. Oser!
Article original sur langue Anglaise: Guide de débutant total pour un meilleur art de jeu 2d
PS
Vous pouvez également être intéressé
Avec le développement de HTML5 et plateformes mobiles Les jeux 2D font leur grand retour et attirent même l'attention des grands éditeurs. Avec des outils comme Unity et des ressources d'actifs de jeux en ligne, le développement de ces jeux est devenu beaucoup plus facile. Vous trouverez ci-dessous une liste des 10 meilleurs sites proposant des ressources de jeu 2D, payantes et gratuites.
*Sites répertoriés dans un ordre aléatoire*
1. Unity Asset Store (payant)
Le plus grand site avec des ressources de jeu payantes. Il n'est pas nécessaire d'utiliser le moteur Unity pour le travail - pour accéder aux ressources de l'Asset Store, il vous suffit de le télécharger version gratuite. Les fichiers téléchargés seront enregistrés dans le dossier du projet Unity, d'où ils pourront être importés dans n'importe quel moteur de jeu 2D.
Il convient de noter que Unity entre les mains d'un développeur qualifié a un énorme potentiel, comme en témoigne le grand nombre de jeux 2D à succès (qui ne vaut que les populaires Bad Piggies de Rovio). Et l'Unity Asset Store offre la plus large sélection d'assets 2D.
2. Marché GameDev (payant)
GameDev Market est un site relativement nouveau, organisé de manière pratique par catégories de contenu (similaire à Super Game Asset, dont il sera question ci-dessous). Vous y trouverez des ressources 2D et 3D, notamment une interface utilisateur, des sprites de personnages, des icônes et des environnements. Des artistes mettent en vente des actifs, et la gamme s'agrandit chaque jour.
Graphicriver est l'une des ressources d'images les plus populaires. Dans le cadre du développement des jeux mobiles occasionnels, une catégorie distincte avec des actifs 2D y est apparue. Avant d'être affiché sur le site, tout le contenu est contrôle interne, et après la publication, tout utilisateur peut laisser sa note et son avis. Bottom line: il s'agit d'un site fiable et en développement actif sous la modération étroite d'Envato.
4. Magasin Scirra (payant)
Scirra est le développeur derrière Construct 2, un éditeur HTML5 2D populaire qui a récemment lancé son propre magasin de ressources. Ici, vous pouvez trouver des ressources audio, graphiques et même des modèles de jeu prêts à l'emploi pour Construct 2. Cependant, vous pouvez utiliser n'importe quel autre éditeur 2D pour le travail.
5. Partenaires artistiques du jeu (payant)
Chez Game Art Partners, vous pouvez acheter une variété de ressources de dessins animés pour les plates-formes 2D, notamment des personnages animés, des monstres, des armes, des effets visuels et des kits d'interface utilisateur.
6. Super Game Asset (payant)
Si vous créez un RPG ou un jeu avec des graphismes isométriques, ce site est fait pour vous. Vous trouverez ici des ressources de la plus haute qualité : des icônes RPG colorées (probablement les meilleures disponibles en ligne), des sprites 2D, des sprites de personnages animés et d'énormes cartes isométriques. Plus important encore, la plupart des ressources présentées sont faites dans le même style.
7. Ouvrir l'art du jeu (gratuit)
La ressource définitive pour les développeurs de jeux open source code source, Open Game Art peut être appelé la plus grande collection d'actifs de jeu de License gratuite. Tous les matériaux - des sprites aux icônes - peuvent être téléchargés sous licence GNU ou Creative Commons. C'est un excellent site pour les débutants, mais de nombreux éléments diffèrent par leur style visuel, ils devront donc être soigneusement sélectionnés.
8. Actifs du jeu Kenney (gratuit)
Un autre excellent site avec plus de 20 000 actifs, y compris des éléments d'interface utilisateur et divers sprites pour les plates-formes 2D. La plupart des ressources se trouvent dans graphiques vectoriels et adapté à tout appareil, quelle que soit la résolution de l'écran. Les actifs peuvent être téléchargés individuellement (gratuitement) ou en tant qu'ensemble (moyennant des frais modiques de 9 $).
9. Jeu-Icons.net (Gratuit)
Game-icons.net est le meilleur site d'icônes gratuites, il n'y en a pas moins de 2000. Malgré le fait que toutes les icônes sont en noir et blanc, elles sont assez polyvalentes et peuvent être utilisées pour représenter des actions, des sorts, des compétences, des objets , etc n Nice bonus - format vectoriel.
10. Tilesets de Reiner (gratuit)
Le meilleur site avec des tuiles gratuites. Ici vous pouvez trouver des sprites d'animaux, de plantes, de bâtiments, d'armes, effets visuels et presque tous les objets pour RPG avec des graphismes isométriques. Le style des assets rappelle Diablo II. C'est une excellente ressource pour les développeurs en herbe qui souhaitent tester un moteur de jeu ou commencer à créer leur propre jeu.
Comme vous le savez, il y a un immense parc appareils mobiles avec différentes résolutions d'écran et formats d'image. Et si vous lisez cet article, alors vous, comme moi, voulez décider sous quelle autorisation demander à l'artiste de dessiner des sprites, à tel point que le jeu a l'air bien sur la plupart des appareils.
On notera tout de suite la méthode selon laquelle le jeu est dessiné pour un format, et mis à l'échelle pour tous les autres. Cette méthode déforme l'image à l'écran et tout semble différent de ce que l'artiste avait prévu.
Notre méthode consistera à couper la partie de l'image qui n'affectera ni le gameplay ni la composition artistique à différents rapports d'aspect. Mais quelle doit être la taille de l'image d'arrière-plan d'origine ?
Pour ce faire, décidons quelles résolutions d'écran et quels rapports d'aspect sont les plus populaires en ce moment. Pour cela, j'ai utilisé les statistiques ouvertes de l'équipe Unité, tu peux le voir. Voici les données actuelles au moment de la rédaction :
Résolutions d'écran
Rapports d'aspect
Et voici à quoi ressemble la liste des résolutions les plus populaires les unes par rapport aux autres :
Nous allons couper l'excédent sur les côtés, en laissant la hauteur de l'image intacte. Par conséquent, vous devez décider de la taille maximale de l'image en hauteur.
Si vous dessinez quelque chose en taille 2048 x 2048 pixels, puis réduire par programme à la taille 512x512px, alors l'image restera claire, dans le sens opposé avec graphiques matriciels vous ne pouvez pas faire cela - l'image sera floue.
Comme vu ci-dessus, dans la liste des résolutions les plus populaires, la hauteur maximale est 1536px.
Pour les formats de rapport d'aspect les plus populaires (98,5%), vous pouvez choisir la largeur de l'image afin que la hauteur reste la même 1536px. C'est ce qui en est ressorti :
Tenant compte du fait que les bords latéraux seront coupés sur les écrans avec un rapport d'aspect autre que 16:9, il est possible de placer des objets importants pour le gameplay afin qu'ils restent visibles, c'est-à-dire en les plaçant à l'intérieur d'une zone de taille 2048 X 1536 pixels. Sur la base de ce modèle, vous pouvez dessiner l'arrière-plan et d'autres éléments du monde du jeu.
Création d'une feuille Sprite dans Sprite Sheet Packer
Sprite Sheet Packer est un outil permettant de créer des feuilles de sprite (feuille de sprite, feuille de sprite) de différents formats. Page d'accueil Sprite Packer https://spritesheetpacker.codeplex.com/. Ce petit programme sous licence MIT fusionne de nombreuses images uniques en une seule image qui organise efficacement les images d'entrée sur une toile transparente. Pour que Sprite Sheet Packer fonctionne correctement, Microsoft doit être installé sur le système. cadre net pas inférieur à la version 3.5
Le programme prend en charge les formats d'image d'entrée PNG, JPG, BMP et GIF. Le résultat est une seule image PNG 32 bits. arrière-plan transparent. Sprite Sheet Packer crée également un fichier texte d'accompagnement qui affiche les noms de fichiers d'image d'entrée avec leurs coordonnées et leurs tailles. C'est tout ce dont vous avez besoin dans votre programme de sprite pour trouver les zones d'image dont vous avez besoin.
L'interface utilisateur de Sprite Sheet Packer dispose d'un ensemble de contrôles nécessaires et suffisants. Il n'est pas difficile de le comprendre. L'ouverture des fichiers d'entrée est possible à la fois depuis la boîte de dialogue et par glisser-déposer. Les fichiers peuvent être ouverts individuellement ou par sélection multiple à la fois.
Après avoir chargé les images, vous devez définir la quantité requise d'espaces entre elles, déterminer le nom et l'emplacement du fichier de feuille de sprite. Si vous cochez l'option pour créer une carte de sprites, après avoir défini le nom de la feuille de sprites, le nom du fichier de carte et son emplacement seront définis automatiquement.
Étant donné que j'ai l'intention d'utiliser Sprite Sheet Packer comme outil de sprite principal pour appliquer des sprites CSS aux pages Web, je n'ai pas traduit les deux options spécifiques. Est-ce "Require Power of Two Output ?" et "Exiger une sortie carrée ?". Si je comprends bien, ils sont conçus pour définir des formats spéciaux de liste de sprites lors de l'utilisation du programme dans le but prévu - créer des listes de sprites pour les jeux. Ci-dessous, je vais donner des captures d'écran de toutes les options pour créer une feuille de sprite.
1 - Options "Require Power of Two Output?" et "Exiger une sortie carrée ?" . Les dimensions de la feuille de sprite sont de 462x200px.
2 - - "Nécessite l'alimentation de deux sorties ?". Les dimensions de la feuille de sprite sont de 512x256px.
3 - - "Require Power of Two Output?" et "Exiger une sortie carrée ?". Les dimensions de la feuille de sprite sont de 512x512px.
4 - - "Requiert une sortie carrée ?". Les dimensions de la feuille de sprite sont de 336x336px.
L'exemple de feuille de sprite est très simple. Je ne me suis pas soucié des photos. des tailles différentes, et a pris les premières images PNG rencontrées avec des dimensions de 32x32 pixels. Sur la page développeur (voir lien ci-dessus), vous pouvez voir des exemples de feuilles de sprites avec des images de différentes tailles. Il me semble que la dernière option est optimale pour créer un sprite maître pour le placement ultérieur de sprites css sur des pages Web. Cette feuille de sprites a une forme carrée optimale avec une petite quantité de marge vide pour l'ajout éventuel de nouveaux sprites si nécessaire. Je vais donner une capture d'écran du fragment fichier texte cartes pour la dernière version de la feuille de sprite.
La capture d'écran montre les noms de fichiers de sprites promis, leurs coordonnées et leurs tailles. Mais les coordonnées des images sont données ici sans le signe moins, donc lors de la création de styles pour les sprites CSS, vous devez en tenir compte. Il est beaucoup plus facile de charger le sprite maître résultant dans le programme Sprite Cow pour déterminer les coordonnées souhaitées, il indiquera de manière transparente les coordonnées à utiliser dans CSS.
C'est en fait tout.
Amis, Mult-uroki.ru est un projet non commercial qui est utilisé par de plus en plus de personnes chaque jour. plus de gens dans le monde en tant que ressource avec du matériel éducatif gratuit de qualité sur le thème de la création de dessins animés et d'animation 2D. Vous pouvez AIDER AU DEVELOPPEMENT DU PROJET avec une petite somme d'argent, car souvent le temps que je pourrais consacrer à créer de nouvelles leçons, je le perds en faisant des petits boulots pour survivre. Merci!
Afficher les matériaux associés à Cette leçon dont je parlais dans cette vidéo :
Dans mes tutoriels vidéo, vous pouvez apprendre à créer des dessins animés, des personnages et des animations 2D/3D dans n'importe quel style.
Commencez à apprendre dès la première leçon :
1. Un aperçu du programme Anime Studio Pro (Moho Pro). Nous créons votre première animation de haute qualité
La leçon dure 41 minutes ! Pendant ce temps, vous vous forgerez une opinion complète sur moi et le programme, et prendrez une autre décision qui pourrait changer votre vie future (même si vous ne regardez pas mes cours plus tard, cela vous fera gagner du temps !).
Où trouver des sprites pour les jeux ?
Pour vous-même, vous répondrez aux questions suivantes :
- Puis-je travailler dans le programme ?
— Est-ce que je comprends le processus de passage de l'image depuis la préparation dans Adobe Photoshop jusqu'à l'animation et la vidéo finale ?
Avez-vous aimé mon explication ou vais-je chercher autre chose ?
- Puis-je gagner de l'argent avec ça?
— Est-ce que je pourrai créer mon propre dessin animé ?, qui peut servir, par exemple, de super cadeau !
Dans ce tutoriel, je vais vous montrer comment créer une animation de sprite pour les jeux 2D dans Anime Studio Pro (Moho Pro)). Tous les moteurs (SVG) et tous les styles (séquence png).
Mon projet (réseau social) est dédié à l'enseignement de la création de dessins animés 2d, personnages, animation 2d/3d, animation dessinée à la main, création de jeux 2d en javascript et flash, montage vidéo, son, post-traitement vidéo, etc. en publiant mes cours vidéo sur mon site réseau social http://mult-uroki.ru, dans le groupe VKontakte : https://vk.com/mult_uroki et chaîne Youtube: https://www.youtube.com/c/Mult-urokiRu pour les programmes d'animation 2d/3d et la modélisation d'objets d'animation, de terrains et d'arrière-plans dans : Anime Studio Pro (Moho Pro) (ASP) (asp) (anime studio pro ) , Autodesk Maya 2013, Adobe After Effects CS6, Adobe Premier Pro, Adobe Photoshop, Adobe Audition, Adobe Flash, Toon Boom Animation, Cinema 4D, Blender et Poser Pro. Dans mes leçons, vous apprendrez comment les dessins animés et l'animation sont créés, comment les personnages sont lippés et doublés de dessins animés, quelles sont les lois de l'animation et du montage, comment il existe des types de plans et comment les alterner correctement, comment un storyboard et un animatique sont créés , quels dessins animés sont créés dans le programme Anime Studio Pro (Moho Pro) et quel programme est meilleur (plus facile) et quoi choisir pour créer votre premier dessin animé 2D à la maison Anime Studio Pro (Moho Pro) ou Adobe Flash? Tutoriels vidéo : Création de personnages en os et animation 2D dans le programme Anime Studio Pro (Moho Pro 12). Comment créer et dessiner des personnages dans Anime Studio Pro (Moho Pro) ? comment faire un dessin animé 2d?
05/11/2016Alexandre Ptichkin
De simples éclairs qui nous sont familiers sont des décharges qui sautent entre les nuages dans la troposphère et la surface de la terre.
Ressources gratuites pour les jeux 2D
Les lutins, d'autre part, apparaissent dans la haute atmosphère au-dessus d'un nuage d'orage et prennent des formes étranges, ne ressemblant même pas de loin à des décharges électriques.
Ces décharges ont été découvertes relativement récemment, en 1989. Ils ont été découverts par John Randolph Winkler, un professeur à la retraite, un vétéran de la NASA âgé de 73 ans, lorsqu'il a pointé une caméra vidéo très sensible sur des nuages orageux, en l'alignant simplement, puis, en regardant l'enregistrement image par image, a trouvé deux éclairs lumineux. qui, contrairement à la foudre, n'est pas descendu, au sol et jusqu'à l'ionosphère. La raison de leur apparition s'appelle la formation champ électrique haute intensité sur une zone d'un orage qui ressemble à un éclair de lumière de forme étrange. Les sprites apparaissent généralement en groupes, souvent sous la forme d'un anneau. Ils sont mobiles, font des mouvements "dansants", et il est très facile de les confondre avec des ovnis. Les colonnes de luminescence verticales dans les sprites atteignent 20 km de hauteur, leur faisceau peut atteindre 70 km de diamètre.
Vous avez aimé le message ? Soutenez Factrum, cliquez sur:
Comment remplacer un sprite lorsqu'il se déplace le long d'un chemin défini.
Disons que vous avez un sprite avec 36 images (0-35).
C'est-à-dire que chaque image suivante est une sous-image à 10 degrés sur le côté.
Habituellement, dans l'événement draw, dans l'action de dessiner le sprite, dans le champ -subimage-, nous écrivons direction/(360/image_number).
C'est la direction/10. Mais en chemin, la direction de l'objet est un nombre fractionnaire !
Nous résolvons le problème.
Dans l'événement de dessin (ou d'étape), définissez la valeur de la variable,
direction=(rond(rond(direction)/10))*10.
J'explique.
Direction = (arrondi(arrondi(direction) divisé par 10))
multiplié par 10
J'explique plus.
La direction fractionnaire le long du chemin est arrondie. (exemple 268.34 = 268)
Puis on le divise par dix (268/10=26,8)
puis arrondir (26,8=27)
puis multiplier par dix (27*10=270)
Hourra ! Nous avons ce qu'il nous faut ! Maintenant : -subimage- direction(270)/10 =27
Autrement dit, 27 est une image de sprite où l'objet regarde vers le bas, ce qui était requis.
Comment créer rapidement un sprite d'une personne regardant (vue de dessus) dans différentes directions (18, 36, 72 côtés)
Nous créons un sprite avec une image d'une personne. Cliquez sur Modifier l'image-objet
Sélectionnez Animation / Séquence de rotation / puis dans le sens antihoraire.
ensuite, dans le nombre d'images on écrit le nombre de sous-images (personnes dans des directions différentes) et les degrés on écrit 360. (si ça tourne dans tous les sens)
Plus loin OK et... Ô MIRACLE ! s'est produit!
Textures, carreaux, arrière-plans
vous La bonne quantité sous-images.
Ensuite, vous devez définir (en théorie) la première image (numéro 0) où le mec regarde
par direction=0, pour écrire direction/10 dans l'événement de dessin en sous-image, le mec doit regarder vers la droite. Vous pouvez utiliser (si vous ne cherchez pas)
Images/Cycle vers la gauche
images/cycle Droite ou majuscule+ctrl+(L ou R)
Voici le sprite terminé.
Comment créer une machine à eau potable (jeux).
Pour commencer, nous créons deux sprites - la machine elle-même et la banque. Puis ces objets.
Principe de fonctionnement : le héros entre en collision avec une mitrailleuse, et avec de la chance, une banque s'envole vers
certaine distance de la machine. Tout se répète après un certain temps.
Dans l'événement CREATE du héros, nous entrons une variable (vrai / faux), par exemple, no_kola,
pour savoir si le jeu est déjà en cours d'exécution. Donc, no_kola=true (c'est-à-dire que le jeu ne tourne pas)
En cas de collision :
1) Le héros s'arrête.
2) Si no_kola=false (le jeu est activé)
3) Quittez cet événement
4) Avec chance 1 out (nombre, plus, moins de chance, j'en ai 4)
5) Créez un objet bancaire.
Voici plus de détails. Tout dépend de la direction dans laquelle la banque volera. S'applique à : Autre
Si à gauche, alors x=-(random(20)), si à droite, alors c + Y=random(20)-10 All -Relative
6) Puis, si nécessaire, jouez les sons.
7) Définissez no_kola=true (le jeu est activé).
8) Ensuite, nous fixons une minuterie, par exemple, à 50, et dans le cas de cette minuterie, nous écrivons no_kola=true(no game).
Ensuite, dans l'événement CREATE de la canette, nous jouons le son de la victoire (ils disent que nous avons gagné) et dans le cas où le héros entre en collision avec la canette, nous la détruisons et jouons le son de boire la canette. Tout.
Comment créer un feu éternel. (Feu)
Nous fabriquons le sprite de feu, puis l'objet. Nous faisons du son.
Dans Créer, nous écrivons :
1) Si le son du feu ne joue pas
2) Jouez le son du feu
3) Définissez la variable fire=false pour contrôler la propagation.
Dans Step nous écrivons :
1) Si feu=faux
2) Alarme 0 à (nombre, vitesse de propagation, j'en ai 300)
3) Mettre feu=vrai
Dans Alarme 0 on écrit :
1) Si l'objet feu est à la position (x,y = random(100)-50, Relative)
2) Bloquer le démarrage
3) feu=faux
4) Quitter
5) Fin de bloc
6) créer un feu d'objet (x,y =random(100)-50, relatif)
7) Alarme 0 = 300 8) Feu=faux
Principe de fonctionnement. La variable fire indique s'il faut essayer de créer un incendie après un certain laps de temps. Et lorsqu'il est égal à faux, l'alarme est définie pour essayer de créer un incendie à nouveau. Si la position où vous voulez mettre un feu est déjà occupée par le feu, le feu deviendra faux et l'Alarme0 recommencera. En même temps, tout brûlera - murs, personnes et objets. Lorsque le feu quitte la pièce, il vaut mieux le détruire.
C'est tout.
Création d'un personnage armé (y compris jusqu'aux dents).
Dans ce conseil, vous trouverez le principe, et vous réaliserez vous-même déjà les codes.
JUSTE ARMÉ
Cela peut être compris comme deux types d'armes.
Tir unique, faibles dégâts. (Arme à feu)
Tire à plusieurs reprises, peu de dégâts. (Uzi, ingrem)
Tire seul. gros dégâts. (Arme à feu)
Tire des dégâts uniques et maximum. (Bazooka)
Dans ce cas, on suppose que le joueur aura toujours ces 4 armes, même s'il n'y a pas de munitions (le tir sans munitions est un son certain). Pour tirer, il suffira de trouver des cartouches et le tour est joué. La prise de vue sans rechargement est également possible.
Par exemple, dans le jeu MAX PAIN, que je fais actuellement, j'utilise des armes simples. Le pistolet et l'Uzi ne différeront que par le temps entre les balles. (dégâts par ex. 10)
Ils ont besoin d'un objet balle.
Le fusil de chasse tire moins vite que le pistolet. (mais les dégâts, par exemple, sont 3 fois plus)
Nous avons besoin d'un autre objet, de préférence un sprite plus grand.
Le bazooka tire très lentement (et ici les dégâts, par exemple, sur coup - mort)
Et ici, vous devez créer une petite fusée. Lorsqu'il entre en collision avec quelqu'un / quelque chose, il explose et l'objet EXPLOSION inflige des dégâts (par exemple, 10).
Afin de toujours avoir quelque chose à tirer, vous pouvez rendre les balles au pistolet sans fin.
Mais comment choisir une arme ? C'est ainsi que j'ai résolu ce problème. A côté du héros, je dessine sa santé, et au-dessus j'écris le nom de l'arme et à côté le nombre de coups. Les numéros peuvent être utilisés pour la commutation (par exemple 1234). Vous devez entrer des variables (true / false), par exemple: use_pistol, use_usi, use_rifle, use_rocket Et lors du changement de numéro, toutes les variables sont définies sur false et celle requise est définie sur true.
Et dans l'événement dessin : si telle ou telle variable = vrai, alors écris telle ou telle arme.
ARMÉ JUSQU'AUX DENTS
Dans ce cas, le joueur ne possède pas toutes ces armes, et lorsqu'il récupère des munitions d'une arme qu'il ne possède pas, il ne pourra pas tirer. Sans fin sont des pierres, un couteau et une tronçonneuse, une chauve-souris. Vous devrez tirer avec rechargement.
1 Utilisé indéfiniment à courte portée. (Couteau, batte, tronçonneuse)
2 Placé à côté du héros. (Grenade, mine, piège.)
3 lance à une certaine distance du héros. (Pierres, grenade, cocktail Molotov)
4 Tirs simples, faibles dégâts. (Pistolet, arbalète)
5 Tirs plusieurs fois, faibles dégâts. (Uzi, ingrem)
6 Tirs simples, gros dégâts. (Fusil de chasse, fusil de chasse)
7 Tire plusieurs fois, dégâts importants. (Kalachnikov, mitrailleuse lourde)
8 Tirs uniques, dégâts maximum. (Bazooka, lance-grenades)
Protection - Gilets pare-balles, casques, combinaisons ininflammables.
1 Avec un couteau et une scie, c'est probablement compréhensible. La scie a plus de dégâts. Et la chauve-souris est utilisée à une distance légèrement plus éloignée, mais les dégâts sont comme ceux d'un couteau.
2 Vous pouvez également placer une grenade à côté de vous, après un certain temps elle explosera.
La mine est placée à proximité, les dégâts sont les mêmes que ceux d'une grenade, seulement jusqu'à ce qu'elle soit piétinée, elle n'explosera pas.
Un piège est comme une mine, mais avec moins de dégâts.
3 pierres peuvent être rendues infinies et causer des dégâts négligeables.
La grenade est lancée, selon combien de temps vous maintenez la touche (Powershoot)
Le cocktail Molotov ne cause pas de dégâts, mais crée un feu autour de lui, qui disparaît après un certain temps. Mais le feu fait des dégâts, (par exemple, 2) Et s'il entre en collision avec l'ennemi, il sera engagé, même s'il s'en va, et jusqu'à ce que le feu s'épuise ou que l'ennemi meure.
4 Pistolet démonté, arbalète - moins de dégâts
5 Démonté
6 Lorsqu'elles sont tirées d'un fusil de chasse, de nombreuses balles sont tirées ensemble, infligeant individuellement de faibles dégâts. (par exemple, 3) Mais comme il y en a beaucoup, les dégâts seront importants.
7 Comme vous le savez, Kalash a un tombeau, comme une mitrailleuse. Moins de dégâts que 6, mais tire un peu plus lentement que 5.
8 Grenade Launcher tirera des grenades, mais pas Powershoot. Et le bazooka ?
Lorsqu'une fusée éclate, il y aura une explosion, et même le feu continuera de brûler, comme celui d'un Molotov.
Et il y a une autre catégorie - Flamethrower. Il tirera à courte distance, mais le feu, comme celui d'un Molotov, causera d'énormes dégâts, restant sur l'ennemi.
Et la Défense ? S'il vous plaît! Armure - 100 points de vie supplémentaires, lorsqu'on lui tire dessus, il n'y a pas de sang.
Un casque ne protégera que votre tête, c'est donc une défense aléatoire, environ 1 sur 5.
Et une combinaison non combustible - nous introduisons une variable, havekostum=true, et en cas de collision avec le feu, le feu ne sera pas attaché au corps, mais ne fera que réduire la résistance de la combinaison.
C'est tout! Vous pouvez combiner à la fois simple et "jusqu'aux dents", et obtenir de très bonnes armes. Mais la 2ème méthode est nécessaire de manière complètement explicite pour d'excellents jeux. Poussée
Merci, *SpleaN*
Si vous souhaitez offrir au public vos leçons ou simplement des informations intéressantes sur la création de jeux à l'aide de GameMaker, vous êtes le bienvenu - envoyez votre travail à gamemaker e1.ru, en indiquant le sujet 'Leçons sur GM' ou en indiquant directement le sujet de la leçon.
Nous serons heureux de placer les documents envoyés par vous sur les pages de notre site Web, avec l'indication obligatoire de l'auteur !
© 2003 Simple Vie & Monde
Avec le développement du HTML5 et des plateformes mobiles, les jeux 2D reviennent à la mode et attirent l'attention des plus grands éditeurs. Avec des outils comme Unity et des ressources d'actifs de jeux en ligne, le développement de ces jeux est devenu beaucoup plus facile. Vous trouverez ci-dessous une liste des 10 meilleurs sites proposant des ressources de jeu 2D, payantes et gratuites.
*Sites répertoriés dans un ordre aléatoire*
1. Unity Asset Store (payant)
Le plus grand site avec des ressources de jeu payantes. Il n'est pas nécessaire d'utiliser le moteur Unity pour travailler - pour accéder aux ressources de l'Asset Store, il vous suffit de télécharger sa version gratuite. Les fichiers téléchargés seront enregistrés dans le dossier du projet Unity, d'où ils pourront être importés dans n'importe quel moteur de jeu 2D.
Il convient de noter que Unity entre les mains d'un développeur qualifié a un énorme potentiel, comme en témoigne le grand nombre de jeux 2D à succès (qui ne vaut que les populaires Bad Piggies de Rovio). Et l'Unity Asset Store offre la plus large sélection d'assets 2D.
2. Marché GameDev (payant)
GameDev Market est un site relativement nouveau, organisé de manière pratique par catégories de contenu (similaire à Super Game Asset, dont il sera question ci-dessous). Vous y trouverez des ressources 2D et 3D, notamment une interface utilisateur, des sprites de personnages, des icônes et des environnements. Des artistes mettent en vente des actifs, et la gamme s'agrandit chaque jour.
Graphicriver est l'une des ressources d'images les plus populaires. Dans le cadre du développement des jeux mobiles occasionnels, une catégorie distincte avec des actifs 2D y est apparue. Avant d'être publié sur le site, tout le contenu est vérifié en interne, et après la publication, tout utilisateur peut laisser sa note et ses commentaires. Bottom line: il s'agit d'un site fiable et en développement actif sous la modération étroite d'Envato.
4. Magasin Scirra (payant)
Scirra est le développeur derrière Construct 2, un éditeur HTML5 2D populaire qui a récemment lancé son propre magasin de ressources. Ici, vous pouvez trouver des ressources audio, graphiques et même des modèles de jeu prêts à l'emploi pour Construct 2. Cependant, vous pouvez utiliser n'importe quel autre éditeur 2D pour le travail.
5. Partenaires artistiques du jeu (payant)
Chez Game Art Partners, vous pouvez acheter une variété de ressources de dessins animés pour les plates-formes 2D, notamment des personnages animés, des monstres, des armes, des effets visuels et des kits d'interface utilisateur.
6. Super Game Asset (payant)
Si vous créez un RPG ou un jeu avec des graphismes isométriques, ce site est fait pour vous. Vous trouverez ici des ressources de la plus haute qualité : des icônes RPG colorées (probablement les meilleures disponibles en ligne), des sprites 2D, des sprites de personnages animés et d'énormes cartes isométriques. Plus important encore, la plupart des ressources présentées sont faites dans le même style.
7. Ouvrir l'art du jeu (gratuit)
Une ressource définitive pour les développeurs de jeux open source, Open Game Art peut être appelé la plus grande collection d'actifs de jeux sous licence gratuite. Tous les matériaux - des sprites aux icônes - peuvent être téléchargés sous licence GNU ou Creative Commons. C'est un excellent site pour les débutants, mais de nombreux éléments diffèrent par leur style visuel, ils devront donc être soigneusement sélectionnés.
8. Actifs du jeu Kenney (gratuit)
Un autre excellent site avec plus de 20 000 actifs, y compris des éléments d'interface utilisateur et divers sprites pour les plates-formes 2D. La plupart des ressources sont présentées sous forme de graphiques vectoriels et conviennent à tout appareil, quelle que soit la résolution de l'écran. Les actifs peuvent être téléchargés individuellement (gratuitement) ou en tant qu'ensemble (moyennant des frais modiques de 9 $).
9. Jeu-Icons.net (Gratuit)
Game-icons.net est le meilleur site d'icônes gratuites, il n'y en a pas moins de 2000. Malgré le fait que toutes les icônes sont en noir et blanc, elles sont assez polyvalentes et peuvent être utilisées pour représenter des actions, des sorts, des compétences, des objets , etc n Nice bonus - format vectoriel.
10. Tilesets de Reiner (gratuit)
Le meilleur site avec des tuiles gratuites. Ici vous pouvez trouver des sprites d'animaux, de plantes, de bâtiments, d'armes, d'effets visuels et presque n'importe quel objet pour RPG avec des graphismes isométriques. Le style des assets rappelle Diablo II. C'est une excellente ressource pour les développeurs en herbe qui souhaitent tester un moteur de jeu ou commencer à créer leur propre jeu.
