Overview
The Client: A Comprehensive Guide to Elected Offices
WHO IS SPREAD THE VOTE?
MY ROLE
Led several user research sessions with 10+ individuals, while teaching developers how to conduct reseach.
Designed an intuitive seach feature, a core function that educates users about political offices.
Utilized my knowledge of databases and APIs to construct designs, and handed them off to developers.
Scoping
What's Important for Encyclopedia Politica?
After learning about Spread the Vote’s mission for Encyclopedia Politica, we defined the project’s goals and why they were important.
Ensure discoverable and meaningful content
Build a scalable and cohesive site structure
Design an interface that builds trust with users
Spread the Vote planned to house information about all the political offices in the US— a very heavy set of information. Our main priority before diving in was to organize the offices.
Research
Political Offices are Complicated!
WHO ARE OUR USERS?
Encyclopedia Politica
Houses information about all U.S. political offices— ranging from the President, to Attorney Generals, to State Local Judges.
End Users / Voters
Need to intuitively find the political offices
and information they're looking for, without requiring help.
Spread the Vote Team
Need to easily manage the large dataset of U.S. political offices as it continues to grow, given their low-tech knowledge.
ROUND ONE: OPEN CARD SORTING
While Spread the Vote hadn't compiled all of the U.S. offices they were going to include in the final project, they provided us with the list of Louisiana offices they already completed.
Some of the offices provided.
Pre-Determined Office
Categories
Could users group them
differently?
Key Insight
Low-informed voters think about what offices do, not which level of government they belong to.
ROUND TWO: TREE TESTING
4 / 7
Tasks with agreement
For tasks 1, 6, and 7, there were discrepencies in the most commonly picked page.
"State courts, for example—I don’t know what I’d go there for beyond cases or legal issues. I'd like it to be more familar; like elections broken up into ballot measures, or what's on the ballot, or who's running?"
Users were stuck between 3 different pages for task 7.
There is only so much that the information architecure can capture.
Users cannot intuitively know how to use the directory/site.
Ideation
Iterating on the Site Map
"Local government should be divided into county and municipality."
"Get Involved doesn't need its own page - add it to the About page.
"Move Directory higher on the Home page, it should stand out more."
Design
Breaking Down the Pages
SIMPLIFYING THE SEARCH
Although we narrowed down the categories for the directory, the issue was making the search feature intuitive. We needed a way to let low-informed voters know what they could search for, without being text-heavy.
Using ChatGPT, I researched information-heavy websites that had search features to accomodate it— such as e-commerce sites and academic repositories. I implemented a search bar with a dropdown filter, similar to Worldcat's. Depending on the selected category, the placeholder text would also change—letting users know what they could search.
OTHER DESIGNS I WORKED ON
Office Page
About Page
The STV team provided the About page content, and I didn't add much imagery to avoid detracting from the core information.
DESIGN TO DEVELOPMENT
After finalizing the designs, we handed them off to developers in Figma. They built the site in Webflow because of its balance of high functionality and low technical overhead—making it easy for the Spread the Vote team to manage after handoff.
THE FINAL SITE
Once complete, we handed the site over to the Spread the Vote team for them to manage!
Note: Since this project concluded, the product has continued to evolve. The live site reflects ongoing iterations and constraints that differ slightly from the designs presented in this case study.
Reflections
DESIGNING FOR DENSE INFORMATION
The biggest challenge was sifting through all the political offices— I didn't have much political knowledge, so I didn't know where to begin. But through the process, I learned how to break down a large set of information into sizable chunks.
BE PREPARED TO SHIFT GEARS
There were things that didn't go to plan during the project. While we created an idealized project roadmap, we shifted gears due to setbacks—such as struggling to recruit users for research, delayed responses from our client, and development troubleshooting. It's important to remain adaptable and not to get too attached to one path!