¿Cómo puedo dar la ilusión de altura a una pelota en 2D?


40

En los juegos de fútbol de arriba hacia abajo en 2D, a veces una pelota tiene la ilusión de estar en el aire, como a continuación:

ejemplo

¿Cómo puedo conseguir esto?


aquí su respuesta japantoday.com/category/lifestyle/view/… : shadow.
v.oddou

1
Citando fuente de imagen: Originalmente corté ese GIF de este video de juego de Tiki Taka Soccer para esta pregunta .
Anko


1
Dependiendo del tamaño de la vista de su juego también se podría utilizar perspectiva haciendo que la bola más grande
Wilf

¡Qué lejos está la pelota de su propia sombra!
Bradman175

Respuestas:


79

Dale a la pelota un valor de altura. Dibuja una sombra en la posición 2D real de la pelota; la sombra ayudará a orientar espacialmente la pelota para el jugador.

Al dibujar la pelota en sí , compensar la posición Y por la "altura" de la pelota. Si desea implementar algo más que una ilusión, use también este valor de altura en los cálculos; por ejemplo, puede implementar la capacidad de que la pelota pase por encima de la cabeza de un jugador en un juego como lo demostró al verificar si la altura es más suave que la altura de un jugador.


40
Además, escale la bola a medida que sube en el eje Y para un efecto adicional (mientras reduce la sombra si lo desea)
jgallant

La idea de @Jon es realmente inteligente. Dependiendo de qué tipo de juego y el nivel de 'acción' que quieras poner en él, es una muy buena idea (también fácil de implementar)
tfrascaroli

1
También puede escalar la bola (o en el caso de los sprites, cambie el sprite a imágenes progresivamente más grandes / más pequeñas) para que imite estar más cerca de la cámara. Esto puede exagerar la altura, o puede ser sutil, dependiendo de cuánta diferencia de tamaño se use.
Draco18s

1
@ Jon encoger la sombra no sería realista. Hacerlo más difuso lo haría, si está dentro del nivel tecnológico del juego.
hobbs

1
@Kramii eso es efectivamente lo que obtienes cuando "compensas la posición Y por la" altura "de la pelota" como se describe en la respuesta.
osvein

78

Sombra y textura .

Texturiza la pelota para mostrarla girando. Esto ayuda a dar la ilusión de rotación de una esfera, que tiene más de 2 dimensiones.

ingrese la descripción de la imagen aquí

Una sombra puede engañar a tu cerebro para que crea todo tipo de cosas. Hacer que las cosas planas parezcan tener una tercera dimensión.

ingrese la descripción de la imagen aquí

Ni siquiera tiene que cambiar la altura de la pelota, solo necesita cambiar la ubicación de la sombra.

ingrese la descripción de la imagen aquí

Este video es un excelente ejemplo de lo que puede hacer shadow. Notarás que la bola se mueve exactamente igual en cada secuencia, solo cambia la sombra: https://www.youtube.com/watch?v=5fgOK0odA1o


66
Lo siento por los horribles gifs ... Ojalá pudiéramos insertar el video.
MichaelHouse

18
esos gifs son perfectos y son integrables. En el caso del video, necesitaría reproducir manualmente cada uno de ellos
lukas.pukenis

Además, los videos estarán vinculados externamente. AFAIK incluso StackOverflow no descarga los videos de YouTube y los almacena ... pero los GIF pueden almacenarlos.
Nelson

algunos sitios de red pueden insertar YouTube
joojaa

Buenas sugerencias, pero compensar la sombra parece extraño. La sombra es una proyección de una pelota hacia el plano del suelo. Viaja en línea recta (no es una parábola, como la bola 3d) y cuando la bola está en el suelo, las posiciones de la bola y la sombra deben coincidir. Si compensamos la sombra en lugar de la pelota, puede ser muy confuso. Tendremos que hacer que la sombra tenga una trayectoria parabólica para moverla hacia la pelota, o hacer que desaparezca repentinamente cuando la pelota aterrice. Ambas opciones se verán muy extrañas.
Interphx

1

Shadow and Ball son aspectos clave. El tamaño de la sombra y la distensión entre la bola y la sombra deberían aumentar cuando la altura aumenta. Además, el tamaño de la bola debería aumentar cuando la altura de la bola aumenta. La posición de la sombra representa la posición de la bola en 2d y cuando la altura de la bola aumenta, debe cambiar la posición de la bola (supongo que la fuente de luz es homogénea y no es un punto único como una lámpara. La fuente de luz cambia todo lo relacionado con la sombra). Finalmente puede agregar alguna animación como flujo de aire.


3
El tamaño de la bola debería aumentar ... solo si tienen una proyección en perspectiva. Si es isométrica, como la imagen, el tamaño de la bola debe permanecer igual.
Arturo Torres Sánchez

0

Haría lo que sugirieron los carteles anteriores, la sombra y el tamaño aumentan cuando la pelota es más alta. Una cosa que recuerdo de jugar al tenis en los viejos juegos de televisión es que la pelota también disminuyó su velocidad a medida que se fue haciendo más grande. Cuando llegó a su cenit y comenzó a "descender", comenzaría a ir más rápido nuevamente a medida que se hacía más pequeño.


-1

Dibujas una sombra debajo de la pelota, como se hace en el gif. Cuanto más alta sea la pelota, mayor será la distancia entre la pelota y la sombra.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.