DISEÑANDO MAQUETAS WEB

Cuándo pensamos en un proyecto web es importante tener claro lo que se va a mostrar y que tipo de negocio es, además de no olvidar la caracterización de las audiencias que accederán al sitio, pues finalmente son los usuario en quienes se debe pensar a la hora de diseñar una página web o una App.

Para esto los diseñadores o desarrolladores web hacen uso de los Mockup, que podríamos definir como un boceto, maqueta o un modelo a escala de un diseño, que nos permite plasmar y mostrarle al cliente u organización cómo se verá finalmente su sitio web.

Un mockup se puede hacer de varias maneras, por ejemplo, yo lo hice de forma analógica, con materiales que encontré a la mano:

 

También podemos plasmar las ideas con un dibujo, que sería el boceto de ese proyecto web:

 

 

Otra forma de hacerlo es a partir del uso de diferentes software que hacen del diseño algo mucho más profesional y real, la idea es crear un boceto lo más exacto posible al proyecto final, por eso a continuación encontrará algunos de los programas que los diseñadores usan a la hora de crear un mockup:

 

·         Adobe Illustrator

·         Adobe Photoshop

·         Gimp

·         Corel Draw

·         Cinema 4d

·         3ds Max

·         Moqups (gratis)

Indagando sobre este tema encontré el blog ESPACIO PARA EMPRENDEDORES de Carlos Cobian, que nos ilustra 9 herramientas para crear maquetas interactivas, donde nos muestra a los lectores el uso de otros instrumentos que nos ofrece la web para crear nuestros bocetos.

PASOS PARA TENER EN CUENTA A LA HORA DE CREAR UN MOCKUP

1. Creación y definición del esquema de navegación y estructura de la web, pero sin establecer aún colores, tipografías, texturas etc... Así es mucho más fácil empezar a estructurar los contenidos del sitio.

2. Establecer junto al cliente de una vez las estructura de esa arquitectura de la información, así nos evitamos que más adelante nos quieran cambiar el diseño, pues aunque no parezca ese trabajo extra implica cargos económicos y de tiempo.

3. Con los dos pasos anteriores, el trabajo esta más que adelantando y estructurado, así será más fácil empezar a desarrollar el resto del diseño.

Lo cierto es que los mockup tiene una gran ventaja, son una manera fácil de estructurar una web o App, a la hora de recrear en ideas sobre la organización de la información.