Democracy
A simple way to gain access to your most powerful right.
Here lies the problem
The final app in the Google UX Class was to design an app for social good. I chose to design a mobile app to help citizens register to vote.
Time to dig up some dirt
After examining the competition I found that the websites used for registering to vote are all different. They all have their own way of doing in line with their state government. Most of the websites provided online registration that left me feeling stressed and overwhelmed due to small cramped text and the lack of spacing between the information.
Onwards to the sketching and wire-framing
After my research, I now had an idea of what I would like to do to solve the problem. Time for my idea to come alive in my sketchbook and then into Figma to start building digitally.
After using what is provided for registering to vote, I chose to follow again a simple layout and this time, I used a vertical navigation bar that would slide in when needed. This allows for the design to be more responsive to other devices. This leaves users at ease so they can focus on their tasks rather than trying to navigate the app.
Sketch
Wireframe
Moving on to a lo-fi prototype
After laying out the wireframe, I now had an Idea of where to go with this lo-fi prototype. I polished elements and added, the navigation bar, set up the procedure to register to vote, and added other necessary pages to the prototype.
To get a better look at my lo-fi prototype, here is a link:
https://www.figma.com/proto/IVnlX7I4pu6obnrhj5xIF1/Voter-Registration-App_Tolerico?page-id=5%3A2&type=design&node-id=5-3&viewport=604%2C582%2C0.31&t=L7gvfyI1A3ljzFGq-1&scaling=scale-down&starting-point-node-id=5%3A3&mode=design
Heading into the hi-fi prototype
Once I had the lo-fi structure in place, it was time to add a color palette to the app. I followed the color guidelines that the government provided for their websites. I also drew inspiration from the United States Presidential Seal. This provided a professional, regal, and important look to this project. After picking the color palette I started to finalize the app by adding images, fine tuning elements like the buttons and text. After all this is done I went over the connections in the prototype to make sure navigating the prototype was stress free.
To get a better look at my hi-fi prototype, here is a link:
https://www.figma.com/proto/IVnlX7I4pu6obnrhj5xIF1/Voter-Registration-App_Tolerico?page-id=10%3A13&type=design&node-id=68-44&viewport=800%2C483%2C0.22&t=Stu0nnkkmbex56YV-1&scaling=scale-down&starting-point-node-id=68%3A44&mode=design
Testing out this design
With this design, I decided only to test this prototype once. I tested it in its h-fi state to see if it made a difference whether or not I tried it in lo-fi made a difference. My testers seemed to have no issues with the app and found it easy to use. It was Figma and the internet where my testers ran into problems, Figma being finicky and sometimes failing to load certain elements. Once all this was sorted out, the testers liked the design and found it simple to use and understand. One tester, Lori, enjoyed that you could research and learn about the representatives in whatever area they may be living.
“I like the idea of looking up the representatives in the area. It allows people to have a chance to understand who is going to represent them and how their going to help their area.” - Lori
To see the full results of the usability test press the button below:
In Conclusion
I wanted to design a simple, easy way for users to have access to register to vote, and have the necessary information and files to be able to exercise our most potent right as a civilian. After looking at the options available for people to use, I felt good about providing this opportunity for people to have an app like this one. I found creating this app particularly difficult, trying to keep this app simple and figure out what was necessary for the user to have and not get carried away. Like most anything, the more experience you have, the more ways you can iterate and solve the problem. The more I get into this world of UX, the more excited and confident I will become to tackle anything that comes my way.
To see the full results of the case study press the button below: