PROJECT 05 / Human Factors
Voting Interface Design.
Designing and testing an accessible voting interface focused on clarity, inclusive interaction, and confidence in a high-stakes process.
Research → Wireframe → Test → Learn → Iterate → Final UI
- YEAR
- 2024
- CONTEXT
- ENP 166 · Voting Interface Design Project
- TEAM
- Group Project
- MY ROLE
- User Research · Wireframing · Usability Testing · Interface Design
The Challenge
Voting is a high-stakes process that needs to work for people with very different levels of political knowledge, technical experience, reading ability, vision, language proficiency, and familiarity with election procedures.
Our team explored how a digital voting interface could make the process easier to navigate without reducing access to important information or influencing the voter's choices.
DESIGN QUESTIONHow might we help voters understand complex information and confidently move through the voting process without adding unnecessary barriers?
Designing for Different Voters
Our research considered users with very different abilities, experiences, and information needs rather than designing around a single 'average' voter.
YOUNGER / FIRST-TIME VOTERS
- Clear instructions
- Trustworthy information
- Help understanding registration
- Efficient access to candidate information
OLDER OR LOW-VISION VOTERS
- Larger readable text
- Strong contrast
- Clear navigation
- Screen-reader or audio support
VOTERS WITH READING OR COGNITIVE CHALLENGES
- Plain language
- Shorter explanations
- Clear hierarchy
- Alternative ways to access information
VOTERS WITH LIMITED ENGLISH PROFICIENCY
- Translation
- Simple instructions
- Visual support
- Reduced jargon
Turning Research into Design Principles
CLARITY
Use plain language and strong information hierarchy.
ACCESSIBILITY
Support different visual, reading, and language needs.
NEUTRALITY
Present political information consistently without visually favoring one option.
CONTROL
Allow users to review information, compare options, save progress, and revisit decisions.
CONFIDENCE
Clearly communicate progress and provide a review step before final submission.
DESIGN DECISIONWe intentionally avoided comprehension tests or mandatory reading checks because adding additional barriers to the act of voting could make the process less accessible.
Mapping the Voting Journey
- Sign in
- Verify identity
- Check registration
- Register if needed
- Ballot measures
- Candidates
- Compare
- Review
- Submit
- Confirmation
From Research to Wireframe
We translated the research into a low-fidelity Figma prototype so we could evaluate the structure and flow before investing in visual styling.
The wireframe focused on how users would move through the ballot, find additional information, compare candidates, and review their selections.
Testing the Wireframe
We tested the wireframe with six participants across different ages and professional backgrounds.
Participants moved through sign-in, verification, registration status, registration, ballot information, candidate comparison, review, and submission tasks while we observed navigation problems and gathered qualitative feedback.
6USABILITY TEST PARTICIPANTS
Could users understand where they were and what to do next?
Could users find and understand ballot and candidate information?
Were instructions, forms, and interactions understandable across different users?
Did users feel prepared to review and submit their selections?
What We Learned
The basic flow was easy to understand
Participants generally responded positively to the clean structure and simple sign-in and verification flow.
Some actions needed more context
Users wanted clearer explanations for registration status, verification, unfamiliar form fields, and what different actions would do.
Political information could become dense
Candidate and ballot pages contained important information, but several users wanted stronger visual hierarchy, summaries, and easier ways to scan content.
Comparison was valuable
Participants liked having a direct candidate comparison tool rather than repeatedly navigating between candidate pages.
Review built confidence
The review screen helped users verify their choices, but editing selections needed to be more visible.
Turning Feedback into Design Changes
BALLOT INFORMATION
A clearer way to process dense ballot information.
Created stronger hierarchy, clearly separated favor/against information, added a visible progress system, and made the voting action more prominent.
CANDIDATE COMPARISON
More visual separation and an easier way to compare candidates without navigating back and forth.
Developed a structured comparison workspace with candidate profiles, clearer columns, and direct side-by-side information.
REVIEW + SUBMISSION
Confidence that their ballot was complete and an obvious way to modify selections.
Created a structured review page with clearly separated ballot sections and visible edit controls before submission.
Final Interface
The final visual design retained the structure tested in the wireframe while adding stronger hierarchy, clearer navigation, consistent visual language, and more visible system feedback.
Accessibility Was Part of the Interface, Not an Add-On
Accessibility requirements were considered from the beginning of the project rather than added after the main interaction had been designed.
The final concept included controls intended to help users adjust how they access the voting experience.
Support for multiple interface languages.
Allow users to increase the size of interface text.
Provide an additional way to access written content.
Break complex information into more manageable sections.
Keep progress and actions predictable throughout the voting flow.
Designing the Final Decision Carefully
In a high-consequence interaction, the final step needs to communicate both control and finality.
The interface gives users a dedicated review stage before submission and then clearly confirms that the process has been completed.
See selections together before submitting.
Return to sections that need changes.
Clearly communicate when submission is final.
Provide an explicit completion state after submission.
Explore the Prototype
The final Figma prototype shows the complete interaction flow from account access through ballot review and confirmation.
Explore Final Prototype (opens in a new tab)View Early Wireframe (opens in a new tab)
What I Learned
This project reinforced that simplifying an interface does not mean removing important information. The challenge was deciding when information needed to be immediately visible and when users should be able to access additional detail on demand.
Usability testing also showed how differently people approach the same high-stakes process. Some users moved quickly and wanted concise summaries, while others wanted to carefully review every available detail. Designing for both required clear hierarchy, predictable navigation, and multiple levels of information.
If I continued the project, I would conduct additional accessibility testing with screen-reader users, people with low vision, and users with cognitive or reading disabilities, then iterate on the interface based on those results.