Web Design Tool Wish List

I’ve spent years looking for tools that help designers who don’t code participate in a process like the one we use. Something that would let them reuse design system components and would allow them to do as Stephen Hay says and resize their designs until they break and then… BOOM… they need a breakpoint.

Unfortunately, most design tools are focusing on the wrong features. So with the help of Cloud Four’s design team, I put together our design tool wish list.

Full responsive support
No more static mockups.

Treats design system as the source of truth
Design systems have to meet a higher quality bar.

Import design system components and create variants
Make it easy for designers to reuse the design system work.

Support for importing/exporting design tokens
Sometimes you don’t need the full design system. Sometimes you just need some colors or other items from the design tokens.

Design from scratch when existing components won’t do
Designers shouldn’t be restricted in what they can design.

Feel like a design tool
This is totally subjective, but if it doesn’t feel at least as natural to use as other design tools, people won’t use it.

Adopts new web standards quickly
We need better parity between CSS features and web design tools.

Built on the web
I suspect it will be easier to make something work like the web if it is actually built on the web, but if someone pulls it off with a native app, more power to them.

Easy to update with new versions of the design system
Design systems need to be maintained. The design tool needs those updates as well.

Override design system component behavior when necessary
Figuring out where to draw the line between the rules of the design system and the freedom of designers to innovate on a component is a challenge.

Ability to prototype interactions by linking screens
Let’s make the designs feel interactive.

Accessibility testing and feedback
The sooner we can get people thinking about accessibility in the design, the better.

Code mode fallback
Useful for times when the design tool doesn’t support a new browser feature yet.

Integration with design system documentation
It would be nice for someone using a component in a design tool to know the rules for using that component.

Collaboration features
Make it easy to gather feedback and let others participate in the design process.

Tools for developers to inspect designs
It may help developers to see what measurements have been set in the design. We just value this less than people making design tool do.

Animation support
Animation can be crucial for solving user experience problems.

During my interview with Cloud Four’s designers, Tyler Sticka summed up what he looks for “as something he can develop muscle memory for and something that allows him to import as much or as little as possible.” In the video below, he expands on why this matters:

With our wish list in hand, we set out to test design tools to see how close they come to fulfilling our dreams. Next time, we report our findings!

Permalink to This article is part 5 of a series on design tools in a design system world:

This article is part 5 of a series on design tools in a design system world:

1. Traditional Web Design Process is Fundamentally Broken
2. Design Happens Between Breakpoints
3. Faulty Assumptions and Unwanted Features of Most Web Design Tools
4. Responsive Design Process that Works
5. Currently Viewing:Web Design Tool Wish List
6. Design tool reviews
7. [Coming soon]