Saltar al contenido principal

Mockup

Un mockup o maqueta es un diseño digital de una web y / o aplicación. Las maquetas se usan en la etapa de diseño inicial para visualizar ideas y conceptos en el contexto del diseño web e incluyen la estructura de navegación, el sitio y los items de diseño en detalle. Los mockups pueden ser plantillas producidas con programas de edición de imágenes sin funcionalidad o diseños que se crean con herramientas especiales de maquetas y donde los items de control ya están vinculados con funciones simples.

Comparación: mockup, wireframe, prototipo

Los términos mockup, wireframe y prototipo muchas veces se consideran lo mismo en la práctica, no obstante, de hecho son tres tipos distintos de representaciones de diseño como parte de la creación rápida de prototipos y se usan en distintos etapas del diseño antes de la programación real.

Un wireframe es la forma más simple de plantilla y no incluye ningún color, tipografía, imágenes o gráficos, a diferencia de una maqueta. Este primer diseño de boceto puede ser creado a mano o en el PC. La funcionalidad está absolutamente ausente en esta pantalla. De este modo, los wireframe se consideran diseños de baja fidelidad. [1]

Las maquetas pueden construirse sobre cualquier estructura existente y seguir desarrollándola. Integrando color, tipografía, imágenes y gráficos, se acercan mucho al diseño final y ya lo representan. De este modo, son preferibles a efectos de presentación.

Un mockup clásico es estático. No obstante, las modernas herramientas de maquetación permiten la incorporación de funciones simples como los enlaces, de modo que, dependiendo de la complejidad, pueden categorizarse como diseños de mediana a alta fidelidad y bordear los prototipos.

Se pueden usar maquetas complejas de varias partes como base para prototipos que, dependiendo de su estilo, además se pueden considerar diseños de mediana a alta fidelidad. A diferencia de la clásica maqueta estática, los prototipos son siempre interactivos y contienen la mayoría de las funciones de la página web o aplicación planificada.

Quizás te interesa >>>  Conversion

Usos y beneficios de los mockups

Las maquetas se usan en la etapa inicial de desarrollo de webs y apps para la presentación y el control de calidad. Sirven para coordinar con el cliente las ideas y los requerimientos de la interfaz de usuario en cuanto a las funciones básicas, la navegación, la arquitectura de contenidos y el diseño. Quién obtiene el contrato final muchas veces se decide sobre la base del mockup.

Las maquetas se usan para pruebas de usabilidad sin un gran esfuerzo de programación previo. Por ende, cualquier problema se detecta antes de crear el prototipo y se reduce el riesgo de que un concepto tenga que ser absolutamente revisado a mitad de la etapa de desarrollo. En general, los mockups pueden contribuir a ahorrar tiempo y dinero en un proyecto online.

Ejemplos

Fácil edición de imágenes y software de presentación como PowerPoint se usa a veces para los mockups, pero en comparación con las herramientas de maquetas son bastante lentos. Las herramientas especializadas proporcionan items prefabricados e inclusive la oportunidad de probar procesos de interacción simples.

Ejemplos de herramientas de mockups para sitios web:

Ejemplos de herramientas de simulación para apps:

Ventajas de la usabilidad

Ya que las maquetas son muy adecuadas para las pruebas de usabilidad debido a su nivel de detalle medio-alto, pueden proporcionar información importante sobre la experiencia del usuario y ayudar a aprovechar al máximo el diseño de la experiencia de usuario en una etapa temprana de la etapa de diseño, sobre todo en los campos de la estética y la facilidad de uso.

Enlaces Web

error: Atención: Contenido protegido.