Prototipando apps con Sketch
Seguimos con nuestra serie de entradas dedicadas a programas para prototipar apps. Hasta ahora hemos reseñado Proto.io, Marvel e InVision. De los tres programas, el único que nos va a permitir poder crear las pantallas de nuestros prototipos es Proto.io. Tanto Marvel como InVision requieren que el usuario haya creado previamente el diseño de las pantallas en otro programa. Por este motivo, el programa que reseñaremos hoy no es explícitamente un programa para prototipar apps, sino que es un programa que puede usarse para tal fin pero también para muchos otros: Sketch.
Sketch para prototipar apps
Sketch es un programa que cuesta 99$ y que existe solamente para usuarios de Mac. Ya en la propia web del programa podemos ver un ejemplo de diseño realizado en Sketch que es, precisamente, el diseño de una app.
¿Cómo podemos usar Sketch para prototipar?
Podemos empezar descargándonos los freebies que hay disponibles para prototipar apps de diferentes sistemas operativos. En la web Sketch App Sources encontraremos diferentes paquetes de plantillas que podremos usar en Sketch para prototipar apps. Encontramos, por ejemplo:
No sólo encontramos recursos de diseño de interfaz, sino que también encontraremos prototipos de diferentes dispositivos móviles. De esta manera, podremos colocar, si nos interesa, una pantalla ya diseñada en un prototipo de dispositivo y así poder mostrarle una imagen más cercana a la realidad al cliente o al equipo.
Exportando nuestros diseños
Una vez hayamos diseñado las pantallas de nuestra app en Sketch, podemos exportarlas e importarlas luego en un programa tipo InVision o Marvel (incluso Proto.io) y a partir de ahí con esos programas podemos empezar a diseñar transiciones animadas, jerarquías entre diferentes pantallas, cambios de estado, feedback de la app… Os aconsejamos que visitéis este enlace del blog de InVision en el que se detallan con vídeos diferentes consejos a la hora de diseñar prototipos con Sketch.
¿Y por qué no usar Photoshop?
En primer lugar, podríamos hablar también de la herramienta Fireworks de Adobe. Desgraciadamente, Fireworks es un producto que lleva descontinuado ya por más de 2 años, por lo que aunque podamos seguir usándolo, no es la mejor estrategia si queremos adaptarnos continuamente a este mundo cambiante. Entonces… nos queda Photoshop. El problema de Photoshop es que no es un programa que haya sido creado para diseñar UX/UI. Sketch es un programa ágil, rápido y que ha sido pensado adrede para esta nueva era de diseño. Photoshop, en cambio, es un programa ‘antiguo’ (que arrastra cosas del pasado, digamos) y que fue pensado para procesar imágenes. Con Sketch podemos trabajar con vectores sin problemas, también con píxeles. En Sketch tenemos también ‘smart guides’ que nos ayudan a diseñar mejor… entre otros muchos recursos que nos ayudarán a diseñar de una manera más ágil y mejor nuestros prototipos.
Probadlo y no os arrepentiréis.
