Payment of ₹ requested by HONEY VIG. Click the link to pay securely via Razorpay: Make 5000 payment Payment of ₹ requested by HONEY VIG. Click the link to pay securely via Razorpay: Make 5000 payment ⭐ If you would like to buy me a coffee, well thank you very much that is mega kind! : https://www.buymeacoffee.com/honeyvig
Hire a web Developer and Designer to upgrade and boost your online presence with cutting edge Technologies

Monday, August 18, 2025

Automating Design Systems: Tips And Resources For Getting Started

 

Design systems are more than style guides: they’re made up of workflows, tokens, components, and documentation — all the stuff teams rely on to build consistent products. As projects grow, keeping everything in sync gets tricky fast. In this article, we’ll look at how smart tooling, combined with automation where it makes sense, can speed things up, reduce errors, and help your team focus on design over maintenance.

A design system is more than just a set of colors and buttons. It’s a shared language that helps designers and developers build good products together. At its core, a design system includes tokens (like colors, spacing, fonts), components (such as buttons, forms, navigation), plus the rules and documentation that tie all together across projects.

If you’ve ever used systems like Google Material Design or Shopify Polaris, for example, then you’ve seen how design systems set clear expectations for structure and behavior, making teamwork smoother and faster. But while design systems promote consistency, keeping everything in sync is the hard part. Update a token in Figma, like a color or spacing value, and that change has to show up in the code, the documentation, and everywhere else it’s used.

The same thing goes for components: when a button’s behavior changes, it needs to update across the whole system. That’s where the right tools and a bit of automation can make the difference. They help reduce repetitive work and keep the system easier to manage as it grows.

In this article, we’ll cover a variety of tools and techniques for syncing tokens, updating components, and keeping docs up to date, showing how automation can make all of it easier.

The Building Blocks Of Automation

Let’s start with the basics. Color, typography, spacing, radii, shadows, and all the tiny values that make up your visual language are known as design tokens, and they’re meant to be the single source of truth for the UI. You’ll see them in design software like Figma, in code, in style guides, and in documentation. Smashing Magazine has covered them before in great detail.

The problem is that they often go out of sync, such as when a color or component changes in design but doesn’t get updated in the code. The more your team grows or changes, the more these mismatches show up; not because people aren’t paying attention, but because manual syncing just doesn’t scale. That’s why automating tokens is usually the first thing teams should consider doing when they start building a design system. That way, instead of writing the same color value in Figma and then again in a configuration file, you pull from a shared token source and let that drive both design and development.

There are a few tools that are designed to help make this easier.

Token Studio #

Token Studio is a Figma plugin that lets you manage design tokens directly in your file, export them to different formats, and sync them to code.

Token Studio
(Large preview)

Specify #

Specify lets you collect tokens from Figma and push them to different targets, including GitHub repositories, continuous integration pipelines, documentation, and more.

Design-tokens.dev

Design-tokens.dev is a helpful reference if you want tips for things like how to structure tokens, format them (e.g., JSON, YAML, and so on), and think about token types.

Design-tokens.dev screen showing the output of named design tokens generated by the system.
(Large preview)

NameDesignTokens.guide #

NamedDesignTokens.guide helps with naming conventions, which is honestly a common pain point, especially when you’re working with a large number of tokens.

Token configuration
(Large preview)

Once your tokens are set and connected, you’ll spend way less time fixing inconsistencies. It also gives you a solid base to scale, whether that’s adding themes, switching brands, or even building systems for multiple products.

That’s also when naming really starts to count. If your tokens or components aren’t clearly named, things can get confusing quickly.

Note: Vitaly Friedman’s “How to Name Things” is worth checking out if you’re working with larger systems.

From there, it’s all about components. Tokens define the values, but components are what people actually use, e.g., buttons, inputs, cards, dropdowns — you name it. In a perfect setup, you build a component once and reuse it everywhere. But without structure, it’s easy for things to “drift” out of scope. It’s easy to end up with five versions of the same button, and what’s in code doesn’t match what’s in Figma, for example.

Automation doesn’t replace design, but rather, it connects everything to one source.

The Figma component matches the one in production, the documentation updates when the component changes, and the whole team is pulling from the same library instead of rebuilding their own version. This is where real collaboration happens.

Here are a few tools that help make that happen:

ToolWhat It Does
UXPin MergeLets you design using real code components. What you prototype is what gets built.
SupernovaHelps you publish a design system, sync design and code sources, and keep documentation up-to-date.
ZeroheightTurns your Figma components into a central, browsable, and documented system for your whole team.

How Does Everything Connect?

A lot of the work starts right inside your design application. Once your tokens and components are in place, tools like Supernova help you take it further by extracting design data, syncing it across platforms, and generating production-ready code. You don’t need to write custom scripts or use the Figma API to get value from automation; these tools handle most of it for you.

But for teams that want full control, Figma does offer an API. It lets you do things like the following:

  • Pull token values (like colors, spacing, typography) directly from Figma files,
  • Track changes to components and variants,
  • Tead metadata (like style names, structure, or usage patterns), and
  • Map which components are used where in the design.

The Figma API is REST-based, so it works well with custom scripts and automations. You don’t need a huge setup, just the right pieces. On the development side, teams usually use Node.js or Python to handle automation. For example:

  • Fetch styles from Figma.
  • Convert them into JSON.
  • Push the values to a design token repo or directly into the codebase.

You won’t need that level of setup for most use cases, but it’s helpful to know it’s there if your team outgrows no-code tools.

  • Where do your tokens and components come from?
  • How do updates happen?
  • What tools keep everything connected?

The workflow becomes easier to manage once that’s clear, and you spend less time trying to fix changes or mismatches. When tokens, components, and documentation stay in sync, your team moves faster and spends less time fixing the same issues.

Extracting Design Data

Figma is a collaborative design tool used to create UIs: buttons, layouts, styles, components, everything that makes up the visual language of the product. It’s also where all your design data lives, which includes the tokens we talked about earlier. This data is what we’ll extract and eventually connect to your codebase. But first, you’ll need a setup.

To follow along:

  1. Go to figma.com and create a free account.
  2. Download the Figma desktop app if you prefer working locally, but keep an eye on system requirements if you’re on an older device.

Once you’re in, you’ll see a home screen that looks something like the following:

Figma dashboard showing a left sidebar navigation for exploring design files and a grid of thumbnail images on the right for previewing specific files.
(Large preview)

From here, it’s time to set up your design tokens. You can either create everything from scratch or use a template from the Figma community to save time. Templates are a great option if you don’t want to build everything yourself. But if you prefer full control, creating your setup totally works too.

There are other ways to get tokens as well. For example, a site like namedesigntokens.guide lets you generate and download tokens in formats like JSON. The only catch is that Figma doesn’t let you import JSON directly, so if you go that route, you’ll need to bring in a middle tool like Specify to bridge that gap. It helps sync tokens between Figma, GitHub, and other places.

For this article, though, we’ll keep it simple and stick with Figma. Pick any design system template from the Figma community to get started; there are plenty to choose from.

Showing a collection of Figma templates contributed by community members.
(Large preview)

Depending on the template you choose, you’ll get a pre-defined set of tokens that includes colors, typography, spacing, components, and more. These templates come in all types: website, e-commerce, portfolio, app UI kits, you name it. For this article, we’ll be using the /Design-System-Template–Community because it includes most of the tokens you’ll need right out of the box. But feel free to pick a different one if you want to try something else.

Once you’ve picked your template, it’s time to download the tokens. We’ll use Supernova, a tool that connects directly to your Figma file and pulls out design tokens, styles, and components. It makes the design-to-code process a lot smoother.

Step 1: Sign Up on Supernova

Go to supernova.io and create an account. Once you’re in, you’ll land on a dashboard that looks like this:

Supernova dashboard in an empty state. There is navigation in the left sidebar and a summary of activity in the main content showing no design tokens, components, assets, or documentation.
(Large preview)

Step 2: Connect Your Figma File #

To pull in the tokens, head over to the Data Sources section in Supernova and choose Figma from the list of available sources. (You’ll also see other options like Storybook or Figma variables, but we’re focusing on Figma.) Next, click on Connect a new file, paste the link to your Figma template, and click Import.

Supernova dashboard to connect Figma files
(Large preview)

Supernova will load the full design system from your template. From your dashboard, you’ll now be able to see all the tokens.

Supernova dashboard with tokens
(Large preview)

Turning Tokens Into Code #

Design tokens are great inside Figma, but the real value shows when you turn them into code. That’s how the developers on your team actually get to use them.

Here’s the problem: Many teams default to copying values manually for things like color, spacing, and typography. But when you make a change to them in Figma, the code is instantly out of sync. That’s why automating this process is such a big win.

Instead of rewriting the same theme setup for every project, you generate it, constantly translating designs into dev-ready assets, and keep everything in sync from one source of truth.

Now that we’ve got all our tokens in Supernova, let’s turn them into code. First, go to the Code Automation tab, then click New Pipeline. You’ll see different options depending on what you want to generate: React Native, CSS-in-JS, Flutter, Godot, and a few others.

Let’s go with the CSS-in-JS option for the sake of demonstration:

Supernova Code Automation screen showing options for creating a new pipeline that pulls information from other services to produce code documentation.
(Large preview)

After that, you’ll land on a setup screen with three sections: Data, Configuration, and Delivery.

Data #

Here, you can pick a theme. At first, it might only give you “Black” as the option; you can select that or leave it empty. It really doesn’t matter for the time being.

Supernova Code Automation screen
(Large preview)

Configuration #

This is where you control how the code is structured. I picked PascalCase for how token names are formatted. You can also update how things like spacing, colors, or font styles are grouped and saved.

Supernova Code Automation screen showing configuration of tokens
(Large preview)

Delivery #

This is where you choose how you want the output delivered. I chose “Build Only”, which builds the code for you to download.

Supernova Code Automation screen where you choose how you want the output delivered
(Large preview)

Once you’re done, click Save. The pipeline is created, and you’ll see it listed in your dashboard. From here, you can download your token code, which is already generated.

Automating Documentation

So, what’s the point of documentation in a design system?

You can think of it as the instruction manual for your team. It explains what each token or component is, why it exists, and how to use it. Designers, developers, and anyone else on your team can stay on the same page — no guessing, no back-and-forth. Just clear context.

Let’s continue from where we stopped. Supernova is capable of handling your documentation. Head over to the Documentation tab. This is where you can start editing everything about your design system docs, all from the same place.

You can:

  • Add descriptions to your tokens,
  • Define what each base token is for (as well as what it’s not for),
  • Organize sections by colors, typography, spacing, or components, and
  • Drop in images, code snippets, or examples.

You’re building the documentation inside the same tool where your tokens live. In other words, there’s no jumping between tools and no additional setup. That’s where the automation kicks in. You edit once, and your docs stay synced with your design source. It all stays in one environment.

Supernova Code Automation screen where you automate documentation
(Large preview)

Once you’re done, click Publish and you will be presented with a new window asking you to sign in. After that, you’re able to access your live documentation site.

Practical Tips For Automations #

Automation is great. It saves hours of manual work and keeps your design system tight across design and code. The trick is knowing when to automate and how to make sure it keeps working over time. You don’t need to automate everything right away. But if you’re doing the same thing over and over again, that’s a kind of red flag.

A few signs that it’s time to consider using automation:

  • You’re using the same styles across multiple platforms (like web and mobile).
  • You have a shared design system used by more than one team.
  • Design tokens change often, and you want updates to flow into code automatically.
  • You’re tired of manual updates every time the brand team tweaks a color.

There are three steps you need to consider. Let’s look at each one.

Step 1: Keep An Eye On Tools And API Updates

If your pipeline depends on design tools, like Figma, or platforms, like Supernova, you’ll want to know when changes are made and evaluate how they impact your work, because even small updates can quietly affect your exports.

It’s a good idea to check Figma’s API changelog now and then, especially if something feels off with your token syncing. They often update how variables and components are structured, and that can impact your pipeline. There’s also an RSS feed for product updates.

The same goes for Supernova’s product updates. They regularly roll out improvements that might tweak how your tokens are handled or exported. If you’re using open-source tools like Style Dictionary, keeping an eye on the GitHub repo (particularly the Issues tab) can save you from debugging weird token name changes later.

All of this isn’t about staying glued to release notes, but having a system to check if something suddenly stops working. That way, you’ll catch things before they reach production.

Step 2: Break Your Pipeline Into Smaller Steps

A common trap teams fall into is trying to automate everything in one big run: colors, spacing, themes, components, and docs, all processed in a single click. It sounds convenient, but it’s hard to maintain, and even harder to debug.

It’s much more manageable to split your automation into pieces. For example, having a single workflow that handles your core design tokens (e.g., colors, spacing, and font sizes), another for theme variations (e.g., light and dark themes), and one more for component mapping (e.g., buttons, inputs, and cards). This way, if your team changes how spacing tokens are named in Figma, you only need to update one part of the workflow, not the entire system. It’s also easier to test and reuse smaller steps.

Step 3: Test The Output Every Time

Even if everything runs fine, always take a moment to check the exported output. It doesn’t need to be complicated. A few key things:

  • Are the token names clean and readable?
    If you see something like PrimaryColorColorText, that’s a red flag.
  • Did anything disappear or get renamed unexpectedly?
    It happens more often than you think, especially with typography or spacing tokens after design changes.
  • Does the UI still work?
    If you’re using something like Tailwind, CSS variables, or custom themes, double-check that the new token values aren’t breaking anything in the design or build process.

To catch issues early, it helps to run tools like ESLint or Stylelint right after the pipeline completes. They’ll flag odd syntax or naming problems before things get shipped.

How AI Can Help

Once your automation is stable, there’s a next layer that can boost your workflow: AI. It’s not just for writing code or generating mockups, but for helping with the small, repetitive things that eat up time in design systems. When used right, AI can assist without replacing your control over the system.

Here’s where it might fit into your workflow:

Naming Suggestions

When you’re dealing with hundreds of tokens, naming them clearly and consistently is a real challenge. Some AI tools can help by suggesting clean, readable names for your tokens or components based on patterns in your design. It’s not perfect, but it’s a good way to kickstart naming, especially for large teams.

Pattern Recognition

AI can also spot repeated styles or usage patterns across your design files. If multiple buttons or cards share similar spacing, shadows, or typography, tools powered by AI can group or suggest components for systemization even before a human notices.

Automated Documentation

Instead of writing everything from scratch, AI can generate first drafts of documentation based on your tokens, styles, and usage. You still need to review and refine, but it takes away the blank-page problem and saves hours.

Here are a few tools that already bring AI into the design and development space in practical ways:

  • Uizard: Uizard uses AI to turn wireframes into designs automatically. You can sketch something by hand, and it transforms that into a usable mockup.
  • Anima: Anima can convert Figma designs into responsive React code. It also helps fill in real content or layout structures, making it a powerful bridge between design and development, with some AI assistance under the hood.
  • Builder.io: Builder uses AI to help generate and edit components visually. It’s especially useful for marketers or non-developers who need to build pages fast. AI helps streamline layout, content blocks, and design rules.

Conclusion

This article is not about achieving complete automation in the technical sense, but more about using smart tools to streamline the menial and manual aspects of working with design systems. Exporting tokens, generating docs, and syncing design with code can be automated, making your process quicker and more reliable with the right setup.

Instead of rebuilding everything from scratch every time, you now have a way to keep things consistent, stay organized, and save time.

Further Reading

From Line To Layout: How Past Experiences Shape Your Design Career

 

Your past shapes who you are as a designer, no matter where your career began or how unexpected your career path may have been. Here it shows how those lessons can sharpen your instincts, strengthen collaboration, and help you become a better designer today. Learn how the skills you have learned in your previous jobs can be put to work today in meetings, design reviews, and complicated mid-project pivots.

Design career origin stories often sound clean and linear: a degree in Fine Arts, a lucky internship, or a first job that launches a linear, upward path. But what about those whose paths were not so straight? The ones who came from service, retail, construction, or even firefighting — the messy, winding paths that didn’t begin right out of design school — who learned service instincts long before learning design tools?

I earned my Associate in Science way later than planned, after 15 years in fine dining, which I once dismissed as a detour delaying my “real” career. But in hindsight, it was anything but. Those years built skills and instincts I still rely on daily — in meetings, design reviews, and messy mid-project pivots.

Your Past Is Your Advantage

I still have the restaurant dream.

Whenever I’m overwhelmed or deep in a deadline, it comes back: I’m the only one running the restaurant floor. The grill is on fire. There’s no clean glassware. Everyone needs their check, their drink, and their table turned. I wake up sweating, and I ask myself, “Why am I still having restaurant nightmares 15 years into a design career?”

Because those jobs wired themselves into how I think and work.

Those years weren’t just a job but high-stakes training in adaptability, anticipation, and grace under pressure. They built muscle memory: ways of thinking, reacting, and solving problems that still appear daily in my design work. They taught me to adapt, connect with people, and move with urgency and grace.

But those same instincts rooted in nightmares can trip you up if you’re unaware. Speed can override thoughtfulness. Constant anticipation can lead to over-complication. The pressure to polish can push you to over-deliver too soon. Embracing your past also means examining it — recognizing when old habits serve you and when they don’t.

With reflection, those experiences can become your greatest advantage.

Lessons From The Line

These aren’t abstract comparisons. They’re instincts built through repetition and real-world pressure, and they show up daily in my design process.

Here are five moments from restaurant life that shaped how I think, design, and collaborate today.

1. Reading The Room

Reading a customer’s mood begins as soon as they sit down. Through years of trial and error, I refined my understanding of subtle cues, like seating delays indicating frustration or menus set aside, suggesting they want to enjoy cocktails. Adapting my approach based on these signals became instinctual, emerging from countless moments of observation.

What I Learned

The subtleties of reading a client aren’t so different in product design. Contexts differ, but the cues remain similar: project specifics, facial expressions, tone of voice, lack of engagement, or even the “word salad” of client feedback. With time, these signals become easier to spot, and you learn to ask better questions, challenge assumptions, or offer alternate approaches before misalignment grows. Whether a client is energized and all-in or hesitant and constrained, reading those cues early can make all the difference.

Those instincts — like constant anticipation and early intervention — served me well in fine dining, but can hinder the design process if I’m not in tune with how I’m reacting. Jumping in too early can lead to over-complicating the design process, solving problems that haven’t been voiced (yet), or stepping on others’ roles. I’ve had to learn to pause, check in with the team, and trust the process to unfold more collaboratively.

How I Apply This Today

  • Guide direction with focused options.
    Early on, share 2–3 meaningful variations, like style tiles or small component explorations, to shape the conversation and avoid overwhelm.
  • Flag misalignment fast.
    If something feels off, raise it early and loop in the right people.
  • Be intentional about workshop and deliverable formats.
    Structure or space? Depends on what helps the client open up and share.
  • Pause before jumping in.
    A sticky note on my screen (“Pause”) helps me slow down and check assumptions.

2. Speed Vs. Intentionality

In fine dining, multitasking wasn’t just helpful, it was survival. Every night demanded precision timing, orchestrating every meal step, from the first drink poured to the final dessert plated. The soufflé, for example, was a constant test. It takes precisely 45 minutes — no more, no less. If the guests lingered over appetizers or finished their entrées too early, that soufflé risked collapse.

But fine dining taught me how to handle that volatility. I learned to manage timing proactively, mastering small strategies: an amuse-bouche to buy the kitchen precious minutes, a complimentary glass of champagne to slow a too-quickly paced meal. Multitasking meant constantly adjusting in real-time, keeping a thousand tiny details aligned even when, behind the scenes, chaos loomed.

What I Learned

Multitasking is a given in product design, just in a different form. While the pressure is less immediate, it is more layered as designers often juggle multiple projects, overlapping timelines, differing stakeholder expectations, and evolving product needs simultaneously. That restaurant instinct to keep numerous plates spinning at the same time? It’s how I handle shifting priorities, constant Slack pings, regular Figma updates, and unexpected client feedback — without losing sight of the big picture.

The hustle and pace of fine dining hardwired me to associate speed with success. But in design, speed can sometimes undermine depth. Jumping too quickly into a solution might mean missing the real problem or polishing the wrong idea. I’ve learned that staying in motion isn’t always the goal. Unlike a fast-paced service window, product design invites experimentation and course correction. I’ve had to quiet the internal timer and lean into design with a slower, more intentional nature.

How I Apply This Today

  • Make space for inspiration.
    Set aside time for untasked exploration outside the norm — magazines, bookstores, architecture, or gallery visits — before jumping into design.
  • Build in pause points.
    Plan breaks between design rounds and schedule reviews after a weekend gap to return with fresh eyes.
  • Stay open to starting over.
    Let go of work that isn’t working, even full comps. Starting fresh often leads to better ideas.

3. Presentation Matters

Presentation isn’t just a finishing touch in fine dining — it’s everything. It’s the mint leaf delicately placed atop a dessert, the raspberry glace cascading across the perfectly off-centered espresso cake.

The presentation engages every sense: the smell of rare imported truffles on your truffle fries, or the meticulous choreography of four servers placing entrées in front of diners simultaneously, creating a collective “wow” moment. An excellent presentation shapes diners’ emotional connection with their meal — that experience directly impacts how generously they spend, and ultimately, your success.

What I Learned

A product design presentation, from the initial concept to the handoff, carries that same power. Introducing a new homepage design can feel mechanical or magical, depending entirely on how you frame and deliver it. Just like careful plating shapes a diner’s experience, clear framing and confident storytelling shape how design is received.

Beyond the initial introduction, explain the why behind your choices. Connect patterns to the organic elements of the brand’s identity and highlight how users will intuitively engage with each section. Presentation isn’t just about aesthetics; it helps clients connect with the work, understand its value, and get excited to share it.

The pressure to get everything right the first time, to present a pixel-perfect comp that “wows” immediately, is intense.

Sometimes, an excellent presentation isn’t about perfection — it’s about pacing, storytelling, and allowing the audience to see themselves in the work.

“

I’ve had to let go of the idea that polish is everything and instead focus on the why, describing it with clarity, confidence, and connection.

How I Apply This Today

  • Frame the story first.
    Lead with the “why” behind the work before showing the “what”. It sets the tone and invites clients into the design.
  • Keep presentations polished.
    Share fewer, more intentional concepts to reduce distractions and keep focus.
  • Skip the jargon.
    Clients aren’t designers. Use clear, relatable terms. Say “section” instead of “component,” or “repeatable element” instead of “pattern.”
  • Bring designs to life.
    Use motion, prototypes, and real content to add clarity, energy, and brand relevance.
A motion-forward style tile concept I created to introduce storytelling through micro animations, immersive color themes, and real content.

4. Collaboration Is The Backbone

In fine dining, teamwork isn’t just helpful — it’s essential. Every night, success depends entirely on collaboration. The hostess seats guests, the bartender crafts drinks, the chefs prepare dishes, bussers swiftly clear tables, dishwashers provide spotless glasses — each role is critical, and without one, everything falls apart. You quickly learn there’s no ego or question about whether you could do it better alone. You know that teamwork is the only way, which may mean temporarily stepping outside your role to buss your table or jump behind the dishwasher to get clean glasses. Fine dining is truly a well-oiled machine — everyone must trust and rely on one another entirely.

What I Learned

In product design, it’s easier to slip into a silo inadvertently. Unlike restaurants, it can feel natural to work independently, maintaining biases and assumptions, or pushing work forward without additional feedback. But great design thrives on intentional collaboration and shared accountability, especially within an agency setting. Collaborate early, not alone. Actively embracing your support system — joining a UX call even when you’re not officially invited — can give critical insights far before wireframes or comps are developed, helping you ask better questions and make smarter assumptions.

In restaurant service, stepping in unannounced to address an issue was seen as helpful, even necessary. But in design, jumping in without alignment can confuse roles or interrupt someone else’s process. I’ve learned that collaboration isn’t about taking over but staying connected. I’ve had to get better at asking before helping, syncing instead of assuming, and treating the handoff not as an ending but as an open communication thread.

How I apply This Today

  • Stay involved after handoff.
    Check in during engineering and QA (quality assurance) to support implementation.
  • Keep workshops flexible.
    Adjust structure based on the client’s energy and decision-making style.
  • Invite a fresh perspective.
    Bring in another designer near the end for polish or feedback.
  • Capture intent visually.
    Document decisions clearly so downstream teams understand the nuances and not just the layout.

5. Composure Under Pressure

In fine dining, pressure isn’t an occasional event — it’s the default setting. Every night is high stakes. Timing is tight, expectations are sky-high, and mistakes are rarely forgiven. Composure becomes your edge. You don’t show panic when the kitchen is backed up or when a guest sends a dish back mid-rush. You pivot. You delegate. You anticipate. Some nights, the only thing that kept things on track was staying calm and thinking clearly.

“This notion of problem solving and decision making is key to being a great designer. I think that we need to get really strong at problem identification and then prioritization. All designers are good problem solvers, but the really great designers are strong problem finders.”

— Jason Cyr, “How being a firefighter made me a better designer thinker”

What I Learned

The same principle applies to product design. When pressure mounts — tight timelines, conflicting feedback, or unclear priorities — your ability to stay composed can shift the energy of the entire project.

Composure isn’t just about being calm; it’s about being adaptable and responsive without reacting impulsively. It helps you hold space for feedback, ask better questions, and move forward with clarity instead of chaos.

There have also been plenty of times when a client doesn’t resonate with a design, which can feel crushing. You can easily take it personally and internalize the rejection, or you can pause, listen, and course-correct. I’ve learned to focus on understanding the root of the feedback. Often, what seems like a rejection is just discomfort with a small detail, which in most cases can be easily corrected.

Perfection was the baseline in restaurants, and pressure drove polish. In design, that mindset can lead to overinvesting in perfection too soon or “freezing” under critique. I’ve had to unlearn that success means getting everything right the first time. Now I see messy collaboration and gradual refinement as a mark of success, not failure.

How I Apply This Today

  • Use live design to unblock.
    When timelines are tight and feedback goes in circles, co-designing in real time helps break through stuck points and move forward quickly.
  • Turn critique into clarity.
    Listen for what’s underneath the feedback, then ask clarifying questions, or repeat back what you’re hearing to align before acting.
  • Pause when stress builds.
    If you feel reactive, take a moment to regroup before responding.
  • Frame changes as progress.
    Normalize iteration as part of the process, and not a design failure.

Would I Go Back?

I still dream about the restaurant floor. But now, I see it as a reminder — not of where I was stuck, but of where I perfected the instincts I use today. If you’re someone who came to design from another path, try asking yourself:

  • When do I feel strangely at ease while others panic?
  • What used to feel like “just part of the job,” but now feels like a superpower?
  • Where do I get frustrated because my instincts are different — and maybe sharper?
  • What kinds of group dynamics feel easy to me that others struggle with?
  • What strengths would not exist in me today if I hadn’t lived that past life?

Once you see the patterns, start using them.

Name your edge. Talk about your background as an asset: in intros, portfolios, interviews, or team retrospectives. When projects get messy, lean into what you already know how to do. Trust your instincts. They’re real, and they’re earned. But balance them, too. Stay aware of when your strengths could become blind spots, like speed overriding thoughtfulness. That kind of awareness turns experience into a tool, not a trigger.

Your past doesn’t need to look like anyone else’s. It just needs to teach you something.