Web App Clones

UI exploration on what makes great web apps great

Project Overview

In a bid to learn what makes great dashboards work, I have been recreating dashboards from world-class tools to learn more about what makes them great.

Below is a list of the dashboards I have cloned

Canva

I will continue adding to this list as I clone more dashboards

Tool Used

Figma

Canva Clone

Lessons learned from cloning Canva

Consistency is Key: Canva uses the 4/8/16/24/32 sizes on everything on their dashboard. From font and icon sizes to padding and margin. This consistent use of these sizes creates great visual hierarchy in a way that the brain appreciates when you see it. Its very few places where Canva has broken this pattern and I think that's why you will feel that the site is really well put together as a user but not know why
Use Color Very Sparingly: Canva only uses color to things that they would like the user to focus their eyes on. The fact that they use color so infrequently makes your eyes go directly to those call to actions and important sections. It also makes the main content the templates and your designs pop.

Below is the Figma file of the clone. Explore it for yourself!

Figma Prototype of the Canva Clone

Like what you see?

Contact Me

Reach out to me on the platforms below

Email

Phone