Docs

Image Choice Quiz

Published July 25, 2026

An image choice quiz lets participants answer by comparing visual options instead of reading a long list of text choices. Use it for product matching, style preferences, visual diagnostics, examples, inspiration, assessments, and any quiz where pictures make the answer easier to understand.

In QuizFlow Labs, image choice quizzes are built with a Multiple Choice block using the Media card style.

Product-style UI mockup of an image choice quiz with visual multiple choice cards, a selected image option, settings controls, and branching flow cues.

Image choice quizzes work best when the visual options are easy to compare and the labels stay short.

Best used for

Product matching

Let participants choose the product, category, style, or use case that looks closest to what they want.

Style preferences

Show visual options for design, skincare, fashion, interiors, food, fitness, or creative direction.

Visual diagnostics

Ask participants to pick the example, condition, setup, or screenshot that matches their situation.

Learning and assessment

Use image options with scoring and Answer Key controls for visual knowledge checks.

Before you build

Use comparable images

Keep framing, lighting, crop, and visual weight consistent so one option does not win by accident.

Keep labels short

Use 1-4 word labels. Let the image carry the meaning and the label confirm it.

Plan the output

Decide whether each choice should set a tag, add a score, route to another step, or only collect preference.

Avoid vague visuals

If the participant cannot tell what an image represents quickly, use a clearer image or a text-based block.

Build a visual multiple choice quiz

  1. Add a Multiple Choice block and write a prompt that asks for one visual decision.
  2. Open Settings and set Style to Media card.
  3. Return to Options and add an image to each choice with Choose from library or Search GIFs.
  4. Add or confirm Alt text so each option remains understandable without the image.
  5. Choose an image position for each option, then preview the quiz on desktop and mobile.
  6. Add optional Tags, Scores, Answer Key, or Jump Logic depending on the outcome you need.

Media sources and positions

Use the Asset Library for the most reliable image delivery. Asset Library images inherit saved alt text by default and newly selected images start with the Large top (card image) position.

You can also use Search GIFs to pick a GIPHY-powered GIF for a choice when motion helps the participant recognize the answer.

Large top

Best for visual-first cards where the image should dominate the choice.

Medium top

Useful when the image matters, but the label and surrounding card copy need more balance.

Small top

Useful for compact visual hints above short labels.

Top

Places the image above the label without the large card-image treatment.

Left

Places the image beside the label for row-style comparison.

Upload limits and quality guardrails

Media card choices use Asset Library image rules so visual flows stay fast and consistent.

Accepted image files

JPG, PNG, or WebP.

Source file size

Up to 10 MB before processing.

Image processing

Images are compressed to a maximum 1200px longest side.

Post-compression limit

The final image must be 500 KB or smaller after compression.

If a file does not pass validation, the Asset Library blocks it immediately so you can retry with a smaller or cleaner image.

Scoring, tags, and routing

Tags and variables

Use tags when image choices should personalize outcome copy, exports, or follow-up workflows.

Scoring

Basic+
Assign points to image options when the quiz needs totals or score-based outcomes.

Answer Key

Basic+
Mark correct image answers for visual knowledge checks.

Jump Logic

Pro
Route participants based on image choices, tags, scores, or destinations.

For full setup details, see Multiple Choice, Response Tags, Scoring Logic, and Logic & Branching.

Common patterns

Product recommendation quiz

Use one product, category, or use-case image per option. Tag each choice, score if needed, and route to a completion CTA that matches the participant's selected preference.

For a complete ecommerce workflow, see Product Recommendation Quiz.

Style or preference quiz

Use consistent image dimensions and comparable framing so participants compare style, mood, or preference instead of reacting to image quality differences.

Visual assessment quiz

Pair image options with scoring and Answer Key controls when one image is correct. Add immediate feedback if participants should learn during the quiz.

Troubleshooting

Why can I not add images to options?
Open the Multiple Choice block settings and set Style to Media card. Image controls appear on each option after Media card is selected.
Why was my image rejected?
Use JPG, PNG, or WebP files. The source image can be up to 10 MB, but the optimized result must stay 500 KB or smaller.
Why do my cards look uneven?
Use images with similar aspect ratios, crop style, lighting, and subject scale. Mixed crops can make one option look more important than another.
Should I use Media card or Product Cards?
Use Media card when participants are answering a question. Use Product Cards when the quiz should present offers, products, pricing, badges, or checkout paths.
Should I use GIFs?
Use GIFs only when motion makes the choice easier to understand. Static images are usually better for product matching, assessments, and side-by-side comparison.

Tips

  • Ask one visual decision per question.
  • Use the same image aspect ratio across all options.
  • Put the most important subject near the center of each image.
  • Keep labels short and direct.
  • Add alt text for every choice image.
  • Test on mobile before publishing.
  • Use tags or scores when the image choice should affect the final result.
Share