[video:prototype]
Antes de comenzar a crear tu app es muy importante que tengas claro cómo quieres que sea: cuántas pantallas tendrá, qué diseño tendrá cada pantalla, como navegarán los usuarios de una pantalla a otra, etc. Deberías crear un prototipo de tu app. Al hacer tu prototipo te surgirán dudas sobre la estructura, el diseño, el contenido, etc., y harás multitud de cambios mientras lo diseñas. Además, el prototipo te servirá para mostrar a tus clientes una maqueta no funcional de tu app para que la validen o sugieran cambios. Es mucho más fácil realizar estos cambios sobre un prototipo que luego cuando estés desarrollando la app.
Existen muchas técnicas para crear un prototipo, debes utilizar la que más cómoda te resulte, aunque siempre es bueno empezar por alguna de las técnicas más tradicionales:
- Lápiz y papel
Antes de empezar una app, puedes diseñar en un papel cómo será cada pantalla y hacer líneas entre las pantallas para definir la navegación entre ellas. Es preferible que utilices lápiz y no bolígrafo, pues si quieres hacer algún cambio es más fácil de borrar.
- Post-it y pizarra blanca
Utiliza post-its rectangulares (notas adhesivas), pues tienen un formato similar al de los smartphones. Cada uno emulará una de las pantallas de tu app. Dibuja todas las pantallas de tu app sobre los post-it. Pega las pantallas sobre la pizarra y dibuja en la pizarra flechas que conecten las pantallas. Lo bueno de este método frente al anterior es que puedes borrar y hacer cambios con mucha facilidad, pues los post-its los puedes despegar y volver a colocar en otro sitio si así lo consideras necesario.
Si solo necesitas el prototipo para tener claro cómo quieres hacer la app y optimizar el tiempo de desarrollo, con las técnicas anteriores tendrás más que suficiente. Hazle una foto a la pizarra para recordar la estructura de la app.
Pero si necesitas que tu equipo o tu cliente revise la estructura y diseño de la app antes de ponerte a desarrollarla, seguramente necesitarás más que una foto de la pizarra. Existen herramientas para hacer este tipo de prototipos, conocidos como wireframes, a través del ordenador, desde un simple documento PowerPoint hasta herramientas más especializadas como balsamiq o invision. La ventaja es que en estos otros formatos te será más fácil enviar tu prototipo a tu equipo o tus clientes e incluso podrán añadir comentarios.
El último paso, en caso de que necesites mostrar a alguien algo más parecido a la app final o comprobar que la navegación es la que tu app necesita, es hacer fotos de tus post-its, lo que hayas dibujado en papel o algo que hayas diseñado con el ordenador), y montar con ello una maqueta funcional de la app.
Con Mobincube puedes crear estas maquetas muy fácilmente, haciendo uso de las pantallas action image. Simplemente crea una app nueva, sube todas las imágenes (los post-its) al gestor de recursos y crear una pantalla de tipo “Imagen interactiva” con cada una de las imágenes. Define en ella áreas clickables sobre las zonas donde haya botones y haz que conecten con las pantallas correspondientes. En unos minutos podrás descargar en tu smartphone o tablet una maqueta funcional que servirá a tu equipo o tu cliente para comprender el funcionamiento de la app. O también puedes crear maquetas más avanzadas con las pantallas de tipo “detalle”, por ejemplo, las barras, los temporizadores, etc.
Related articles:
Entender el interfaz de Mobincube
[what_is_screen]
[screen_actionimage]
[what_is_bar]
[screen_detail]