Los bocetos, wireframes, mockups y prototipos son parte esencial de todo proceso de diseño, aunque, en algunos casos, se suelen saltar ciertos pasos e incluso fusionarlos debido a la cantidad de tiempo disponible para finalizar el proyecto. Sin embargo, no se puede negar que todos estas fases son importantes para el proceso de diseño, en particular si se trata de un proyecto digital, aunque en proyectos impresos se sigue exactamente el mismo proceso, cada uno es importante y ayuda a mantenernos creativos y localizar errores.
En este artículo te damos algunos consejos esenciales que deberías poner en práctica para poder mejorar todas las fases del proceso de diseño. Mejorar tus bocetos o prototipos te ayudará a transmitir mejor tus ideas a tus compañeros de equipo o a tu cliente.
Conoce el proceso de diseño
En este artículo te damos algunos consejos esenciales que deberías poner en práctica para poder mejorar todas las fases del proceso de diseño. Mejorar tus bocetos o prototipos te ayudará a transmitir mejor tus ideas a tus compañeros de equipo o a tu cliente.
El proceso de diseño se puede considerar como un proceso progresivo. Es común empezar con bocetos en lápiz y papel hasta que poco a poco se va puliendo el diseño y se llega al producto final. El punto clave es saber cuándo es momento de pasar a la siguiente fase.
Lo más recomendable es empezar con papel y lápiz, esta es la fase en la que probablemente harás bastantes cambios hasta dar con el boceto que piensas es el ganador. En este punto, ni siquiera se toma en cuenta los colores o la tipografía, sino que se trabaja en la disposición de los elementos. Es por ello recomendable trabajar con bocetos sencillos en lápiz.
Una vez que tengas el boceto “ganador”, puedes pasar a hacer el wireframe, es decir cuando tu boceto pasa a digital. En este punto es importante trabajar con cuadrículas y determinar en cuántas columnas vamos a dividir nuestro espacio de trabajo. Al contrario que los bocetos ya se trabajan con proporciones exactas.
Luego, el diseño pasa a los mockup, que sirven para probar cómo lucirá el diseño en el dispositivo. Es totalmente estático y no se incorpora ningún tipo de interactividad. Por último, en la fase de los prototipos es en la cual se añade interactividad a la aplicación y se hacen los ajustes necesarios.
Es importante recalcar que en cada fase se hacen correcciones, pero deberían ser cada vez menores a medida que se avanza con el proceso.
Usa los bocetos para identificar problemas potenciales
Trabajar en los bocetos es un gran ejercicio para ir identificando problemas y posibles soluciones. Cada detalle del diseño responde a cierta pregunta, por ejemplo si se usa tal color porque hace mayor contraste o el tipo de fuente se identifica mejor con la personalidad de marca, etc. Todos los detalles concernientes al diseño responden a cierta pregunta en cuanto a la funcionalidad y usabilidad del producto final. Y si no estás haciéndote esta pregunta al realizar tus bocetos, entonces deberías comenzar a hacértela. Te puedes evitar problemas mayores en fases posteriores del proceso.
Cuando trabajas en equipo o en las reuniones que tengas con tu cliente, puede ser común que te diga si desea cambiar el color o la tipografía. En estos casos, es importante preguntar el por qué, es la única manera de entender cuál es el problema de diseño que se ha encontrado en los bocetos o wireframes.
Emplea imágenes y texto adecuado en tus mockups
Es obvio que en esta etapa del diseño, temas como las imágenes a emplear y el texto publicitario ni siquiera se encuentran en tu mente. Sin embargo, sabes que, como diseñador las imágenes tienen un gran poder comunicativo y si las eliges incorrectamente o al azar podrían tener un impacto negativo en tu mockup. Por otro lado, si decides dejar este espacio en blanco, puede que tus clientes no capten el mensaje que intentas transmitir.
¿Qué hacer entonces?
Pues todo depende de la cantidad de tiempo que tengas disponible, es obvio que en esta fase las imágenes que elijas no son definitivas pero podrían ayudar a crear el ambiente y si estás presentando el mockup con clientes o compañeros de equipo, es importante que ellos entiendan cuál ha sido tu objetivo principal al tomar ciertas decisiones de diseño.
Detalles como los mencionando anteriormente ayudan a diferenciar tus bocetos iniciales con un mockup de alta calidad, más cercano al producto final. Entonces, en ciertas fases, es importante darle la importancia debida a las imágenes, iconos y texto de tus prototipos.
No temas cometer errores, especialmente en la fase de bocetos
Usualmente es la primera fase del proceso, el desarrollo de bocetos iniciales, la que suele llevar mayores problemas a los diseñadores. Es común tener bloqueos y no saber qué decisión de diseño tomar. Sin embargo, una vez que tienes los bocetos iniciales, puedes seguir con el proceso de manera más natural. Para evitar futuros problemas siempre debes tomar en cuenta los comentarios de tu cliente o compañeros de equipo sobre lo que se puede mejorar y lo que se debe cambiar.
No temas cometer errores ni tampoco admitirlos. Tus compañeros o clientes pueden darte otro punto de vista que tal vez tú no habías considerado. Como ya hemos mencionado anteriormente, es importante preguntar el por qué de las sugerencias o cambios para poder comprender exactamente qué es lo que está fallando en los bocetos. En esta fase es en la que se deben corregir los bocetos según las sugerencias de tus compañeros, pero hay ciertos detalles que se ven con claridad una vez que presentas el mockup, por ejemplo la selección de colores. En cada fase habrán correcciones que deban hacerse, es todo parte del proceso.
Usa diferentes herramientas para cada fase del proceso
Actualmente, existen una gran variedad de herramientas de las que puedes hacer uso. Podrías escoger una que te parezca lo suficientemente completa como para poder cubrir todas las necesidades en cada fase. Sin embargo, tener una herramientas especializada puede ayudar con tu productividad e incluso ser de ayuda en tu proceso creativo. Todo depende de tu forma de trabajo y de tus preferencias personales, pero de igual manera te dejamos con algunas sugerencias:
- Bocetos: Es bastante popular el uso de lápiz y papel en esta fase. También puedes hacer uso de Evernote si deseas anotar ideas y GoMoodbard para crear moodboards, que te pueden servir como referencia en todo el proceso de diseño.
- Wireframes: Una herramienta gratuita es Wireframe.cc, se encuentra en la web, no hay necesidad de descargarle y te ofrece las funciones necesarias para hacer tus wireframes de manera rápida.
- Mockups: Herramientas completas como Pencil Project, que incluyen una gran variedad de funciones y características para ayudarte a crear rápidamente tus mockups, son esenciales en esta fase del proceso. Si tu presupuesto lo permite también podrías usar otras opciones de pago como Balsamiq.
- Prototipos: Para dar interactividad a tus prototipos estáticos puedes hacer uso de CodePen o Invision.
Las herramientas que mencionamos son sólo algunas sugerencias, puede que ya tengas tus herramientas favoritas o que prefieras usar otras en base al proyecto en el que estás trabajando.