Transcript
This transcript was autogenerated. To make changes, submit a PR.
Hello everyone.
My name is Paula.
I'm a principal engineer at Zscaler.
And before Zscaler, I was in Adobe for almost 11 years, working on multiple
products from Adobe Sign PDF, Adobe X to Adobe Xpr, and also enterprise
solutions like Adobe Experience Manager.
Today I'll be walking you through how to design tokens can evolve from
a design tool into true platform infrastructure and a scalable,
multiple platform design systems.
So the big problem in fragmentation, right?
Traditional design system phase fragmentation, static
style guides don't scale.
Hand of create frozen drift and siloed implementation result in inconsistent
user experiences, works manual design works, aids to a technical date.
This fragmentation.
Starts three groups.
Basically, the customer expect consistent branded journeys.
Engineers want automation and governance and designers needs as a leading,
but without the manual overhead, without alignment, all three suffers.
So here is the paradigm shift tokens as infrastructure.
So design tokens represents a cept instead of just a static fellows.
We treat design decisions as programmable infrastructure.
These decisions becomes version able to reusable and aligned with platform
engineering Principles like automation and sales service bookings are.
These design tokens basically are structured in hierarchy.
The role values evolve into global semantic, and
finally, the component tokens.
This progressive abstractions provide flexibility while ensuring consistency
and a single source of truth.
How this orchestration pipeline works, right?
Tokens are defined in source format, ization.
They're transformed fi the build pipelines into platform specific targets like the
CSS variables, SWIFT code or Android xmo.
One definitions, many output.
Then the team composition.
I took in for system enable automated team generations multi-brand identity,
light, dark modes and accessible driven teams can all be created
without duplicating definitions.
In our use case at Zscaler we have our system design system called Nimbus.
We were able to consulate repositories and implementing tokens which
reduce the bundle size by two 40 kilobytes and improve the first
Contentful paint, which is also a very important web vital to almost 18%.
Then GitHub's workflows and types of users and developers experience.
This is the case study, if forced 500 enterprise rolled out tokens
across seven product lines and three acquisitions Result seven, 3%
sew designing stances, 40% foster feature development, and a hundred
percent automated WIC gap compliance.
Then, so when you talk about governance and compliance the governance
ensures the trust decision, schema, validation, and forces standard.
Automated contrast testing guarantees accessibility.
The peer approval bring in cross-functional alignment and
documentation updates automatically.
And this is the how the lifecycle works for the whole token system.
If formal lifecycle answers, evolution without the cows token
moves through the creation, review, distribution, monitoring, and
structured deprecation process, this balance, innovation and stability.
From the developers ex perspective, the difference is night and day before
we have scattered hard coded values.
And after that, now we have type safe tokens id auto complete
and single source of truth.
The, we all definitely have a lot of challenges.
Adoption is never smooth.
Resist chains, legal systems complicate integrations and
the governance may seem risky.
Risky, but with code mods, phase rollout, schema validation and proof
points, these challenges are solvable.
And how if phase rollout works right, you start with the audits and standards,
then set up the foundation report.
Run a pilot, then scale and automate pipelines, finally
drive continuous improvements.
What are the key takeaway from all of this?
Tokens are infrastructure, not just the styling.
They deliver a single source of truth, automated compliance, and
measuring efficiency against.
The call to action assessor design system maturity starts with a focus pilot and
build governance alongside architecture.
This is how we scale design system for future, and I always say design
token source to your API contract between the design and development.
So hope you all like the presentation and thanks.