Unified digital experience

Jump to
Introduction

At dsm-firmenich we operate as a single brand. This ensures that all the activities we undertake help build equity into one, unified, brand. In our communications we follow this Masterbrand-led strategy. Our digital products need to embody and reflect that identity: everywhere and always. That’s where our unified digital experience comes in. 

This experience is all about balance. It’s flexible enough to service all our different personas intuitively, while ensuring a consistent brand journey across our websites, (customer) portals, apps, newsletters, and other digital channels. Whether the content has an internal or external focus, we maintain that same balance and consistency.

What makes this possible? Our new dsm-firmenich design system. Let’s take a quick look at how it works, how it improves the user experience for all locations and devices, and how you can use it!

What is a design system?

A design system is a comprehensive collection of reusable components, ready-made templates, design guidelines, and standards that help teams create consistent, cohesive, scalable, and brand aligned digital products.

You can access our design system here

Branding & naming strategy guidelines for dsm-firmenich applications

To unify and simplify all dsm-firmenich's digital product portfolio, we’ve developed a clear framework that includes primary and secondary wordmarks, icons for navigation, and naming guidelines. The name is primarily used in communications, the wordmark for navigation, and the icon for quick identification in areas like app stores and internal pages. This approach ensures a cohesive and streamlined brand experience across all applications.

Download the guidelines
Frequently asked questions

A design system ensures visual and functional consistency across all touchpoints of a product or brand identity and recognition. This makes workflows more efficient, enhances collaboration between design and development teams and accelerates product development.

Whenever you’re developing an application, website page, or other digital product for dsm-firmenich! Doing so ensures that we maintain a unified brand identity and user experience, and helps us work better together.

You must use the design system when creating or maintaining dsm-firmenich digital products: no ifs, no buts. To make this process as smooth as possible, be sure to involve the D&T Digital Experience Design team in the early stages of your project.

A design system typically includes:

  • UI components: Buttons, forms, navigation bars, etc.
  • Style guidelines: Typography, colors, spacing, grid systems.
  • Documentation: Rules for usage, dos and don’ts, best practices.
  • Design tokens: Variables for colors, fonts, spacing, and more.
  • Patterns: Predefined layouts or solutions for common use cases.

While a style guide focuses primarily on visual elements like typography, colors, and logos, a design system is more comprehensive. It includes both visual guidelines and functional components, along with the code and documentation to implement them in digital products.

  • Designers: Use it to create consistent designs that align with the system, ensuring consistency.
  • Developers: Use the code-ready components to reduce build time and simplify the development process.
  • Product managers: Use it to define requirements that align with established standards.
  • Marketers: Use guidelines to create campaigns that balance their product’s look and feel with the wider dsm-firmenich brand identity.
  • Other stakeholders: Gain clarity on how digital products should look and behave, reducing ambiguity.