Our Challenge

Each group in class was randomly assigned a local NGO as their client. We had 12 days to:

  • Redesign the NGO’s website and make it responsive (for desktop/mobile)
  • Consider service design into the redesign process

Zack, Tom, JX and I were assigned to work with ACRES — a local NGO and registered welfare charity that raises awareness for the cause of animal , conducts animal research projects and partners with authorities and related parties to make this all possible.

Unlike other organizations like SPCA that mostly focuses on small animals / domesticated pets, ACRES works with wildlife animals. This includes activities such as:

  1. protecting Singapore’s native wildlife animals
  2. rescuing animals that are caught up in the global illegal wildlife trade

1. Auditing the Website

To start off, we used the LEMErS framework (Learnability, Efficiency, Memorability, Error Management & Satisfaction) to conduct a heuristic evaluation of the existing website.

Things seemed fine when we landed on the homepage, but we soon uncovered a concerning array of usability problems — ranging from a glitchy website navigation bar to the confusing and segmented way that content was organised.

At this point, we also did a brand audit where we identified inconsistencies in the look and feel of website. We later discovered during usability testing that these inconsistencies — although sounding more like a visual design issue — were actually a problem too.

2. Understanding our Client’s Needs and Co-Creating with Them

During our hour-long conversation with Anbu (Deputy Chief Executive of ACRES) at the main office, we talked about:

  • The intended purpose of the website and its current performance
  • ACRES’ most important needs right now
  • Public perception of wildlife animals
  • The ACRES wildlife rescue hotline

Overall, the client meeting was a great experience. We started off with assumptions in our heads and left with a much more reliable first-hand account of the organization’s structure and needs. It was also very inspiring to learn about how insanely dedicated the ACRES staff and volunteers are — they put in 17,000 hours of work a year! — so we really wanted to showcase that in our website redesign.

Showing Anbu the draft version of our service design blueprint

We also took this opportunity to co-create a service design blueprint with Anbu. We wanted to understand the end-to-end journey of a person signing up as an ACRES volunteer and we needed her help to fill in the back-end operations.

Our final service design blueprint

This blueprint helped us to see the bigger picture of a user’s interaction with the entire organization, beyond just the digital touch-points(i.e. website).

Although the short project timeline did not allow us to venture far into service design, our new perspective pushed us to redesign elements that existed outside of our website, such as the Google forms volunteer sign-up and confirmation email.

Lesson learnt: UX can be applied to so much more than just websites and apps!

3. Finding Out What Our  Think

With our client’s needs in mind, we proceeded to conduct user research to explore people’s thoughts on animal welfare, as well as their level of awareness towards wildlife animals.

Left: Interviewing a vet at Singapore Zoo | Right: Interviewing a stable hand at RDA Centre

We focused on speaking to users who have a decent level of concern for and awareness of animal welfare, as we figured that these people would be the main target audience for our website.

Our research revealed that users:

  1. are curious about wildlife but have never interacted with them
  2. are confused about how to respond to a wildlife animal in distress
  3. care about animal welfare, but lack motivation to volunteer and donate to animal welfare organizations

We were most surprised and concerned by Point 3. To address this concerning problem of cognitive dissonance, we had to ask ourselves:

How might we improve the website experience in order to motivate site visitors to contribute to ACRES’ cause?

4. Creating our Personas

Our personas reflected the 2 types of users our website would target:

  1. Someone who is only familiar with domesticated animals (e.g. dogs) but has the potential to care about/help out with wildlife animals too
  2. Someone who is an all-rounded animal lover and activist who is more than ready to contribute to the cause

We also created their customer journey maps to understand what their experience through the website (signing up as a volunteer and donating) would be like, and identify opportunities for improvement.

5. Prototyping and Usability Testing

Screenshots of our lo-fi prototype

After brainstorming our website redesign ideas and organising them in a feature prioritisation chart, we created our lo-fi prototype on Axure RP.

There was a lot of meaningful content on the existing ACRES website — it was just ineffectively organised and made users feel overwhelmed. So, we decided to rearrange the website’s content into a few main pages with a narrative-like flow and personable microcopy. (As inspired by this news feature).

We believed that bringing users through our “story” would be more impactful in motivating them to engage with ACRES.

However, our pages turned out to be very long and inconvenient to navigate — users had no way of knowing what the content on each page was unless they scrolled through all of it.

Furthermore, users were confused by the way we had reorganised the information architecture.. for example, what was the difference between “Support Us” and “Donate Now” in the global navigation bar?

However, after much iteration and 2 rounds of usability testing, we managed to alleviate those problems and create a much more pleasant user experience.

Hi-Fi Prototype: Before & After

Left: Old navigation bar | Right: Redesigned navigation bar

Perhaps the most obvious change we made was to the website’s global navigation bar. We shifted it to the top (a more conventional location) and renamed the categories to be more user-friendly.

Left: Volunteer roles | Right: Our Volunteers

Diving into the content pages, you can see that careful thought was put into how the copy was written so that users would feel a warm sense of connection with ACRES. We also wanted to showcase the stories and personalities of ACRES’ amazing network of volunteers.

Left: Landing on the Donate Now page | Right: After completing your donation

Given that donations was one of ACRES’ main needs, made sure to declutter the Donate Now page and make the CTAs very convincing and easy to understand. Donors would be pleased to know that they can spread the word to their friends and family with a Share function upon completion. (The strong visuals and quote serves as an extra push!)

Left: Volunteer sign-up form | Right: Volunteer follow-up email

And finally, as per our service design blueprint, we also redesigned external pages such as the volunteer sign up form and follow-up email with impactful visuals and quotes as well as readable content.

Now that we’ve brought you through the main changes,

Check out our website prototype here!

(adjust your browser size to see the responsive elements)

You can also view our presentation deck here.

Final reflections

  • I was quite nervous for the client meeting (it was my first time) but being able to meet the people that make ACRES’ work possible and hear their stories was a fantastic experience. Major thanks to Anbu for so graciously hosting us.
  • I am now convinced that people who work with animals are actually angels in disguise. The passion and love for these innocent creatures has inspired me to care more about animals too!
  • Although we had to travel far and wide for our user interviews, it was definitely worth the relevant insights that we gathered. Don’t let long commutes hold you back from conducting solid user research.
  • It was my first time dabbling in service design and I wish we had more time to work on it. Fingers crossed that I’ll get to explore more of this field in the future!
  • Finally, major thanks to my awesome teammates who worked so hard to make this project happen. All those long nights and mosquito bites were worth it in the end 🙂

Source link https://uxdesign.cc/new-steps-to-redesigning-a-non-profits-cafcc7c43527?source=rss—-138adf9c44c—4


Please enter your comment!
Please enter your name here