Insider One Marketing Design System
Insider One
Dec 2025 - Jun 2026
As the Senior Digital Designer, Creative, Web and Design Systems, my role was to design and build a scalable marketing design system for Insider One. I led the structure, component logic, visual system, module library, and adoption strategy to help the marketing design team produce faster, more consistent, and more reusable work across web, campaign, event, and brand assets.
After the Insider One rebrand, the marketing team needed a more scalable way to produce high-quality design assets across different formats, regions, campaigns, and product launches. The challenge was not only to create reusable components, but to build a connected production system that could support designers, non-designers, and cross-functional teams without breaking brand consistency.
The system was structured around three connected libraries:
Component Library, Module Library, and Visual Library. Each library had a clear role in the production workflow.
The Component Library included UI, brand, and visual components, supported by a global Figma variable structure. These components acted as the foundation of the system, defining typography, colours, spacing, states, variants, and reusable behaviours.
The Module Library transformed these components into ready-to-use web modules. Each module was built with nested components and exposed controls, allowing users to customise layout, device, theme, content, and visual options from the Figma right panel without manually editing the artboard.
The Visual Library brought together more than 700 web visuals as component sets. These visuals were connected through a Super Visual component, allowing teams to browse and swap visual assets through variants and instance controls.
Component Library:
A scalable foundation of UI, brand, and visual components designed with variants, states, booleans, text properties, and reusable logic. Components were built not only for visual consistency, but for practical daily production.
Module Library:
A collection of ready-to-use web modules built with nested component structures. These modules allowed designers and non-designers to customise complex layouts from the right panel while keeping the structure, spacing, and brand behaviour intact.
Visual Library:
A centralised visual asset system containing 700+ reusable web visuals. By placing these assets inside a Super Visual component, the team could access and swap approved visuals directly inside modules and campaign layouts.
Global Variables:
The system used Figma variables, component properties, variants, booleans, and nested instances to create a controlled but flexible production environment. This turned Figma from a static design canvas into a parametric design workspace.
The core principle of the system was simple: structure stays fixed, customisation stays flexible.
Instead of asking every designer to rebuild layouts manually, the system exposed the right decisions at the right level. Users could change theme, device, layout, item count, copy, visual selection, logos, badges, and CTA content through controlled properties, while the underlying design logic remained protected.
This approach reduced the risk of inconsistency and made the system usable for different levels of design maturity. Senior designers could build and extend the system, while mid-level designers and non-designers could use the existing components and modules safely.
he rebrand became the catalyst for building Insider One’s Marketing Design System.
As production demands increased, it became clear that sustainable growth required more than creative output. It required infrastructure.
The principles developed during the rebrand later evolved into the Component Library, Module Library, Visual Library, and global design standards that now support everyday marketing production.
What started as a necessity during launch eventually became the foundation for a scalable design operation.
Building the system was only the first step. The next challenge was adoption.
To support the team, I created a structured adoption plan built around live walkthroughs, 1:1 sessions, practical tasks, show-and-tell reviews, and guided real-work usage. The goal was not to run a traditional training programme, but to integrate the system into daily production.
Each team member was onboarded through their own workflow. Event designers worked with event assets, motion designers worked with visual and video structures, daily production designers worked with reusable components, and senior designers explored more complex component and module logic.
The adoption strategy focused on real work, not artificial exercises.
The system helped the team move from one-off asset creation to reusable production. It reduced repetitive work, improved consistency, and created a shared design language across web, visual, campaign, and event outputs.
By centralising components, modules, and visuals, the team could produce assets faster while keeping the brand more coherent. The system also created a stronger foundation for future AI-assisted workflows, where structured components and modules can be used as controlled building blocks for landing page and marketing asset generation.
The system was rolled out gradually through internal team sessions, individual onboarding, and real production use cases. Instead of forcing the team into a new workflow overnight, the adoption process allowed each designer to understand how the system could support their own responsibilities.
The rollout started with system walkthroughs and practical 1:1 sessions, then moved into component creation, property controls, and real-task application. This helped the team build confidence while giving space for feedback, missing components, and improvement ideas.
The Marketing Design System transformed Insider One’s design workflow from fragmented production into a scalable, connected system.
By combining a Component Library, Module Library, Visual Library, global variables, nested components, and controlled properties, the system created a practical infrastructure for faster and more consistent marketing design production.
More than a library, it became a production layer for the team: a way to build, customise, scale, and maintain brand quality across different formats and use cases.
The result was not just a cleaner Figma file. It was a new way of working.