OpenSourcePicks

Open source alternatives to popular software, with live GitHub data

GitHub stats refreshed every day

Quant-UX

Interactive prototyping with built-in usability tests, heatmaps and session recordings

Visit Quant-UXGitHub

Main features

  • Clickable prototypes with screen and widget animations
  • Components and design tokens, shareable as a design system
  • Logic flows for conditional navigation and A/B tests
  • Data binding, form validation, web service calls and scripts
  • Shareable test links with tasks and a custom landing page
  • Dashboards with task KPIs and survey answers
  • Click heatmaps and recordings of test sessions
  • Import of Figma projects and PNG or JPEG images
  • Collaborative editing through a websocket server

What Quant-UX does

Quant-UX is a prototyping tool built around one question: does the design work for real users? You design screens in the browser, connect them into a clickable prototype, send testers a link, and then study what they did. Most design tools stop at the prototype; Quant-UX adds the research step and the analytics in the same application.

The prototyping side goes further than linking screens. Logic flows send users to different screens depending on what they entered, and the same operator can split testers randomly for A/B tests. Data binding carries values from one screen to the next, form fields can be validated, a web service element can load or send data over HTTP, and a beta script component runs small JavaScript snippets. Components and design tokens keep styles consistent, and a prototype that holds a design system can be imported into other prototypes so its components appear in the widget menu. Widgets can have hover and error states, and screens can have entrance animations.

Testing and analytics

Sharing a prototype creates a test link with a landing page where you set a welcome message, a background image and the tasks testers should complete. Survey elements such as star ratings and NPS questions collect direct feedback. Afterwards, the dashboard reports KPIs per task, the heatmap view shows several kinds of click heatmaps per screen, and an analytic canvas offers finer-grained visualizations. Each test session can also be replayed as a recording. The built-in help notes that five testers give qualitative insight but that numbers only settle with many more.

For teams that already design in Figma, Quant-UX can import Figma projects using a personal access token, so you can test existing designs without rebuilding them. Image files can also be dropped in as screens.

Self-hosting Quant-UX

A self-hosted install has three services: the Vue front-end with its own small Node.js server and proxy, a Java backend (published separately under the MIT license) and a websocket server for collaborative editing, plus MongoDB. An SMTP server is needed for mails such as password resets. The README provides a Docker Compose file using the developer’s images, and points to a community Docker setup, a community Kubernetes configuration and one-click deployments on Elestio and RepoCloud. You must set a JWT secret, can restrict sign-up to chosen email domains, and can use Keycloak for login. TLS is left to a reverse proxy such as nginx.

Optional AI features use an OpenAI token set by the operator and shared by all users; the README warns that this can become expensive and suggests a budget-limited token.

Hosted version

The developer runs Quant-UX at quant-ux.com, which the README presents as a working demo of the project.

Limitations

Quant-UX is aimed at prototypes, not at polished visual design, illustration or marketing graphics, and it does not offer the depth of Figma’s design features. The front-end still runs on Vue 2, and the project is largely the work of one developer. Self-hosting means running three services, a MongoDB database and mail delivery, which is more than many design tools need.

Who it suits

Quant-UX suits UX researchers, product designers and students who want to run unmoderated usability tests on their own server and see heatmaps and recordings without sending data to a commercial testing service. For the design work itself, many teams will pair it with Penpot, or import existing Figma files to test them.

License details

GPL-3.0. The front-end is GPL-3.0; the Java backend is a separate MIT-licensed repository.

Technical details

Self-hosting needs

  • MongoDB
  • SMTP server
  • Docker

Built with

  • JavaScript
  • Vue
  • Java

Reviewed by the OpenSourcePicks editors from the project's repository and documentation. Something out of date? Tell us.