Contenido

Qué es un mockup

Definición

Un mockup es una representación visual realista de un diseño o producto antes de producirlo: una web sobre la pantalla de un portátil, un empaque sobre una mesa, una app en un teléfono. Sirve para ver y aprobar cómo quedará algo sin fabricarlo.

Por Hernán Arévalo5 min de lectura

En diseño digital hay tres cosas parecidas que conviene no confundir: el wireframe es el esqueleto sin estilo (dónde va cada bloque), el mockup es cómo se verá con colores, tipografía e imágenes, y el prototipo es lo que además se puede clicar y navegar.

Para qué se usa

  • Aprobar antes de construir. Cambiar un mockup cuesta minutos; cambiar una web ya desarrollada cuesta días.
  • Vender una idea. Un empaque o una tienda en contexto se entienden mucho mejor que una descripción.
  • Presentar propuestas. En una propuesta comercial, ver la web propia rediseñada cambia por completo la conversación.

Dónde conviene no usarlo

En publicidad de producto físico. Un empaque en mockup se ve perfecto y el real tiene reflejos, arrugas y sombras; cuando el cliente recibe lo segundo después de ver lo primero, la decepción es del producto aunque el producto esté bien. Para anuncios de venta se usa foto real, y el mockup se reserva para presentar, aprobar y comunicar internamente.

Wireframe, mockup y prototipo

Wireframeestructura sin estiloMockupcómo se veráPrototipose puede clicarProducciónlo real

Cada paso cuesta más que el anterior. Aprobar en el segundo es lo que evita rehacer en el cuarto.

Auditoría GEO gratuita

¿Tu marca aparece cuando alguien le pregunta esto a la IA?

Escribe tu dominio y leemos tu sitio en este momento: los permisos de los bots de IA en tu robots.txt, tu llms.txt, el JSON-LD, los meta y el sitemap. En 20 segundos tienes tu score sobre 100, sin registro. Es por donde empieza el trabajo de GEO que hacemos.

Sin registro. El rubro es texto libre. Leemos únicamente archivos públicos de tu sitio.

Preguntas frecuentes

¿Mockup y prototipo son lo mismo?

No. El mockup muestra el aspecto final pero no se puede usar; el prototipo permite navegar y probar el flujo. Para validar cómo se ve, basta el mockup; para validar si se entiende, hace falta el prototipo.

¿Con qué se hacen?

Figma es el estándar para producto digital; para empaques y piezas gráficas se usan plantillas de mockup en Photoshop o generadores en línea. Lo que decide la calidad es la imagen que pones dentro, no la plantilla.

¿Sirven para vender un proyecto?

Mucho. Un cliente entiende en tres segundos un mockup de su propia web rediseñada y en tres minutos una explicación. Es la forma más rápida de alinear expectativas antes de firmar.

¿Puedo usar un mockup como foto de producto?

Para presentaciones sí, para publicidad de venta no. Lo que el comprador ve tiene que parecerse a lo que va a recibir, y un mockup siempre se ve mejor que la realidad.

Ver todos los recursos

¿Quieres aplicar esto en tu negocio?

Agenda un diagnóstico gratis de 20 minutos. Revisamos tu embudo y te decimos dónde está la fuga.

Agendar diagnóstico

Diagnóstico sin costo, 20 minutos, sin compromiso.