Criando a caixa de um produto ou software

Where to start?

First, create an empty image in Photoshop. I created one 800px wide and 600px long. Now, we will create the guides like on the picture below. I moved the ruler to the first top position for easier viewing. We will create guides for the back (50×300px) and front side (150×300px). Now, create the horizontal guides on 10px, 20px, 280px and 290px. OK? Let’s move on.

Use the Rectangle Tool (U) to create the front and back box with the above values. Now, use the Direct Selection Tool (A) to move the point of the back and front sides like this: 0,0>0,10px, 0,300>0,290px for the back side and 200,0>200,20px, 200,300>200,380px.

You did this? You should now have something similar to the box on this picture.

Now, import your footage. I made my front side a little wider but with these values you should experiment on your own. My footage is as you can see 50×300px back and 200×300px front. If you are doing this for the first time, forget the writing on box and experiment with the pictures instead :)

Here is the magical part :). Select the first rectangle you created (to do this use your mouse, hold down the CTRL key (or COMMAND key) while clicking on the layer representing the rectangle (Shape1).

Now, use Edit > Paste Into (or SHIFT + CONTROL/COMMAND + V) to paste into the rectangle. Use Transform (CTRL/COMMAND + T) to transform the front and back side footage to move it to the place.

If you are new to this you might want to move your points to the position manually, but here is how I did that. First, move the right part to the right guideline, then click with your mouse on the top right corner (for the front side, off course). While holding your mouse, use the combination SHIFT+CTRL+ALT and move the right corner slightly down, really slow. If you did everything as mentioned, the bottom corner will move to the center as well. You should get something like this.

The last thing we want to do is to create some inner shadows for both sides (40% opacity, 0px distance, 20px size). You can also select both sides and create a white background in back of them. Now, apply the Drop Shadow to the layer with these values: 10% opacity, 10px distance, and 20px size. I also added an outside stroke with the width of 1px, white, to the same layer. Here is what it looks like.

You should try to experiment for yourself now :)!

Pessoas visualizando este conteúdo






Total de visualizações






Obrigado pela atenção ate a próxima