MINI GUA DE INICIO A CLICKTEAM FUSION
Si te has topado con esta excelente herramienta para desarrollar juegos y aplicaciones dirs, "todo muy lindo, pero
cmo funciona?", bueno, he aqu una pequea y sencilla gua para que todos los recin empezados puedan
familiarizarse con el programa.
"En esta gua se busca familiarizar al usuario novato con el programa, por lo que solo se explicar lo bsico y se
pasaran por alto algunos temas y no se profundizar en cada uno."
Antes que nada dejemos en claro como est compuesto un video juego, stos se conforman principalmente en 4
partes: grficos, programacin, sonidos e historia. Hay muchos ms puntos a tener en cuenta para llevar a cabo el
desarrollo de un video juego pero en esta gua solo explicar lo relacionado con el programa.
Grficos: Es la parte visible de la aplicacin, son todos los objetos de diseo y dibujo que se aprecian en el escenario
o nivel del juego, como por ejemplo, personaje, enemigos, cajas, monedas, fondo, etc.
Programacin: Es la mecnica del juego o en otras palabras lo que le da vida, es la parte no visible pero una de las
ms importantes, ya que sin ella nuestro juego solo sera un conjunto de objetos inmviles. Todo lo que tenga que
ver con los movimientos o eventos son parte de la programacin, por ejemplo, el control del jugador a travs del
teclado o mando, ya sea desplazndose hacia los lados, saltando, disparando, etc.
Sonidos: La parte auditiva son todos los sonidos que escuchamos durante el juego, estos pueden ser por ejemplo, la
msica de fondo, el sonido al recoger una moneda o saltar, etc. Si contamos con un buen apartado sonoro suma
mucho a la calidad final del juego y lo hace ms entretenido.
Historia: Es lo que le da sentido al juego, es lo que hace que el jugador se interese y quiera avanzar hasta terminarlo.
En algunos casos como en los juegos casuales la historia puede ser muy breve o simplemente estar ausente, pero en
juegos ms complejos y elaborados, una buena historia es algo esencial para lograr el xito.
La historia abarca, por ejemplo, el objetivo del juego, los obstculos en la trama, los giros o cambios posibles, etc, en
el caso del personaje principal, nos cuenta por qu est en ese lugar, quin es y que tiene que hacer. Podemos
contarla como una presentacin grfica, con dilogos textuales o audibles, a travs de videos o como una secuencia
grfica como si fuese un cmic.
Conociendo Clickteam Fusion
Clickteam Fusion es una herramienta de creacin de juegos y aplicaciones especializada en 2D, es actualmente una
de las ms potentes y fciles de usar que existen en el mercado. Cuenta con una interfaz grfica muy sencilla e
intuitiva en donde ubicaremos todos los objetos y extensiones que vayamos a utilizar. Este software no requiere de
programacin a base de texto, funciona por medio de "eventos", o sea, condiciones y acciones.
Familiarizndonos:
El programa se divide en 3 pantallas principales, Storyboard editor, Frame editor y Event editor (El Event list editor
es lo mismo pero se visualiza en forma de lista).
Storyboard editor: Desde esta pantalla administraremos todos los frames o niveles de nuestro juego.
Frame editor: Aqu es donde ubicaremos todos los grficos y objetos que vayamos a utilizar para crear el
escenario, tambin se insertarn las extensiones que necesitemos.
Event editor: Esta pantalla pertenece a la parte de programacin, aqu crearemos todos los eventos necesarios
para darle vida al juego. Tambin podemos visualizar los eventos en forma de lista desde el Event list editor.
"Clickteam Fusion cuenta con una amplia lista de objetos y extensiones que nos facilitarn y ayudarn en la creacin
de nuestro juego."
Las extensiones y objetos podemos dividirlas en 2 grupos, algunos sirven para agregar cualidades al programa, por
ejemplo, movimiento de 360, fsicas, online, etc y por otro lado estn los que nos ayudarn a darle forma a nuestro
juego, por ejemplo, agregando personajes a travs de actives, fondos, puntuacin, etc.
Utilizando Clickteam Fusion:
Lo primero que vamos a hacer es abrir el programa, para empezar creamos un archivo nuevo para nuestro juego o
aplicacin, para esto vamos a la pestaa "File" y seleccionamos "New" o simplemente hacemos click en el icono que
representa una hoja de papel .
Veremos que se crean 2 items, uno se llama "Application 1" que es el juego/aplicacin y el otro "Frame 1" que
corresponde al primer escenario o nivel de nuestro juego.
Seleccionando "Application" podremos configurar las distintas propiedades de nuestro juego/aplicacin, como la
resolucin (tamao de la pantalla o ventana), los frames por segundo, modos de visualizacin, etc.
Al seleccionar "Frame 1" podemos configurar el tamao del escenario, color del fondo, etc. Si hacemos doble click en
"Frame 1" accedemos al "Editor de nivel (Frame editor)", aqu es donde vamos a crear nuestro escenario y
ubicaremos toda la parte grfica y las extensiones que vayamos a utilizar.
Parte Grfica (Frame editor)
En este punto voy a explicar el uso de algunos de los objetos bsicos del programa.
Objetos actives (Active)
Los actives son objetos que se utilizan para crear todo lo que sea programable, o sea, todo lo que tenga movimiento,
por ejemplo los enemigos, lo que sea controlado por el jugador como el personaje principal o simplemente todo
objeto que vaya a cambiar su estado en un futuro o interacte con otros.
Vamos a insertar un objeto activo o ms conocido como "Active", para ello hacemos click derecho en el escenario y
seleccionamos la opcin "Insert object (insertar objeto)", se nos abrir una ventana, en ella buscamos el objeto
llamado "Active" y lo seleccionamos, damos "ok" y lo ubicamos haciendo click en el escenario, vemos que se cre
un rombo verde , ste es nuestro "objeto activo (active)". Hacemos click derecho en el "Active" y seleccionamos
"Edit", se abrir una ventana en donde podremos editar, animar e importar sprites para darle forma a nuestro
objeto.
Fondos (Backdrop) y Fondo replicable (Quick backdrop)
Los backdrop son utilizados para insertar fondos en nuestro escenario u objetos como plataformas y obstculos, no
se les puede asignar ningn tipo de movimiento y no son programables, solo los actives pueden interactuar con ellos
mediante colisiones.
Para agregar un backdrop hacemos click derecho en el escenario y seleccionamos la opcin "Insert object (insertar
objeto)", ahora buscamos el objeto "Backdrop" , lo seleccionamos y lo colocamos en el escenario. Podemos editar
el backdrop haciendo click derecho sobre el objeto y seleccionando "Edit", all podremos modificar el dibujo o cargar
una imagen para usarla como fondo, plataforma u obstculo.
Los Quick backdrop al igual que los backdrop sirven para agregar fondos a nuestro escenario o generar un degrad,
se utilizan especialmente para fondos o texturas replicables y son de mucha utilidad por ejemplo cuando
necesitamos replicar una textura de pasto por todo el escenario. En cuanto a programacin es lo mismo que los
backdrop, no son programables y solo los actives pueden interactuar con ellos a travs de colisiones.
Para insertar un Quick backdrop es igual que con el Active y el Backdrop, pero en este caso seleccionamos el objeto
"Quick Backdrop" , una vez ubicado en el escenario podemos configurar los distintos tipos desde las propiedades,
ya sea como color slido, gradiente o motivo (imagen replicable).
Contadores (Counter)
Los contadores (Counter) son objetos utilizados para crear puntuaciones, barras de vida, etc. Este objeto maneja
valores y se puede sumar, restar o definir uno determinado, dichos valores pueden interpretarse de forma numrica,
como barra (vertical u horizontal) o mediante iconos o grficos que representen lo que nosotros queramos, como
por ejemplo corazones para una barra de vida.
Insertar un contador es igual a los casos anteriores, pero esta vez seleccionamos el objeto "Counter" , una vez
ubicado en el escenario podemos configurar las propiedades como valor actual, valor mnimo y valor mximo,
tambin el tipo de contador, numrico, como barra, animacin, texto y dems propiedades.
Si queremos un contador personalizado debemos elegir el tipo animation y editar cada imagen, luego modificamos
los valores actual, mnimo y mximo segn lo queramos, para que funcione correctamente, al valor mximo
debemos asignarle el nmero de frames que tenemos en la animacin del contador.
Programacin (Event editor)
La programacin en Clickteam Fusion, a diferencia de otros programas de creacin de juegos, es sencilla y posee una
interfaz visual muy intuitiva y compacta.
Cmo trabaja?
El programa utiliza como programacin los "eventos", stos son sucesos que ocurren mediante una condicin y
terminan en una accin, siempre estn compuestos por condiciones y acciones, para dejarlo bien claro, hagamos
una comparacin con la realidad, imaginemos lo siguiente: "Un misil impacta contra un auto y lo destruye", en el
lenguaje del programa esto sera igual a "El misil colisiona con el auto (condicin)" y como resultado "el auto se
destruye (accin)". He aqu nuestro primer evento, sencillo no?
Antes de adentrarnos en los eventos explicar un poco los movimientos bsicos del programa.
Movimientos de los objetos
Si bien la mayor parte de la programacin la hacemos en el "event editor", el movimiento lo configuramos desde el
"frame editor" (en el caso de usar los que vienen por defecto), seleccionando el objeto y desde las propiedades en la
pestaa "movement" podemos asignarle uno de los movimientos de la lista por defecto que trae el programa. Al
elegir un movimiento podemos configurar las distintas opciones del mismo, como la velocidad, aceleracin,
desaceleracin, gravedad, etc.
Tambin podemos hacer movimientos personalizados sin necesidad de utilizar los que vienen con el programa, lo
podemos hacer programando todo de cero o utilizando algunas extensiones que nos facilitarn la tarea, por ejemplo
si queremos crear un movimiento de plataformas es recomendable usar el objeto "Platform movement", no
entraremos en detalle respecto a los movimientos personalizados ya que en esta gua se busca dar a conocer los
aspectos bsicos del programa.
Ahora voy a explicar cmo funcionan los movimientos bsicos para que tengan una idea.
Nota: Siempre es recomendable crear nuestros propios movimientos ya que los que vienen por defecto no tienen
mucha precisin y suelen causar problemas o ser obsoletos en programaciones ms complejas.
Static: Esta opcin no posee movimiento, nos sirve para dejar un objeto esttico en el escenario, como por
ejemplo monedas, cajas de municin, objetos coleccionables, etc.
Bouncing Ball: El movimiento clsico de la pelota que rebota, podemos utilizarlo para darle el movimiento a la
pelota de un juego estilo arkanoid o breackout.
Path: Con este movimiento el usuario puede trazar guas para que el objeto las siga, se puede cambiar la
velocidad de cada lnea y hacer que el movimiento se repita constantemente.
Mouse Controlled: Movimiento del objeto controlado por el mouse, este movimiento puede ser utilizado por
ejemplo, para controlar el pusher de un juego estilo air hockey a travs del mouse.
Eight Directions: Con este movimiento podremos controlar nuestro objeto con el teclado en 8 direcciones.
Race Car: Es til para crear movimientos de autos, nos permite controlar el objeto en 32 direcciones.
Actualmente es un movimiento algo obsoleto ya que no es preciso y solo posee 32 direcciones de los 360.
Platform: Movimiento especial para crear juegos de plataforma como Mario. Es recomendable no utilizarlo ya
que no es preciso en las colisiones, en su lugar es conveniente crear un movimiento personalizado con el objeto
"Platform movement".
Eventos bsicos
Vamos a utilizar el "Event editor" para ver algunas condiciones y acciones bsicas como las colisiones y destruccin
de objetos.
Colisin entre objetos:
Tenemos 2 objetos, los llamaremos "objeto A" y "objeto B" para diferenciarlos.
Al estar uno sobre el otro se produce lo que conocemos como una colisin.
Cuando esto pasa, podemos programar un evento para que mediante esta condicin se d lugar a una accin, como
por ejemplo destruir los objetos.
Para esto lo que tenemos que hacer es ir al "Editor de eventos (event editor)" y hacemos click en "New condition",
se abrir una ventana en la que vamos a seleccionar el "objeto A", hacemos click derecho y vamos a "Collisions" >>
"Another object" y finalmente elegimos como objetivo el "objeto B". Ya tenemos nuestra condicin, ahora
crearemos la accin, en la fila de la condicin que acabamos de crear vamos a la columna del "objeto A", hacemos
click derecho en la casilla vaca y seleccionamos la opcin "Destroy", hacemos lo mismo en la columna del "objeto B"
y listo, ahora cuando ambos objetos se superpongan (colisionen) se destruirn.
Pongmoslo en prctica:
Vamos al "Frame editor" y colocamos 2 objetos activos (Actives) en el escenario, en este caso un Misil y un Auto.
Pueden descargar los grficos desde este link: [Link]
Seleccionamos el Active "Misil", le asignamos el movimiento "Bouncing Ball" y ajustamos la direccin inicial a la
derecha.
Ahora vamos al "Event editor" y aplicando lo aprendido anteriormente hacemos que al colisionar el objeto Misil con
el Auto, se destruyan.
Probamos la aplicacin haciendo click al botn "Run application" o presionando la tecla F8, si hemos hecho todo
correctamente, el misil debera moverse en direccin hacia el auto, colisionar con el y destruirlo.
Algunas condiciones bsicas:
La condicin [Start of Frame] es til para acciones que necesiten dispararse inmediatamente al iniciar el nivel, por
ejemplo, cargar datos, reproducir msica de fondo, crear objetos, etc.
Para crear una condicin [Start of Frame] clickeamos en "New condition", hacemos click derecho en el objeto
"Storyboard controls" y seleccionamos [Start of Frame].
[Always] es una condicin que se reproduce infinitamente a diferencia de [Start of frame] que solo se dispara al
iniciar el nivel, esta condicin se ejecuta constantemente por lo que debemos usarla con precaucin y para acciones
que necesiten estar siempre activas, por ejemplo, hacer que un objeto se posicione en base a otro, que un enemigo
vaya en direccin hacia el personaje, etc. No debemos usarla para acciones que se repitan y se puedan superponer
como por ejemplo, reproducir un sonido, crear objetos, etc, ya que no obtendremos un buen resultado y puede
afectar al rendimiento del juego.
Para crear una condicin [Always] clickeamos en "New condition", hacemos click derecho en el objeto "Special"
y elegimos [Always].
[Every] es una condicin que se ejecuta indefinidamente cada cierto tiempo, segn el valor que asignemos,
podemos hacer que sea cada X milisegundos, segundos, minutos u horas y es til para acciones que necesiten
ejecutarse continuamente pero con un intervalo de tiempo, por ejemplo, crear objetos cada X segundos, hacer que
un objeto se mueva cada tanto, etc.
Para crear una condicin [Every] clickeamos en "New condition", hacemos click derecho en el objeto "The timer"
y elegimos [Every], luego configuramos los valores de tiempo segn lo queramos.
Sonidos
El audio es una parte importante de nuestro juego ya que contar con buenos sonidos y msica har que nuestro
juego se destaque y sea ms entretenido al jugarlo.
Solo para que tengan una idea voy a explicar muy brevemente los distintos tipos de sonidos que podemos
diferenciar tanto en la vida real como en las pelculas y tambin en los videojuegos. Podemos dividirlos en 3 tipos.
Efectos: Son todos los sonidos directos que surgen de acciones, por ejemplo, saltar, recoger una moneda, disparar,
explosiones, etc.
Ambiente: Es todo lo procedente de fuentes externas o internas de forma no directa, o sea los sonidos que se
escuchan de fondo, pueden ser por ejemplo, lluvia, el sonido del viento, el ruido del trfico, etc. Suelen ser sonidos
que pasan desapercibidos pero que le dan una atmosfera ms atrapante a nuestro juego.
Msica: La msica hace ms entretenido e inmersivo a nuestro juego, es la meloda que suena de fondo y podemos
utilizarla para acompaar distintas escenas, ya sean dramticas, de batalla, de armona, etc.
Utilizando sonidos en Clickteam Fusion
En Clickteam Fusion manipularemos y haremos que se reproduzcan los sonidos desde el "event editor".
Para importar y agregar un sonido a un evento vamos al "event editor" y en la fila de nuestro evento vamos a la
columna del objeto "sound" , hacemos click derecho en la casilla vaca y veremos 2 opciones, "samples" y "music",
utilizaremos tanto para efectos como para la msica la opcin "samples" ya que es la que soporta ms formatos de
audio. En el men de "samples" veremos una amplia lista de opciones, en este caso solo utilizaremos 2, para los
sonidos que solo se reproducirn una vez cada vez que se cumpla el evento vamos a elegir "Play sample", si
previamente hemos importado sonidos elegimos uno de la lista o importamos uno nuevo haciendo click en el botn
"browse" (from a file), en el caso de las msicas o sonidos de ambiente que deban reproducirse indefinidamente
utilizaremos la opcin "Play and loop sample" y luego indicaremos cuantas veces queremos que se reproduzca el
sonido, en este caso ser continuamente por lo que colocaremos 0 (cero) como valor.
Tengan en cuenta que a la hora de utilizar sonidos deben ir en eventos rpidos, o sea que tengan un inicio y final
inmediato, por ejemplo [Start of frame], [Colisin entre objeto A y B], etc y no en eventos que se ejecuten
indefinidamente o sean prolongados como por ejemplo el evento [Always] entre otros, esto es para evitar que los
sonidos se superpongan y suene mal.
Sugerencias
Para los efectos de sonido lo ideal es hacerlo en eventos rpidos o inmediatos como por ejemplo, [Colisin entre
objeto A y B], al [Presionar una tecla], etc y de accin con "Play sample" hacemos que se reproduzca el sonido que
corresponda.
Para reproducir msica o sonidos de ambiente podemos utilizar eventos como [Start of frame] y de accin "Play and
loop sample" para que la msica o sonido ambiente se reproduzca indefinidamente al iniciar el nivel.
Ahora que saben cmo importar y agregar sonidos vamos a ponerlo en prctica, para ello van a utilizar el proyecto
que han hecho previamente y en el evento en donde el misil colisiona con el auto [Colision between Misil and Auto]
van a agregar el sonido de una explosin, una vez hecho prueban la aplicacin y si todo est correcto se reproducir
el sonido de explosin cuando el misil colisione con el auto.
Sonido de explosin: [Link]
"Ahora que han aprendido lo bsico del programa pueden visitar la web [Link] e intentar hacer alguno
de los tutoriales, siempre empiecen por lo ms simple y vayan avanzando de a poco, nunca vayan directamente a lo
difcil."
Pueden descargar el archivo del tutorial terminado desde este link: [Link]
Hasta aqu llega esta mini gua de inicio que he realizado con el fin de que aprendan lo bsico y se familiaricen con el
programa para que a la hora de profundizar en el mismo se les haga ms fcil y puedan hacerlo de manera correcta.
Gua creada por Sergio (Administrador) para MMF Zone
