Qué son los MockUps? y Para qué Sirven?

Publicado por jumabu el

Conoce que son los mockups, para que se utilizan y varios ejemplos de este práctico recurso

Los MockUps son una maqueta, una plantilla un modelo utilizado para la presentación de nuestro diseño de manera realista (en la mayoría de los casos).

Ok, aquí la explicación técnica, casi de diccionario, pero vamos a entender un poco más sobre este maravilloso recurso.



Supongamos que estuvimos diseñando un sitio web y queremos presentárselo a nuestros clientes, normalmente presentaríamos un JPG donde se visualiza nuestro diseño, pero el cliente quiere saber más, y entonces surgen preguntas como estas:

Cómo se ve en la pantalla?

Y este borde se estira o siempre queda así?

En una tablet o iPad cómo se visualizaría? y en un teléfono?

Es alineada a la izquierda mi web? o está centrada?

En lugar de dar explicaciones para que el cliente entienda o imagine la visualización de sus preguntas, lo que hacemos es encontrar un MockUp que nos permita presentar nuestro diseño en las distintas pantallas con un alto grado de realismo.

Veamos un ejemplo:

Vamos a imaginarnos que presentaríamos la vieja web de jumabu a un cliente.

Para que nuestro cliente vea un poco más realizado nuestro diseño lo que hacemos es descargarnos un lindo mockup para presentar diseños webs, aquí les dejo el enlace de uno de mis preferidos: http://wp.me/p211Nr-cNj
y comenzamos a aplicar nuestro diseño.
El mockup que descargamos es un PSD, por lo tanto lo podremos editar con Photoshop.

Veamos el primer paso:
Abrimos el PSD que descargamos…

mock up web - Qué son los MockUps? y Para qué Sirven?

Luego lo que haremos es copiar la imagen que tenemos ya diseñada de nuestro sitio web y la fotomontamos sobre el mockup
Primero la pegamos sobre el mockup y luego con la herramienta Edición > Transformación Libre (para Mac manzanita + T, para Windows Shift + T)
acomodamos nuestro diseño para que coincida con la perspectiva del mockup.

mock up fotomontaje - Qué son los MockUps? y Para qué Sirven?

tocamos un poco y listo! nuestra primer vista del mockup en un ordenador de mesa

También los mockups pueden editarse trabajando con objetos inteligentes, aquí te dejo un post para que veas como editarlos: Como editar un mockup usando objetos inteligentes

Ahora vamos a hacer lo mismo con nuestros diseños de Ipad o tablets y de teléfonos!

Mockup para Ipad o Tablets:

iPad Template - Qué son los MockUps? y Para qué Sirven?

Mockup para Teléfonos:

iPhone Template - Qué son los MockUps? y Para qué Sirven?

Este mismo ejemplo se aplica a los diferentes diseños que realicemos.
Muchas veces encontramos mockups de botellas de vino para que podamos presentar nuestras etiquetas de botellas, o bien nos toca diseñar una tarjeta personal y queremos presentarla de manera más realista, entonces descargamos un mockup como estehttp://wp.me/p211Nr-cLI

Recuerden, los mockups nos permiten presentar nuestros diseños de manera más realista.
Cuanto más realista sea el mockup, mejor quedará presentado nuestro diseño.
Los mockups pueden ser archivos para editar con Photoshop, Illustrator o Corel, In Design, etc, etc…

Espero que este mini tutorial les haya servido y que de ahora en más cuando vean un mockup sepan a  que se hace referencia.
Saludos y si quieren dejar su comentario para evaluar nuestra explicación… Bienvenido Sea!

Recursos Similares

triptico realista mockup - Mockup para hacer un tríptico realista aplicando tu diseño
Mockup para hacer un tríptico realista aplicando tu diseño
contrato para diseno grafico - Modelos de Contratos para diseñadores gráficos, diseño web listos para descargar
Modelos de Contratos para diseñadores gráficos, diseño web listos para descargar
mockup banner vertical vectorizado - MockUp en Vector de Banners de Pié o Pendones de Pié
MockUp en Vector de Banners de Pié o Pendones de Pié
playera mockup - Mockup de Playeras con fondo blanco
Mockup de Playeras con fondo blanco
guirnaldas psd gratis - Reemplaza el contenido de la bola navideña por lo que quieras
Reemplaza el contenido de la bola navideña por lo que quieras
mockup iphone x gratis - iPhone X Mockups en PSD para descargar
iPhone X Mockups en PSD para descargar
Iphone color blanco mate mockups - Fantásticos Mockups de distintos dispositivos en color blanco mate
Fantásticos Mockups de distintos dispositivos en color blanco mate
indesign folleto gratuito - Folleto tríptico para editar con InDesign Gratis
Folleto tríptico para editar con InDesign Gratis
tazas mockup photoshop - Tazas de café para poner tu logo con photoshop
Tazas de café para poner tu logo con photoshop
jarra de cafe mockup - Jarra de café y plantilla de tarjeta personal para cambiar tus datos
Jarra de café y plantilla de tarjeta personal para cambiar tus datos
mockup plantilla psd - Mockup de un libro abierto de tapas duras
Mockup de un libro abierto de tapas duras
maqueta tarjeta invitacion psd - Maqueta en PSD de Tarjetas de Invitación
Maqueta en PSD de Tarjetas de Invitación