Illustrator/Sketch Vs Photoshop

izaskunsaez Consejo, diseño, software, User Interface, Workflow 4 Comments

Recuerdo los comienzos en las Facultad de Bellas Artes, donde empecé con esto del diseño. Allí teníamos acceso a unos mac viejísimos y lentísimos, donde el Freehand, el Photoshop y el QuarkXPress petaban el ordenador de tal forma que entonces sí que teníamos tiempo de reflexionar sobre los proyectos y tomarnos tiempo para hablar y tomar un café intercambiando impresiones; ahora todo es tan rápido, que apenas da tiempo a pensar qué tecla apretar.

Después de unos cuantos años, después de desarrollar muchos proyectos y de pasar muchas horas frente a la pantalla, puedo asegurar que mi agilidad diseñando con programas de tipo vectorial (illustrator, sketch, ink) es inmensamente mayor que en el entorno que me ofrece Photoshop.

Mi día a día se divide en uso de 80-90% programa vectorial y un 10% Photoshop. Aunque he de reconocer que la mayoría de los días es 100% Illustrator, Sketch o Indesign.

¿Por qué?

Desde hace tiempo desarrollo muchos proyectos relacionados con el diseño de interfaces: aplicaciones móviles y diseño web; y aunque Photoshop se ha puesto las pilas para adecuar su interfaz (o entorno de trabajo) a este tipo de necesidades, pero desde mi punto de vista, siguen faltando puntos clave que programas como Illustrator o Sketch si ofrecen.

Para mí, los principales puntos fuertes son:

– Múltiples mesas de trabajo: Soy incapaz de diseñar una app o web visualizando únicamente una sola pantalla al mismo tiempo. Como diseñadora necesito saber en todo momento las interacciones entre pantallas para asegurarme de que la coherencia entre las transiciones asegura una buena experiencia de usuario y usabilidad. Esto me lo permite hacer tanto el Illustrator como Sketch.

 

sketchapp-before

Desde Enero estoy trabajando de forma remota, para una empresa en Bilbao como diseñadora ui/ux y recuerdo que cuando llegué y me enseñaron los proyectos, estaban todos en photoshop, por lo que, lo 1º que les dije es que yo no trabajaría así por una cuestión de agilidad y de lógica (propia),  le expliqué a la diseñadora que estaba entonces, el por qué de mi predilección por los programas vectoriales, ella enseguida lo entendió y además le interesó ese punto en el cual gracias a las mesas de trabajo múltiples, puedes controlar el diseño de interfaces de una forma mucho más precisa.

– Los objetos fuera de las mesas de trabajo: Personalmente, creo que este punto es el que ofrece una experiencia de usuario lo más cercana posible  a trabajar en una mesa real. Si estás dibujando o escribiendo de forma tradicional (osea, a a mano) tu atención está focalizada en lo que estás haciendo, en el papel que tienes delante en ese momento, pero puede que tengas muchas cosas fuera de ese papel, puede que tengas un montón de anotaciones, un cuaderno con un dibujo, unas notas en un folio… De esta forma, aunque estés centrado en la tarea que tienes justo delante, puedes dejarte de forma astuta los elementos que te ayuden a crear el elemento principal.

illustrator-txorotxori

En esta imagen puedes ver varias mesas de trabajo y elementos fuera de ellas.

Trabajar con programas como Illustrator y Sketch me ayuda inmensamente en estas tareas concretas:

  • Visualizar el diseño en las diversas resoluciones y tamaños de Android, iOS o web
  • Ver de forma clara la interacción entre pantallas. Esto me permite detectar errores durante el proceso, ahorrando el sobrecoste de invertir más horas de posterior revisión.
  • Tener un visión global del workflow.
  • La agilidad de poder diseñar/dibujar en cualquier área aunque no sea dentro de una mesa de trabajo.

Un truco: yo utilizo la captura de pantalla para hacer los primeros journey maps de las apps o web.

illustrator-litell

Si se trabaja de forma metódica y ordenada, el diseño puede cumplir la función de presentar la propuesta de Look & Feel al cliente, además de vigilar la interacción entre pantallas desde el primer momento.

Para terminar, os dejo el enlace a este post: Illustrator Vs Photoshop, que me ha parecido muy interesante, sobre todo para aquellos que no conocéis muy bien la diferencia entre trabajar con un software u otro.

 

 

Comments 4

  1. Buen post! Llevo tiempo intentando encontrar la ventaja de trabajar con Photoshop en diseño web y aplicaciones móviles, pero tras la lenta desaparición de programas como fireworks me cuesta adaptarme a pensar con Photoshop. El hecho de trabajar con vectores es mucho más sencillo para los diseñadores de papel y lápiz y para minimizar problemas de resolución en pantallas retina que exigen formatos más versátiles y adaptables. A mi personalmente me recomiendan exportar los elementos de página vectorizados en PDF para utilizarlos en Xcode y aprovechar más las ventajas de este tipo de formato.
    Salut!

    1. Post
      Author

      ¡Hola Javi! no conocía eso de exportar a PDF para el Xcode ¡tengo que investigarlo!
      Si has trabajado con fireworks sin duda es más fácil que te adaptes al sketch o illustrator que a photoshop., pero oye, quien sabe ¡todo es ponerse!
      Gracias por tu comentario y por la info 🙂

  2. Artículo interesante Izaskun, gracias! Para mi Illustrator, y antes Freehand, me ha parecido super versátil para hacer los diseños de interfaces y de webs.

    1. Post
      Author

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *