Hola! Abro esta sección porque me pareció que mucha gente tiene ganas de aprender a hacer juegos pero no puede por varias razones. Voy a utilizar el Adobe Flash CS3 Professional; si tienen el Macromedia Flash Professional 8 o el MX no hay problema ya que me voy a dedicar a ActionScript 2.0 (lenguaje de programación del Flash).Vamos a empezar con algo básico y fácil de hacer: un juego de esquivar. Empecemos desde cero.
Introducción
Flash usa algo llamado Clips de Película para identificar los dibujos que se transforman en parte del juego (un personaje, una barra, el enemigo, etc... siempre son Clips de Película). Estos forman parte de los símbolos. Otros símbolos son los botones y los gráficos. Para crear un Clip de película (desde ahora los vamos a llamar MC) abran el Flash que tengan y clickeen en Archivo de Flash ActionScript 2.0 .
Ahora lo que van a hacer es seleccionar la herramienta pincel y van a dibujar un círculo.
Ahora presionen F8. Les aparecerá algo así:
Lo que nos sirve es lo que está arriba de la linea celeste. No se preocupen si solo aparece esa parte, la otra no es necesaria. En el texto Nombre: escriban Jugador. Si el casillero del Clip de Película está seleccionado y el punto de Registro: seleccionado es el centro clickeen Aceptar.
Ya tenemos nuestro MC. Ahora pasamos al movimiento de este MC que va a ser nuestro "Jugador". Selecciónenlo con la flecha negra y presionen F9. Acaban de abrir el Panel de Acciones. Aquí vamos a poner las órdenes que el Flash va a recibir y ejecutar. La primer linea que se debe escribir en las acciones de un MC es esta:
1
2onClipEvent(enterFrame){
}
Movimiento
Ya tenemos la base de nuestro código. Ahora vamos a darle el movimiento a nuestro "jugador".
Vamos a hacer que el mouse sea la posición del círculo. Presionen ENTER dos veces en el final de la línea 1 así crean la línea 2 en blanco. Ahora agreguen esto.
Antes de explicar estas dos líneas nueva tienen que entender bien lo que es el sistema cartesiano del Flash.1
2
3
4onClipEvent(enterFrame){
this._x = _root._xmouse
this._y = _root._ymouse
}
Wikipedia define las coordenadas cartesianas así:Las coordenadas cartesianas son un sistema de referencia respecto de un eje (recta), dos ejes (plano), o tres ejes (en el espacio), perpendiculares entre sí (plano y espacio), que se cortan en un punto llamado origen de coordenadas. En el plano, las coordenadas cartesianas (o rectangulares) x e y se denominan respectivamente abscisa y ordenada, y se representan como (x, y).
Una explicación gráfica: Como ven, la forma de posicionar los MC en Flash es mediante un sistema de coordenadas. Por ejemplo: el círculo azul tiene coordenadas x = 350 (pixeles) e y = 100 (pixeles), las coordenadas del gris son x = 50 e y = 200 y finalmente el rojo tiene x = 200 e y = 350. De esta forma podemos decir la posición de nuestro MC. Ahora sí paso a explicar las dos líneas nuevas.
Línea 2 y 3: Lo que estamos haciendo ahora es modificar una característica del MC (la posición X e Y). Siempre que se quiere modificar algo de un Símbolo se debe poner el "nombre" del mismo, un punto y luego la característica que se modifica.
Se podría decir que una traducción al español de lo que venimos haciendo sería:
En un MC (onClipEvent), cuando estamos en la frame ((enterFrame)), la posición (_x)X e Y(_y) de este MC(this.) es igual(=) a la posición X(_x) e Y(_y), respectivamente, del mouse(_xmouse y _ymouse).
Supongo que querrán comprobar si esto es verdad... Bueno presionen CONTROL+ENTER y vean que el círculo que hicimos sigue al mouse. Si les parece que tiene algo de retraso lo único que tiene que hacer es aumentar el numero de fotogramas por segundo. Pueden presionar CTRL+J (o van a Modificar-Documento), así abren las propiedades del documento. En el recuadro donde dice Velocidad de Fotogramas cambien el número a 24 o 30. Debería quedar algo así:
Si ya cambiaron a 24 o 30 esto clickeen Aceptar y vean la diferencia si antes estaba demasiado lento. Recuerden guardar este documento porque vamos a seguir modificándolo.
Espero que les sirva. Si quieren seguir con la creación de su juego, la parte 2 ya está en el blog!
-Rest
Tutorial: Como hacer un juego. 1- Movimiento
Categoria
Tutoriales
4 comentarios:
muy malo
no tendran alguno de Adobe flash cs4?
ActionScript 2 es más viejo que mi abuela. .-.
che si van a decir algo malo para eso ni ablen
Publicar un comentario
Bueno, les pedimos que si quieren pongan el nombre de usuario de Kongregate en el comentario y sean moderados.