information design

Most of what I've built at Merkle lives behind an NDA. But the process of building a presentation design system from version 1 to version 5, across three years and 60+ projects, is a story worth telling on its own.

objective

Build a presentation design system that lets a small team deliver consistent, on-brand work for global clients — fast enough to meet sales deadlines, flexible enough to adapt to any brand.

skillset

design system

cross-team collaboration

ui design

Most of what I've built at Merkle lives behind an NDA. But the process of building a presentation design system from version 1 to version 5, across three years and 60+ projects, is a story worth telling on its own.

objective

Build a presentation design system that lets a small team deliver consistent, on-brand work for global clients — fast enough to meet sales deadlines, flexible enough to adapt to any brand.

skillset

design system

cross-team collaboration

ui design

Most of what I've built at Merkle lives behind an NDA. But the process of building a presentation design system from version 1 to version 5, across three years and 60+ projects, is a story worth telling on its own.

objective

Build a presentation design system that lets a small team deliver consistent, on-brand work for global clients — fast enough to meet sales deadlines, flexible enough to adapt to any brand.

skillset

design system

cross-team collaboration

ui design

I’ve been part of an Information Design team for about 3 years at Merkle. We help different teams around the world present their content in the best way possible, coming up with new formats and trying different types of software for this purpose.

To be able to deliver consistent results on time and make other teams shine, we work with various design systems. I’ve been in charge of setting up and organizing the design systems we use the most (currently on Figma and Figma Sites) during my time at Merkle. Since most of the content we’ve worked with is confidential, here’s a peek into my design process 🙂

Our target audience

  • Sales teams from different companies and industries

  • Decision makers in power positions

  • Marketing teams

  • Visitors and savvy users in tech events

User needs

For our team:

  • Scalability

  • Adaptability to different brands

  • Flexibility and modularity

  • Ease of use

  • Reliability

For marketing teams:

  • Ease of use, during and after the design process

  • Flexibility to allow different types of content, depending of the need

  • Personalization

functional requirements

  • The user should be able to handle the presentation given with a regular mouse and keyboard

  • The user should be able to add information using platforms already known to him (Microsoft Office tools, most of the time)

  • The designer should be able to personalize every part of the presentation interface depending on the brand he’s working with

  • The designer should be able to add custom pieces to the design system as needs and requests come

methodology

Since this was my first time setting up a design system and my team was not adapted to Figma yet, I started researching how different design systems were setup in other companies. We had an old presentation template in Adobe XD that served as a starting point to know which pieces we needed to build, though it was not optimized or set up taking advantage of all the features available in the software.

Understanding each part of the system and creating the template

  1. I classified all the parts of the existing template based on their location in the page and specific function: Global and specific navigation, content area (placeholders for body copy, illustrations, mockups and other resources) and technical information, when the theme required us to.

  2. Based on the components previously catalogued, we created all the main files needed to build the templates taking into account dedicated font files, color palette files and variables, and the setup of a light and dark theme using Figma’s variables. The components were built and so were the template files, having different design patterns setup as well flexible enough to be customized according to different brands.

Testing and iterations

We created a test presentation and set up an intake file to gather all the information from our internal users — the marketing and sales teams. With their direct feedback and the way we saw them interact with both the template and the intake file, we started making changes.

What were the biggest changes during the first months using the new system?

  • We changed the visual template of the intake file, since we realized most teams were most comfortable working in spreadsheets.

  • We changed the way some of the pieces fit in the file, making personalization easier. We had more custom template requests than what we were expecting.

  • We improved the animations by setting up templates for this as well. Creating animations was time consuming at first and we realized we needed to create components to streamline it.

current state

After more than 2 years working on the design system, we’re on version #5 and still working on it. We also launched a second design system to build microsites, based on the components built for the presentation design one. Moving forward, we will continue making new components and making improvements with the new features continuously released by Figma. As of now, we’ve built more than 60 presentations and sites for teams located in all continents and all sorts of industries.

— final thoughts

Three years into this project, the most surprising thing I discovered is that I'm good at organizing information — something I never thought of as a design skill until I was doing it at scale. What keeps me invested is being able to watch a system grow and improve across dozens of real use cases, testing new tools like Figma Sites in the wild, and knowing that what I build makes my team's work easier.

let's be friends

built on framer, powered by peach green tea

let's be friends

built on framer, powered by peach green tea