Image may be NSFW.
Clik here to view.
A la hora de crear los prototipos de tus Apps hay multitud de opciones, como ya os contamos en Louesfera. Hoy quiero hablar de la opción que elegí yo. Hablaremos de Codiqa y su herramienta online para prototipado de Apps. Como vais a ver, es una utilidad muy sencilla pero muy efectiva para plasmar nuestras ideas en forma de interfaz.
¿Por qué Codiqa?
De entre todas las opciones que barajé, Codiqa era la que más convenía a mis necesidades. Buscaba algo sencillo, fácil de utilizar y obtener resultados visualmente atractivos. Y, pese a la simplicidad de la App que yo tenía que prototipar, quedé satisfecho con el resultado. La cantidad de opciones que ofrece Codiqa se ajusta perfectamente a lo que se puede necesitar a la hora de dar las primeras pinceladas a nuestra interfaz. Además, la idea de usar una herramienta desarrollada por dos jóvenes emprendedores (Max Lynch y Ben Sperry) era otro aliciente.
Lo primero que destaca de Codiqa es que es completamente HTML5 con jQuery Mobile, lo que quiere decir que su utilización es totalmente intuitiva y fundamentalmente a través de arrastrar y soltar. Además, el código generado es totalmente utilizable a posteriori, algo que nos evitará mucho trabajo de desarrollo.
Creando nuestra interfaz con Codiqa
Tenemos la posibilidad de probar gratuitamente Codiqa durante 15 días, período totalmente aceptable visto lo rápido que se pueden ir generando los primeros esbozos de nuestros proyectos.
La interfaz, accesible desde nuestro navegador web, está bastante cuidada y organizada. A la izquierda encontramos el panel de botones y componentes listos para ser usados así como las páginas (pantallas) que vamos creando. En la parte superior tenemos el acceso a las opciones de descargar el código, compartir y los modos construcción y test, conmutables mediante un deslizador.
Lo primero a definir es la “pantalla” sobre la que queremos trabajar. Podemos seleccionar prácticamente cualquier tamaño de pantalla existente en el mercado. Las pantallas de los dispositivos iOs están evidentemente incluídas. Una vez seleccionado el tamaño deseado, tan sólo tenemos que ir creando nuestra interfaz añadiendo botones, opciones, imágenes y todo lo que queramos para ir generando las sucesivas pantallas de nuestra interfaz.
Image may be NSFW.
Clik here to view.
Cada elemento que insertamos es potencialmente editable desde la ventana que aparece a la derecha de la pantalla. Podremos modificar color, textos a mostrar, iconos, transiciones, enlaces a otras pantallas y otra multitud de cosas. Para crear el efecto interactivo de los botones, basta con crear enlaces entre páginas creadas. En cuanto os queráis dar cuenta, tendréis una primera aproximación de interfaz de vuestra futura App delante de vuestros ojos. Gracias a las transiciones entre pantallas el aspecto visual está bastante logrado. A este efecto se suma también la posibilidad de usar plantillas CSS para cambiar el aspecto de nuestra App.
La posibilidad de intercalar rápidamente entre los modos de trabajo y de test, permite un control constante de los cambios producidos y su efecto real sobre nuestra maqueta. Para terminar, en la parte inferior de la interfaz de Codiqa tenemos un Inspector para el código HTML que se va generando automáticamente.
Las tarifas de Codiqa
Como he comentado, tenemos la posibilidad de usar Codiqa durante 15 días sin coste alguno. Más que suficiente para crear varios prototipos y ver si nos convence como herramienta o no. Después, las cuentas de pago permiten tener más capacidad de almacenamiento multimedia, mayor número de proyectos que podemos crear, o aumentar el número de personas que trabajan en un mismo proyecto. Los precios van de 24$/mes hasta los 99$/mes de la versión más completa.
Mas info | Codiqa
Twitter de los desarrolladores | @helloimben y @maxlynch