Oivan Design Director | Daniel Motta

The design industry is riddled with buzzwords. My personal favorite? Affordance. No reason for the choice; I just like the sound of it. It’s funny how you go from never using such a word to now using it every day.

Affordances are properties of components that show end-users the actions they can take. Too wordy, right? Let’s make it simpler: the affordance of an elevator button is to be pressed. So when you press button 3 on the panel, you know the elevator will take you to the 3rd floor.

Since we’re in buzzword territory, let’s talk about a big one: Design System. In a nutshell, a Design System is a single source of truth (buzzword) that streamlines design and development efforts and enables consistency across a product or system.

Design is a very time-consuming effort. Take buttons, for example. They are arguably the most straightforward component in any interface, and yet, they can eat up a lot of time given the many different decisions that go into their crafting.

Even the simplest of buttons require you to think about padding, margins, font, font style and attributes, background color, border-radius that’s a lot of decisions to make. Now imagine you have to make those decisions every single time you start a new design. That would be lengthy and non-effective.

That’s where the Design System comes in. If we define all the characteristics of said button, we’re not going to worry about it anymore. Every time we need to create a new design under that system, it’s already done. And if we need to add another variation or even a completely new element, that’s ok. All we need to do is set it once, and we’ll be sure that it is consistent.

Here is a nice blog post about our Lead UI/UX design: Our Digital Nomad Designer

Design System white boxes

A Design System is much more than just a design

Even though a Design System sounds like this magic solution, the reality is not that simple. It takes much effort and time to create a proper one. In addition, the more your product grows, the bigger it gets, and it will require its team to take care of it.

Developers benefit a whole lot from a sound Design System too. When given the component codes and their corresponding documentation, they’re sure to build things consistently while keeping high quality across all products.

Documentation is key

While a UI library is a part of the system, it’s not limited to it. We also need documentation. That’s because designers and developers must know how to make choices. On top of that, new people come in all the time, so you need to help new hires hit the ground running fast.

Because I’m prone to drama, let me put it this way: what if I disappear? I mean, not as in I took a bus and left everything behind, I mean literally disappear like magic. Poof! Gone. I told you, I love some drama.

Can people keep working on my designs if that happens? I’m not talking about the emotional wreckage of having me going into the ether, but rather how hard it would be for those after me to pick up where I left off and carry on with the work I’ve been doing.

If you’re not into drama like me, let’s make it simpler: what if you start working in a new company? How easy will it be for you to understand the design decisions that have been made before you join the team?

Assets alone can only do so much. While a sound UI library is crucial, it won’t answer questions designers will ask, like “when should I use variation A instead of variation B of component X?”. If there’s not enough documentation provided, then you’re going to spend a lot of time answering context questions and being forced to make decisions.

A beacon to attract talent

Do you know what big names like Shopify, GitHub, Microsoft, or Uber, just to name a few, have in common? They all have well-established Design Systems that are open for partners to use. This is a clear indicator that these companies take design very seriously.

By taking this stance, they’re creating a virtuous cycle of attracting the best talent around because everyone can see this company places a lot of value on design, and the new hires are going to want and keep up the good work that’s been done thus far.

Here at Oivan, we’re on the verge of starting a new Design System for one of our clients, and I’ll be happy to share the progress with you in the coming months. I promise to write about all the blood, sweat, and tears. And about affordance too.

Feel free to check out our work and our design services. Contact Daniel Motta daniel.motta@oivan.com if you have any design needs or other related subjects.

Follow Oivan on LinkedIn.