PennEnvironment — Creating an Easier Way to Disseminate Data about Public Bills

Team: Cornell Hack4Impact - Designer: Gloria, Project Manager: Anthony, Tech Lead: Charu, Developers: Kevin, Rahul, Alexandra, Shefali

Timeline: Spring 2021, 8 weeks design

PennEnvironment is an environmental advocacy non-profit organization working to advocate for a cleaner, greener Pennsylvania. Their campaigns put the environment first and work with people to make an impact through petitions, emails, letters and more. PennEnvironment strives to help deliver the public’s voices to the right decision-makers.

Problem

Currently, there is no easy way for the public to know what bills or legislation are introduced or are on the table for state legislation. PennEnvironment wants to create a platform to view the bills that are up to help educate the general public on environmental policies. They also want to create an easy way for the public to send their support or opposition to currently active bills to their representatives.

Solution

We helped PennEnvironment create a platform to display current environmental-related bills and an easy way to add, edit, and delete bills for admins. For each bill, we included a bill summary and a comprehensive list of resources related to each bill.

Current Solutions

Our partner at Penn Environment introduced us to a few bill websites that allow users to find environmental bills introduced in their states and find the status and summary of the specific bill. We learned that:

1. Each bill includes information such as bill number, bill name if applicable, introduced date, status, bill sponsors, cosponsors, summary, and a link to the bill text
2. Actions that could be taken from the bill include sharing to social media, contacting the sponsors of the bill, and links to news articles discussing the bill

However, after browsing existing bill websites, we noticed that there isn’t one that focuses on displaying environmental bills. Additionally for PennEnvironment, they are focused on displaying environmentally impactful bills specifically for Pennsylvania, so our solution would display a more narrowed and focused range of bills for easier access to essential information.

Current Bill Website Solution

User Research

To better understand the current pain points of Pennsylvania local environmental activists when searching for and browsing bills, we conducted user research with experienced environmentalists who will be our primary user group. From them we learned:

1. Users search for information on Google about a bill they heard from others, from the news, or seen on a newsletter. But if they don’t have enough information about the specific bill, it’s difficult to find it.
2. Users want to discover currently viable environmental bills but have a hard time knowing what bills are introduced and the statuses of each bill.
3. The current Pennsylvania legislature’s website includes bills of various statuses from ones that have just been introduced to ones that have passed, there is no easy way to see the bills that are currently in discussion.
4. Users want to learn about the bill through opinion articles both in support of the bill and in opposition so they can make their own judgment about pieces of legislation in the bill.

Information Architecture

Learning from the user research interviews and other bill websites, I developed an initial information architecture to include the most important content and information for each page. We defined two goals to guide this process:

1. Simplify navigation, reducing the number of clicks to reach the bill details.
2. Present bills for user exploration, so they have a chance to discover currently viable environmental bills.

Bill Website Information Architecture

We separated the necessary contents into three pages:

1. Homepage where all current bills would be displayed
2. A search result page that includes more detailed information on each bill and an expanded details page for each bill. As a team we are also developing the database and backend for the bill website, so we also included a few features for those.
3. A detailed bill page with links to the bill text, articles discussing the bill and detailed summaries.

Low fidelity

Option 1

Low-fidelity option 1

From the information architecture, I sketched out the low fidelity of the home page and bills detail page. After speaking with our partner and referencing back to user interviews, we determined that the most important fields to search with are: keywords, bill number, sponsors as most users who use search have a specific bill they are looking for in mind, so they are using these terms to narrow down the bill. Currently there is no easy way to browse bills in discussion or by their statuses, so I decided to include a filter that would organize the bills by their statuses. This could give users more information on who to contact about the bill. So on the top right, I sketched out a way to filter through active bills by their statuses.

Option 2

Low-fidelity option 2

After discussing it with my project manager/ design partner Anthony. We decided to consolidate the bills into two categories: featured bills and active bills. Featured are bills that PennEnvironment wants to highlight. We adopted a horizontal scroll to allow more navigation if the user was interested in diving more.

Mid fidelity

Mid-fidelity for homepage

After speaking with our partner, we discovered that they want to share the organization’s point of view with the users by labeling bills as good or bad for the environment, so we simplified the bill cards to include tags and the bill summary on the back.

Bill Detail Mid-fidelity

Our initial design for the bill detail pages includes three separate sections — overview (summary facts), details(history and progress), text (bill text). Through discussions with our developers, we decided that some of the information such as bill progress and text could be condensed to overview or displayed elsewhere and it was more technically feasible to do so.

High-fidelity Visual Design Card Decision

Hi-fidelity Visual Card Design Decisions 1

We introduced three tags for :

1. The issue surrounding the bill
2. The sustainability aspect of the bill and
3. The year the bill was introduced.

Hi-fidelity Visual Card Design Decisions 2

After iterating on the visual design of the card we settled on option 2. This is because when considering all the edge cases like different photo content and card content, option 2 ensured the most consistent readability and communication of the photo.

Final Flow

EcoBill Tracker Final Iteration

For me…

This is my first time working as a designer within a team with developers. That presented a new challenge for me because I now needed to consider the functionality of my designs and discuss the feasibility. This is also my first time working with a “client/partner” who came to us with a problem and a solution in mind. So instead of researching a solution, our task was to create a design that met both the user and the partner’s needs. Throughout the entire process, I learned that at times ideas clash and we need to arrive at a compromise and there are points when some of our designs needed to be changed because it wasn’t feasible within the project timeline. But with the challenges of working in a team comes the benefits of having multiple points of view and plenty of opportunities to learn from each other.

In the future…

We hope that this project will be a useful and informative tool for Pennsylvania residents and legislators. In the future, environmentalists could be more informed through this project and their voices could be heard and they can make a positive impact on their home environments.