DropMock Design Suite
Project scope
Website redesign
UI/UX design
Project Status
Finalized in April 2020
Currently in development on another platform
Team
Lead designer / Webflow developer - Abby Castro
Lead developer - Karim Selima
Tools
Webflow
Adobe Photoshop
Adobe Illustrator
Overview
DropMock is a cloud-based design app that helps users with their marketing needs by providing a wide array of video mockups, image mockups, video templates, etc. It also caters to a community of entrepreneurs and provides them with online trainings on business growth, marketing and client acquisition.
Challenges
The website was very outdated and no longer completely described the current features of the app.
A redesign was a must as DropMock prepares to leave the the affiliate marketing industry and finally go mainstream.
Main changes (before and after)
Change #1: Add search bars
As DropMock releases more newsletters, free webinars and paid mastermind courses, the aforementioned sections of the website need to each have a search bar. This would allow visitors to easily discover the content that they wish to consume without flipping through numerous pages.
Change #2: Use existing webinars as a marketing tool
The DropMock community highly values the free webinars provided by its founder and its CEO. These are exclusively available to DropMock members and are also hidden inside the app. Although I agree that its exclusivity must remain, I suggested that it should also be shown in the public website. Why hide one of the strengths of DropMock? Then, if a visitor wants to watch a specific webinar, he/she can do so after signing up.
Change #3: Open mastermind courses to the public
Paid mastermind courses is one of the company’s income streams. However, it is hidden inside the app where only DropMock members can see them. These courses are not DropMock-specific and hence, should also be offered to the public. I suggested it should be transferred out of the app and into the public website.
Change #4: Create landing pages for each course
The mere title of a mastermind course is not enough to entice a user to purchase that course. Following this, I suggested that a landing page for each course should be created to provide more information to interested individuals and help the company close more sales. This would also help with SEO.
DropMock is an online design app that offers a massive collection of image mockups, video mockups, video templates, etc. There is so much that you can create on this platform without needing any technical expertise.
Change #5: Move all templates into the public eye
Guess where this massive collection resides... Yes, inside the DropMock app. After looking at its competitors, the founder, the lead developer and I agreed that we should move all the creative templates into the public eye. Let’s show off what DropMock is made of. All templates can be previewed but users would still need to log in in order to customize any of the templates.
Change #6: Create separate template pages to improve SEO
Previously, titles are added to templates so that users can search for a specific one. In order to preview a template, a user would just need to click one from the search results and a dialog box would appear.
But instead of a dialog box, I suggested we provide a separate page for each template. This page would allow more details to be added such as a description and tags. Consequently, this can help with SEO as search engines can index these pages and connect more potential clients with DropMock.
