Desde que me dedico a esto he pasado por todo el espectro que ofrece Adobe con el que poder diseñar interfaces, básicamente Photoshop, Illustrator y Freehand (llegué a este mundillo justo cuando se cargaron Freehand así que no tuve necesidad de reconvertirme), todos con sus pros y sus contras:

  • Photoshop. Pro: se puede hacer de todo con él y por supuesto incluye herramientas necesarias para diseñar y recortar interfaces. Además, no te van a faltar toneladas de recursos en internet: tutoriales, técnicas, pinceles, brochas, etc. Contra: Al ser en origen una app de edición fotográfica, está más pensada para trabajar con capas que con las formas que la contienen. Aunque tiene un método de selección directa, esta característica puede acabar siendo un lastre en tu productividad.
  • Illustrator. Pro: Trabaja con vectores, lo que es ideal para redimensionar ahora que una app para Android tiene que contemplar de tres a cuatro resoluciones más las dos que hay que preparar para iOS. Además te permite interactuar directamente con los objetos que dibujes a cambio de que dejes de pensar en capas. Contra: es un programa enorme y muy pesado. Y en cuanto trazas los sectores para exportar los diferentes elementos de la interfaz, empieza a moverse como un hipopótamo con artritis. A mayores, es insufrible para afinar la conversión de los vectores a píxeles en busca del ansiado ‘píxel perfect’.
  • Fireworks. Pro: Trabajas con vectores pero siempre con la web en mente, en ningún momento dejas de ver los píxeles y además tiene funciones de ‘ajustar a pixel’ que funcionan de manera decente. Contra: a nivel de interfaz parece anclado en el pasado, herencia directa de la antigua Macromedia, dejando una interacción que ralentiza mucho el flujo de trabajo.

¿Qué aporta Sketch?

Sketch es una herramienta de dibujo vectorial para Mac con tres puntos fuertes:

  • Precio: 70€. No, no es dinero para un software de diseño que te permite agilizar tu flujo de trabajo.
  • Reutilización:  Se pueden definir estilos de texto aplicados en cualquier elemento para ser reutilizados en cualquier momento. De manera parecida se pueden agrupar determinados elementos y convertirlos en un símbolo. Por supuesto, puedes hacer esto con los otros programas, pero en ninguno están tan bien integradas con tu flujo de trabajo. Si en una instancia particular de tu símbolo o estilo descubres que deberías modificar algo, se actualizará en vivo a todas las instancias del mismo estilo o símbolo.
  • Exportar: Cuando diseñas una interfaz, después de pintar cada pantallas, para pasar a producción se deben extraer los diferentes elementos de manera individual para que en programación se puedan aplicar como apariencia de cada componente. Aislar estos elementos obligaba a una tediosa fase de trabajo que te tenía varios días definiendo sectores, encendiendo y apagando capas. Además, para aplicaciones móviles te veía obligado a redimensionar estos gráficos para tenerlos listos para todas las resoluciones. En cambio, en Sketch, cada elemento cuenta con propiedades de exportación que podrás definir a tu gusto: nombre, cuántas copias y con qué tamaños necesitas de cada elemento. Si vas definiendo esto a medida que creas cada elemento, luego te hace la exportación de todos los gráficos de una sola vez, ahorrándote algún que otro día de trabajo
    Captura de pantalla 2014-07-27 a la(s) 12.25.29
    Insertar y exportar símbolos. Lo mejor de Sketch en una imagen.

    .

La verdad es que resulta difícil escribir sobre ello, porque el cambio es algo que se siente. Si te dedicas a esto, dale una oportunidad a la prueba gratuita. Es un programa nuevo, al principio te sentirás más torpe, pero en cuanto veas cómo agilizas tu flujo de trabajo de cara a la producción de tus diseños no querrás usar otra cosa.

Únete a la conversación

5 comentarios

  1. Cuidado, que el programa no cuesta «solo» 70 euros… cada actualización vas a tener que pagarla a parte… ;). Eso si, creo que merece la pena.

    1. El «solo» (o «sólo», no lo sé. Si Zapato a la Cabeza está leyendo esto, no me mates ^_^) No era porque sea precio cerrado sino por comparación por lo que cuestan otros programas de Diseño. En particular los de adobe.

      1. Si, la verdad que el precio está genial comparado con otros programas de diseño… A todos los diseñadores que conozco que lo han probado al final se han pasado a sketch… yo lo uso pero como programador… es decir, casi nada, pero es muuuucho más fácil e intuitivo que cualquier otro.

        He oído que google está «detrás» de ello participando en el desarrollo, así que es aún más interesante con eso.

        1. No tenía ni idea de que Google andaba en el ajo pero tiene todo el sentido. Precisamente hablaba con Husky el otro día de que por lo general hacen falta muchas herramientas para optimizar flujos de trabajo en el diseño.

  2. Hola Raul

    Gracias por darle una oportunidad a Sketch, nos alegra mucho que te guste : )

    Sobre el comentario de Google… es la primera noticia que tenemos : ) ¿Dónde habéis oído ese rumor?

    Un saludo

    Ale — Bohemian Coding

Dejar un comentario

Deja un comentario