Los diseñadores de apps tienen un propio set de herramientas para su proceso de diseño. Javier ‘Simón’ Cuello (@millonestarde), coautor de Diseñando apps para móviles y creador de Diseño en viaje, nos presenta aquellas que más usa al diseñar una app.
Las apps está tan en boga que últimamente parece que surgen nuevas herramientas para ayudar en su diseño, casi cada día. Personalmente, siempre estoy dispuesto a intentar cambiar y abandonar los programas que uso, si una nueva opción me permite trabajar más rápido o conseguir mejores resultados.
Al final, se trata del famoso ‘salto de fe’ que debemos dar cuando queremos mejorar nuestro proceso de diseño, aún sin saber si el cambio reportará beneficios que valgan la pena en el largo plazo. Por mi parte, el cambio más grande lo hice cuando dejé de usar la suite de Adobe y me pasé a una serie de herramientas independientes de distintas empresas. Ahora, mirando hacia atrás, siento que fue una buena decisión.
Como una nota aparte, y como un hecho al que deberíamos prestar atención, las herramientas que han aparecido recientemente parecen estar más enfocadas en el diseño de prototipo de animaciones, como Pixate o Principle.
Más allá de eso, las que te presento a continuación son las que considero que son muy útiles para ayudarte a diseñar una app, aquellas que en mi caso utilizo prácticamente a diario y que te pueden servir para cambiar tu forma de trabajar y mejorar tus diseños.
1. POP
En las primeras etapas del proceso de diseño de una app, cuando hay poco más que esa idea revolucionaria dibujada en una servilleta, POP cumple un rol importante. Permite obtener fotografías de los wireframes dibujados en papel y añadir interacción con vínculos, gestos y transiciones.
De esta forma, aunque apenas tengamos una idea inicial de la aplicación, ya podemos construir un prototipo básico que podemos probar nosotros mismos y con otras personas, para ir validando el concepto y la funcionalidad inicial. Si todo va más o menos bien, podremos avanzar en el proceso de diseño con más confianza en nuestro trabajo, que ya habrá pasado su primera prueba de fuego.
+info: https://popapp.in
2. Sketch
Nunca me sentí muy cómodo usando Photoshop para diseño de interfaces. Suena un poco a ‘pecado de diseñador’, pero la verdad es que siempre me ha parecido que la infinidad de opciones que tiene, a veces, entorpecen el trabajo más que colaborar en el flujo de un proyecto.
Amante confeso de Fireworks, se me rompió el corazón cuando Adobe decidió discontinuarlo. Entonces apareció Sketch, con un timing perfecto. Desarrollado por una pequeña empresa de Holanda y recién lanzada su versión número 3, su foco en diseño de UI y simplicidad de uso, están haciendo que gane un lugar importante en la comunidad de diseñadores de apps.
Además de las funciones esenciales, Sketch permite instalar plugins desarrollados por otros usuarios que extienden la función básica con interesantes complementos. Por ahora, la principal desventaja es que sólo viene para Mac, y por el momento no hay planes de llevarla a Windows.
+info: http://bohemiancoding.com/sketch
3. Pttrns
En algunas ocasiones, me siento bloqueado sobre cómo resolver una determinada pantalla de una app. Una práctica habitual en esas situaciones es buscar el teléfono y empezar a explorar para ver cómo otras apps están resolviendo un problema similar.
Para cuando no se tiene el smartphone a mano, Pttrns viene muy bien. Presenta una colección de pantallas de aplicaciones de iOS y Android, y agrupadas por categorías para que podamos buscar inspiración más fácilmente. Aunque empezó como un pequeño proyecto personal, se mantiene actualizado constantemente, incorporando incluso pantallas de Apple Watch. ¿Qué tal, eh?
+info: http://pttrns.com
4. Skala Preview
A medida que voy diseñando, no puedo dejar de probar lo que voy haciendo en un dispositivo real. No me puedo fiar solamente de lo que veo en el ordenador, así que necesito algo más que me permita comprobar cómo van las cosas. Con Skala puedo ver mis diseños en la pantalla del móvil y asegurarme que los tamaños, los contrastes y la diagramación general están en línea con lo que tengo en mente.
Skala Preview viene para Android y iOS, y funciona instalando tanto el cliente de escritorio como la aplicación en el móvil, que funcionan conectados entre ellos, como buenos hermanitos. Además, hay un plugin para Sketch que te deja pasar de la herramienta original, Sketch Mirror, y usar esta alternativa gratuita. Así es… ¡hay que ahorrar en todo!
+info: https://bjango.com/mac/skalapreview
5. InVision
Cuando ya he pasado por Sketch, y siguiendo el proceso de diseño de una app, llega la hora de construir un prototipo más realista, sobre todo para poder compartir con el resto del equipo, mostrar qué es lo que tengo en mente y asegurarme que todos estamos en la misma página.
InVision permite subir archivos con las imágenes de nuestras pantallas (incluso sincronizado con Sketch), y además de dejarnos construir un prototipo funcional, el resto del equipo podrá entrar al proyecto para dejar sus comentarios e impresiones. Incluso podrán recibir un enlace a su móvil con el proyecto, que hará parecer que la app está casi terminada, aún cuando quede mucho trabajo por delante.
+info: http://www.invisionapp.com
_
Claramente, éstas no son todas las herramientas que hay, pero creo que sí son aquellas fundamentales que te ayudarán bastante en cada una de las etapas de tu camino diseñando una aplicación. Aunque las elecciones siempre son personales y dependen de cada quien, para mí son imprescindibles y las uso casi a diario.
Algunas de ellas tienen alternativas, y hay tantas opciones por ahí dando vueltas (y aparecen nuevas cada día), que en uno de esos fines de semana sin plan, me decidí a crear Prototyping Tools, una especie de compilado con herramientas para prototipar. La lista empezó con apenas unas pocas, ¡y ahora hay un montón!
Sea cual sea la que elijas, tu decisión dependerá en parte de lo cómodo que te sientas con ellas, la curva de aprendizaje o la complejidad del prototipo que puedas lograr, por ejemplo.
Sólo te recomiendo que pierdas el pánico a probar alternativas nuevas. A veces, por no hacer el esfuerzo de aprender, uno sigue usando programas de diseño que están lejos de ser lo ideal. Lo mismo me pasó con Sketch, y meses después de haberme lanzado a usarlo cada día, puedo entender el tiempo que me hizo ahorrar.
Ahora me toca dar el salto para otro tipo de herramientas, algo más complejas, como Origami, Form o Framer. Para ya hablaremos de eso más adelante. Por ahora, cuéntame cómo te va con las opciones de esta lista.