Live eventJune 18Build Your Portfolio with AIGet ticket →

Design Systems · B2B · White-Label · 2020 – 2022

Built to be used
without me.

Every new enterprise customer triggered the same cycle: gather brand assets, manually translate colors and fonts into SDK configuration, go back and forth with engineering, iterate with the customer, iterate again. About 200 hours of work per onboarding, every time. Deeper customisation beyond the basic SDK theming required paid professional services. Every iteration had a price tag. Sometimes they lost the customer mid-process because it took too long.

The fix was not a new tool. It was a Figma file, structured on the same logic as the design system, built on a token architecture, and taught to the business team in three workshops. Sales ran their own demos. Customer success ran their own onboarding.

Two months of back-and-forth per customer became a week. The system stayed in active use for over two years. IDnow's own pitch promised a product that was configurable. The reality was 200 hours and a professional services invoice every time a customer wanted to go further.

Role

Senior UX/UI Designer & Design Systems Lead (Freelance)

Timeline

May 2020 – December 2022
2 years 8 months

Team

Remote · Design, Engineering,
Product, Sales, Customer Success

Stack

Figma · Design Tokens · Figma Plugin

Skills

Design Token Architecture White-Label System Design Figma Plugin Development Workshop Facilitation Cross-Functional Collaboration

Deliverables

Design System v1-v2 White-label Figma Configurator Token Extraction Plugin Business Team Workshops

~200h

Per-customer onboarding
before the system existed

~40h

Customer onboarding after.
Down from ~200 hours

1 week

Build time per configurator
version: 2 versions shipped

2 year+

In active use by sales
and customer success teams

01 — The Bottleneck

The sales team had a problem
nobody thought was a design problem.

IDnow builds AI-powered identity verification infrastructure for banks, fintechs, and regulated businesses. B2B, SDK-based, white-label: enterprise customers integrate the product, put their own brand on it, and present it to their own users as if it were theirs. That promise was the entire value proposition.

For banks and fintechs, a verification screen that looks out of place is a screen users abandon. That was the gap. Brand consistency in a KYC flow is not cosmetic. I had a call with the sales team. It was supposed to be about alignment. What I actually heard was a bottleneck hiding in plain sight.

Every new enterprise customer triggered the same cycle: gather brand assets, manually translate colors and fonts into SDK configuration, go back and forth with engineering, iterate with the customer, iterate again. About 200 hours of work per onboarding, every time. Sometimes they lost the customer mid-process because it took too long.

For prospects, there was nothing to show at all. Just a live demo in IDnow's own branding, asking someone to imagine theirs. The design system I was building (v1 was live, v2 in progress) was solving a lot of things. It was not solving this.

IDnow · Customer branding onboarding

Before
vs
After
Customer signs contract
Design team picks up
Iterates with engineering
Sent back for review
Customer requests changes
Another iteration round
Resolved, or maybe not.
~200 hours · ~2 months High risk of churn
Customer signs contract
Business team opens Figma
Configures branding
Clickable prototype ready
Customer confident. Done.
~40 hours · ~1 week Customer stays

02 — The Insight

A Figma file turned out to be
the whole product.

The insight was not complicated. A structured Figma file, built on the same logic as the design system, could give customers a hands-on way to see and configure the product in their own brand. Colors, typography, button shapes, corner radius, hover states: all adjustable, no engineering involved, no design team required for every iteration.

IDnow white-label color configurator Figma Configurator v1

It worked in two modes. If the customer had a design team, they got access to the file and configured it themselves. If they did not, IDnow's team configured it based on their existing app.

Either way, the output was a clickable happy-path prototype showing exactly how the SDK would integrate into their product, in their branding, before a single line of code was written.

The token architecture made this possible. The design system used design tokens (named values for colors, spacing, radius, typography) as the single source of truth. The configurator file was built on those same tokens. Change a token, and the prototype updates everywhere.

IDnow token color zoom Zoom changing colors on v1

The system served 17 languages, two platforms, and the entire white-label product line.

"A tool only a designer can operate is not a solution. It is a dependency." — On designing for transferability

03 — The Build

We brought the problem
to an internal hackathon.

Our team was me as designer, a Software Engineer, a Software Architect, and the Technical Lead from the core platform team. Ciprian Bostan, Maxwell Anipah, Dmitry Simonov and I mapped the problem together, built out the solution concept, and partially implemented it.

The developers did not need convincing. Manual configuration was draining engineering hours on every single onboarding, not just the big ones. The problem was theirs too. We placed third at the hackathon.

IDnow hackathon — team brainstorm and prototype session

Aug 2020: The hackathon team building the proof of concept.

1

Clients with a design team want to make their own changes to the SDK and customise it to fit their brand without waiting on IDnow.

2

Potential customers can quickly try the demo in their own branding and convert to a paying client faster.

3

Sales and customer success can walk prospects through the product themselves, and one day, it should be fully self-service on the website.

Two months later, the first Figma configurator took shape. The core design decision was the same as in the hackathon: abstract the complexity. Customers should never see a config key. They should see a color picker, a preview that updates as they change things.

Version one, in October 2020, covered core branding. In March 2021 I took the token work further for AutoIdent WEB — the same screens, with the media and breakpoints swapped for the web platform. The second configurator, in May 2022, added more granular controls (secondary color palettes, font weight overrides, more precise radius options) and reached beyond design to serve the sales and customer success teams directly. Each version reflected what the business team learned trying to use the previous one.

Figma Configurator v2

May 2022: Figma Configurator v2

04 — Teaching It

The business team needed to
run it without me.

I ran two to three workshops for three to four members of the business team, teaching them how to edit the Figma files, apply a customer's brand, and understand the structure well enough to prepare their own sales demos.

The goal was concrete: they needed to be able to do this on a Tuesday afternoon without putting a ticket in a design queue.

A tool that only a designer can operate is a dependency, not a solution. That distinction mattered here. That distinction mattered here. The business team was not a department that should be blocked on design for every customer call.

After the workshops, they were not. They ran their own demos. They prepared their own customer configurations. They understood what they were changing and why.

IDnow happy path workshop documentation

05 — The Token Layer

The Figma file fed the plugin.
The plugin fed the developers.

While the workshops were running, I went deeper on the token side. I learned how both iOS and Android were consuming design tokens, then built a Figma plugin that extracted hex color values directly from the configurator file and formatted them for engineering handoff.

The Figma file fed the plugin. The plugin fed the developers. The loop closed without a designer in the middle.

Before the plugin, engineering had to manually copy hex values from screenshots or Zeplin exports, match them to SDK variables, and test each one. That step was error-prone and slow. After the plugin, the output was a formatted config file ready for integration.

This was not a product feature visible to customers. It was infrastructure. The kind of work that nobody sees because, when it works, nothing breaks and nothing is slow and nobody has to wait. The configurator only worked because the token architecture underneath it was already solid.

The design system was the foundation for all of it. Without the token architecture, there were no values to extract. Without the tokens, there was no configurator. Without the configurator, the business team was still spending 200 hours per customer and losing some of them halfway through.

IDnow · Design System Tokens managed via Configurator

06 — The Outcome

200 hours of work
became a week.

The business team started running their own customer demos. What had taken roughly 200 hours of work per customer was now handled in a week. Prospects could see IDnow in their own branding before any contracts were signed. Customer success had something concrete to hand to new clients during onboarding, not a spec sheet asking them to trust the process.

The Figma configurator and the plugin stayed in active use for over two years.

~200h

Per-customer onboarding before

Reduced to ~40 hours after

2 year+

In active production use

By sales and customer success, without design involvement

2 versions

Configurator shipped

Each built in approximately one week

4

Business team members trained

Running independent demos within a week of the first workshop

07 — What They Said

From the people
who were there.

"Karla is fast, precise, organized and can quickly research, ideate and deliver. She connects with the right team members and figures out issues, then fixes them with her huge technical know-how of apps, design systems in Figma and complex integrations."
Lino Wiehen Lino WiehenDesign Lead, Direct Manager, IDnow
"With Karla's help, we were able to simplify the process of demonstrating to customers and prospects our adaptable UI and the platform. With the design utility, customers can choose their screen design and interface options of choice. As a result, we can now provide more personalized support and guidance to our clients during the platform setup and customers' onboarding."
Peter Robert Peter RobertHead of Customer Success, IDnow
"Her assistance enabled us to seamlessly showcase our white-label product to customers with their own branding, allowing us to validate proposals and demonstrate how our product integrates seamlessly with theirs, resulting in increased sales and partnerships."
Christoph Brütting Christoph BrüttingSenior Manager Business Strategy, IDnow
"Our life became way easier by having a centralized system up to date to the latest product requirements."
Souheib Selmi Souheib SelmiEngineering Lead, IDnow
"Karla demonstrated a deep understanding of the technical limitations we faced, which helped us achieve the best possible result without sacrificing the overall style and idea."
Pavel Antonov Pavel AntonovSenior Software Engineer iOS, IDnow

08 — Reflection

What I would build
differently today.

Each version of the configurator took one week to build. With what I know now and current tooling, I could build the same thing in a couple of days. That does not change what it did then. It does make me think about every other process inside a company that is silently draining 200 hours because nobody has stopped to ask the right question.

The question I asked in that sales team call was not "how do we fix the design process?" It was "where is this actually costing you?" The answer was not where anyone expected it. That is still the question I ask first.

The takeaway

Two platforms. 17 languages. One token system.

200 hours per customer.
A week. Every time.

The system did not eliminate the complexity of white-label onboarding. It moved it upstream (into a Figma file) where it could be handled once instead of 200 hours at a time, for every customer, forever.

Ready to work together?

Let's build something
worth remembering.

Book a free 20-min chat → Or check other options →