Billion Acts hosts a platform to track, publicize, and inspire cohesive acts of peace. In a dual role as both product manager and designer I led two teams in updating the responsive site and individually designed changes for the main landing page.
Goals | Increase user activation and reduce administrative burden.
Results | Updated site-wide design and a new digital workflow.
Role | Project lead with 12 designers
| Individual designer for landing page
“Working with Rosie and the team at Tradecraft was easy and effective. They did quality work, dramatically improving the UX of our current site and decreasing our internal workload at the same time. We’d love to work with them again; if you get a chance don’t miss out.”
- Brandi Brown, Director
Billion Acts is a social impact organization backed by Google and 14 Nobel Peace Prize laureates, including Desmond Tutu and the Dalai Lama. Their aim is to generate one billion acts of peace worldwide.
User acquisition was going well - but once users joined the site they would drop off after one visit.
Billion Acts was also interested in automating a campaign creation process that had previously been handled through time-consuming email threads and manual page creation.
Twelve designers split into two teams to focus on each problem separately. The first team generated clearer copy and improved visual consistency to reduce churn. The second team designed an entirely new flow to support a digital campaign-creation solution.
Team 1: Reducing Churn
One team of designers focused on the drop-off of active users after their first use of the site. Several actions were taken, including: clarifying the value proposition on the home page, making the navigation more accessible, increasing the value of the profile page, and introducing delight on the thank you page. The result was an increased likelihood that they would continue to be active on the site.
During usability tests with new users, participants expressed confusion, asking:
“Who is Billion Acts?”
“What is an act of peace?”
We heard from current users that educators were underrepresented in the site branding, language, and value proposition. Stakeholders informed us that educators comprise only 2% of users - yet they represent 85% of activity - because of their amplified reach to students.
Comparative research revealed that similar social impact organizations utilized a couple main conventions in their design:
Simple, bold color palettes
Place value propositions and the primary call to action above the fold
Images of people, potentially emphasizing the human aspect of social impact
We developed several inquiries based on our research and voted to work toward the question we thought would direct the most useful work:
How might we inspire users to stay engaged?
From research, we hypothesized that new users would not return to the site for continued use due to their confounding first impression. We decided to focus on improving this experience by educating users about the value proposition and simplifying the steps of the primary flow: logging an act of peace.
A storyboard inspired iterations of paper wireframes…
…which turned into mid-fi mockups.
Validation and results
We developed a clickable prototype to test the change in first impressions after our redesign. User confidence dramatically increased. Instead of hesitant or downright confused reactions to the question “What is the site about?” we heard concrete responses:
“I can volunteer and log my action.”
“I can get inspired to help people in my community.”
Team 2: Digitizing a Manual Process
Using insights from our combined research, we created an entirely new flow for power users who are organizing campaigns. A campaign is a cohesive group of acts directed at one area of focus. This new flow includes a landing page to educate users about campaigns and how they work, a campaign search, creation form, individual campaign pages, and campaign-specific cards.
Designing a new experience flow
Old Manual Process
Users relied heavily on administrators at Billion Acts to guide them through the campaign creation process, which took valuable time away from other work.
New Digitized Process
Users can now independently create their own campaigns, freeing up time for folks at Billion Acts to focus on other things.
Screens that support the new feature
Campaign landing page
This educational page employs a clear value proposition to inspire activity. Users can take action by either adding their own act to a current campaign, or creating their own campaign.
This page allows a deep dive into what initiatives currently exist, inspiring individual contributors and increasing awareness of possibilities for campaign creators
This form digitizes what previously required manual labor from the administrators at Billion Acts; It enables users to set up their own campaigns with ease.
Old Campaign Page
These pages were generated by hand from information contained in email threads.
New Campaign Page
This update follows insights gained in the combined research phase. Simplifying the color reduces visual strain, the grid is improved for better informational hierarchy, and the primary CTA is accessible.
I used the structure of a GV sprint to kick off this project during the first week, which was a great way to jump into exploring our assumptions as fast as possible and sped the timeline. The quick pace did result in some misfires so I developed a more regular schedule of contact with the client in order to verify our assumptions and stay on track.
Inspiring user action beyond the platform (in the form of acts of peace) is a complex problem and requires considerable incentive. Billion Acts benefits considerably from partnering with external institutions, such as schools, who do a great job of mobilizing their students, volunteers, and employees. When it came to moving the needle on unaffiliated individuals it was hard to measure results. In the future I’ll seek out better access to user data over time, and include these measurements in the scope of the project at the outset.
The design system was inherited from a different group of designers, and I assumed that they had followed best practices when it came to the typography and grid. When I zoomed in during hi-fi I realized there were some problems - which caused rework. I learned to always inspect inherited designs for flaws; a new set of eyes can inspire some easy clean up which reduces overall work.