Featured case study

Contact

Denver

New York City

636 11th Ave
New York, NY 10036

Tidying Up Digital Homes With Design Systems

How to use a Marie Kondo–style approach to organize all things digital

by: Julie Mannheimer

April 17, 2019

Tidying up with Marie Kondo is a phenomenon that has taken the world by storm. Marie Kondo has developed a simple method to help declutter and organize your home. After learning about the KonMari Method of tidying up, I was inspired to try this in my own life. I organized my wardrobe and kept everything that sparked joy. After folding everything neatly and putting each item away, I felt a sense of lightness and can now easily find what I’m looking for. It has saved so much time getting dressed in the morning.

Design Systems Are the Key to Keeping Your Digital Properties OrganizedAs I went through the steps of the KonMari Method of organization, I realized that I apply similar steps in my everyday work. As an experience designer, I’ve found that design systems are the key to keeping my digital properties organized so that changes and updates can be made seamlessly. When a design system is set up properly, creating new features and templates can happen fairly quickly. This allows us, as designers, to focus on solving user needs and creating an overall better user experience instead of spending our time on mundane tasks of re-creating patterns and modules.

Whether you’re starting from scratch, have an existing system, or need to merge designs from different areas of your organization, here are six ways you can leverage the KonMari Method when organizing your design system:

“Lay” everything out to evaluateTo make sure you’re starting the process off with a full scope of the project, I recommend starting with a workshop and including all the team members involved, such as product owners, product managers, designers, and developers. Create a list of all elements to be included in your design system, such as existing components, patterns, and any new items that may be needed. Take the list and put items on sticky notes for easy organization for the next step of this process. We use sticky notes religiously during workshops because it helps us easily organize all our thoughts and ideas into visual groupings.

Organize by category, not by “room”In the KonMari Method, you don’t go from room to room while organizing—you go from category to category. In this case, the “room” is a page, so instead of organizing based on the pages you have to create, you need to think broader of where to place certain elements and patterns that make up the website. Therefore, in this step, you’ll begin to organize everything the team has written down on the sticky notes into categories that make sense for your team. This is where I look at other design systems for research and inspiration to see how they organize their digital assets. Some of the main categories for the product side are “foundational elements,” “components,” and “patterns.” I usually like to reference the Atlassian design system because it breaks out its system larger than the product itself. The Atlassian design system also categorizes its system for its brand, marketing, and content team. After you have figured out the different categories the team may need, you can move on to the next step to further refine your system.

“Does this spark joy?” Is this something necessary for the business, team, or user?The most important step of the KonMari Method for tidying is asking yourself, “Does this spark joy?” This step in organizing your design system is just as important. You want to make sure that your design system includes all of the essential components, but you don’t want to overcrowd and overcomplicate it with unnecessary elements that may distract from the project.

As you and your team begin to organize the list of items you laid out to evaluate, ask yourself, “Is this something we really need?” Just because another design system has a certain functionality or feature it doesn’t mean your system needs it as well. For example, some of our clients have asked us to reference Material Design from Google. They wanted the same interactions and patterns just because Google was doing it, but it did not make sense for their product. Design systems are unique; the reason that Material Design works for Google is because it was made for Google.

Although the last three steps are working together simultaneously in your workshop, you will start to see the system all come together in the next step.

Create an orderThis step usually comes naturally as you start to categorize your sticky notes. As you begin to place similar items together, for example, buttons and links, you will start to create an order for your design system. Work with the team to figure out the order and grouping that makes the most sense for your product. Here again, evaluating other design systems to see how they are organized is extremely helpful. Remember, the easier it is to find a feature or component, the quicker it’ll be to solve problems when they arise.

At the end of your workshop, each team member should have a clear path to the start of a design system.

Come up with a process to streamline your design systemAs the design system starts to come to life, this is when the team should start to identify owners and create a seamless way to manage new features and update existing components. Discuss roles and owners on each team, and identify who will be responsible for managing your design system. Discuss sprint cycle length to figure out how often you will iterate and evolve new features and components. It is important to come up with a process to streamline your design system because without clear ownership, the system will eventually become disorganized again.

Develop a design system libraryAfter completing the KonMari Method, individuals are rewarded with an organized home where they are able to find items easier. Similarly, at the end of this process, all the hard work you’ve done to organize your design system will come to life in a design system library. Your design system library will house all the decisions you’ve made about design principles, visual assets, patterns, and so on. Similar to the Atlassian design system I shared earlier, this is a great example of live coded elements that are ready to use within the team. Designers and developers will use this as single source of truth as they work on existing features or implement new features.

The powerful thing about design systems is that they’re a central repository of shared design patterns and practices that can help an organization push and develop its product. The main goal is that the design system bridges the gap between designers and developers to truly make a cohesive and user-friendly product. Design systems are an ever-changing environment, and the design system will be the North Star for the future of the product. Follow these organizational tips, and you’ll be well on your way to a more organized home for your product.

Author: Julie Mannheimer, Senior Experience Designer
Julie is a Senior Experience Designer at Ogilvy. She is a multidisciplinary designer with a passion for transforming complex information into elegant experiences, from initial concepts through detailed execution.

She brings over 6 years of experience in visual and interaction design, research, and strategy to her role at Ogilvy, where she has partnered with companies including Aetna and Transamerica. Before joining Ogilvy, she worked as a UX and UI designer for the Boulder- based financial design firm, Markit.