Vote Count
Case Study · Civic Tech · Mobile App
UK Vote —
Candidate Advisory App
Our solution gives users two types of comparison — the traditional side-by-side view and a personalised, interactive way to compare candidates based on their own priorities and values.
01 — Description
What the app does.
The Quintet (a five-person UX team) designed this app for the UK Election context — helping voters compare election candidates side by side, or through an interactive personalised match game that scores candidates against a user's own stated priorities.
We found it is hard for users/voters to match between two candidates when all information is in long text. We simplified it by making the comparison as short and scannable as possible. That is why we are including one more way which is engaging and interactive — the Candidate Match Game.
We have tried to cover in-demand technologies to interact with — Voice search, GPS Navigation, Push Notification, Scan QR or Barcode on ID card, Chatbot, In-app Q&A, Rating, and Share through 3rd party IMs. We also considered other challenges like Meet the Candidate.
02 — Design Challenge & Overcome
Two problems worth solving.
Challenge 01
Information overload made comparison feel impossible.
We found it is hard for users/voters to match between two candidates when all information is in long text. It made the comparison overwhelming and discouraging — particularly for first-time voters who had no prior framework for evaluating political candidates or understanding policy positions.
✓ We simplified the comparison by making it as short and scannable as possible — structured policy cards with plain-language summaries at Grade 8 reading level.
Challenge 02
Traditional comparison felt passive and boring for younger voters.
We thought it is a bit boring for some users to use the traditional way of comparing candidate information. The static side-by-side format didn't engage younger voters who expected interactive, game-like experiences from their mobile apps.
✓ We included an engaging, interactive Candidate Match Game — presenting candidates one policy at a time and building a personalised match score.
03 — Solution
Three-part solution.
Multi-modal interaction
We included multiple ways to compare and considered other challenges like Meet the Candidate. Voice search, GPS Navigation, Push Notifications, Scan QR or Barcode on ID card, Chatbot, In-app Q&A, Rating, and Share through 3rd party IMs were all included — covering the full range of how different users naturally interact with mobile information.
Multiple comparison modes
We included multiple ways to compare: Traditional side-by-side (for detail-oriented users who want the full picture) and the Interactive Candidate Match Game (for users who want a personalised, engaging experience that scores candidates against their own priorities). Users choose their own path — neither is the default.
User interview integration
We arranged some local user interviews where they interacted with our prototype and found some minor suggestions which we included in the solution. The Meet the Candidate feature — offering both Physical Meets (constituency events with GPS navigation) and Virtual Meeting Detail (video Q&A sessions with scheduling) — emerged entirely from prototype testing feedback and was not in the original brief.
04 — Flow Diagram
The Quintet — UK Election. Compare Candidate.
The complete user journey — from entry through to electoral action — designed around two parallel comparison paths with a shared entry point and shared outcome.
Login / Sign up
Authentication with location-based constituency detection
Main Menu
Home · Announcements · Media · News · Trending Videos
Candidate List
Browse, search, filter, and sort constituency candidates
Candidate Detail
Full profile — policies, media, ratings, Q&A
Meet the Candidate
Physical Meets (events) or Virtual Meets (video)
Comparison Screen
Traditional side-by-side OR Interactive Match Game → Result + Know My Booth
05 — Wireframes
Low-fidelity exploration before visual design.
Wireframes mapped the entire screen architecture and interaction flow before any visual design decisions were made. Focus areas: the two comparison paths, the candidate list card pattern, and the Meet the Candidate booking flow.
Main Menu · Wireframe
Candidate List · Wireframe
Comparison · Wireframe
06 — Application Designs
High-fidelity screens across all primary journeys.
The complete visual design system applied to all major flows — from the main menu through candidate discovery, comparison modes, and the Meet the Candidate booking flow.
Hello Screen
Candidate List
Match Candidate
Comparison Screen
07 — Major Designs Showcase
The screens that define the experience.
Find Your Question — Q&A
Policy priority selection — the entry point for the personalised Match Game. Plain-language categories at Grade 8 reading level. Selection confirmed with both colour and border change.
Physical Meeting Detail
Physical Meet booking screen — emerged entirely from prototype testing. GPS directions, event details, and registration all in one screen. Capacity indicator helps users plan ahead.
08 — Figma Prototype
Interactive prototype — full journey.
UK Vote — Full App Prototype
Add your Figma prototype share link to embed the complete interactive UK Vote prototype here — covering the full user journey from Login through Candidate List, Match Game, Comparison Screen, and Meet the Candidate flows.
Open Figma Prototype →09 — WCAG 2.1 AA
Civic neutrality as accessibility principle.
Political Neutrality
Four candidate-ordering approaches tested before landing on alphabetical with random sort as default — no candidate receives positioning advantage.
Plain Language
All policy summaries written at Grade 8 reading level — accessible to first-time voters with no political background.
Keyboard & Screen Reader
All comparison flows keyboard navigable. Match percentage communicated as text, never colour alone. ARIA labels on all candidate photos.
Colour Contrast
Party colours used only within defined neutral display contexts — never as background fills. All text meets 4.5:1 contrast ratio against backgrounds.
↑74%
Information comprehension
↑82%
Perceived neutrality score
Gr.8
Reading level achieved
AA
WCAG 2.1 compliance