How a Design Starter Kit can help you improve your UI Skills

Are you a Developer that struggles with creating UIs that don't look like they were created by a Developer?

How a Design Starter Kit can help you improve your UI Skills
Photo by Drew Beamer / Unsplash

Are you a Developer that struggles with creating UIs that don't look like they were created by a Developer?

Have you started designing a UI. Hated it, and just lost interest?

Do you want to learn UI Design, but don’t want to spend too much time on learning a new skill?

Do you want to be able to create visuals without the need for a UI Designer?

Have you found staring at a blank page in Figma, Adobe XD, or any other flavour of Design Tool pretty daunting?

Well, you need to call 0800-IMPROVE-MY-UI-DESIGN-SKILLS now!

Hmm. Maybe not. Let's return to our regular broadcast shall we...

Is there another way that developers could improve their UI skills?

For any Developer out there, if you’re either of the Full-Stack, or Front-End variety, you will, I’m sure, have come across countless (and in most cases, very insightful) Courses and Tutorials ready, and waiting with open arms to help you improve your UI Design skills.

Career Foundry. Skillshare. Udemy. The list goes on, and on…

But it got me thinking.

Was there was another way that Developers could improve their UI Design skills, construct great looking UIs, and pick up a few design best practices along the way, all via the quickest route possible?

Because, after all, who’s got the time to learn a secondary skill right?

Well folks there is…

Design Starter Kits!

Come take a look-see…

A design starter kit can be the kickstart you need to produce great-looking UIs quickly.

An array of different Modal examples shown inside of Figma

Like I mentioned before, an In-Depth Video Course can help Developers a great deal on brushing up on their UI Design skills, no doubt about that, but a Design Starter Kit can be that simple, and quick kickstart that saves you from the daunting situation of staring at a blank canvas in something like Figma or Adobe XD, wondering which Rectangle to draw first.

Ok. Yeah an all-singing, all-dancing UI Kit that you’ve checked out on a design marketplace can inspire you, but it’s pretty much one person’s style that you have to adhere to unless you customise the s**t out of it.

With a Design Starter Kit (such as Root, Cabana or Source to name but a few), you have something that’s there for you to put your own stamp on if required, and get stuff out of the door much faster, even if your UI Design skills are initially lacking.

Here you have a ready-made assortment of Text Styles, Colour Palettes, Master Components, and more, all adhering to design best practices, that you can easily use to piece together beautiful, practical, and accessible UIs in the shortest time possible. All without the need for those pesky Designers like me!

An array of different Components shown inside of Figma

Think of a Design Starter Kit as kind of ‘UI Design Lego for Developers.’ (What do you mean that’s been Trademarked?)

A little while back I had the chance to chat with the very talented Sara Soueidan.

Sara mentioned how, as a Front-End Developer she was, in her own words…

"Still learning my way around UI Design."

This is where I brought up in a conversation about using Design Starter Kits, and Sara mentioned, that as a Developer something like that could be extremely useful…

"Developers shouldn’t always need a Designer to create projects, and many of us are into learning UI Design for this reason. I could use something like a starter kit to kickstart my design work every once in a while."

Not every Developer has the time to learn the ins & outs of a new skill.

A green wall clock with a white face

Now, I’m not saying that Developers should just skip over basic Design Theory and Best Practices, jump both feet first into a Design-Starter-Kit-Thingy-Thing and within a week present themselves as UI Designer extraordinaire.

No I’m not.

It pays to have a knowledge of those things, I know that.

But for a Developer wanting to learn a secondary skill in the shortest time possible, you don’t always have the extra time to digest all of this stuff whilst focusing on your primary skill-set.

You want to know just enough to be dangerous, and this is where a Starter Kit can really help.

Want to be one of those Developer/Designer Unicorns? You do?

A toy unicorn made from Lego pieces

Another great thing is that employers are looking for those Developer/Designer rainbow-coloured-flowing-mane-Unicorns now more than ever…

"As someone who hires Developers and Designers, it’s so hard to find a designer or developer with a decent amount of knowledge of the other skill-set, and we’re all out here looking for those types of people to hire."
"When hiring new Devs for my team, I specifically look for Devs with previous design experience, because I’ve found it results in team members with a much greater attention to design details when developing UIs."

So to wrap things up around here…

Be the best you can be in your Primary role ie; Full-Stack, or Front-End Developer, and competent enough in a Side role à la UI Designer to make yourself a more valuable asset to a Team and/or Employer.

Use something like a Design Starter Kit to help you quickly construct beautiful, practical, and accessible UIs in the shortest time possible, and eventually gain the confidence to develop your own design style.

Zen-like Mastery in UI Design can come later right?

By the way, if you want to improve your design skills fast, and save yourself hundreds of design hours, my Design System for Figma; Cabana could really help you out. Use the code CAB35 to receive 35% OFF. 👇

Cabana - Design System for Figma
Creating amazing designs is hard when you’ve got deadlines to meet. So we built Cabana, a Design System for Figma that enables you to start projects faster.

Thanks for reading the article,