12 sitios para descargar mockups para tus proyectos

por

A grandes rasgos, podemos definir los mockups como contextos virtuales que imitan un resultado real de un proyecto o trabajo realizado. Muchos clientes quieren ver como queda un logotipo en una prenda de vestir, en un producto promocional, en una papelería o cómo se mostraría en formato digital con un teléfono o pantalla de cualquier dispositivo. Existen muchos sitios para descargar mockups, o maquetas virtuales, que permiten ahorrar mucho tiempo y a dar vida a nuestras ideas.

cómo editar un mockup y sitios para descargar mockups

Ventajas de utilizar mockups o maquetas preconfiguradas

Como diseñador de la vieja escuela, siempre me he topado con clientes indecisos que no terminaban de ver el resultado de un trabajo hasta que no lo presentabas en formato físico. Cuando era una impresión normal de un folleto o cartel, era fácil realizar una impresión. La cosa se complicana cuando ese cartel lo querían ver de muestra en una marquesina, o un logo en un rótulo luminoso de una tienda.

Al tiempo dedicado en realizar el trabajo había que sumarle el que se perdía realizando la simulación, que muchas veces no estaba presupuestado y suponía también una pérdida de dinero.

La utilización de los mockups no es algo nuevo, pero sí la facilidad que se tiene para acceder a este tipo de recurso. La gran demanda de estos contenidos ha permitido la aparición de muchos sitios para descargar mockups, tanto gratuitos como de pago, pero con calidades y usos muy variados.

En esta lista encontrará algunos de los sitios donde descargar mockups a los que yo suelo acudir cuando los necesito, no sólo para presentar un trabajo a un cliente, también para crear imágenes que luego utilizo en mi web para determinadas secciones, o en sitios alternativos que administro.

Cómo su usa un mockup

Aunque pueda existir algún método alternativo, como las simulaciones online, lo habitual es usar Photoshop, ya que las diseños de los mockups están creados en capas que necesitamos editar para incrustar nuestro propia imagen, y el formato más utilizado para gestionar estos archivos descargables es «*.PSD».

He mencionado Photoshop porque es la herramienta de edición de imágenes que cualquier profesional del sector utiliza para trabajar, pero para modificar un mockup no es necesario disponer de este software, hay alternativas grtuitas totlamente funcionales para desarrollar esta labor, entre los que destaco Photopea.

Aunque usaré Photoshop para el ejemplo, el proceso es el mismo para realizarlo con Photopea, pero al ser una aplicación online, sólo podemos usarla si disponemos de una conexión a internet.

Suscríbete a mi canal: 

Descargar el archivo que contieno la maqueta o mockup

Dependiendo de la calidad que busquemos y las necesidades, tendremos que elegir entre comprar un mockup en alguna plataforma de prestigio como envato market o buscar uno de uso libre y gratuito en internet.

Una vez que tengamos el archivo descargado en el ordenador habrá que descomprimirlo, suele venir en formato «*.zip» y contiene una carpeta con archivos de ejemplo, el tipo de licencia para no saltarnos las normas de uso y el archivo editable para añadir nuestra creatividad.

Archivos descargados del mockup
Archivos descargados del mockup

En esta ocasión voy a simular la portada de una revista que, por lo general, tendremos que disponer de nuestro original en un archivo independiente en un formato que podamos exportar con facilidad.

Editar la capa del objeto inteligente del mockup

Abrimos el archivo PSD del mockup y buscamos la capa donde se encuentra el objeto inteligente. Suele estar marcado con un icono en la miniatura de la capa. Para editar esta capa tenemos que picar dos veces sobre la miniatura o hacerlo desde el menú desplegable del panel de las capas

Identificación de capa con objeto inteligente

Inmediatamente se abrirá otra pestaña en el programa con la imagen que hay de ejemplo en el mockup. Esta imagen tenemos que sustituirla por la que queremos mostrar, abrimos nuetra imagen, la copiamos y la pegamos en esta pestaña. Debe ocupar y cubrir lo mismo que la original de muestra.

Sustituir imagen del objeto inteligente del mockup
Sustituir imagen del objeto inteligente del mockup

Para que se pueda ver el resultado hay que guardar esta pestaña como si fuera un archivo normal, pero lo que hará en realidad es actualizar el estado de la capa del archivo PSD que hemos abierto en primer lugar. Una vez guardado podemos cerrar tanto la pestaña que edita el objeto inteligente como la que contenía nuestra imagen.

Sólo nos quedamos con la pestaña del archivo principal donde ya podemos ver el resultado.

Resultado de utilizar un mockup
Resultado final de adaptar un mockup

Modificar un mockup

Utilizar uno de estos archivos ahorra mucho tiempo, pero es posible que queramos realizar algún cambio porque no nos guasta algo del archivo del mockup. Gracias a las capas podemos realizar los cambios que estimemos oportunos, como colocar algún objeto adicional o poner una superficie de apoyo diferente.

Mockup modificado
Mockup modificado

Lista de sitios donde descargar mockups

En algunos de los sitios es necesario dejar el correo electrónico para poder descargar el archivo, en otros hay que registrarse para poder acceder al listado de descargas, pero como en la variedad está el gusto, aquí tenéis un listado para que elijáis el sitio que más os guste.

Mockupworld

Mockuworld para descargar maquetas

Mockup World es una especie de buscador de mockups, no es una plataforma que los diseño, almacene o distribuya, sino que recopila los enlaces de otras webs, a las que te redirige una vez que has elegido descargar alguno.

Dispone de un menú de categorías para navegar por la web y un buscador para localizar las maquetas por palabras clave. Al hacer clic en una maqueta, se abrirá la vista previa del mockup, la descripción, las dimensiones de la imagen y un botón de descarga gratuita.

Aunque la mayoría son archivos de descarga en formato PSD, hay algunas webs que permiten realizar la simulación de forma online, sin necesidad de utilizar ningún editor de imágenes.

El uso de este material puede ser privado y comercial de forma gratuita.

CSS Author

CSS author para descargar mockups

El sitio web CSS Author es parecido al anterior, pero además de maquetas podemos encontrar otras herramientas de diseño (iconos, tipografías, imágenes…). Puedes localizar el tipo de mockup realizando una búsqueda o navegando entre los más de 5000 ejemplos que existen entre las diferentes categorías.

Antes de descargar el archivo puede ver una vista previa para obtener más información como los detalles de resolción. Será redirigido a la web del autor cuanda decida descargar algún mockup. Es muy probable que tenga que introducir su email para poder acceder a la descarga, pero una ver registradi podrá descargar el archivo de forma gratuita.

Podrá hacer uso de los archivos de forma privada y comercial gratis.

LS Graphics

LS Graphics Mockups

LS Graphics dispone de mockups impresionantes, junto con otros recursos que podemos descargar, no todos ellos son gratuitos pero podrá ver al pie de cada recurso si lo es o si tiene un precio para poder descargarlo.

Dependiendo del recurso que nos interese tendremos que fijarnos es la compatibilidad del archivo (Photoshop, Sketch, Figma, XD…) que se especifica debajo de cada elemento. Cuando localice el mockup que le guste, haga clic sobre él para poder ver sus características y una vista previa.

Una vez más, todo lo que descargue de este sitio web puede usarse tanto para proyectos personales como comerciales.

Mr. Mockup

Mr. Mockups - Sitio para descargar mockups

Otro sitio para encontrar alguna maqueta o mockup que se adapte a lo que necesitamos es Mr. Mockup, alguno de los sitios ya mencionados o de esta lista contiene descargas de este lugar.

Para poder acceder a las descargas se requiere estar registrado, pero eso no implica que tengamos que pagar en un principio. Existen descargas gratuitas de calidad y la posibilidad de adquirir contenido premium.

Este sitio ofrece la posibilidad de promocionar nuestro trabajo si les enviamos una muestra del resultado obtenido al utilizar alguno de sus archivos. Si lo considera de calida, puede que aparezca en la página de presentación de la web o lo publique en las redes sociales, alcanzando nuestro trabajo un público más amplio.

Pixeden

Pixeden

Pixeden apareció en internet en el año 2011 y contiene una gran colección de mockups, así como todo tipo de gráficos, íconos, vectores, etc. No es necesario registrarse en el sitio web para descargar el contenido gratuito. Dispone de material premium al que sólo tendrá acceso si se suscribe a alguno de los planes de membresía de losa que dispone el sitio.

Antes de descargar el mockup elegido, puede ver una vista previa, leer los detalles sobre el tamaño y el tipo de archivo, verificar cuántas veces se ha descargado y cuántos «Likes» tiene. Podrá hacer una selección de búsqueda por medio de filtros como: «los más recientes», «populares», «los que más gustan», «gratuitos», y también puede usar el buscador tradicional para encontrar lo que necesita.

Facebook Design

Facebook Design ofrece la descarga totalmente gratuita de mockups de una gran variedad de dispositivoses. Puede descargar todo el contenido del sitio en formato zip o elegir un modelo concreto entre los ejemplos de teléfono, tablet, reloj, ordenador o pantalla que hay.

La descarga comprende un archivo que contiene un ejemplo y el boceto para modificar del modelo que eligió.

For Graphic

For Graphic sitios para descargar mockups

Los mockups de For Graphic están creados por un estudio de diseño que se especializa en crear maquetas. Dispone de varios archivos que se pueden descargar de forma gratuita por los que hay que navegar hasta encontrar el que mejor se adapte a lo que necesitamos. También podemos comprar el mockup que se ajuste más a nuestras necesidades en la tienda online.

Para descargar los archivos directamente desde la web nos pedirán en algunos casos que dejemos nuestro email. Algunos ejemplos no pertenecen a la web y nos redirigirán al lugar de origen donde el proceso de descarga puede ser diferente. Podemos destacar que a cada imagen la acompañan las dimensiones del archivo y la versión mínima de Photoshop con la que se puede manipular el archivo.

Graphic Burger

Graphic Burger

Graphic Burger ofrece contenido de diseño digital de primer nivel de forma gratuita. Incluye un conjunto impresionante de maquetas, kits de interfaz de usuario, iconos, efectos de texto y fondos.

Al hacer click sobre el mockup que queremos descargar se abre una página con toda la información necesaria que necesitamos antes de descargar, el tamaño del archivo, formato, dimensiones, versión mínima de Photoshop y una pequeña descripción.

No hay que registrarse en el sitio web para descargar o darle a «Me gusta». Todos los artículos están destinados para uso personal o comercial y no requiere ningún tipo de atribución del origen de la maqueta. Pero no estaría de má hacerlo si es posible ya que nos aprovechamos de su trabajo

Para mantenerse al día con las novedades que vayan apareciendo puede suscribirse a su newsletter.

MockupLove

MockupLove

MockupLove es uno de los sitios para descargar mockups que recoge archivos de autores de todo el mundo y de diversa temática, un lugar para tener de referencia para diseñadores y desarrolladores.

Todos los archivos están en formato PSD y se pueden descargar de forma gratuita. Al pasar el ratón por encima podrá ver la fecha en la que se subió el archivo, aunque no se ha actualizado últimamente, dispone de archivos y mockups de gran nivel para utilizar tanto personalmente como de

Pixelbuddha

Desde el sitio web de Pixelbuddha puedes descargar maquetas gratuitas y premium. Los primeros están destinados para uso personal y comercial, mientras que los segundos vienen con términos de licencia específicos que debe leer antes de realizar una compra. Esta web dispone también de la posibilidad de descargar un montón de iconos, vectores, kits de interfaz de usuario, fuentes, plantillas, etc. de forma gratuita.

Para poder descargar mockups gratuitos debes crear primero una cuenta que te dará acceso a descargar lo que quieras.

Smartmockups

Smartmockups es un sitio web impresionante que presenta maquetas gratuitas y premium. Dispone de un surtino enorme muy fácil de manejar gracias a la disposición de todas las categorías en la barra lateral visible en todo momento.

La diferencia con el resto de sitios es que tienes que editar el mockup de forma online. Al seleccionar la opción que queremos utilizar tenemos que subir la imagen a la web, tendremos una herramienta para adaptar la imagen al formato adecuado y luego un botón para descargar el resultado a nuestro ordenador.

Aunque existen algunas creatividades gratuitas que pueden solucionarnos el papel en algún momento, las opciones son escasas y es mejor optar por el paquete premium que nos dará la posibilidad de conseguir los resultados óptimos que buscamos.

Envato Market

Envato Market - sitios para descargar mockups

Para el último puesto de los sitios para descargar mockups que he seleccionado he dejado la plataforma que más utilizo para descargar contenido de calidad. En Envato Market puedes encontrar todo tipo de material, tanto para diseño gráfico como recursos para Web, pistas de audio, temas de gestores de contenido como WordPress o Prestashop, códigos, imágenes…

Todo el material es de muy buena calidad, lo que implica que no dispone de contenido gratuito. La ventaja de pagar por el material que descarguemos es que tendremos soporte y ayuda de los creadores en caso de que surja algún problema, como la compatibilidad o calidad de los archivos.

Requiere un registro en la web para poder acceder a la compra de cualquier artículo. Antes de descargar el archivo, y sin necesidad de registros, podemos ver todas las características, licencias y detalles de cada producto.

Conclusión

No todo el mundo es capaz de imaginar el aspecto o resultado de un producto, trabajo o diseño, y es en ese punto donde los mockups o maquetas nos pueden ser útiles. De una forma sencilla se puede insertar nuestro contenido, personalizarlo según las necesidades y crear en un momento una vista previa de como se vería nuestro proyecto en un entorno real.

Hay muchísimos sitios para descargar mockups, aquí muestro sólo unos pocos que en algún momento he tenido que utilizar, puede que haya sitios mejores con contenido expectacular y útil, pero probablemente encuentres lo que buscas en esta lista sin la necesidad de perder mucho tiempo.

Juan Martín

Juan Martín

Soy el creador y autor del blog «J Solución creativa», una persona como tú que intenta ganarse la vida en internet. Intento llenar mi blog con contenido útil que pueda ayudar a quien lo necesite y conseguir, con esfuerzo, generar autoempleo y vivir de ello. Si te parece interesante puedes apuntarte a mi newsletter.

Deja un comentario

0 comentarios

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

  Acepto la política de privacidad

Al dejar un comentario se solicitan datos como tu email y nombre que se almacenan en una cookie para que no tengas que volver a completarlos en próximas visitas. Para enviar un comentario debes aceptar nuestra política de privacidad.

– Responsable de los datos: Juan Martín Pascual
– Finalidad: Controlar spam, gestión y moderación de comentarios
– Legitimación: Tu consentimiento expreso
– Destinatario: Base de datos alojada en SiteGround Spain S.L. dentro de la UE. Ver política de privacidad de Siteground.
– Derechos: Acceso, rectificación, supresión, limitación, portabilidad y olvido de sus datos

Diseño gráfico J solución Creativa

Te aviso de las novedades

Suscríbete a mi NEWSLETTER

You have Successfully Subscribed!

Pin It on Pinterest

Share This
Ir al contenido