Figma is essential in UI/UX design
Coding-first approaches also have their role.
We’re in the era of very hot takes on design—where, in an attempt to feed the algorithm, rack up likes, or sell courses, people are making bold, attention-grabbing claims about design, tooling, and the industry. Lately, the target has been Figma: “Figma is dead.” “There’s no reason to use Figma anymore.”
These short-sighted statements lack context and nuance, two qualities that make for meaningful discussions but seem to be in short supply these days.
If you’ve been reading everyday ux for a while, you know I’m all for designers using AI tools to code—no surprises there, but replacing design tools entirely with AI? We’re just not there yet.
Jess Eddy
Jess Eddy
That said, we shouldn’t cling to tools or processes just because they’re familiar. Technology moves fast, and part of being a great designer is knowing when something has become outdated—or when a new approach is worth exploring.
The points in this article aren’t rules—they’re ideas and advice. The best way to find what works for you is to experiment. Try new things, challenge assumptions, and see for yourself.
There’s a time and place for code, and there’s a time and place for design tools.
I use Figma as the example in this article, but while it may be the industry leader, it’s not the only option. If you use something else, swap Figma out for your tool of choice—the point still stands.
With AI-generated code on the rise and more teams shifting toward code-first approaches, some argue that Figma is becoming obsolete. However, Figma remains a crucial tool for product design, especially when working with teams, defining new experiences, and maintaining alignment.
At the same time, design tools must evolve to stay relevant. The demand to go straight from Figma designs to production-ready code is growing fast, and the pressure to streamline this process is shaping the future of design tooling. New integrations, AI-powered automation, and developer-focused workflows are all pushing Figma—and other design tools—to bridge the gap between design and code more seamlessly than ever.
Here’s why design tools matter
1. Rapid UI exploration and iteration
Design is an exploratory process, and Figma makes it easy to iterate on layouts, styles, and interactions—without the overhead of writing code. Adjusting spacing, typography, or exploring screen variations takes seconds in Figma, whereas even minor changes in code require more effort, testing, and debugging. This speed of iteration is invaluable when refining ideas, testing usability, and validating concepts before committing to development, ultimately reducing wasted time and effort.
2. Collaboration across teams
Figma provides a shared workspace where designers, product managers, and engineers can collaborate in real-time. Instead of relying on scattered documentation or long email threads, stakeholders can review, refine, and align designs before development begins. This is especially critical in large teams and complex projects, where multiple perspectives shape the final product. A well-structured Figma file ensures that interactions, edge cases, and flows are clearly defined, reducing misalignment and unnecessary rework.
3. A single source of truth for design
Figma is a central hub for all design-related decisions, keeping UI components, interaction guidelines, and design tokens consistent across teams. Instead of outdated static images or verbal instructions, teams can reference a single, up-to-date file, ensuring that designers and engineers always work from the same source. This is especially important for scaling teams, where maintaining consistency across multiple products is essential.
4. Preventing UI inconsistency and chaos
Jumping straight into code without a structured design foundation often leads to fragmented, inconsistent UI, especially when multiple engineers are involved. Developers may interpret requirements differently without a unified reference, leading to mistakes and inconsistencies. By defining screens and design patterns in Figma before development, teams can ensure that screens and components are properly standardized, reducing guesswork and avoiding last-minute fixes.
5. Defining new product experiences
When designing something new, the right layout and UI structure aren’t always clear from the start. Figma provides a flexible space to explore layouts, flows, and interactions before investing in development. By testing multiple approaches visually, teams can identify friction points, make important refinements, and validate key user interactions, ensuring the final product is well-structured and user-friendly—before writing code.
6. Supporting complex interactions and branding
While AI tools can generate code and basic UI components, they lack the strategic intent to craft polished, unique, and branded experiences. Figma allows designers to refine the details—custom animations, micro-interactions, and brand identity—ensuring the final product feels cohesive and stands out in a sea of AI-generated interfaces. For brands that rely on visual identity and a strong connection with customers, the craft and attention to detail that design tools enable remain irreplaceable.
7. Enabling reusable design systems
A well-defined design system helps designers and teams maintain consistency, efficiency, and scalability. Figma makes it easy to establish and document reusable UI components—from buttons and forms to typography styles—before development begins. By first defining design tokens (colors, spacing, typography scales) in Figma, teams create a single source of truth that engineers can directly reference when implementing UI. These artifacts speed up development and improve long-term consistency across products, simplifying future work.
8. AI tools lack precision and control
AI-generated code can speed up production, but it often lacks the thoughtfulness and strategic intent that shape great design. It can generate layouts but doesn’t truly understand context, user needs, or brand identity. AI-driven solutions risk feeling generic or out of alignment without a deliberate design process. Figma allows teams to refine, iterate, and make intentional design decisions—something that’s much harder to do in code alone.
Figma gives teams the ability to refine, iterate, and make intentional design decisions—something that’s much harder to do directly in code.
More importantly, it enables designers to lead the design process, providing clear direction to engineering on what to build and how. It also supports real-time collaboration and fast UI iteration.
That said, not every project requires a fully designed UI before development begins. Sometimes, jumping straight into code can be more efficient, helping teams move faster without unnecessary overhead. When the design is straightforward, the project is small, or speed is the top priority, writing code first can simplify the process without sacrificing clarity.
Where starting in code makes sense
Design tools help teams explore ideas, structure processes, and align before development begins. However, when the UI follows established patterns, the scope is contained, or real-time iteration matters more than static visuals, moving directly into code can be the smarter choice.
For experienced front-end developers, coding can often feel more intuitive than designing in a separate tool. When working within well-established UI structures or testing ideas quickly, skipping Figma can keep the process lean while still working toward a high-quality outcome.
The key is knowing when design tools add value—and when they might slow things down.
Here are a few situations where starting in code makes the most sense:
1. Building from a clear mental model
Designing screens may be unnecessary if you already know exactly how the UI should look and function. Standard layouts—like dashboards, forms, or landing pages—often follow predictable patterns, making it easy to go straight to code. This approach works well when you have strong front-end skills and can efficiently translate ideas into code. It’s especially effective for small, self-contained projects requiring minimal external input and not involving complex collaboration. However, not using design tools entirely can create more work if the project expands or requires collaboration later.
2. Working with standardized UI patterns
UI experimentation isn't always necessary for established CRUD apps, admin dashboards, or data-heavy interfaces. These types of products rely on well-defined patterns, making using existing frameworks and component libraries more efficient than designing from scratch. Figma may still be useful for mapping flows, defining interactions, or maintaining consistency, but detailed UI mockups may not be required. Developers can move directly into implementation, focusing on functionality rather than layout exploration.
3. Iterating quickly in code
If you’re comfortable with front-end development, it may be faster to experiment directly in the browser rather than switching between design and development tools. Making real-time updates in code allows you to iterate quickly without unnecessary overhead. This approach makes sense when the design is relatively simple or well-understood and doesn’t require extensive iteration. Additionally, if the project doesn’t need significant stakeholder review before development begins, starting in code can be a more efficient path.
4. Coding quick prototypes to test feasibility
When speed is the priority, jumping straight into code can be the fastest way to work. A quick-coded prototype can help validate APIs, logic, or user interactions before investing time in refining the UI. It allows teams to gather early feedback from engineers, stakeholders, or users, ensuring that core functionality is on the right track.
Sometimes, a smoke-and-mirrors prototype—where features or functionality are faked or partially implemented—is enough to test an idea, get alignment, or gauge feasibility before committing to full development. This approach can be useful for securing buy-in without requiring a fully functional build.
However, if the prototype is for user testing or needs to be reviewed by stakeholders, starting in Figma first can make it easier to refine ideas, gather feedback, and ensure everyone is aligned before moving to code.
5. Moving fast on solo or side projects
For side projects where you’re both the designer and the developer, skipping formal design steps and iterating directly in code is often more efficient. Without the need to align with a team, you can adjust the UI on the fly rather than maintaining separate design documentation. This approach works well for small, self-contained projects. However, if the project scales or requires a more polished user experience, spending time in Figma early on can help define patterns and maintain structure and consistency over time.
6. Designing highly interactive experiences
Some projects push the boundaries of what traditional design tools can handle, especially when working with complex animations, unconventional layouts, or dynamic interactions that are difficult or impossible to explore in static mockups. In these cases, designing directly in code allows for real-time experimentation with movement, behavior, and responsiveness in ways that tools like Figma struggle to support. Whether advanced CSS layouts, WebGL effects, or motion design, working in code provides flexibility and precision that aren’t always possible in a design tool.
Building an app or writing code is easier than ever, and we’ll inevitably see many tools that look and feel the same now. Accessible coding and a lower barrier to entry are huge wins—more people can bring ideas to life and launch products than ever before. But in a world where anything can be built quickly, taste, creative quality, trust, and distribution matter more than ever.
There’s no one-size-fits-all approach.
Design tools bring structure, clarity, and alignment, essential for collaboration, creating complex products, and maintaining a cohesive experience. However, jumping straight into code can be more efficient in well-defined, small, or fast-moving projects.
At the same time, design tools must evolve to stay relevant.
As AI-generated code and AI-powered UI tools advance rapidly, Figma and other design platforms must adapt to help designers work faster and bridge the gap between design and development. The best tools will not only survive these shifts but also embrace them.
The smartest teams don’t take a rigid stance—they use both strategically, knowing when to start in Figma and when to move directly into code. The goal isn’t to follow a fixed process but to choose the right tool at the right time.
