Artifact ยท General

Design Vote Duel

designvotingcomparisonfeedbackpoll

Design Vote Duel is a simple A/B design voting tool. Put two variants side by side, add your own images, and let everyone vote for the one they prefer.

Use Design Vote Duel together on your board.

Each card shows its vote count and percentage as votes come in, and a new round starts the next comparison.

It runs on a shared MockFlow board, so the whole team votes on the same pair and sees the same tally.

  • Side by side cards. Two variants shown at the same size, so the comparison is fair.
  • Your own images. Replace either placeholder with a design of your own.
  • Live vote counts. Votes and percentages update for everyone as people choose.
  • Optional time limit. Run an open vote or give the round a time limit.
  • Rounds. Start a new round to run several comparisons one after another.

How to use Design Vote Duel.

1

Add your two designs

Press Change on Variant A and Variant B to add your own images.

2

Set a time limit if you want one

Choose a time limit for the round, or keep No time limit.

3

Cast your vote

Press Vote A or Vote B to pick a side.

4

Watch the results

Each card shows its votes and percentage, with a bar that fills as votes arrive.

5

Start the next comparison

Press New round to compare the next pair.

Who uses Design Vote Duel.

A designer choosing between two mockups

Put both options up and let the team pick in seconds.

A product team reviewing a landing page

Compare two hero layouts before deciding which to build.

A marketing team picking an ad creative

Vote on two visuals to settle the direction.

A design critique session

Run a quick round per decision and move through the list.

Add Design Vote Duel to your board.

Use on a board opens a new board with Design Vote Duel already on it. To add it to a board you already have, follow these steps. Each copy keeps its own data, so a vote on one board never changes another.

1

Open your board

Open the MockFlow board you want to use it on.

2

Add it from the Artifact Library

Click Add anything (the plus button) in the toolbar at the bottom of the board, switch to Artifacts and pick Design Vote Duel under General. Adding it does not use AI credits.

3

Use it together

Click Interact with Component (the hand button), or switch the board to Play mode. Everyone on the board uses the same app, and Reset shared data clears it for the next session.

Questions about Design Vote Duel.

What is A/B design voting?
You show two versions of a design side by side and ask people which they prefer. The votes show which direction the group favors.
Can I use my own designs?
Yes. Press Change on either card to add your own image.
Can I set a deadline for voting?
Yes. Pick a time limit for the round, or leave it at No time limit.
Can I compare more than one pair?
Yes. Press New round to start the next comparison.
Does everyone see the same results?
Yes. Design Vote Duel runs on a shared MockFlow board, so votes and percentages stay in sync for everyone.
How do I add Design Vote Duel to a board?
Press Use on a board on this page to open a new board with it already on, or open Add anything (the plus button in the bottom toolbar) on any board and pick it from Artifacts. Adding it uses no AI credits.
Get started

Use Design Vote Duel with your team.

Included on Plus and MaxChange it with AI on Max
New to MockFlow

Sign up free, open a board and see what your team can use together.

MCPBrainstorm with MockFlow MCP

Add MockFlow as an MCP connector in Claude, Cursor, or any MCP-compatible AI assistant to generate flowcharts, mindmaps, architecture diagrams, and 16 types of visualizations.

Desktop App MCP Powerful
CLI Web MCP Developer
Loginless Web MCP Easiest

Built into the MockFlow Desktop App. AI creates visuals directly on your open canvas — no URLs, no waiting.

1
Open Desktop App → open a MockFlow project
2
In Claude Code / Cursor, run:
claude mcp add --transport http -s user mockflow-ideaboard http://localhost:21193/mcp
3
Ask: "Create a flowchart for..."

Best for: Designers, product teams, daily MockFlow users.

Download Desktop App →

Install from npm, log in via browser (OAuth), and boards are saved to your MockFlow account.

1
npm install -g @mockflow/ideaboard-mcp
2
mockflow-ideaboard-mcp login
3
mockflow-ideaboard-mcp

Best for: Developers using Claude Code, Cursor, or VS Code Copilot.

npm Package →

Add MockFlow as a connector in Claude.ai or ChatGPT. No installation, no account required. A new board is created and you get a shareable URL.

1
Open Claude.ai → Settings → Connectors
2
Paste this URL: https://app.mockflow.com/ideaboard/mcp
3
Ask Claude to create a flowchart — done!

Best for: Managers, marketers, anyone using Claude.ai or ChatGPT in the browser.

Welcome back

Don't have an account? Sign up

Faster ways in

Sign in with an account you already use.