Sanchia Fernandes

The Angel Method

 
PHOTO-2021-05-06-20-42-46.jpg
 

Under the hood of The Angel Method Website Redesign.

 

Find out how I used my UX skills and experience to give back to a cause I really care about. The Angel Method founded by Ange Nilsson is designed to free individuals from limiting thoughts and psychological issues that stem from toxic relationships, abuse, low self-esteem, depression and anxiety.

I feel honoured to have received this opportunity to redesign the website, making it easier to use.

 

 
 
 

Project Overview

Team: Sole UX Designer working with Ange Nilsson (Founder, The Angel Method)

Project Type: Client Project

Duration: 10 days, Starting May 6th 2021

Methods:

  • Secondary Research, Competitive Analysis

  • Journey Mapping, Usability Testing

 

The challenge - creating a sales funnel that directs traffic from the organisation’s social media channels to the website PLUS creating an eCommerce platform on WordPress without upgrading to a Business Plan.

The Angel Method, a subsidiary of The Outpost.org.au, was born out of Ange’s desire to help people overcome their struggles with anxiety, depression and abuse through a combination of cognitive behavioural therapy and other psychology-based approaches.

Being a non-profit organisation with limited resources, I had to think strategically about how I could use their pre-existing WordPress Premium account to do the following:

  • Sell and promote The Angel Method

  • Grow their email list

  • Raise brand awareness

  • Sell products on the website

  • Build a community

I enjoyed working on this project because I felt challenged every single day. With the limitations of the WordPress Premium account and those of the other platforms I had to integrate with, I encountered several roadblocks. With laser-sharp focus and eyes set on the end goal, I dug my heels in and extensively researched my challenges until I came up with ways to get around them.

 

Research

 

How do I set up an eCommerce solution without installing a single plugin? Is this even possible? WordPress Premium doesn’t let you install a plugin without UPGRADING

Most WordPress users use WooCommerce, Ecwid, the WPDM and Premium Package add-on, or some other plugin to create a secure digital store solution.

This was not an option I could exercise. It would mean having to pay more for a business plan.

 
Screen Shot 2021-05-18 at 12.09.25 pm.png
 

How was the organisation currently selling their products?

To get a better sense of how Ange managed bookings for her therapy sessions and events, I had a few meetings with her, gathered more information and planned my next steps.

The organisation used Facebook and other social media channels to promote their events and accept bookings. There was also a link pointing users to the website. The site, however, lacked an eCommerce solution which in turn made the whole booking process time-consuming.

Finding the Missing Link through MailChimp

Right from the start, my goal was to not just come up with a new design and work on the visuals but to think about how the organisation could grow their email list and encourage purchases.

One of the things WordPress Premium does allow is integration with Mailchimp without a plugin. Once you’ve set up the integration, you can build a subscriber list by giving users the opportunity to sign-up on your website. This marketing platform also had one important feature that I needed to set up the checkout process.

It gave me the option to sell products or events by creating customised landing pages. I could direct visitors from theangelmethod.com.au to those secure and shoppable landing pages. Voila!

 

Creating a unique user flow to sell tickets to events/challenges through theangelmethod.com.au

Mailchimp content block makes it easy to create a form for users to sign up to receive updates and the latest news.

Mailchimp content block makes it easy to create a form for users to sign up to receive updates and the latest news.

 

Ideation

 

Next Hurdle - Should I Create Wireframes or Not?

Sure, I love creating wireframes or even paper and pen sketches of a few screens. After all, it’s a tried and true step in the UX design process.

In this instance, I was working with a WordPress Premium account which meant the following:

-I couldn’t use certain types of embed codes to customise the visual style or functionality of the site.

-I had to start out with a template.

-Once I selected a template, I couldn’t override certain pre-set global styles that determined the appearance of the whole site.

Instead of coming up with wireframes that I couldn’t convert to WordPress, we collaborated and came up with a basic plan for the website design.

From the images below you’ll see that Ange wanted a simple and clean layout which a static header image and top centred horizontal menu bar.

I looked for similar themes on WordPress to match the layout we had in mind and discovered ‘EXFORD’.

 
 
Group 7.png
 
 
 

Seeking Inspiration from Other Websites

Armed with a template that somewhat suited the needs of the organisation, I looked to other websites like eventbrite.com.au, eventcinemas.com.au, counsellingsydney.com.au, and chloeting.com to get my creative juices flowing. The image below illustrates some of the features I liked about these websites.

 

Thinking Strategically about Incorporating Certain Features Seen on Other Websites to Create a Superior Product Experience

 

Building the Website in 7 Days Without Ever Having Used WordPress Before!

Remember how I said I loved this project because it challenged me in so many ways? Working with WordPress wasn’t something I had attempted before let alone putting together a whole eCommerce user flow.

Without the help of plugins, widgets or CSS code, I had to find a way to add preferred features to the website in keeping with the layout we had in mind. Starting out with a good template helped but each time I tried to embed a form on certain pages I failed.

WordPress stripped the embedded form and this left me wondering what to do next.

 

Solution

 

I created two user flows. One for people signing up for ‘Free Challenges’ and the other for those purchasing ‘VIP Access’. I created a single sign-up page for ‘Free Challenges’ and a shoppable landing page through MailChimp for buyers wanting VIP Access.

 

Signing up for the ‘FREE CHALLENGE’

 

Purchasing a VIP Challenge

 

Implementing Some of the Best Checkout Page Strategies

The longer I worked on WordPress Premium, the more aware I became of its constraints. With the eCommerce User Flow in place, I wanted to focus on creating a simple and easy-to-use checkout process that would increase conversion rates.

Some of the things I thought about are as follows:

-Fewer clicks to checkout.

-Adding checkout buttons at the top and bottom of the product information page for easy access to ‘Buy Now’ buttons.

-Differentiating ‘Free Access’ from ‘VIP’ or paid events by changing the colours of their respective CTA buttons to make them visually distinct.

Why I Had Trouble Implementing a Few Checkout Page Strategies

- Although I could add CTA (in this instance Buy Now) buttons in preferred locations on the website, I couldn’t do the same on shoppable landing pages designed on Mailchimp. This is because MailChimp only allows you to set up a single payment button on each landing page.

-I would have preferred to make the Shipping and Billing Details form shorter or give customers the option to create an account after making a purchase. Again, since I had to integrate Mailchimp with Square, I had to stick to the templates and checkout pages set up on both platforms.

-Lastly, with Square, I learned you can’t create more than one order confirmation notification form for different types of products ordered. I had to create a single order notification confirmation form that had nothing other than the details of the product ordered.

Deadline approaching - Ensuring the Website was Ready to Accept Bookings for the Event

Together with Ange, we choose images, colours, and content that matched her unique brand, personality, and style. I wanted her personality to come through in the language we used to communicate with our target audience.

It was now only a matter of designing each page and ensuring everything was working as designed.

 
 

Next Steps

 

While I left Ange with a fully functional website that could now be used to book ‘Challenges’ or ‘Consultations’ I still want to conduct a few usability tests to understand whether people can easily find the information they need.

Are there any areas of confusion? What can I do to overcome any issues that are exposed? I want to leave users feeling engaged and happy as they browse the website.

Important Lessons Learned

Lesson #1 - Become familiar with the platform that will be used to develop the product. In this instance, it was pointless coming up with a pixel-perfect custom design on Figma. WordPress Premium wouldn’t allow me to customise features and elements even if I wanted to.

Lesson #2 - You can set up a small eCommerce solution on WP without installing a plugin. You can even set up a Stripe account to accept payments if you don’t want to use MailChimp shoppable landing pages.

Lesson #3 - Communicate with your client as much as possible and get early feedback. Be transparent and communicate effectively, letting them know what you can and cannot accomplish on various platforms and why.

Final Thoughts

I feel overjoyed to have been the sole designer on this project, coming up with a solution that would allow people to connect with Ange. The benefits of The Angel Method (CBT) are many. It helps people find their joy and overcome the core issues that prevent them from leading a fulfilled life.

Check out The Angel Method for yourself at www.theangelmethod.com.au and let me know what you think!