Design system optimisation

Our ultimate goal of the design system is to create a cohesive user experience. An experience in which users feel empowered and can reuse their existing knowledge intuitively to navigate through your software and achieve whatever they set out to do efficiently.

Design Systems should be structured the way the team works. Establish the guiding rules and principles that support and drive both - the design process and the product for which it is designed. Are there any other aspects to consider? 

​

Can Design System influence SEO performance?

​

SEO and design systems initially appear to be opposites. Designers focus on making a site look fabulous and providing accessible, fluid navigation. In reality, CSS styles, including the Design system, are essential for maximizing SEO. After all it is a collection of reusable code components that build real software applications. When someone opens your website, all your Design system styles are loaded with a CSS file. 

Anything more complex than industry-standard CSS or HTML can affect your page search ranking.

First thing’s first – disaster awaits if you redesign a website without factoring your SEO into the equation.  Ensuring that a redesigned website can still find high-performing pages is the only way to maintain SEO progress, though.

​

It is not a problem if your visits are counted in the hundreds. A lightweight Design System is a BIG DEAL for a product like ASK.fm with millions of google impressions daily.

​

What Are Google's Core Web Vitals & Why You Should Care About Them?

​

To measure these essential aspects of user experience, Google chose three corresponding metrics:

• LCP, Largest Contentful Paint: This measures how long it takes for the largest piece of content to appear on the screen. 

• FID, or First Input Delay: This measures how long it takes for the site to react to the first interaction.

• CLS, or Cumulative Layout Shift: This measures the visual stability of your site.

​

Objective Key Result (OKR) 

​

Our current Google core Web Vitals score of 22 was below industry standards. Top players such as Facebook and Twitter had scores above 50 and Youtube even above 60. As an ambitious goal, we thought it would be great to double our score and get closer to 50.

​

Strategy:

• Improve page speed

• Provide a clear website structure

• Improve interlinking

​

We concentrated on the refactoring of the following components: 

• Color styles

• Text styles

• Grid system

• Iconography

• Buttons

• Input fields

• Selection controls

• Cards