Autor Tema: [Manual - Aporte] Vista 3D en juegos 2D By SoyJoaquin. [Diseño & AS2]  (Leído 881 veces)

Desconectado SoyJoaquin.

  • PHPero Master
  • ******
  • Mensajes: 2.737
  • Karma: 131
  • Sexo: Masculino
  • ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ Problem?
    • Ver Perfil
    • IsoMap
¡Hola Chic@s!
Como ya sabrán, desde hace ya aproximadamente 6 o 7 meses me encuentro dentro del mundo de la creación de juegos en Flash utilizando AS2 como lenguaje de programación.

En este manual les voy a enseñar como puedes crear un juego con aspecto tridimensional (3D) sin abandonar la bidimensionalidad (2D).

Tomare como temática principal un juego de coches ya que aquí es donde se logra apreciar mejor este efecto.

Empezamos. Primero que nada dibujemos (Con líneas) un simple cuadrado en nuestra hoja.

Ejemplo:


Después de esto, copiaremos y pegaremos ese cuadrado. Una vez hecho esto vamos a seleccionar la opción para "transformar" un objeto seleccionado (En este caso nuestro cuadrado)


Una vez seleccionada esta opción vamos a poner el puntero del mouse sobre la línea superior de nuestro cuadrado, el puntero se cambiara por dos flechas horizontales. una en dirección contraria de la otra. Ahora mantén presionado el botón izquierdo el mouse mientras arrastras la figura hasta un ángulo no tan lejos del actual. Por ejemplo:


Esto lo vamos a seguir haciendo hacia el mismo lado y aumentando cada vez mas el ángulo las veces que quieras. Ejemplo:


Digo hacia un solo lado ya que para ahorrar tiempo y que quede mejor geometrizado nuestro coche tridimensional.

Una vez que tengas toda una dirección lista tan solo vamos a seleccionar todos los recuadros creados, los copiamos y los pegamos. A estos recuadros pegados los seleccionaremos todos (Solo los recientemente pegados) y nos vamos a la barra de menú superior donde dice "Modificar", Después le damos a "Transformar" y a continuación a "Voltear horizontalmente".
Nos quedara algo así:


Bien, ya aquí tenemos nuestro plano base. Ahora vas levantando líneas guías para ir diseñando tu coche. A mi me quedo algo así:


No me tienen que decir que me quedo feo, ya que fue realizado muy rápidamente para darlo como ejemplo en este manual. Pero descuida, estoy seguro que a ustedes les quedara mejor.
Una ves hecho esto, creamos un clip de película con todas estas imágenes (Un movimiento por cada frame) y lo que falta es solamente cosa tuya.

Aquí te puedo dar una idea. son 5 frames, de los cuales el frame 3 es el medio. Entonces cuando se inicie el movieclip tiene que estar en el frame 3. Esto se hace por medio del método OnClipEvent (load). En ese mismo método crearía una variable de posición la cual su valor sea 3 (Esta variable es la que va a cambiar de acuerdo a la posición). Ahora empezamos con el cambio de dirección del coche. Yo lo que haría es que al momento de que una tecla es presionada (KeyDown, en el método EnterFrame) cambiaria las posiciones del movieclip del coche [Coordenadas X según la tecla (Derecha +x - Izquierda -x)]. en ese mismo método lo que hago es que si la posición X (Imaginemos que la película mide 600 de ancho, la divido por 4 partes que serian 150 cada una) es 300  quiere decir que es el punto medio, si pasa de 300 es el frame 4, si es menos de 300 es el frame 2, si es mas de 450 es el frame 5 y si es menos de 150 es el frame 1.

Vista previa: http://vectorcity.h3w.es/publicaciones/3djoako/simula3d.swf

Para las colisiones, se toma el plano de base (Donde empezamos a diseñar todo)
Saludos, espero que les aya aclarado dudas.
Twitter: @JoakoM010



Comunidad PHPeros