350 Austin is a part of a global non-profit that aims to reduce our carbon footprint. Their goal for membership is to improve the retention rate of younger members, aged 22-40 years old. To help 350 Austin achieve this goal, I conducted and analyzed user research and created a persona and storyboard. I also ideated on and redesigned the sign-up process for 350 Austin's campaign events.
Team: Michelle Kao, Shau Huang, Lavina Rana, Julie Nguyen
Roles: UX Researcher and Designer
Time Period: 2 weeks group research / 1 week individual iteration and design
Tools: Sketch, Invision
We first met with 350 Austin’s leadership team to get an idea of where the organization was running into issues retaining their younger members. It became clear throughout the meeting that there was a deep lack of understanding for younger members and their potential pain points. To fill this gap, we conducted user research through surveys and user interviews. We used affinity mapping to analyze the research and uncovered four major pain points:
- No sense of belonging/community
- Unclear mission and goals
- Unclear roles for members
- General lack of organization
We also uncovered some trends in younger members' sentiments about climate change, the way younger members obtain news about environmental policy, and in how younger members utilize their technology devices:
- “Climate change is real!”
- Something should be done about climate change; unsure what that something is or how to get started.
- Within concerns about climate change, there was no mention of environmental policy.
- 60% obtain news from social media.
- 33.3% only consume news regarding environmental policy if its on their newsfeed.
- 96.7% obtain news from phone usage; 76.7% from laptop.
After conducting the research, I created a user persona for Mia Jenson to visually represent the insights and user pain points. During the ideation and design phases, the persona was used to ensure that any design decisions kept the user's goals, needs, and pain points in mind.
To illustrate a situation in which these pain points are addressed, I created a storyboard. In this perfect world scenario, our user Mia finds exactly what she needs on the 350 Austin website. She finds the landing page for the Fayette Power Plant campaign she wanted more information on. She easily completes the sign-up form to attend an official information session for the campaign and shares the sign-up to her social media all in a few quick steps.
Design Ideation and Sketching
Based on insights gained from the research, the main design implications were to:
- Add an actual landing page for the Fayette Power Plant campaign to keep information organized and easy to find.
- Keep the campaign sign-up form simple and quick to fill out to help increase conversion.
- Add an option to share the sign-up to social media to promote a greater sense of community and help close the loop of younger members finding information for environmental news from social media newsfeeds.
- Design for mobile since a staggering 96.7% of users interviewed obtained news from their mobile device.
Before sketching out any sign-up forms, quick research on forms revealed that poorly designed forms that violated the Nielsen Norman Group's usability guidelines for form design had a much lower rate of completion at 42% one-try submissions when the completion rate for forms in compliance was at 78%. Since conversion would be important to 350 Austin, the usability guidelines in the Nielsen Norman Group's "Website Forms Usability: Top 10 Recommendations" were heavily considered.
For the Fayette Power Plant campaign landing page, I borrowed heavily from e-commerce "click-through" landing pages and adapted best practices to 350 Austin and a mobile platform. In e-commerce, these landing pages are successful because they utilize design best practices such as white space to direct the user's eye to important information. These pages have clear, compelling copy to get people interested in the product they are about to click-through to the CTA for.
After some feedback and initial testing with the whiteboard prototype, I created a low fidelity prototype in Sketch featuring a simple landing page and a two field form with the newsletter option pre-selected to help conversion and increase engagement.
350 Austin already has an overarching style guide in place that I decided to use so that the redesigns could be easily understood by and integrated into the organization . The full style guide can be found on their site at "https://350.org/visuals/".
After testing the low fidelity prototype, I moved on to the high fidelity prototype, and applied the style guide. 100% of the users that tested the high fidelity prototype in Invision were able to quickly find and sign up for the Fayette Power Plant campaign and share the sign-up to social media without confusion.
To test the prototype yourself, try the tasks in the prototype below:
1. Fill out the Fayette Power Plant campaign sign-up
2. Share the sign-up to Facebook
350 Austin has a great cause that is able to align and gain the interest of many different people. The ability to retain younger members will give the organization much needed momentum and energy, especially for campaign projects. After the initial conclusion of the project, my team and I were able to circle back with the organization and present the research and redesigns, which was an incredibly rewarding experience. Moving forward, future plans include testing the prototypes further with the SUS method.