Scaling Design Systems

At the beginning of design, the overarching arm is to create something that works and solves your users’ problems. Behind this are usually a set of team members who are deeply connected to the problem they are solving, and even without documentation, has the shared goal imprinted on their minds, enough to guide their design process. However, as teams grow and companies go from one or two designs to several, the challenges becomes more than just creating what works. New hires come with new perspectives and creative juices, and in the quest to deliver excellently, they may introduce new ideas to the designs of the company. Since they are also usually disconnected from the primary aim of the company, they will often design without it. This eventually kick-starts a chaos in the design room. And consistency in design is first to suffer it. 

Design systems are created to curtail these undesirable events and ensure designs within a company remain consistent as the product scale. From a few pages and functionalities, products develop into hundreds of pages with new technologies. It is easy to lose track and break the experience of users when products become cumbersome. With design systems, designers have a set of standards for design and concepts on which the designs should be used. However, design systems should be regarded as a continuously but harmoniously changing system. The essence of a design system is scale, and this includes when scaling teams, products or enterprises. 

What should be accounted for when scaling design systems. The first are the core principles and ethics of the company. Rather than being a combination of colours and lines, designs are meant to be meaningful. And this meaning, when not communicated properly and consistently, will leave products in the strange directions that are often undesirable to the owners, and users as well. Is your design meant to convey complexity or minimalism, exclusivity or openness, conservation or vibrancy? With multitude designers having different ideas on how the product should work, when the principles and ethics are not clear, your product may break rules that you do not enjoy breaking. 

When the company is clear on its core principles and ethics of work, it must sort out its leadership. Small teams often depend on a solitary designer who dictates the pace and pattern of all designs in a company. When building for scale, this type of leadership will likely crack, creating frictions that slow down work that it aimed to speed up. While a design system is created, it should allow contributions for the whole team involved in the design process at that company. This is exemplified by Google’s committee by design. The middle ground is to have a team that decides the design direction of the company. Knowing which stage of development you are should inform your decisions. Your goal is to reduce friction while staying up to date with the product’s design needs. 

Companies usually already have design libraries that designers can pick components to use. This becomes limiting when design is needed to scale. Design system comes to the rescue by not only defining what components are used in the design of products, but how they may be used. Creating an initial design system can sometimes take several months or years. To be able to define that works for a company, the company must have collected enough feedback overtime to help refine its direction. While this process does not stop, at some point, there is enough feedback for a company to set up guidelines for its design. An assembly of product components and how they may be assembled are put together. A popular approach is atomic design, which documents designs from their singular components to their appearance, along with other components, on pages. 

Even though design systems are a set of standards, these standards must remain flexible to feedback and changes. While design system are not meant to change abruptly, this will be chaotic, they are expected to evolve with time. Companies or product teams must continuously listen to feedback, measure the impact of their design and combine this data with their creative ideas to provide new design solutions. 

After design systems are created, and other values defined, companies need to develop an efficient and effective way of educating everyone in the company of the company’s design direction and system. When such information is broken and does not reach all the people who need it, the essence of the design system becomes defeated and companies may continue to see errors they sought to prevent with the design system. 

Photo by Kaboompics .com from Pexels

[Draft] My Life is Meaningful

I’ve got to say I don’t necessarily believe the world is vain. A general lamentation at death, especially one regarded as untimely, is that it is all vanity. It is often a reaction to loss and our inability to deal with endings. I am grateful for this ambit of time, that I, a speck in a moving blue, have to explore sated desires. And it is more reason why I think it is often ill-advised to spend your time pursuing life in fear, pursuing ambitions that are not the ticklers of your soul. The result of my life is my life well-lived, a judgement that only I have the power and knowledge to proclaim. You may lose things, objects, people, parts of your body, and perhaps sadly your memory, but you’ll never lose the power that the feeling of making your own path sprouts in you, albeit and conjunct all the influences that surround you. I am a moment in time and my life is meaningful.

to be continued.

What is Color Theory?

Here is the first of my articles on design. You’ll probably find some of these articles already online. I am just documenting some of the things I have learnt and anyone could follow the trajectory to become good designers too.

Understanding colors helps you achieve coherence in design. Colors are visual and psychological. They direct the attention of the person and help them experience a design a certain way and you want to be able to get people to pay attention to the right things. Rather than enjoy the beauty of your design, you do not want people pondering over how jarring or underwhelming your design is. This is why a good designer should learn about color and how they work together. That brings us to the first definition.

So what is Color Theory?

Color theory is a set of principles that guides designers to create cohesive color combinations. These principles help designers choose and combine colors effectively when creating color palettes. They can be represented in various forms such as color charts, color wheels, color schemes, color triangles etc.

There had been several attempts to define color relationships in the past. One of such was Johann Wolfgang van Goethe’s book titled Theory of Color. Van Goethe’s book had an equilateral color triangle which contained nine colors, defining that color relationships were categorized by emotions. Before him, Sir Isaac Newton has presented a color theory that was a spectrum from splitting white light into red, orange, green, blue, indigo and violet. Others include Nobel prize winning chemist, Wilhelm Oswald, through his book, The Color Primer ; Louis Prang who wrote the book Theory of Color and popularized the primary colors in the form of red, blue, and yellow.

DecoArt Blog – Color Theory Basics: The Color Wheel

Categories in Color Theory

  1. Primary Colors– These are yellow, red and blue. They are the fundamental colors that combine to form other colors.

Easy Pace Learning. Primary colours learning primary colours

2. Secondary Colors – When you combine each of the primary colors with another primary color, what you get are secondary colors. The secondary colors are green, orange, and purple.  

Macie Gardner – Secondary Colours

Tertiary Colors – These are the colors you get when you combine each primary color with each secondary color. The results you get are red-orange, red-purple, blue-green, blue-purple, yellow-orange, yellow-green.   


Pinterest


Tertiary Colors – colors next to each other on the color wheel 

Complementary Colors – There are colors that are opposite one another in the color spectrum. E.g Orange and Blue.  


Color Theory: Color Harmonies | The Paper Blog

Triadic Colors – These are three colors that are equidistant from one another in the color wheel. E.g. Red, blue, yellow.


Color wheel. Triadic color scheme.

Analogous Colors – These are two or three colors beside one another on the color wheel. They are usually easy on the eye when used together. E.g. Blue, green-blue and green.


Split Complementary Colors – These are three colors where the one color is directly opposite the two colors spaced out by one color. E.g. Red, green and yellow.

Double Complimentary Colors (Tetradic) – These are four colors consisting of two pairs of colors complementary to another.

Monochromatic Colors – This is a colors made of the shades and tints of one color.

Square Color Scheme – These are four colors evenly spaced from one another on the color wheel.

Properties of Color

www.tes.com (Contrast – Lessons – Tes Teach)

HUE

A hue is the name of a color which signifies its position on the color spectrum.

SATURATION

This refers to the intensity, chroma or purity of a color. A color that is bright is highly saturated while one that is dull is desaturated.

BRIGHTNESS

This is the degree of light or darkness in a color. It may also be described in terms of brilliance.

VALUE

This is the degree of darkness or lightness of a hue. Variations in value are used to create a focal point for the design of a picture. Contrast of value separates objects in space, while gradation of value suggests mass and contour of a contiguous surface. Gradations of value are also used to create the illusion of depth, thus producing three dimensional figures. White, black and gray are referred to values without hues.


TINT

A tint is amount of white added to a color

TONE

The tone is the amount of gray added to a color.

SHADE

This is the degree of black in a color.

COLOR TEMPERATURE

istockphoto.com- Color wheel, warm and cold colors



WARM COLORS

These are bright colours. They include yellow, red, red orange, orange, and red violet. Basically, the reds, yellows and oranges. These also describe the temperature of the colours.

COOL COLOURS

These are darker colors like blue, green, violet, yellow-green, blue-violet etc. Basically the blues, greens and purples. They are the other side of the color temperature.

There you go! A simple introduction to some terms in understanding how colors work together. Look forward to my next article.

Cheers