Copywork: The Ultimate Way to Rapidly Improve Your Design Skills
There’s a technique for improving one’s user interface design skills that is the most efficient way I know of expanding one’s visual vocabulary but that I’ve rarely heard mentioned by digital designers.
What’s going on here? Pay attention to great design to see what they’re doing right
I’m talking about copy work. Copywork is a technique that writers and painters have been using for centuries. It is the process of recreating an existing work as closely as possible in order to improve one’s skill. In our case, this means recreating a user interface (UI) design pixel for pixel.
It’s not as pointless as it sounds, I promise. The trick is to pick a design that is better than what you are currently capable of. By copying something outside of your wheelhouse, you will be expanding your skills.
So, if you want to improve your use of color, copy something with some crazy gradients or a bold palette. If you want to get better at luxury branding, copy a preeminent website with a ritzy look and feel.
Obviously, this technique is not rocket science. Actually, it would be hard to think of a more mundane exercise. But it is the most effective way I know to improve my UI design skills. Credit goes to
Which is the original and which is the copy? Original by Sam Thibault.
The idea behind copy work is that the process of rewriting an existing book can improve our writing skills.
This concept can be applied to visual UI design as well. But in our case, we’d recreate a web or app design element by element, pixel by pixel.
What I’d recommend you to do is — this is something that I’ve done in the past as well:
- Find a website that you really like visually. Pick a design that, when you look at it, you wish you could design like that.
- Take a screenshot of that website.
- Place the screenshot in Figma or whatever design software you use.
- Start copying it, piece by piece, element by element, measure, inspect, and create.
By copying, you examine the website. You can see how large the header is, how large the font in the header is, the size of the hero image, where the call to action button is placed, the use of white space and line height, etc.
You design by copying and matching the design as much as you can. It doesn’t need to be perfect, though (I’d only focus on a 90–95 percent match). Soon enough, you’ll understand balance, layout, and other graphic design principles better.
Then slowly, you can establish a visual language, a visual voice for yourself.
I’d recommend you do this exercise for about an hour every day, especially when you start in the field and don’t have a formal graphic or third-level design education.
Recreate designs for practice/Experiment
If we’d like to get better at something, we need to put the work in. So, if we’d like to get better at visual UI design, we need to devote time to design exercises — practice, practice, practice. You will see how better your visual design skills are only in a month.
By the way, I hope it goes without saying, but I’m going to tell it anyway: whenever you do copy work, you can’t claim the design as your own. Copy work is for your practice, and you shouldn’t put your practice copy work in your portfolio.
Good luck with your practice! Thank you for reading!
