I recently updated my product’s design.
Some people say we no longer need design tools like Figma. We can design directly in code, open the website in a browser, see how it looks, and keep making changes. In some ways, this makes sense. I actually designed parts of my website this way. But after trying it, I still think Figma is useful, especially for more complex projects.
Here’s what I learned.
- Design involves a lot of small changes.
Design is mostly about trying things, comparing options, and making changes. This is easy in Figma. You can move things around and test different ideas quickly. In code, the same process can get messy. You may create unnecessary components and styles before you even know what you want.
- AI designs differently when it also needs to code
When AI has to design and write code at the same time, it also needs to think about features, components, responsive layouts, and technical details. I feel like this takes some of its attention away from the visual design. The result may work well, but it often doesn’t look as good. Sometimes it’s better to let AI think about the product and design first, without asking it to implement everything immediately.
- Figma makes it easier to see the whole product
In Figma, you can put many screens next to each other. Both humans and AI can quickly understand the overall product and compare different pages. With code, the AI may need to open the website, log in, click through different screens, and reproduce certain states. Sometimes a human still needs to help. That makes visual review more complicated.
- Figma has a lot of useful templates
Figma has many community templates, components, and design systems. Humans use these resources all the time, and AI can use them too. They give both humans and AI a better starting point.
- But some changes are much easier in code
Code also has an important advantage: shared components. If the header is a shared component, you only need to change it once, and every page is updated. Changing a theme color, font, or spacing rule can also be very simple. In Figma, the same change can be painful, especially if the file isn’t well organized. You may need to update many screens one by one. So once the basic design system is clear, making changes in code can be much faster.
Figma also helps me think
For me, Figma is not only a design tool. It also helps me think about the product. When I can see many pages at the same time, without worrying about implementation, it is easier to ask: Who is the user? What problem are we really solving? Does the whole experience make sense? I often get distracted by implementation details and the excitement of vibe coding. Figma helps me step back and focus on the product itself. I don’t think the answer is Figma or code. Figma is better for exploring ideas and thinking about the whole product. Code is better for testing the real experience and making changes across the entire system. For simple products, designing directly in code may be enough. For more complex projects, I still prefer to start in Figma and move into code once the direction is clear.