M Is For Mockups
We know you have been wondering where we have been! Last year, we promised ourselves that we would only speak on topics that truly resonated with us. Well, after a 7-month hiatus, we are back with a new blog post! Over the past few months, we have been working with an all-natural hair + skin line on their new website and product labels. It was through this work that we discovered a new love for mockups! In this blog, we want to discuss what a mockup is, what it can do for you and some of our favorite mockup sites.
We can’t assume everyone has heard the term mockup before so let us explain. In short, a mockup is a customizable file that you can upload your design on. Picture a shampoo bottle. Can you see the cap color, the label, the bottle’s color? Well, in a mockup, you have complete control on how it's designed. You select the color and you upload your label. Essentially you become the graphic designer. If you have a little working knowledge of how to use Adobe Photoshop and/or Adobe Illustrator, then this post is for you! If you don’t, most mockups come with a guide to help you navigate the file and ultimately achieve your desired look.
As mentioned above, we have discovered a new appreciation for these little gems while working on a recent project. Mockups aren’t just for novice users. Designers use mockups all the time to see what their work will look like in 3-D. Originally, we would have wanted our client to have the physical products photographed to be used on the site we were creating. However, that wasn’t possible; so we had to come up with a plan B, or rather a “plan M” - Mockups! We found a few mockups based on the containers the client had already purchased. In the end, we create clean, cohesive 3-D product examples that truly enhanced the site. Thus to attracting visitors and increasing the likelihood of a purchase. Check out a few below!
When you upload the mockup file into your program there will be layers that the creator has marked as editable. Example. the green grid area is editable. From there, you can change whatever is needed to achieve the look you want!
Here is what your mockup could look like after you have added a label and changed the colors. For this mockup you can edit the bottle cap, outside label and the color of the liquid on the inside.
*Please note this is not the hair and skin brand we reference in our post. We will showcase that at a later date.
We know you all are wondering where you can get these mockups! Well, it depends on what you need. If you are looking for more developed mockups, we suggest Creative Market and Envato Elements. You pay per mockup with Creative market and you pay per month to have access to the items with Envato. We only suggest those if you are looking for more customizing abilities. If you are looking for free mockups, we suggest Graphic Burger or Mockupworld. Depending on what you are looking for, these 4 should have you covered. Even doing a quick google search could yield some gems that aren’t mentioned here.
In short, mockups can take your website, presentation, and other projects from a C- to an A+ by creating a clean + unified look. Whether you are a seasoned designer or just looking to try your hand, mockups can be a useful tool for all.