DIY Crea tu propio mockup
Este es el primer tutorial que subimos al blog, estoy seguro que muchos usáis mockup’s (yo tambien lo hago). Es una herramienta que todo diseñador usa en sus presentaciones a sus clientes. También estoy seguro que aún habiendo millones de ellos, alguna vez no habéis encontrado uno que os encaje. DIY crea tu propio mockup
Pues en este tutorial voy a daros una técnica sencilla para crear los vuestros propios. Crear un mockup no es complicado, ahora bien, crear uno profesional es un poco más complicado, o al menos más laborioso.
Empezamos DIY Crea tu propio mockup
Lo primero que tenemos que hacer es preparar en photoshop el lienzo al tamaño que necesitemos. Recordad que tiene que ser un tamaño adecuado para que se vea bien, el pixelado quita credibilidad y profesionalidad al trabajo.
En segundo lugar colocaremos la imagen donde vayamos a crear el mockup. Como podéis imaginar, se puede utilizar cualquier objeto o imagen y el resultado final dependerá del esmero que pongáis en la creación. Nosotros para este tutorial vamos a usar una taza, por complicarlo un poco. Cuando el mockup son lineas rectas (una valla un libro o un cuadro) es algo más sencillo. Por eso vamos a utilizar un objeto con curvas para que aprendáis algo más complicado y los demás sean más sencillos de hacer.
Una vez colocada la imagen crearemos una capa vacía y en ella crearemos un recuadro que cubra el objeto. Imagen 1
Una vez hecho esto, vamos a convertir dicha capa en un objeto inteligente. Este paso es muy importante ya que si no lo convertimos no podremos cambiar el diseño fácilmente y esa es la finalidad de un mockup.
Una vez convertido a objeto inteligente y teniendo seleccionada esa misma capa pulsamos Ctrl+T, botón derecho y deformar. En estos momentos vamos a acondicionar el recuadro al objeto. Es aquí donde tenemos que darle la forma del objeto en cuestión, en nuestro caso la taza. Nos tomaremos el tiempo que sea necesario para que nos quede bien. Un truco es bajar la opacidad para ver el objeto de fondo y así poder amoldar el recuadro lo más perfecto posible. Imagen 2
Creamos los detalles
Lo que hemos hecho hasta ahora es la base del mockup, lo mínimo que se necesita. Ahora vamos a crear los detalles. Por que detalles? sencillamente por que para que quede realista, debemos integrar el dibujo a la imagen lo máximo posible. Este pack incluye, brillos, destellos, sombras y un largo etc, todos los filtros necesarios para que quede realistas.
Cada detalle se creara en una capa diferente, de esa forma podremos modificarla si en algún momento lo necesitáramos. Estos detalles dependerán de la imagen en cada caso. No todas las imágenes necesitan los mismos, así pues, cada imagen necesitara su propio mockup.
Como se puede observar en la Imagen 3 colocaremos una capa distinta y la convertiremos en capa de recorte para que solo afecte al objeto. Por cada luz, sombra, textura o detalle que queramos deberemos usar una capa distinta. DIY Crea tu propio mockup
Para convertirla en capa de recorte simplemente pondremos el cursor entre las dos capas pulsando Alt. Como ya he mencionado antes cada mockup necesitara un tipo y cantidad de capas de detalle diferente. Cada cual según su nivel de dominio de photoshop mejorará más o menos su imagen final. Estamos preparando un tutorial en vídeo para subirlo a nuestro canal de YouTube, donde podréis ver con más detalle la realización de principio a fin de un mockup.
Al ser un tutorial escrito, entre un paso y otro podéis tomaros el tiempo que necesitéis. Cada cual a su paso y una vez satisfecho con el resultado pasamos al siguiente paso.
Como usar el mockup DI
Una vez creado o descargado un mockup, lo abrimos en photoshop. Una vez abierto deberemos buscar la capa que sea un objeto inteligente. Es posible que haya varias capas de esa categoría, por lo que un buen diseñador las habrá renombrado adecuadamente. Bien por el nombre o apagando el ojo (así sabremos cual es la que contiene el diseño a cambiar) localizaremos la capa a modificar.
Una vez localizada damos doble clic y saldrá un mensaje que se va a abrir en una nueva pestaña y que deberemos guardarla para que se haga efectivo el cambio. En algunos mockup que tienen efectos incluidos, saldrá otro mensaje avisando que se desactivaran los efectos temporalmente.
En la pestaña abierta tendremos el dibujo del mockup para modificar. Nuestra imagen deberá ser con fondo transparente siempre que sea posible. Puede ser un jpeg pero teniendo siempre en cuenta que la imagen quede dentro de los limites. DIY Crea tu propio mockup
Para crear un mockup se necesita un dominio básico de photoshop, así como de saber crear y utilizar capas, filtros y efectos varios. Os espero en el tutorial de YouTube y si queréis descargaros mockup para vuestros trabajos y presentaciones, aquí os dejo unas paginas. Graphic Burguer MockupWorld Free Desing Resources
Si os ha gustado este post sería un honor que dejarais un comentario y si queréis compartirlo al principio y al final de cada post están las redes sociales para que lo hagáis. Podéis dejarme un comentario con algún tema del que queráis que hable. Pero siempre teniendo presente que lo aquí escrito es mi humilde opinión y punto de vista.
DIY Crea tu propio mockup
