Politipedia

With the onset of a new decade, the United States has faced its share in political ordeals. We have seen the effects of a trade war with China, watched congressional theater on impeachment hearings and now look to the government to help us wage war against a deadly pandemic. Interest in the inner workings of government has never been higher. This is the story of how I used my UX passion to enable every American with the right tools to observe and scrutinize their elected officials in every level of government.

ROLE

Researcher
Designer

TEAM

Robin Mukherjee
(Initial Design Solo)
Tyreek Houston

DURATION

Jan 2020
(Still in progress)

The Challenge

“Just 37% of Americans can name their representative”

Today if you wanted to gain an unbiased understanding of your representatives, you are in for an uphill battle. Nearly all popular media outlets have some sort of bias and lean in some sort of direction on the political spectrum.

For the aspiring political enthusiast, finding voting records and official statements is no walk in the park. Currently users have to sift through outdated government sites that are efficient in compiling information but are unable to present it in a user friendly manner.

The search for information on state and local representatives is even more tedious. Their sites are not always updated regularly and the css styling is often reminiscent of a bygone decade.

The Approach

Transparency. Transparency. Transparency.

We live in an age where I can easily look up what my tinder match had for dinner yesterday. Yet if I wanted to know how my senator voted on that bill that I deeply care about, I must comb through a few outdated websites.

The goal is to provide the user a one-stop shop site where they can research their elected officials. More importantly they wouldn’t need a degree in political science to understand what they are reading.

I decided the best way to pursue this was to understand how people research their politicians and learn the thought process that one goes through when voting for a candidate.

The Discovery

The first step was to understand how current voters select candidates and consume politics. I setup a Google Forms survey and blasted it to my network as well as place it on some subreddits that allow for sampling. It was important to keep in mind that most of the respondents were my age and much more diverse racially than what one would expect from an actual nationwide poll due to the nature of my network. The following are some key insights that I found from the responses -

Most voters vote only in federal elections.

Voters use a number of resources to follow bills that are passed, but more than half don’t follow bills.

Most voters do not know who their local representatives are at all, but have more knowledge on state representatives, and most knowledge on federal representatives.

During elections, voters vote based on what they believe about a candidate (promises made, public image), not based on information they’ve found.

Most voters don’t follow bills that are passed, but knowledge on how a bill impacts the U.S, their city or state, and race would affect their vote on a candidate.

Along with surveys and user testing I decided to perform some Competitive Market Analysis. As I assumed, this area is quite saturated so I went out looking for why certain site were not as popular as they should be or what they could be doing better. To do so I identified three NNG heuristic principles that would best evaluate the competition based on the needs of a potential user:

Match between system and real world - Whether they are first time voters or people that don’t pay much mind to politics, some users will not understand the different classifications that we have for our politicians. This applies even more so when one delves into state and local representatives. I believe it is important that the products help the user understand what he or she is looking for in the most layman of terms.

Recognition rather than recall - The product is a resource on what can be considered a very complex area. Therefore it may be required to display a considerable amount of information and data. It is important that the interface does not add to the user’s memory load more than it needs to.

Aesthetic and minimalist design - The way ballots are structured are hard enough to understand. The least we can do is provide users with resources to learn about their representatives in a manner that is appealing to look at.

Ballotpedia

Match between system and real world
All buttons and information in the tool are presented in a form that is easily understandable. The tool description and what it includes are worded in a way that should be easily comprehensible by the average user. The user is also asked the basic information needed to find who his representatives are.

Recognition rather than recall
The results are displayed in an easy to read format. The user does not need to input which type of representative he is looking for, rather he is provided with all possible results. All the representatives are denoted with their party affiliation wherever it is applicable as well as their respective level in government. The user is not asked to recall any information, leading me to believe that Ballotpedia satisfies this NNG principle.

Aesthetic and minimalist design
On this principle I believe Ballotpedia lacks amongst the rest. The interface has the feel of an outdated Wikipedia article (probably intentional due to the name). The landing page, though provide clear information, has large blocks of plain text that do not entice the user to continue using the product. Its color scheme is apparent, the blue header and orange donate button mesh well with the logo. But they are the only uses of color on the whole page. The black dotted line that delineates the different offices has a clear function. However it too seems like an outdated divider.

My Reps

Match between system and real world
After a few attempts to type invalid or ambiguous locations into the search bar, I found that the My Reps tool would either search a random location with the closest string that was inputted or nothing was loaded at all. However, the button ‘find me’ is a good example of this principle instead of using the more common and wordy ‘use my location’. Another feature I noticed was the map of the US. Though it may fall under aesthetics, the fact that the map was present next to a location search bar brought me under the impression that it would be interactive. The way the states are delineated may cause some users to click on the states that they are inquiring about, only to find out that it is a static image.

Recognition rather than recall
My Reps satisfies this NNG quite well. The user is presented with checkboxes that will filter results based on which level(s) of government they are looking for. However, if the information of the specified level of government is not found, nothing is displayed. Without an acknowledgement of the lack of data, the user may be confused on whether representatives do not exist or may just be missing. They do however have a small blurb asking the user to report to Google with a link that takes the user to a Google API error reports form.

Aesthetic and minimalist design
My Reps does an excellent job with minimalistic design. The font colors are different shades of black and the headers are different fonts that all complement each other. The grid like format of the information being displayed makes it easy for the user to figure out what they are looking at. Also the fact that the icon links to social media accounts are in the different red accent color is a nice touch.

Who Is My Rep

Match between system and real world
As done with the previous tools I inputted invalid addresses and zip codes. The error messages did have a bit of ‘system’ talk to it. However it is only one field that is being inputted and the average user would probably able to figure out that the address provided was simply not found. Other than that the interface is very intuitive.

Recognition rather than recall
Similar to Ballotpedia, the user is provided all representation respective to the address provided. The results page is a collapsible list that outline each representative’s name, position and party affiliation (denoted by a red or blue dot).

Aesthetic and minimalist design
Who Is My Rep definitely takes the top spot for aesthetics and minimalist design. The user interface is very intuitive and free of unnecessary information. The plus icons start up a small animation which makes the chosen official’s name become larger as well as expand to a box that includes buttons to different relevant links. I would have kept to the dark blue and white theme with the buttons inside the entries however they do help in denoting the differences.

User Personas

Charlie, Donna and Sam were the user personas that I chose to represent the vast differences amongst the audience that would be interested in using this app .Charlie and Donna are relatively unaware of the intricacies of bills, knowledge of local candidates and their main source on information on politics comes from mainstream media news outlets. Sam is considerable more in politics and considers himself a politico. The benefit for this application would be more technical. The app is well designed and easy to use for him to do his usual research compared the current alternatives.

The Vision

For those of us that are not seeking a political career, our civic duty is to hold our government accountable. Our primary method of doing this is through INFORMED voting. Hence I chose the following four functions as the MVP features for this application:

Track

Users should be able to track bills as they pass through the various stages before becoming law. If they wish they can optionally read the full text of the bill as well as see how Congress members voted.

Learn

Oftentimes at the ballot, voters will have little knowledge as to what a certain Boffice may entail. Everyone knows of the common ones (eg. mayor, city council), but how about the duties of a sheriff, county auditor or clerk of court. Users should be able to learn about all positions in an easily digestible format.

Compare

Whether it be for primaries or general elections, all users should be able to find their candidates to compare them. The platform will provide unbiased facts and statistics taken from each of their press statements, voting records and campaign websites. Links to media outlets could be aggregated for further analysis.

Find

Every user should be able to find all the elected officials that represent them in every level of government. A profile page with relevant information as well as links to applicable information will be provided.

How Might We..?

With the user analysis and an exercise known as “how might we” statements the aforementioned features would best serve the goals of our user personas and general audience. Charlie and Donna should be able to learn about the different types of government and roles within them as well as find  who represented them. Sam should be able to track bills that will affect his community. All three of them should be able to compare candidates when voting season comes about.

How might we make it easier for new voters to learn about their elected officials?
‍A quick view/ profile page on the elected official. This would include their basic information like party affiliation and links to their social media accounts. It would also include the top 3 issues that they are the most vocal about. If they have been in office, their last 3 votes on record. It would also include a few links to the top new stories about them.

How might we educate users on the inner workings and responsibilities of local and state officials?
Either an animation/short video explaining the roles of each posting in local and state governments (think schoolhouse rock videos). The goal being that education on these roles is easily digestable to the average voter who may not be familiar with political jargon. More detailed explanations can be presented in text form for those that are interested as well as links to informative articles.

How might we help voters make a clear decision on who they will vote for?
Around a month before an election, the application can alert the user which offices are up for elections as well as the candidates. Once the user chooses an office for a detailed view they will be offered with a side by side comparison on the candidates. The comparison will include their views or “quotes” on major issues. The user can choose who they like and after they have chosen a candidates for each office the application can provide a list of candidates that the voters can take with them to the voting booth.

How might we aid voters to track bills in Congress and State Assemblies?
The application would present a list of current bills either being formulated, discussed or on the floor. They would be divided by US Congress and the user’s state assembly. Each bill could have different tags on them to identify at which stage they are in the process. The feature would also allow the user to contact their representative if they would like to voice their opposition or support of the bill. If the congressman has already made their view on the bill public, that information would also be presented. The feature could also include recent top stories on the bill for users that would like to learn more about it.

How might we allow users to track legislation and executive action on issues that they care about?
The user could choose issues that they feel strongly about during account creation or choose later. This feature would include articles from various sources regarding the issue. If the user’s representatives are mentioned  they could be highlighted with a tag.

The Journey

Analyzing user goals from my research served as a tool to what I would consider this app should not only do, but also how it would feel. Understanding emotional design helped me prioritize the aesthetics and tone of its experience.

The Prototype

Disclaimer - The gifs below have some washed up color due to recording software and you might not be able to see all elements in a wireframe. If you would like to test out the prototype yourself please click here.

Find
With an input of a zip code or address, the user is shown a list of all the political figures that represent them for every level of government. The user is able to filter out the results based on the level as well. Once the user has chosen a result a quick view of the politician is shown from where they can navigate to different screens regarding said information. All options are also available to view via the profile page on the politician.

Learn
Should a user wish to learn more about the different electable offices, they may click on the Learn button on the homepage. The resulting page organizes a number of different positions in a grid-like format divided by branch of government and level of government. Once the user chooses an office, they are able to watch a short educational video on the position as well and read up on more information about it below.

Track
Clicking on the track button on the homepage will change the home page search bar to one for bills. The user can search for a bill by keyword or bill#. If they choose All bills, the most recent bills on the floor will display along with an advanced search bar. Result modules provide basic information such as the title, cosponsor and date introduced. When bringing up the bill page the user is able to read a summary of the bill, position statements, and a timeline of the bill so far.

Compare
Similarly to the track function, the compare function will allow the user to see information about candidates running for elections. Should the user type in a candidate and select an election they are able to see the current breakdown of it with an infographic and polling figures.

The Impact

While looking for some insights into the UX profession I contacted an old colleague of mine by the name of Tyreek Houston. Together we have brought this initial design and research to a group of individuals interested in actually producing it and making it available for all users. In the light of the current political/social atmosphere we believe that this would be an invaluable tool for all voters. Currently we are making the change from a web application to a mobile application. Further changes as well as the finished project will be updated on this page.

If you are interested in working with us on this project, please contact me at robmukherjee@gmail.com