Modulz raises $4.2M to close the gap between design and code

Colm Tuite

3 min read

Modulz is a visual code editor that empowers teams to design, develop, document and deploy a design system, without writing code.

We arrived on the design tool scene early this year with a successful Kickstarter campaign, raising $36k from 394 backers who pre-paid for early access.

Since then, we've raised $4.2M in seed funding from LocalGlobe, Frontline and many high-profile angel investors including Ryan Hoover (Founder of Product Hunt), Vedika Jain (Weekend Fund), Des Traynor (Co-founder of Intercom), Jina Anne (Founder of Clarity), TinyVC and other great investors.

We've put together a super strong team of 9 and we're excited for the future ahead. So I want to share what we're working on.

Modulz is a radically fresh take on the "developer handoff" workflow. Typically, design teams will draw static representations of their component library, then "throw them over the wall" to their engineering team.

As a process, sharing assets between design and engineering teams is conceptually sound. However, existing workflows are disjointed and tooling is relatively archaic.

Modulz will empower design teams to "handoff" a complete design system consisting of the following:

  • Theme — a set of reusable tokens for designing consistent components.
  • Components — a production-ready component library, published to NPM.
  • Styleguide — an automatically generated styleguide with component examples, code snippets, navigation, search and more.
  • Integrations — export your design system to Sketch, Figma and Framer so your design team can utilise your symbols, components and styles.

Each time you publish a new version of your design system from Modulz, all of these export targets update automatically.

This means your whole team is kept in sync. Everyone can consume the exact same design system in whatever format they need it. Developers consume the design system in code via NPM. Designers consume the exact same design system in Sketch, Figma AND Framer (no need to pick a side!). The styleguide keeps everyone aligned on how the design system should be used.

A lot of VC money is being poured into the design tool space, though much of the progress has been incremental.

When Adobe launched Photoshop in 1990, designers were drawing static pictures of interactive websites. Today, almost 30 years later, our most powerful design software is still optimised for drawing static pictures of inherently interactive components.

Along that same timeline, our digital products have become increasingly interactive. We now have touch screens, animation, voice input, audio, video, AR and VR. Vector graphics are no longer an appropriate medium through which to communicate digital design decisions.

Modulz is a visual code editor. We want to expose as many people as possible to the power of code, but in an environment that looks and feels familiar.

We want to fix the disconnect between design and code, and save companies time and money, so you can focus on building your products.

Share this post on Twitter