Comment puis-je donner l'illusion de hauteur à une balle en 2D?


40

Dans les matchs de football 2D top-down, un ballon a parfois l’illusion d’être dans les airs, comme ci-dessous:

Exemple

Comment puis-je atteindre cet objectif?


voici votre réponse japantoday.com/category/lifestyle/view/… : shadow.
v.oddou

1
Citing source of image: À l'origine, j'avais coupé ce GIF de cette vidéo de gameplay de Tiki Taka Soccer pour cette question .
Anko


1
En fonction de la taille de la vue de votre jeu, vous pouvez également utiliser la perspective en rendant la balle plus grande
Wilf

À quelle distance se trouve le ballon de sa propre ombre !,
Bradman175

Réponses:


79

Donnez à la balle une valeur de hauteur. Dessinez une ombre à la position 2D réelle de la balle; l'ombre aidera à orienter spatialement la balle pour le joueur.

Lorsque vous tirez la balle elle - même , décaler la position Y de la "hauteur" de la balle. Si vous voulez implémenter plus qu’une illusion, utilisez également cette valeur de hauteur dans les calculs. Par exemple, vous pouvez implémenter la possibilité pour le ballon de passer par-dessus la tête d’un joueur dans un jeu similaire à celui que vous avez montré en vérifiant si la hauteur est correcte. plus que la taille d'un joueur.


40
De plus, balancez la balle à mesure qu'elle monte sur l'axe des Y pour un effet supplémentaire (tout en réduisant l'ombre si vous le souhaitez)
jgallant

L'idée de @Jon est vraiment intelligente. En fonction du type de jeu et du niveau d'action que vous souhaitez y
intégrer,

1
Vous pouvez également redimensionner la balle (ou, dans le cas d'images-objets, changer l'image-image en images de plus en plus grandes / petites) pour qu'elle ressemble plus à la caméra. Cela peut exagérer la hauteur, ou peut être subtile, en fonction de la différence de taille utilisée.
Draco18s

1
@Jon réduire l'ombre ne serait pas réaliste. Le rendre plus diffus le serait, si cela correspond au niveau technique du jeu.
Hobbs

1
@ Kramii, c’est ce que vous obtenez lorsque vous "décalez la position en Y de la" hauteur "de la balle", comme indiqué dans la réponse.
osvein

78

Ombre et texture .

Texturisez le ballon pour le montrer en rotation. Cela aide à donner l’illusion de rotation d’une sphère, qui a plus de 2 dimensions.

entrez la description de l'image ici

Une ombre peut tromper votre cerveau en lui faisant croire toutes sortes de choses. Faire en sorte que les choses plates ressemblent à une troisième dimension.

entrez la description de l'image ici

Vous n'avez même pas besoin de changer la hauteur de la balle, il vous suffit de changer l'emplacement de l'ombre.

entrez la description de l'image ici

Cette vidéo est un excellent exemple de ce que l’ombre peut faire. Vous remarquerez que la balle se déplace exactement de la même manière dans chaque séquence, seule l'ombre change: https://www.youtube.com/watch?v=5fgOK0odA1o


6
Je suis désolé pour les gifs affreux ... J'aimerais que nous puissions intégrer une vidéo.
MichaelHouse

18
ces gifs sont parfaits et ils sont intégrables. En vidéo, je devrais jouer manuellement chacun d'entre eux
lukas.pukenis

De plus, les vidéos seront liées de manière externe. Autant que je sache, StackOverflow ne télécharge pas les vidéos youtube et ne les stocke pas ... mais les GIF qu’ils peuvent stocker.
Nelson

certains sites du réseau peuvent intégrer youtube
joojaa

De bonnes suggestions, mais compenser l'ombre semble bizarre. L'ombre est une projection d'une balle sur le sol. Il se déplace en ligne droite (pas une parabole, comme la balle en 3D) et lorsque la balle est au sol, la position de la balle et celle de l'ombre doivent correspondre. Si nous compensons l'ombre au lieu de la balle, cela peut être très déroutant. Nous devrons soit donner à l'ombre une trajectoire parabolique pour la déplacer vers la balle, soit la faire disparaître soudainement lorsque la balle atterrira. Les deux options seront très étranges.
Interphx

1

Shadow et Ball sont des aspects clés. La taille de l’ombre et la distance entre la balle et l’ombre devraient augmenter avec la hauteur. En outre, la taille de la balle doit augmenter lorsque la hauteur de la balle augmente. La position de l'ombre représente la position de la balle en 2D et lorsque la hauteur de la balle augmente, vous devez changer la position de la balle (je suppose que la source de lumière est homogène et qu'il ne s'agit pas d'un point unique, comme une lampe. La source de lumière change tout ce qui concerne l'ombre). Enfin, vous pouvez ajouter une animation comme un flux d'air.


3
La taille de la balle devrait augmenter ... seulement si elles ont une projection en perspective. Si c'est isométrique, comme l'image, la taille de la balle doit rester la même.
Arturo Torres Sánchez

0

Je ferais ce que les affiches ci-dessus suggéraient: l’ombre et la taille augmentent lorsque la balle est plus haute. Une chose que je me souviens de jouer au tennis sur de vieux jeux télévisés, c’est que la balle ralentissait aussi à mesure qu’elle augmentait et devenait plus grosse. Quand il a atteint son zénith et a commencé à "descendre", il recommençait à aller plus vite à mesure qu'il devenait plus petit.


-1

Vous dessinez une ombre en dessous de la balle, comme dans le gif. Plus la balle est haute, plus la distance entre la balle et l'ombre est grande.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.