Mockup in 2 minutes: draw faster than download

Time is the only irreplaceable resource. Therefore, you need to spend it on interesting tasks and loved ones, but not on searching and downloading the next mockup in Google.

Therefore, now I will teach you how to draw it in 2 minutes!
You can use any graphics editor, personally I will draw in Figma.

Don t worry if you don t succeed the first time, which is why I prepared a Figma file that you can download on my Telegram channel and see how it works!

Go!

Step 1.
Draw a rectangle.
Size: 375х812
Corner radius: 40
Color: F0F4FA

Step 2.
Duplicate the resulting rectangle 2 more times.
Change the parameters of two new rectangles (do not touch the first)

Size: 395×832
Radius: 48
Color: DCE4F5

Size: 425×862
Radius: 60

Step 3.
We superimpose the rectangles on top of each other like a nesting doll:
large at first, medium at it, small at it

Step 4.

Select the smallest one and add 5 points in the center on its top edge.

Step 5.
We form a “monobrow”:
Just pull the three center points down.
In principle, you can do without it, then skip four and five Steps.

6 step.
Select the largest rectangle and apply 3 shadows to it:
1) Drop Shadow
Blur: 80
X: 40
Y: 40
Color: B8C2D9
2) Inner Shadow:
Blur: 10
X: -4
Y: -4
Color: C3CDE7
3) Inner Shadow:
Blur: 10
X: 4
Y: 4
Color: ffffff

Last step.
Don t be afraid to experiment! You can add speaker, camera or change colors.

Outcome:

Many things seem complicated only at first glance, and in a few minutes you managed to make your first mockup!
But if you have any difficulties, or you want to see the devices in other colors, then download the Figma source in my cart