Superdope is a tool to generate premium mockups in seconds.
I’ve designed Superdope from 0 → 1 (ideation, product design, development and launch).
Probably the biggest challenge I embraced as a product designer.
CONTEXT
Creating a fast, easy to use and visually powerful mockup generator experience for creatives & makers.
GOAL
‘The Martian’, by Ridley Scott, inspired me the most for the artistic direction. A blend of sci-fi, vivid oranges and greyscale tones set the product’s identity.
ANECTODE
BENCHMARKING COMPETITORS
In order to create the crème de la crème, I had to get a taste of what is there on the market. And what’s better than a deep benchmarking session to accomplish that:
PERCEPTUAL MAP
NEW PRODUCT, NEW MARKET-FIT
Unlike any established brand or product, Superdope was new and unknown.
To identify the pain points and start moving forward with the product, I interviewed designers and makers to validate my assumptions and find the right angle of development.
I started by illustrating their current workflow whenever they have to showcase design/product on mockups, and I attributed a degree of pain for each step of the process.
Plot Twist: the results were unanimous - the process is painful.
SEARCH MOCKUPS ON MARKETPLACES
5 - 25min
Pain SCORE
BUY & DOWNLOAD MOCKUP TEMPLATES
5 - 10min
Pain SCORE
TRY TEMPLATES ON PHOTOSHOP
5 - 20min
Pain SCORE
PAIN SCORE MAPPED TO CURRENT FLOW
Well, I basically reuse the same mockups over and over again
And paying $15... No thanks
5:02PM
I don’t showcase mockup visuals anymore. I became lazy dude
Photoshop is a hassle man 😅
9:42AM
I find my mockups on 2/3 sites and use Photoshop to add my designs
I block half a day for that specific step 😢
11:31AM
I have 0 knowledge of photoshop haha. All I do is coding ngl
I ask my friends to do it for me 😜
4:58PM
SELECTED FEEDBACK FROM DESIGNERS & MAKERS
BUILDING EXPERIENCE PILLARS
With the goal to create the go-to platform on the market, I came up with a list of 4 experience pillars. Each one structuring the experience, setting the vision and the direction to follow.
FASCINATING
Let the power of visuals set the tone
INTUITIVE
Easy & straightforward user experience
INTERACTIVE
Use micro-interactions to make process fun
REWARDING
Give the user the feel of receiving a reward
EXPERIENCE PILLARS
CONCEPTS EXPLORATION
After establishing solid foundations on the project vision, It was time to start to explore some visual concepts and get a first visual feel of how the experience would be.
My process is often the following:
Mapping out the features (Information Architecture)
Exploring some visual layouts
Getting direct feedback on them
INFORMATION ARCHITECTURE
LAYOUT EXPLORATION (LOW-FI) + SELECTED OPTION (BASED ON FEEDBACK)
A SOFT & SCALABLE DESIGN SYSTEM
Along the design process, I built a logic, scalable and unified design system.
It was a mandatory step to allow the project to scale and avoid mismatch in the future.
I named it NOVA.
NOVA - DESIGN SYSTEM
And NOW WHAT?
It was a pleasure working on that project for the past months. I built Superdope in public and receiving the love and support from fellow designers on X (Twitter) was a blast.
Since the launch, Superdope has been published and shared by well-known blogs and curated websites:
CURATED PUBLICATIONS
Here are some stats regarding Superdope since launch (launched on September 2023):
