Design Library Pt.1: Design Principles

JackieZhang
3 min readJul 18, 2022

Hey welcome 👋! Over the past few weeks, I’ve been working away on a Design Library. I don’t know about you, but Legos are my jam! 🧩 and if there’s a lego ideology system in design, you bet I’m going to gravitate towards it and want to find out everything about it!

edit: After speaking to some people about this, turns out, what I was building is a design library, not a design system…awkward 🙈… so I have edited this article to reflect that!

Why? 💬

This year, I want to do my best to show my learnings! To show people what I think I did right, and what I’ve completely done wrong and hopefully, someone out there could learn from the paths I’ve taken! 🚷

Note ⚠️

  • Before we continue, I want to note that this is not going to be perfict, there will be parts that you might disagree with or parts that are just plain wrong, my main objective is to experiment and challenge existing ideas and learn from them.
  • I do encourage you to comment or point out anything! I would love to learn from you!

🏁 Where do we start?

With design library or design in general, it's good to start off with some design principles to guide us.

What are design principles? These are just some design philosophies or ideas to start off with. They can take the form of just words or quotes.

If you need some inspiration, check out Adele by UXPin, it's a list of design library from all your favourite brands!

🌟 Design Principle for this library

Good designs(for this particular library) are…

  1. intuitive: single actions even over powerful shortcuts
  2. not to underestimate the user: minimal even over well explained
  3. modular: logical even over creativity

Good design is as little design as possible.- Dieter Rams

🎨 Aesthetics direction

This is something that I’ve been curious to try. To incorporate a stylescape from the branding world, into product design.

It’s basically a highly curated moldboard to guide the look and feel of the brand.

By keeping in mind the design principle, it guided me in creating the stylescapes.

A highly curated collage with different images and words to act as the guiding light for how we want the aesthetics of the design to look.
The style scape for this design library

And in turn, the stylescapes and design principles will help decide how the rest will look!

Because this is not for an existing brand, it makes sense, but I would encourage you to try to make one even for a brand that exists, a stylescape for the product side would help align emotions, that are often missed when aligning goals.

🏷 Naming

To give this piece of work a name, I’ve followed Tom Cavill’s method of naming product

After following this method, I’ve arrived at the name of

“Linear”

This was rooted in design principles of keeping things simple and straightforward.

Part 2 coming soon! I’ll put the link to it here, once I’m done writing it!

I truly hope you’ve enjoyed this! :)

I’m on Twitter @jackie_zhang_ls , if you want to hear more of my ramblings in real-time 👋

--

--