En la fase de diseño de un proyecto web, ya sea para un sitio web o para una aplicación móvil, siempre se debe de tener en cuenta tres pasos a seguir en el orden que se exponen:

1. Sketch
2. Wireframes
3. Prototipado

Este post se centra en el primer paso, el Sketch.

El objetivo es crear un boceto inicial de cómo es la interfaz de la aplicación y su navegación, entre las distintas secciones y vistas. De esta manera, se comprende de forma más visual el proceso funcional y creativo.

La propuesta de diseño que se presenta, ayuda a detectar errores en el diseño y así poder realizar cambios de forma sencilla.

Supongamos que tenemos que hacer una app móvil para los propietarios de mascotas. La aplicación tiene que ofrecer los siguientes contenidos:

 Conocer los centros veterinarios de un barrio y su horario.
 Conocer recomendaciones sobre alimentación.
 Conocer cuáles son las vacunaciones obligatorias.

Antes de comenzar a pensar en un posible diseño, se debe identificar otras características, como por ejemplo, los tipos de mascotas o si es necesario un sistema de localización, debemos conocer cuál sería su funcionamiento. Es decir, tenemos que tener claro los requisitos funcionales.

Después de comprender cuáles son los objetivos y los procesos de interacción, se pasa al diseño del boceto.

Los bocetos, son dibujos básicos y de baja calidad, en donde se expone el diseño de la interfaz propuesta para la aplicación. También permiten definir los objetivos en la etapa más temprana de un proyecto de diseño centrado en el usuario.

Gracias a que son bocetos rápidos, admiten modificaciones de manera rápida.

En las siguientes imágenes vemos el resultado de un sketching (pulsar sobre las imágenes para ampliarlas)

También puedes verlas en el tablero UX en Pinterest