What UI Kits Taught Me About Design

May 18, 2019 · 500 words · 3 minute read

A few years ago, I wanted to start getting into Sketch, start to get better at a robust design workflow, and try to do something a little bit different and be able to make some of the products that I wanted to make from start to finish. As a developer, I did the thing that most of us do and just hopped into code. I started to system out the vision that was in my head. It came out okay, but with the rise of Sketch and my desire to always play with new tech tools, I wanted to take a little bit different approach.

The inside of Sketch is kind of like UI components back in the day—I think it was just iOS. It was cool to play around with those standard components and see what some of them were and how they work. That was a cool way of teaching me how to use the program.

Thinking about the web and some of our projects at the component level, I wanted to learn what things would be consistent throughout my project. What were those were valuable pieces?

What I did with Sketch was start by buying some UI kits. I bought five or six different kits and saw how different people put together these things. I never really used any of these kits in any production project, but I did open them up and dissect them. Because of the depth of my project, I felt like open up dev tools and looking at what was going on under the hood. Looking at it from that layer showed me some of the right building blocks that would make a functional component.

One of the kits that stick out to me had a couple of different parts. Being able to see how some of the standard design aesthetic was consistent throughout these components and how a lot of the stuff was reusable showed me how a few simple touches could go a long way into designing a good product. I also saw how a few simple core components can help you rapidly prototype something. There was a level of polish to products that people were trying to make a few bucks off of, there’s a level of polish too.

It was valuable to see how different people would build these components. It really helped me develop my design system and create the design aesthetic. It also showed me the key to consistency and the key to uniformity in the design projects. I think it helped me make me a better developer in the end because it showed me the levels of complexity and sophistication that go into building something as small as a card component.

If you are struggling with design inspiration and want to learn a new tool, grab a UI kit and dig into it. It is a fabulous way to learn a program and understand what these tools can do for you as a developer and designer.