ai can make your design process better
How do you use AI in your design process? I hear this question a lot. As we are now going through this amazing period, exploring the technology and looking for new ways to use it, I wanted to share my personal experience, with hope that it will bring new ideas to other designers who feel lost, overwhelmed, or feel left behind.
Some time ago I started building tools for myself. It was summer 2022, and I really didn't enjoy doing one particular repetitive task. And if you ever worked with design systems, you know how fun it can be updating component variations, migrating styles, or checking if particular set of screens are using design tokens. Things like these were already more then enough, but that time I had to manually design dozens of color schemes, all following the same unwritten rules. And surprise-surprise, there were no ready to use plugin for this task.
Yeah I know, it's all in the past now, but it's nice to remember good old times.
Anyway, I felt like these things sould be automated, I just needed to find a way how to do it. Long story short, I learned how to build plugins for Figma, spending my free time on courses about javascript and digging into figma api and open sourced plugins. After my first internal plugin (that btw saved company months of work), I started asking myself what else I can automate.
And that's the first thing I want to highlight. Ask yourself, what tedious and repetitive tasks you feel require manual work and not really your brains. They probably could be automated.
If you work in figma, you can now build plugins to automate these tasks without leaving the app. And if you just need to do it once and don't need a plugin, you can ask an agent in figma (or via your favorite AI agent through Figma's MCP / Figma Console MCP) to do it for you.
If you work in Paper, and oh my friend I recommend you to check it out if you have never tried, it has a similar MCP interface for agents, but in my personal opinion, is much better suited for co-designing with AI.
Those little automations saved me days and weeks of repetitive work. And so they can help you.
Here are some links to get you started:
Interact
It always bothered me that designs in all the design tools are flat. You see all the screens, but there is no interaction or depth. Using vibe-design tools bridges this gap. You can just ask your favorite tool to build a prototype for you, and then you can play with it on different devices, understanding the interaction model better. Figma Make is amazing, but so is Claude Design, or even tools like Lovable or v0. They don't require any set up or configuration, and can be used out of the box.
Code to design to code
I skipped the vibe-prototyping part almost completely, and started building right in the codebase. It is exciting process to see the ideas come to live so quickly. But I found this approach somewhat limiting. Ideation still needs canvas.
I found it very helpful to be able to ask an agent to recreate a screen I'm working on in code in Paper, tweak it there, and then ask it to build it back into the codebase. Also I can share these Paper files with my team and they would come up with ideas, ideating on canvas.
Getting deterministic
AI is probabalistic, and it is great for ideating. But when things comes down to polishing details and making decisions, being probabalistic is not that good. Especially when it comes, for example, to accessibility.
I started building tools that the AI could use to do the math, my favorite one is APCA-CLI tool that checks color contrast against WCAG and APCA standards, considering font size and weight.
You can create tools that will enforce AI to make deterministic choices in a way that matters to you, instead of relying on it's good guess.
Getting deterministic
I also use tools and skills other people share. Emil Kowalski’s design engineering skills have been particularly useful. Skills give an agent guidance about how to work; calculation tools give it results to check. I find both helpful.
Learning more myself has helped just as much. Emil’s Animations on the Web helped me better understand motion and transitions in code.
I also recommend Rauno’s Devouring Details for exploring the details that make an interface feel right.
Josh Puckett’s Interface Craft is another place I’d point designers who want to go deeper into this kind of work.
The design mode I wanted
Eventually, I got tired of chasing tools. Claude, ChatGPT, Figma Make, v0—there was always something new to try. I’m still excited about them, but I can’t change my work process every week, especially in a team.
I knew more clearly how I wanted to work, and I was already paying for AI subscriptions. So I decided to build my own tool: Trezi. This time, I went all in on AI coding.
Trezi is the design mode I wanted my coding tools to have. I can select something in a live preview, adjust its styles, edit text, rearrange layers, or open its code right there. The project’s design system and built-in calculators help guide the changes.
It works with my Claude and Codex subscriptions, with a separate Vercel AI Gateway connection for other supported models. Multiple chats and agents can work in isolated workspaces, with conflicts resolved when their changes come together.
Mostly, it keeps me focused on the thing I’m changing—visually and in code—instead of spreading the work across windows on my desktop.
If you want a guided way into building your own AI assistant and tools, I highly recommend Neuma by Kris Puckett.
Sometimes I still want a canvas
When a prototype starts in code, there may be no Figma file. But sometimes I just want to move things around and compare a few options.
Claude Code’s /design command gives me one way to explore ideas on a canvas with the agent.
More often, I use Paper. Its HTML and CSS canvas, React export, and MCP connection fit the web projects I’m already building.
I ask the agent to bring a few screens into Paper, mess with them myself, then ask it to inspect my changes and apply them back to the prototype using the existing components and tokens. I review the result in the running product.
That gives me a canvas when I need one, while keeping the work connected to code.
Start with something that annoys you
None of this started with a plan to build my own design environment. It started with small tasks I didn’t want to keep doing by hand.
Pick one you understand well. Describe the rules, look for an existing tool, or build a small version with AI. Try it on real work and check the result. You can figure out the bigger process as you go. I certainly did.