Viktor Nagy
UX Designer

UX Research for MME.hu

Improving the online donation flow for Magyar Madártani Egyesület

Project summary

  • Duration: 11 weeks
  • Client: Nonprofit organization (Magyar Madártani Egyesület)
  • Subject: http://www.mme.hu/
  • Goal: Improving the website

The organization
UX Design and Research for MME.hu

About the organization

Magyar Madártani Egyesület

  • Established in 1974
  • The largest bird protection organization in Central Europe. 
  • More than 9000 members
  • 800+ million HUF (~2.8 million EUR) revenue per year

UX Design and Research for MME.hu

The organization's website

http://www.mme.hu/

About the process

The process

  1. Stakeholder interviews
  2. User interviews
  3. Persona creation
  4. Journey mapping
  5. Design brief
  6. Prototype creation
  7. Usability testing
  8. Handover

Stakeholder interviews

Stakeholder interviews

We were trying to understand what are their goals as an organization and what kind of role does their website plays in achieving those goals.

We were asking questions like:

  • What are the organization's biggest challenges right now?
  • What's the purpose of the website? 
  • What do you think the website offers right now for the users?
  • Who are the target users?

Insights:

  • They have a diverse user base with very different needs
  • Even the owners find the website confusing and overwhelming
  • Technical constraints are limiting development options
  • Their revenue from online donations are only 1/4 of the total amount
Only 1/4 of their donations came from an online source last year

Decision:

There were many things we could've made better. We chose to focus on making the online donation process better. 


  • The reason for this is because donations have a direct impact on their revenue. 
  • Implementing a potential solution for donations would've required the least amount of development work. 
  • The scope was also a factor. We had to think about what we can investigate and solve just under three months.


User interviews

User interviews

With the user interviews, we were trying to understand the user's context as much as possible.

We were looking to answer these questions:

  • Why and how does one become a supporter of the organization?
  • What are the users main goals when they visit the organization's website?
  • Are they able the find the information that they are looking for? If not then what is missing?
  • How do they reach the website when they need information? Context? Device?

Insights:

  • Family and school experiences have a significant impact on who will become a supporter
  • Early childhood experiences have a crucial role in who will return to the organization later either as a supporter or a worker
  • People like the organization, but they don't want to commit to anything long-term
  • Kids and older adults are the most active members -aside from employees- because they have the most free time available. People between 20 and 40 years are struggling the most with the lack of free time.

Hands-On experience with birds have the biggest impact on a person's views

Decision:

Based on the research results we knew it was important to make everything as close to life experience as possible. The more users could feel what they were donating for the more likely they would finish the donation process. We tried to achieve this by using bigger pictures that would result in more immersive experiences. 


We wanted to make people feel what they are donating for. Almost like they are holding the bird in their hands.

Personas
UX Design and Research for MME.hu

The persona... matrix!

We've identified seven types of users inside the organization. We've also realized that they had a connection between them. Specific actions could trigger them to move closer to the organization. 

For example, take someone who was interested in the organization. There was a very high chance that this person became a supporter if he or she visited a hands-on event with birds.

Journey mapping
UX Design and Research for MME.hu

The website is the weakest point in the whole experience.

Journey mapping showed us that events and personal interactions are the best part of the organization's experience. However, the website is the primary source of frustration and friction in the experience. 

Design brief

We've defined four main principles for our future designs

  1. Experience focused design
  2. Allowing - not forcing anything on the user
  3. Transparent - not hiding anything
  4. Focused - making the user's flow as clean as possible

The prototype
UX Design and Research for MME.hu

We've experimented with 2 versions

  1. A version with a single button that covered both donations and memberships 
  2. A version with separate buttons for donations and memberships

Usability testing

Usability testing

We've tested the new prototype to see how people can interact with it.

Details:

  • Subjects: 3 users who haven't used the site before
  • Moderated, in-person testing
  • Tasks:
    • Make a donation or 
    • Register as a member through the website

“It was a breeze to make a donation.”
UX Design and Research for MME.hu

The new donation page

  • Bigger images
  • Shorter copy
  • Input fields close to the top

Insights:

Users were reporting earlier that they could “get lost” on the old site or mistook the donation page as a simple article for its length. With our new prototype users were saying things like “it was a breeze to make a donation”. We couldn't be happier about that.

However, the single button version has completely failed. When they had to register their membership, they could find the option anywhere. As we later discovered people saw that there was a button for "Support" but they associated membership as something different than just supporting the organization with money. Membership for them was a deeper connection, so they kept looking elsewhere for the button.
UX Design and Research for MME.hu

Membership options

The membership page still had issues. Users were reporting that the number of choices was still overwhelming for them and they had a hard time figuring out the differences.

Decision:

We've decided to scrap the one button version and go forward with separate buttons for donations and memberships. The membership page in itself was so massive that we couldn't fix everything. We tried to get the best out of it. Ultimately we had to stop working on it as there wasn't enough time to fix it completely. 

We've managed to fit in one more improvement
UX Design and Research for MME.hu

Saving time for those who need it the most

We’ve simplified the donation menu drastically. We were able to reduce the number of options by 77% while not losing any piece of information. 


We went from 9 equal options to just 1 primary and
1 secondary option! A huge difference in visual direction
and flow.

What's next?


If we could continue working on the site, we would iron out the rest of the issues with the membership flow, and then we could start working on the rest of the site. 

The next step would be reorganizing and simplifying the main navigation and making the home page less overwhelming. Also, a lot of smaller improvements are in the pipeline.

Our team was:

Viktor Nagy (UX Designer)

Gábor Lukács (Mentor)

Gábor Pekarek (Prototype builder)

Vivien Vetési (All around helper and recruiting specialist)