Our Better World

Our Better World is the digital storytelling initiative of the Singapore International Foundation. They unearth stories of people doing good in Asia and share them with a global community.

They aim to connect those doing good who could use mass support, storytellers who need their stories shared; and people who’d love to help but don’t know how to get involved.

My Role

As product designer, I was responsible for their website redesign. This involved conducting user research, updating the information architecture, usability testing, designing wireframes for various page templates and components.

cover-obw

Project Goals

The goals of the redesign are:

  • Transform from being a "blog" to a platform for their community
  • To help their users find and take action easily
  • Nurture a community of action takers (donate, volunteer, contribute in other ways)

Process

I conducted 1-to-1 user interviews to understand our users’ perceptions towards donating or volunteering. I also conducted user testing and observed for any pain-points as they went through the current website. Subsequently, we did a card-sorting exercise for any improvements to the information architecture.

portfolio-obw-2

Card-sorting, user interview notes and sketch of Homepage layout

Pain-points

Information of activity: Users want to know where the location of the event is, and what they will be involved in, when deciding to attend a volunteering event

Connections: Users want to know if any of their connections are attending, which may motivate them to participate

Donation transparency: Users want to be notified that their donations have been received, and the resulting impact of their contributions

Improvements

In the current design, users could only see all the available actions in the middle of each article. To make these actions more visible, a "Take action" sidebar was added to every article.

The sidebar would list the type of CTA (e.g. a call for volunteers) with a short description of the activity and a sign-up link. When viewed on a mobile device, a "Take action" tab was added. This allows users to switch between the article and the list of actions.

More information was added to each action, such as the time and date of the activity, location, and the users who have registered. An "Impact" tab was added to display the latest updates on the story. This allowed users to see the impact of their contributions, and to encourage others to contribute as well.

portfolio-obw-3
portfolio-obw-1
portfolio-obw-4
obw-tbt-1