Tras varios años de trabajo como diseñadores online vamos encontrando nuestro modelo perfecto de flujo de trabajo. Quiero compartir con vosotros el que a mi mejor me funciona. Por lastima no siempre se dispone del tiempo o los recursos necesarios para poder llevarlo a cabo. En mi propia experiencia, cuando sigo estos 10 pasos, el producto definitivo siempre es de alta calidad.

1º- Uno de los puntos más importantes, y que por desgracia a algunos diseñadores se les olvida, es el estudio de plataformas web, aplicaciones o sistemas similares a la que vamos a diseñar. Gracias a este estudio no solo lograras anticiparte a posibles problemas futuros sino que encontraras diferentes soluciones a estos e inspiración para realizar un mejor producto final.

2º- Estructuración de contenidos, bien a través de urls ya definidas o de un esquema en blanco donde el cliente solo nos da algunos bosquejos de lo que quiere que sea el resultado, existen varios métodos para conseguir una estructura adecuada. A mi lo que mejor me funciona es el «cardsorting» y la utilización de algún programa de testeo como Optimal Workshop.

cardsorting

3º- En este punto me gusta coger lapiz y papel y crear «wireframes», como normalmente diseño firsmobile me los suelo subir a una app muy útil que se llama POP donde puedo testear el funcionamiento y ver si hay alguna laguna. Hay más programas similares, yo utilizo este para testear todo el flujo y terminar de definir bien los menús para la versión móvil.

 

4º- Ahora le toca a la versión de escritorio e Ipad, para testear esta utilizo Axure, este es uno de los pasos que muchas veces tengo que saltarme por tiempo.

 

axure

 

5º- Llegados a este punto y es la hora de compartir el trabajo con el equipo y escuchar sus comentarios 🙂 , hay diferentes programas para compartir de forma online como por ejemplo Invision (muy orientado a nuestro trabajo) u otros para la gestión de proyectos como Trello, Basecamp, etc.

 

mockup-5

 

6º- Después de tener en consideración los comentarios del equipo y hacer los ajustes necesarios, es hora de realizar algunas versiones de alta calidad (esta es mi parte favorita :).  Normalmente elijo dos pantallas principales para desarrollarlas. Estas pantallas se las enseño al cliente junto con todo el trabajo anterior para que entienda cual será el funcionamiento Es muy importante no seguir avanzando hasta que el cliente este satisfecho en este punto y nos de su ok (preferiblemente por escrito) tanto de las pantallas como de la estructuración, sino puede ocurrir que tengas que rehacer todo el trabajo que has realizado y que vas a realizar.

 

super

 

7º- Una vez realizados los cambios solicitados por el cliente (siempre hay) y aprobado todo el trabajo anterior (por escrito) desarrollo el diseño final de todas las pantallas, primero en versión móvil y después en versión escritorio (si existe).

8º- Subo todas las páginas a POP de nuevo y se las enseño al cliente, dejándole bien claro que es un simulador a través de imágenes y no hay nada programado todavía.

9º- Hago los cambios solicitados por el cliente y una vez aprobado todo el diseño (por escrito) preparo todos los master, ordeno las capas, carpetas, etc y las paso a programación. Junto a esto es importante entregar una guía de estilos de nuestro sitio con tipografías, colores, botones, «mouseover», etc. si no quieres tener sorpresas posteriores. Tambien es importante explicar bien el funcionamiento, transiciones, apertura de nuevas páginas, etc para que los programadores lo tengan absolutamente claro. ES MUY IMPORTANTE QUE EXISTA UN BUEN ENTENDIMIENTO ENTRE PROGRAMADOR Y DISEÑADOR ya que los dos vais en el mismo barco y tenéis que remar en la misma dirección.

 

Style-Guides

 

10º- Una vez realizado el frontend, recomiendo realizar un buen chequeo del mismo antes de entregar o enseñar al cliente ya que este en la mayoría de los casos no va a entender que haya errores aunque se le explique que se modificaran y es un proceso. Probablemente aunque el cliente haya aprobado con anterioridad todo el proceso, este pedirá cambios de última hora.

En muchos proyectos, nuestro trabajo nunca se terminará ya que la web o la aplicación que hemos creado irá evolucionando por lo que se tendrán que diseñar nuevas funcionalidades y pantallas.

Puede que no sea la mejor manera de trabajar, pero si es la mejor que yo conozco. Espero que esto sirva a mis compañeros diseñadores.

Jorge Mateo