HERE is a link to the slide deck for this portfolio project.
Project duration: October 7th - November 3rd.
My role: Lead UX Designer. Responsive web design from conception to delivery. UX Researcher
Responsibilities:
User research, competitive audit, wireframes, mockups, prototypes. Design with ALL users in mind, with special care to those that vote, and those with accessibility requirements.
This project targets United States Users currently. Those that would be affected by proposed legislation bills. The purpose is to keep the user in formed about proposed bills that affect that user directly in their neighborhood.
The problem:
People in our neighborhoods need a way to stay informed of proposed legislation ahead of time. Because the average person may be busy with life, and conventional methods have gone to the wayside, people in a district/ neighborhood often have no way of knowing what elected officials are voting on. The BIGGER picture is that the general population of citizens want and need to stay informed, however traditional means to follow up with legislation, and their legislators is inundated with too much information. like CONGRESS.GOV. There are many tools and features for users to employ. However, the average user has no real use for any of the "busy" features and navigating websites like this is far to much trouble to draw in a Reasonable Daily User (RDU.)
The goal:
The goal of this project is to bring vibrant life to an otherwise dusty topic. To call to action users, and excite their need to be informed on local legislation and make what most consider useless information pertinent to their day-to-day lives. Ultimately, leading to a more informed voter registration to spread equality to democracy. The RDU is working, raising children, and battered with daily tasks. The real user for Congress.Gov sites, are in more deeply involved with politics, and where their elected officials stand on specific legislation. This app will differentiate between those that are deeply invested, and crossover to users with little understanding of the legal jargon that is employed by the mundane websites like congress.gov and news websites that report on congressional activity. The priority of this new Legislation App, is to create an appeal akin to Facebook, Instagram, Twitter and the like so that ideally, everyone will have this app on their smart device. It will be easy to use, easy to configure, and it will provide information to users that are no privy to all the terminology, and busy "fluff" of the current products out there for citizens to use. There needs to be an engaging, and simplified way to provide accurate information to voters regarding their legislators, and voting history.
Understanding the user
Summary of User Research:
How might we make proposed legislation easy to find, and read? We are hoping to identify ways to make more readily available local proposed bills, and legislation in a concise and quickly informative way. We may consider increasing empty space, to further accentuate call to action. Call to action considerations for politician/legislator contact info is a curiosity we hope to quench by observation. In testing random users/voters, 5/5 users stall when starting out their search efforts online, and don't persist with learning, engaging, and following up with information that is NOT pertinent to their day-to-day lives.
We found our KPIs weighed heavy with data regarding the a/b testing. Compiling data from Research study plan that included moderated interview over 20 minutes with 5 users.
User personas:
Althea represents 4 out of 5 of the users tested.
Pat Represents 2 out of 5 of our users tested.
Ideation:
In Ideation Phase, we thought to make a “one-stop-shop” feeling. We wanted to make it so that on the home page, a user can find the most recent proposed bill, and very little other information to clog up the search process.
Starting the Design
Upon initial research, we found that most folks want a “connection” to the proposed bills. I.e. Who sponsor them, who are their representatives?
Low-Fidelity Prototype:
This user flow was designed with simplicity in mind. Carrying users from the mainstay which is proposed legislation, to the sponsors of the bill, and ultimately to who their representatives are.
Usability Study: Parameters
Study Type: moderated usability study
Location: St. Louis, in home
Participants: 5 participants
Length: 20-30 minutes
Usability study: findings
- Users want to know who sponsors each of the proposed bills
- Users don’t want extended information.
- Users do not know the common terminology that is peppered through out typical legislation websites.
Refining the Design
Mockups:
1.) In this usability study we found that the flag banner gif was too much animation. The title for the state located at the top was in the way of most screens interface ( camera, drop downs)
2.) Users were distracted by the flag again. And the name of the state again was moved. At the bottom, the navigation bar was modified to be less “busy”
High-fidelity prototype:
Here we made it so a swipe left or right would flow to the next page. With three pages in navigation this flow works sleek and smooth. We added animation with some of the text, indicator for page at the bottom bar, and a phase for the legislator image.
Here we made it so a swipe left or right would flow to the next page. With three pages in navigation this flow works sleek and smooth. We added animation with some of the text, indicator for page at the bottom bar, and a phase for the legislator image.
HERE is a link to the Hi-fi prototype
Accessibility Considerations
- We were concerned about the need for simplicity. We wished to make the app easy for less tech savvy individuals. Which also streamlined the flow for all users. In addition, this optimization frees up performance metrics, for smoother flow on older devices.
- Entering the color scheme into several apps, and tools to confront potential conflict with visual impairment was a main concern.
- Keeping advanced nomenclature, and terminology limited. To further increase usability for users of all literary backgrounds.
Information architecture, and responsive design
Sitemap:
Main goal: Keep the flow easy, simple, and informative. With back and forth navigation. Excluding information users DO NOT want.
Takeaways
Impact:
Users, and peers reviewing this have described the service provided as being less “convoluted” than our competitors. ( who seem to have so much content that through user research is not a desire, and therefore a hindrance.) The impact this app could potentially have is a positive one, where users are informed, and can take this information to their local voting polls.
What I learned:
In addition to the general absorption of political prowess and knowledge that comes with this kind of project, I have learned a great deal about what users look for when they are ready to make a difference in their community. Design: I’ve learned a great deal about scalability, user bias regarding uninformed voters, and informed voters. I think most of all I learned that the NEED for an app that tracks legislation/legislators' votes and provides follow-up options for voters to reach out and have the power to make their concerns heard.
Next Steps
- I would like to have an A/B test with regard to some minor changes in design.
- A second user testing iteration and this project is complete.
- This project is only that last iteration away from from end development. Expediting to engineering is next.
- Users need a search feature to find legislation, or legislators they want specifically.
- Upon the next iteration of this Legislation App, I would like to explore the ability for users to "customize" their feed. Tag legislation/legislators, have a news feed tab, and other cosmetic alteration options. ( dark mode, and simplification options.)
Dark Mode:
Light Mode:
Let’s Connect!
EMAIL: JPSONGER2@GMAIL.COM
Phone: 618-612-3337
LinkedIn: https://www.linkedin.com/in/jared-s-b0527b244
Blog: https://songerismsuxdesign.blogspot.com/



