Get younger generations to become informed voters: A UX case study

Brayden Iwasaki UX
Brayden Iwasaki
Published in
9 min readFeb 10, 2019

Research from the last Presidential election showed that the Millennial and Gen-X demographic had the highest voter turnout. They outnumbered Baby Boomers and older voters for the first time, 69.6 million to 67.9 million. Close to 2 million more votes. Looking into this more it revealed that only 49% of Millennials and 69% of Gen-X generations voted.

How might we help the younger generations register and vote as the responsibility shifts to them?

Strategy: Research

As a team of 3, we set out to see what we could do to help increase voter turnout of the younger generations. With the problem in mind, we looked to develop a strategy to reach this goal. We started our research to figure out the needs of our user.

Some assumptions we came up with about the demographics:

  • They are influenced by social media in their voting decisions.
  • They are motivated by convenience.
  • They are not sure what they are voting for or who is on their ballot.

We wanted to see what is motivating this demographic to get out to vote and what would influence more to do the same. Using our assumptions we put together a survey. We wanted to find out if people had voted and why they voted in the last two elections. In a few hours, with a hand from social media, 62 responses from the qualifying demographic came in.

A survey was sent out to test our assumptions

Interviews

To find more insight about our demographic we each went out and interviewed people on the street. This helped me find out about their pain points and what their voting experience was like. I was interested in what kind of trends were seen from a candidate point of view. I contacted someone who had worked on a recent campaign to see what insights they could give me on this.

Interesting insights from interviews:

  • They are more conscious of issues and candidates because of social media.
  • Voting out of social pressure as opposed to informed choices.
  • People often vote based off of knowing who they don’t want to vote for.
  • Negative ads get a reaction that influences people to come out to vote without being informed.
  • Many people are not informed of every decision they are going to have to make on their ballot. They end up picking recognizable names to vote for.

At a glance, interviews and survey answers were all over the place. Putting them into an affinity map made the common points stand out so that it was more digestible.

Some interesting survey data points:

  • A third of the survey responses said they didn’t vote in the last two elections because they didn’t feel informed enough.
  • 48% of the survey responses that didn’t vote had sited registration issues.
  • A third or more of those who voted said they didn’t know all the candidates and choices that were on their ballot.
Organizing the survey and interview data

Grouping the commonalities helped us focus on our user. This showed us how we could help younger voters get over pain points and in turn help more people vote. This made it easier to build more empathy for our users.

Some strong commonalities in interviews:

  • Felt their vote didn’t make a difference.
  • Didn’t feel informed enough to vote.
  • Confused about candidates/issues from social media, news, etc.
  • Thought they registered to vote, but not sure.
  • Didn’t know about all the candidates and issues on their ballot.

From the data collected, we created a persona to show us what our user looked like. This focused the goals and narrowed our scope for the project.

Scope: Who Are We Designing For

Meet Jessica, a millennial who has three goals:

  • Make informed voting decisions.
  • Feel like she is positively impacting her future as she votes.
  • Wants to encourage her friends to learn more about issues and vote.

It also includes her frustrations that we can address and experiences we can improve. The persona keeps the focus on our user and their goals.

Our Millennial Voter Jessica

Structure: Site map + Card sorts

We created a user story map to ideate website features that would help ‘Jessica’ reach her goals. We broke each goal down into a narrative of how she would accomplish them. Each narrative was broken down again into tasks so that the narrative could be accomplished. These subtasks were organized in order of importance to decide what the minimum viable product looked like. The tasks that fall below this line could be added later.

With the MVP established we checked the anatomy of our mapping. We did this to make sure the tasks focus on ‘Jessicas’ goals. By asking: “As a Millennial Voter I want to (task) so that I can (goal).” From this, we confirmed that the tasks focused on the users’ goals. Also, to make sure they were all in the correct location under the right narrative. This helped organize and clean up the redundant and non-related tasks.

User Story Map

The user story map gave us a map for each of ‘Jessicas’ goals and what they included and how to accomplish each of them. They all tied back to her goals but I wondered if we were presenting her with too many choices. We agreed that we might need to take some features out. From this, a site map was put together to finalize the navigation.

Site map of our site

The features we ideated all fit with ‘Jessicas’ needs and goals. Through doing some card sorts we can find out where the navigation could improve. This would clear up questions about it for us and our user.

one of many card sorts

The card sorting process did show us that we were confusing our user by having too many features. Grouping some features together would help guide users through the navigation. It also pointed out the confusion in our naming conventions. Ultimately, this was making it difficult for the user. We adjusted our naming from the card sort feedback to more simplified terms.

Skeleton: Wireframes + Prototyping

To form a skeleton of what the site would look like we moved on to wireframes. We worked through 10x10s and reviewed our wireframe sketches as a team. We grouped elements together that made sense for accomplishing ‘Jessica’s’ goals. We created rough wireframes that gave us a good place to start testing with.

A few of the chosen wireframes

User testing with rough wireframes

We asked users questions about where they would go to find certain features. Through this dialogue, it pointed out where we needed to reorganize and simplify our navigation a little more. It included some features that weren’t as important to ‘Jessica’ as we first thought.

Some feedback from the wireframe testing:

  • What would be under the “discuss” page?
  • Are you creating your news or is it from an outlet I might not trust?
  • Where is the candidate information?

We also got feedback about including some features that were not in our MVP that she would want.

What we changed from the feedback:

  • We decided that the “discuss” page wasn’t as helpful to our users.
  • It was more important for ‘Jessica’ to be informed. This would allow her to come up with her own things to discuss.
  • We focused on prioritizing information ‘Jessica’ was looking for first.

Team project ends, the individual project begins

After the first round of rough wireframe testing, we broke out from the group and finished the project on our own. I created the wireframes in sketch and put them in front of users for more testing.

Initial Wireframe prototypes

I learned users wanted more information personalized to them. This is the main reason why they were coming to the site. Feedback like what is on my ballot? where are the issues I saved? and what issues are relevant to me? came up. We had these features already but we needed to change the hierarchy of them.

Wireframe Adjustments

I needed to take another look at the wording and the content to simplify the site and its navigation. This brought the focus to the home page and what information was on it. I created new open and closed card sorts for the navigation. They helped make the information and the site map more clear. The card sorts pointed out where I needed to make changes. This would also help streamline the voting process for the user. It was important to make that information more accessible right from the beginning.

Second Round of Card sorting

Many testers asked about the “news” page and what was on it. How much I had to explain this, I realized it was information that the user was not looking for. It was to help Jessica get better informed but she was already getting news from other outlets. She would be coming here to get information and decide where she stands on issues and candidates. This would be the place that they would come before they voted. Following news topics didn’t seem as useful when they were looking to form their own opinions. ‘Jessica’ is looking to inform herself about issues not taking the opinions of the news. This lead to simplifying the site features and navigation a bit more to focus on ‘Jessicas’ needs.

I updated the wireframes with the feedback and tested them again. With the changes, there was a noticeable improvement in flow through the menu and options. This was a good sign.

Final wireframes

Surface: Final Site

After testing, updating the wireframes and receiving good feedback, I moved on to the surface design of the site. The finalized wireframes were used to create high fidelity mockups. There were a few iterations and design layout changes but the wireframe content was the same. It was important to appeal to the targeted demographic and to look like a reliable source. Obviously, blue is a patriotic American color. In color theory, blue provides a sense of security, stimulates productivity, and promotes trust. Millennial colors are a pastel palette so I used a pastel blue for the main color. I used Open Sans for the typeface. It is a humanist sans serif that has a neutral yet friendly appearance.

Logo, Color palette and Typeface
Final screenshots

Conclusion

Millennial and Gen-X voters outnumbered the Baby Boomers and older voters. But only 49% of Millennials and 69% of Gen-X generations voted. We wanted to educate and make it more convenient for the younger generations to vote. The end result helped ‘Jessica’ reach her goals and would also increase the voter turnout of others like her.

Moving forward

With the next elections being far off, getting compelling feedback will be difficult. Getting feedback from people when voting is on their mind would be the most relevant. Sharing the prototype with users to see if we actually helped ‘Jessica’s’ meet her goals is key.

I tested the final prototype of the site with a few of the people I had interviewed. I received positive feedback.

‘I want to use this site for the next elections!’

I want to do more user testing to get more detailed feedback around the next elections. This would flush out what features could improve and fine-tune the user experience. Hopefully, the young voting generation can gain confidence by becoming informed and take action because of it.

Process lessons learned…

  • Having a well-defined strategy is key. This would have helped us refine the features of the site earlier in the process.
  • It is important to challenge the structure that is developed early. This saves a good amount of time spent in the later steps of the process. This helps keep you on track, staying focused on the user and their goals.
  • We ended up removing two features of the site that wasn’t as important to ‘Jessica’ as we had initially thought. Research, user testing and building empathy for ‘Jessica’ was the key to making correct decisions throughout the design process.

Let me know what you think in the comments below! Thanks for reading!

--

--