Could we make an app that will allow you to seamlessly mix and match devices, hand models, and backdrops, just like you were in the photo studio with us?!
We've talked about this for the longest time and at one point even made a little prototype with minimal functionality to test if this idea makes sense.
It included just four hands and three phones. We loved it and couldn't stop thinking about to power it will bring to our customers.
Why is this needed?
It's not an easy task to stand out. Many of our users are freelance designers and agencies. The main reason they use mockups is simply to get a job; sell their ideas and services.
Having a photo with your proposed app design presented in a photorealistic environment leaves a great impression. It shows you looking a few steps ahead. The app might easily be weeks or even months from being finished, but you already showed them what it will look like in actual use!
Our Beginnings
We can closely relate to this because our beginnings are in the field of web agencies. We were constantly trying to get new clients and sign contracts. Making a visually attractive pitch was our significant advantage, and this is actually the origin story of Mockuuups.
One day, we needed a few iPhone mockups for an upcoming mobile app, and nothing we found online fit our needs. Our solution was to take our DSLR camera and visit the park next to our office to snap a few pictures of us holding our own phones.
A few days later, we retouched them and created four PSDs with Smart Objects for screens, and made them available as a free download. Little did we know this was a humble start of a business we are still running six years later!
However, there is a certain limit where we just cannot meet the demand for new scenes. If we made a perfect photorealistic scene for every possible use, that could be millions of photos. On top of that, every few years, the iPhone gets an entirely new form factor, and suddenly all our iPhone mockups become obsolete.
The Studio Was Born
This is where we came back to the idea we first had in the photo studio. With all the recent improvements in graphics processing and computational photography, we were able to develop a robust system for generating realistic mockups and make them easily configurable so everybody can do it.
Let's explore some of the things you can achieve with Studio.
Pick Your Device
In the first release, we are starting with a collection of 22 smartphones. Most of them are the most famous flagship models from Apple and Android. Furthermore, we'll be looking to include other commonly used phones and platforms.
All devices are available in the original colors the manufacturer sells. They can also be turned into an abstract 2D shape with configurable colors.
Some phones have one more additional version called Clay. The clay version is a 3D render with all the little details like embossed edges or camera lenses visible and all that in your preferred color.
Showing the phone, for example, in your primary brand color makes for a unique style. It can be used to further strengthen your brand identity.
Hold It In Diverse Hands
The most natural way to show your app or website is to show it on a device held by a real human hand. Frequent feedback we were receiving about our mockups was to improve the diversity. For this release, we have hired a group of 12 professional hand models of different ages and backgrounds.
We spent countless hours perfecting the way we capture photos of hands and make it all work seamlessly together with our collection of devices.
It takes a village (in our case, a team of six) to make a photoshoot like this go smoothly. We did it, so you don't have to! We hope having a more diverse range of options brings you even closer to your market.
Set the Scene
Finally, we have an option to customize the environment. Some designers might want to export mockups on a transparent background so they can work their magic in their favorite design tool. We definitely have this option available.
However, we also want to make it easy for everybody, especially non-designers, to create beautiful scenes. No other design software is required. That's why we added these background options:
- Solid color - the good old classic
- Gradient - multiple colors blending into each other
- Texture - materials like marble, paper, wooden planks, or concrete wall surfaces
- Unsplash - integration with the free stock photo library
And finally, the cherry on top is the ability to set an overlay for the whole scene. Whether that's sunlight coming through the window blinds or a shadow cast by a plant… we got it.
Infinite Options?
The Studio brings an unprecedented level of freedom in creating mockups. We often say this new generator provides infinite options, but nobody believes marketing phrases like this! What's really in there?
We did the math. By clicking different presets in our app, you can arrive at a whopping 788 million unique combinations! 788 million. And that's not counting the ability to set your own custom colors or include one of the millions of stock photos from Unsplash.
It's not infinite, but I think we are getting close! 😉
We liked exploring different combinations so much, we got to put them into the app itself. You can click the "Shuffle" button, and everything in your mockup will be completely randomized.
What's Next?
This is far from a stopping point for us. As we have created it, the Studio is a living platform where we can constantly make updates.
New Devices
We'll definitely be adding new devices and colors. Next on our list is adding support for tablets and smartwatches. They also come with their own sets of diverse hands!
More Creative Control
The most exciting part for us is thinking outside the box and seeing what innovative features we might add. All to allow you to customize your mockups even further. Some ideas we are playing with are:
- the ability to reposition the device and the hand in the scene
- bringing an additional hand and point the finger at a specific place on the screen
- further customization of hands — from the nail polish (imagine nails in your brand color!) to clothing sleeves or accessories one might wear multiple devices in a single mockup…
If you have more ideas, we are all ears!
Available Today
The Studio is now publicly available in our desktop app and the Figma plugin. We'd love it if you could try our new mockup generator for your upcoming project!
You can create unlimited custom mockups with a free account and export small resolution previews with your screenshots placed.
Once you are happy with the result and need the full resolution, you can choose to purchase a single export or start a free trial of our unlimited Premium subscription. All the details can be found on our pricing page.
Thanks to all Premium subscribers, we were able to invest a lot of our time and resources into this massive update. We are so grateful for your continuous support. ❤️
What Will You Make?
Be creative, go crazy, or just get the job done. We hope the Studio will help your achieve your goals even faster than before.
We love seeing the content you create with our mockups, so if you have something to share, don't be shy and let us know about it!
