Post Image

Every UX designer worth a damn is talking about having a Design System in place. If you are still wondering or considering having a Design System for a new product or for an existing one, you are moving in the right direction. A Design System has numerous benefits for an organization.

As any product evolves over time, keeping a consistent design pattern across different areas of the application becomes difficult. The problem is more human than technical.

There are different people involved in the project and there are different moving parts. People take care of their modules and features, but somehow they miss to align with other parts of the project. This becomes a challenge at scale, where, even a subtle variation can initiate a chain reaction of inconsistency. The chain reaction keeps accelerating until it is addressed, but that slows down the design and development process.

This is where having a Design System in place comes in handy. It is a single source of truth and provides all the little details to designers and developers to create a consistent experience for the users. It is like an organization system which acts as a rule book for everyone involved in the project.

Reduced decision making

One of the most time-consuming parts of the product development cycle is the to and fro between different teams towards a goal of coming up with a solution. When the solution is already there as a Design System, it leaves space for the teams to focus on other important parts.

Either it is the design team working on a new feature or the development team tweaking the UI elements, anyone can refer to the Design System to look for answers. Design System is the source of all the design decisions that have already been made. None of the team members have anything more to decide about the behavior of the interface. Designer and developers alike can pick up components from the Design System and focus on the feature in hand, instead of going through decision making.

If UI components are atoms of a design, Design System is the Physics, which governs the laws of design. Once you have the fundamental laws in place, it is much easier to stay within the boundaries and create a consistent user experience.

Smoother process flow

As the development and design team is not reinventing the wheel every time they start working, it eradicates repetitive time-consuming tasks. A lot of the elements are reusable, so it is easy to stay consistent and it eliminates the small inconsistencies that grow with time. Even the quality team will need to spend less time looking for inconsistencies.

Design System makes sure that the product is in alignment no matter who is working on it. Even if you have some new team member, with less experience, it is easier to hand off parts of the project to them with confidence. When you have a Design System in place you have less mental notes scattered throughout the team.

The design components are shared and form the established patterns from which everyone takes components and design guidelines. The team is always in alignment with the idea of how the interface will behave. This lets them focus on important functionalists and user behavior patterns. None of the team members will have to worry about small details like hover color of the button they created, it is already defined, they just have to reuse the element.

Save time and Money

The reduced decision making during the process flow results in a smoother workflow which saves both time and money and reduces the chances of a visual language breakdown of the brand and product over time. The workflow becomes faster and the team can utilize that time in doing other things. In design and development, time is money, so if you are saving time, you are saving a lot of money. This also leaves more space for the exploration of new ideas. The more a team explores new ideas, the more effectively they can come to the right solution for the problem.

With a proper Design System in place, the overall process of generating new ideas is much faster. You are not focusing on the layout and interface elements, as that is already regulated by a set of rules, instead the focus is on the functionality. It results in smoother user experience and more user-centered design decisions.

Figma for organizing a Design System

You can have a Design System in place using any of your favorite design tools, but we prefer using Figma as our primary tool of choice. We love the way everything stays in the cloud and designers are not having to mess around with multiple bloated source files missing linked assets likes images, fonts and iconography. Here are some of the reasons why it fits well in our workflow:

Cross platform
Unlike other tools, Figma has an awesome, fully functional and full featured web interface, which makes it very hard to ignore Figma as a design tool. With teams working remotely and in both Mac and Windows or even Linux and Chromebook (if you are into it), Figma is available everywhere without the hassle of file sharing.

Effective version control
The history of the design updates is automatically backed up and visible. More controlled version control is also available, where you can describe important updates.

If you have worked on Google docs, you will find it awesome yet familiar for design collaboration on the same design file. It also provides options to get design feedback, which makes it easy to iterate on individual projects and collaborate on Design Systems.

The design project lives in the cloud and visible to all the team members in the project. This allows for greater transparency on the progress of the design and also opens the channel for early feedback.

All in one tool
Figma is a single tool for wireframes, mockups, prototypes, and developer handoffs, this makes it a close to perfect fit for maintaining Design Systems. It can be easily shared with the team members and everyone has the latest version of the Design System with them.

The Takeaway

Although building a Design System can be a little time-consuming process to start with, the benefits definitely cover for the invested time. Once you have a Design System in place the overall workflow is faster and efficient. If you have a long term project which is scaling with time, having a Design System in place is a must. It is a good idea to invest in the Design System when the project is small and as the project evolves, the System will keep evolving with it. A Design System can help you build a more efficient team which is driven by definite design decisions, instead of individual opinions.

Ready to start building your Organization’s Design System?

The Jozi Firecracker Factory are passionate about designing, building and implementing game-changing, collaborative Design Systems for Enterprise. If you’re looking to get started with building and implementing your own Design System, get in touch with our UX team to find out more about how having your own Design System can help drive efficiencies and innovation for your product teams.

How good Design Systems can help rapid prototyping in your Organization