After a week with WorkBuddy, I decided to deprioritize Pixso AI and FigmaMake

Don't rush to shove AI into design tools; first think about what your workflow is missing.

When I wrote that article "Stop Letting AI Guess Your Intentions" a couple of days ago, I had just used WorkBuddy for document organization. At the time, I felt it was like a competent assistant—you tell it what you want, and it gives you exactly that, no more, no less. But honestly, my perception of its positioning was just an advanced document tool.

Until I casually tried its ability to generate UI components.

To be honest, I didn't have high expectations. I've tried many AI design tools on the market. I used Pixso AI's smart design for about two months, and I also tinkered with FigmaMake when it first launched. They each have their uses, but there always feels like a barrier—you can't modify the images you draw, and what it generates isn't necessarily directly usable. Like an overnight latte, it looks okay, but one sip tells you something's off.

But WorkBuddy surprised me a bit. Not because its design capabilities are incredibly strong (honestly, regarding interface generation alone, it's not as flashy as Pixso AI), but because it truly integrated design specifications into the workflow, rather than throwing a design-tokens.json file at you that no one maintains.

I've Tried All Three Tools, Where's the Difference?

Based on my testing, the differences in experience among Pixso AI, FigmaMake, and WorkBuddy in UI design scenarios are much larger than I imagined.

Comparison Dimension	Pixso AI	FigmaMake	WorkBuddy
Learning Cost	Low, online operation, direct generation on canvas	Medium-High, need to be familiar with the Figma ecosystem	Low, but need to write a PRD first
Output Quality	Good visuals, but component specs are inconsistent	Strong ecosystem, but high barrier for beginners	Spec-driven, stable output but conservative
Workflow Integration	Canvas-centric, tied to team collaboration	Figma-centric, plugin-based	Document-centric, linked with Git
Team Collaboration	Good online collaboration, but weak version management	Strong, but requires proficient use of component libraries	Strong, version control via PRD and Git
Suitable For	Designers primarily, PMs secondarily	Designers as main force, devs cooperating	PMs, designers, and devs can all use it

The table is a bit dry, but the conclusion is clear: Pixso AI and FigmaMake solve the problem of "drawing," while WorkBuddy solves the problem of "unification."

Let me give a specific example. Previously, I tried generating a form page in Pixso AI. It gave me three options, all visually nice—dark theme, rounded corners, gradients. But when I put it into our team's existing component library, I found that almost every component needed manual adjustment: button corner radii were wrong, spacing differed from the spec by 8px, font hierarchy didn't match the design tokens. In short, it generated an interface that "looks like" it fits, but doesn't align with your actual specs.

FigmaMake is slightly better because the community has ready-made component libraries, but the prerequisite is that you maintain those libraries well beforehand. I've seen too many teams where design spec files gather dust in Notion, and the version of the component library in Figma lags behind the actual delivered code by three iterations.

Why WorkBuddy Feels More Reliable

WorkBuddy's approach is: Write design specs into the PRD, letting AI follow the rules from the start.

I tested a simple scenario: generating the first version of a user settings page interface.

1. Create a new PRD in WorkBuddy, using Markdown to clearly define the page structure. The key operation is in the ## Design Specs section, where you write in the team's design tokens (e.g., --spacing-unit: 8px, --border-radius: 4px, --font-family: system-ui).

2. In the ## Page Layout section, use lists to describe the function and expected components of each block. No need to draw diagrams; just write it clearly: "Top navigation bar, Logo on the left, user avatar and settings entry on the right."

3. Run WorkBuddy's generate-ui command, specifying the output format as design-tokens.json and Figma component references.

4. After about 30 seconds, it generated a set of pages, including editable Figma links and corresponding CSS variables.

I checked the results: Button corner radius was 4px (as per spec), spacing was multiples of 8px (as per spec), font hierarchy used h1 24px, body 14px (as per spec). Not a single component required manual adjustment for specs.

This might sound uncool, but for a designer like me who gets tortured daily by "inconsistent specs," this is more useful than generating a hundred pretty pictures.

Of course, there are complaints. WorkBuddy's generated interface visual style is conservative, lacking the "wow" effect of Pixso AI. If you're doing concept design or need visually impactful solutions, it might not help. But if you're working on B-end products, backend systems, or internal enterprise tools—projects that require strict adherence to specs—WorkBuddy's output quality is far more stable than those two tools.

Real Case Review: From PRD to Deliverable Design Draft

I'll review a recent project from my team. The requirement was to create a user permission management page, with three main modules: role list, permission matrix, and edit modal.

The first time I used WorkBuddy, I made a mistake. I wrote the PRD like an essay, describing at length how "the page should be clear and easy to use, allowing users to quickly find needed functions." As a result, what WorkBuddy generated was a mess, with random spacing and mixed components, exactly like the "spec configuration didn't take effect" complaint I posted about before.

Later I realized where the problem lay: It wasn't that AI was dumb; it was that I didn't tell it the specific constraints. I treated it like a human, thinking vague descriptions like "clear and easy to use" were enough. But WorkBuddy needs precise instructions.

The second time, I changed my writing style:

1. In the PRD's ## Design Specs, I explicitly wrote --color-primary: #1877FF, --color-danger: #FF4D4F, --spacing-unit: 8px.

2. In the ## Page Layout, I used