Cómo crear un videojuego (o APP) desde cero #5: Maqueta tu proyecto

mockup01

Realizando la maqueta de tu proyecto

Cuando ya tienes el GDD y un gameflow de tu proyecto es el momento de meterte de lleno a darle forma verdadera a tu juego o aplicación. Se que te mueres de ganas por ponerte con el arte y  la programación, pero antes es VITAL que tengas una maqueta de tu proyecto.  Lets go!

Para mi esta parte del proyecto es de las más importantes de todo el proceso de creación. Ya tenías los cimientos y ahora es el momento de añadir los pilares maestros. Así que por favor NO ESCATIMES ESFUERZOS en el mockup (también se les llama “wireframe”s o simplemente “maquetas”).  El mockup se utiliza para la demostración y evaluación del diseño.

mockup02

Para que sirve

Su aportación más importante es plasmar físicamente algo que únicamente tienes en la cabeza. Al hacerlo comenzarán los problemas 🙂 Quizá pensabas que sería más sencillo de usar, que las mecánicas del juego serían más fáciles, o que en la pantalla quedaría algo de hueco libre y resulta que lo has llenado todo de botones. No pasa nada, modificar el mockup apenas tiene coste y es muy fácil, haz cuantos cambios necesites ahora.

Por donde empezar:

1. Herramienta de creación de mockups

Lo primero es conseguir una herramienta de creación de mockups. Puedes hacer una primera versión a mano, pero recomiendo que después lo lleves a digital. El escenario final será digital por lo tanto es mejor que te manejes en el medio.

Personalmente me gusta usar la herramienta “MockFlow“, pero existen infinidad de herramientas para el proceso, “Balsamiq” es quizá una de las más famosas,  Google te dirá otras 1000 😉

mockup03

2. Comienza por el principio

Comienza a dibujar todas las pantallas de tu juego una a una  a lo cutre 🙂  Hacer un mockup es plasmar el diseño y la usabilidad de cada página de manera sencilla, sin invertir apenas tiempo, con el objetivo de comprobar que realmente todo funciona y se coloca como debería. Por ejemplo este sería el mockup de un juego de cartas en iPhone:

Como puedes ver ahora no estamos trabajando para que quede bonito, simplemente queremos colocar todos los elementos  en las posiciones que deben estar. ¡Es importante colocar TODOS los elementos! Puedes ver en la imagen que se añade por ejemplo un botón de “cerrar”, esa es precisamente la esencia de esto: se debe añadir todo. No vale aquello de “más o menos será así“, debes pensar bien los elementos que tendrán las pantallas y añadirlos TODOS. Esa es la función. Ese motivo nos lleva al punto 3.

3. Pruébalo

Si algo me gusta de “MockFlow” es precisamente que permite crear “enlaces” y “botones” de manera sencilla permitiendo probar realmente el prototipo. Por ejemplo, si al pulsar sobre el botón “cerrar” me debe llevar a la home de la aplicación, en mi maqueta añadiré un link a ese botón creado que enlaze a la home. Esto me va a permitir PROBAR DE VERDAD el juego (a un nivel muy básico) antes de ponerme a escribir código o empezar con el arte.

 

El resultado

Al final tendrás todas las pantallas de tu juego en un enorme dibujo. Lo bonito de esto es que las páginas enlazarán al lugar donde deben ir, y que contendrán todo la información que deben contener. Podrás probar realmente tu aplicación antes de ponerte a escribir código y eso te ahorrará cientos de horas de programación y de arte.

Mira, siento decirte que esto de los mockups es una tontería, no es para mi

Creeme, no es una tontería. Ten en cuenta que el método que escogimos para la creación del juego fue un método ágil donde la burocracia es casi inexistente precisamente para que te pongas cuanto antes a crear el proyecto de verdad. Pero una maqueta (mockup) forma parte de eso, y es vital. Si no lo haces te pasará lo siguiente:

  • Tendrás una pantalla casi terminada y descubirás que le faltan 3 botones. Ya no caben más botones, así que te toca tirar esa pantalla a la basura y volver a empezarla.
  • Resulta que ese pantalla que acabas de tirar se utiliza como base en otras 5 pantallas más, por lo tanto, tendrás que cambiarlas también.
  • Al modificarlas descubres que la usabilidad de tu aplicación ha cambiado de manera profunda (por ejemplo,  has tenido que añadir un TabBar que al principio no existía) con lo vas a tener que cambiar TODA la aplicación ¡Ahora que ya tenías la mitad de juego montado!.

Se que esto puede parecer algo exagerado, pero es un caso real con un proyecto real. Lo prometo. Así que ya sabes:

¡Dibuja un precioso y profundo mockup de tu juego o aplicación!

Anuncios

3 responses to “Cómo crear un videojuego (o APP) desde cero #5: Maqueta tu proyecto”

  1. Kapde says :

    Voy a pelearme un poco con esto hoy que tengo un rato 🙂

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: