Vote My Way.
Create a way to vote by phone.
11/2020
Vote My Way is a project I started from a program called Daily UI. The first project was to create a signup page, modal, form, or app screen related to signing up for something. This project was during October 2020, when the U.S. election was about to take place. It was the first time I was voting for my country, and I was incredibly confused about how to do so. So, I thought this would be a great time to make a mobile version of the ability to vote. Plus, if we can do our taxes on our devices, why not vote on our devices?
Problem.
As you can see from my empathy map and my notes below, there were a lot of problems facing the application. The first problem I faced was how do I make the voting application very easy since a majority of people have never voted on their device before. The second problem I had to address was the trust and security of smart devices. I had a lot of friends that did not trust the mail-in ballot, so what would make them trust something that can get hacked and change their votes.
Sketches.
Empathy Mapping.
In my empathy mapping, here is what I found as problems to the user experience for voting. Users are proud and happy to vote for their country, but it is still an inconvenience to stop the user's day to vote. There are elderly people that can't get to the voting booth, there are moms with children having to wait in a long line to do something that takes two seconds. And then there is also the issue of security. Back in the 2020 elections, there was a lot of questions about voter fraud. So a lot of users were scared that their ballots would not be counted correctly or worth the count. The last experience I found about users was that the old or new voters had questions about how to vote. This is because voting is not a daily or even a yearly experience, causing users to forget how to vote.
Journey Mapping.
The journey mapping was straightforward because I was already making a voting application, and I didn't have to think about the inconvenience it would cause the users. What I had to think about during the journey mapping was security and the easiest way to vote. That way the users do not have any questions on how to vote. I started with a simple sign-in process with the driver's license number and the social security number. The sign-in process gives the user security and an effortless experience, this is because the next page fills out all the information needed, unlike today's experiences. The users then have to confirm all the information is correct, and then everything is set for election day. I, however, did add four options in how to vote: App, Digital In-Person, In-Person, and Mail. We will be focusing on the app, but both Digital In-Person and In-Person gives you a digital Voter Registration Card. The only difference between digital and non-digital is that the digital makes you pre-select your voting ballot on your phone, and then you go in in-person and scan your phone with an NFC chip for your ballot to be processed. Kinda like the pick-up process that chick-fil-a has on their app. This will give the user the ability to experience voting in person, but much quicker.
Moving back to the In-App voting choice, it gives you a timer for election day and all the information you need to know about voting, including all the runners for the elections. This screen is supposed to help users that have questions about voting. During election day the problem I faced was security. The journey mapping security process was a picture scan of both sides of the driver's license and a proper selfie. This is to make sure the user that is voting is in fact the user that filled out the ballot and not someone else. After that, all the user has to do is fill out the ballot and send it. After completing the ballot the user will be notified that the ballot has been encrypted and then coded to ensure the safety and security of the ballot. The whole point of the pictures and encrypting is to ensure the user that security is the priority. After that users can log off or stay up to date on how their candidate is doing in the running.
Wireframes.
Style Guide.
color.
There was no way I was making this application without choosing red, white, and blue. So I used the color tool by google to pick my colors. The Primary color is (#0d76bd) blue with two blue variants: (#5ba4f0) light blue and (#004b8c) dark blue. The Secondary color is (#ed1c23) red with two red variants: (#ff5f4e) light red and (#b20000) dark red. The background and surface colors are (#ffffff) white, and the error color is (#b00020) red. Other than these chosen colors for the application, I had to pick certain colors to represent the party the candidates represented: Republic Party is Red, Democratic Party is Blue, the Constitution Party is Purple, Liberation Party is Yellow, Green Party is Green, Left Party is Black, Peace, and Freedom is Light Green, and Socialist Party is Light Red.
fonts.
Trying to go with the theme of Patriotism, I purposely choose bold fonts. The Display font is Gotham, and the Running font is Montserrat.
style.
The Style I was trying to go with was Patriotism and paper. As you can see by the color paragraph, I choose all my colors out of the American flag to symbolize Patriotism to the users. Then I wanted to make the application look like paper because I was trying to communicate with the users the similarities it is to voting in person. I used material design from google to recreate the paper look since that was what inspired material design.
The Final Product.
Solution.
To solve my first problem, I had to think about ways to make the website or application much easier to use. The first thing I did to solve the problem was to apply auto-complete. When you first start the application, you are required to put only your Driver's License and Social Security. In filling out your driver's license, all information is auto-completed in the voter registration. The only thing required out of the user is to make sure all information is correct. If information is incorrect, the application helps direct the user to their DMV. The second thing that made voting easier was that the users can see who they are voting for ahead of time (so they can do their research on the candidates). When the time to vote, the user is allowed to vote by phone by selecting it on their device or pre-selected the vote to go vote in person for faster lines. To solve my second problem of security, I started by making sure the user takes a picture of their ID, scans the back of their ID, and then takes a real-time photo to vote. The next solution was to show my users that we code their ballots with a digital enigma machine (that only trusted selected computers have the settings that decoded it) and then encrypt the coded ballots. This process should show that the application takes extra measures to ensure that what the user input will be recorded correctly.
