LINH NGUYEN
Digital Product Designer

PRICING PAGE

PROJECT DETAILS

Xero is an award winning cloud-based accounting software platform, with over 2 million global users. The pricing page is one of the most visited pages on xero.com and informs users of Xero's plans, prices and features.

PROJECT BRIEF

The pricing page was experiencing a lot of growing pains. Australia's tax office was rolling out Single Touch Payroll, a policy requiring employers to report tax and superannuation information to the tax office each time their employees are paid. There was now an opportunity to introduce a payroll-only software, which was previously an add-on, to business owners who would not otherwise consider Xero. This needed to be added to the pricing page. 

Add-ons such as Expenses, Payroll and Projects each had high targets.

Users were turning to cheaper software solutions, or choosing the cheaper tiered plans which may not have necessarily been appropriate for their needs.

I was tasked with redesigning the pricing page to help users choose the appropriate plan and add-ons.

TEAM

  • 3 digital experience specialists with backgrounds in marketing automation and marketing analytics
  • Developer
  • Product owner
  • Product manager

CONTRIBUTIONS

  • Discovery research
  • Facilitating ideation and co-design
  • Wireframing
  • Prototyping
  • Recruitment, screening and planning user testing
  • User testing
  • User testing analysis

1. EMPATHISE
The existing pricing page

The existing pricing page

Since this piece closely aligns with another project I had worked on earlier (the pricing plan recommendation tool), I was able to leverage research from that project and use it here. This research included discovery research from the onboarding team, and insights from the direct sales team and chatbot manager. The direct sales team at Xero have close contact with users who have signed up to a trial or people who are considering Xero, which is the target audience of the pricing page. From the time I had contacted the head of direct sales about the pricing plan recommendation tool, we had developed a great working relationship and I'd asked him if he could start a record or living document of the common customer enquiries. He went one better and asked all team members in the sales team to add every single customer enquiry and issue, grouping them into topics. Over the months, this became a valuable source of customer insights and I used this in the discovery phase.

ANALYTICS

We also used Google analytics and looked at previous A/B tests and experiments and found some relevant pieces of data:

  • "Enter bills," "Reconcile bank transactions," "Send invoices and quotes," and "Pay staff" were the most clicked on features in the feature page.
  • Comparison tables have tested well in A/B tests, driving uplift in web sign ups with a high impact on returning visitors.
  • "See more features" was the 4th most clicked on button on the page from an experiment, indicating that users may be interested in learning more.

Affinity mapping insights using Miro

Affinity mapping insights using Miro

USER NEEDS AND PROBLEMS

  • Some users misunderstood the inclusions and features of each plan.
  • Data and security was a major concern for users.
  • Users wanted to get a feel for the product as soon as possible.
  • Users wanted flexibility between plans. They didn't want to feel locked in and wanted to know if their use of the product exceeded the limits prescribed by their chosen plan.

There were also insights from the previous pricing plan recommendation tool project:

  • The language used on the pricing page was one size fits all and didn't cater to different audiences. Some users didn't understand accounting and Xero related terminology, while others wanted more in-depth detail.
  • Users experienced difficulties in selecting the right plan for their specific needs. The most common requests for help choosing the right plan came from not-for-profits, sole traders, and people who wanted to use Xero for personal accounting.
  • Users often didn't know if Xero was right for their specific needs.
  • Xero's total price was unclear. This was one of the most common enquiries, with users often asking if there were discounts, if it costs more to add multiple users or accountants, and the total cost including add-ons.
  • Users wanted to understand the value of Xero, with many not understanding why it had a higher price than its competitors.

"I'm not sure which plan is appropriate for my business as the pricing page is not very clear."
Customer enquiry to direct sales
I referred back to this customer journey that I had created along with the small business journey manager during the discovery phase

I referred back to this customer journey that I had created along with the small business journey manager during the discovery phase

2. DEFINE AND IDEATE

I framed the problem as:

How might we help users choose the right plan and add-ons for their needs, and then be able to easily calculate the total cost?

Problem framing and ideation on digital post it notes on Miro

Problem framing and ideation on digital post it notes on Miro

WORKSHOP

Following on from the research, I planned a problem framing and co-design workshop. One of the challenges of working in an international company was that my colleagues were based in different cities and continents, so every activity had to be completed via video conference. 

PROBLEM FRAMING

I asked everyone in the workshop to split into groups. Groups were based on locations. I asked each group to think of "How might we" statements based on each customer problem by filling in the gaps in the following phrase: "Given that... how might we... so that..."

IDEATION

After ten problem statements were created, each group were given time to think of ideas that would solve the problems.


SKETCHING AND VOTING

Each group then needed to sketch their ideas and upload them to the Miro board. I asked each group to pitch their design to everyone else. Each participant then voted for potential solutions.

SOLUTIONS

  • Add a filter to help users select the right plan
  • Add FAQs
  • Add tooltips to explain each feature
  • Push the price below features, so users can understand the features first
  • Separate the add-ons from the plans
  • Separate the 30-day trial from the paid plans
  • Have a separate link to direct accountants and bookkeepers to the right page
  • Add social proofing
  • Change the plans to a table format

3. WIREFRAME AND PROTOTYPE
PRICING PAGE

WIREFRAMING

I took the most popular ideas from the co-design workshop and combined them to create a wireframe for all 5 major regions (Australia, NZ, US, UK, Singapore). Different wireframes needed to be created as the product ladder was different for each region. I presented these wireframes to the rest of the team and stakeholders for feedback. I created the wireframes in Sketch.

PROTOTYPING

After further refinement, I turned the wireframes into desktop and mobile prototypes created in Axure. I created 5 different prototypes for the different regions. Feel free to interact with the prototype above.

4. USER TEST AND ANALYSE
One of the user testing sessions. This was a rare session as the participant was based in Melbourne and could come in to the office for the session.

One of the user testing sessions. This was a rare session as the participant was based in Melbourne and could come in to the office for the session.

I then took the 5 prototypes to conduct user testing. I created the recruitment and testing plan myself, including the screener, recruitment admin, and research script.

  • I recruited 5 participants from each region (Aus, NZ, Singapore, UK and US) so there were a total of 25 participants. 
  • All participants were small to medium business owners, or made accounting software decisions for small to medium businesses.
  • All participants had either signed up to accounting software that wasn't Xero within the last 6 months, or were thinking about doing it within the next 6 months. 
  • I conducted one-to-one moderated user testing, mostly via video conference using Google Hangouts, which was the go-to conferencing software used within Xero.
  • User testing involved testing both desktop and mobile.
  • I facilitated all the sessions, with a notetaker to help me.

User testing synthesis

User testing synthesis

MAIN INSIGHTS

  • Most users completely ignored the filters at the top, both on mobile and desktop. Users believed them to be a list of features, not filter buttons.
  • Prices were difficult to find as they fell below the fold on most people's screens.
  • The "Less" and "More" buttons on desktop were easy to use.
  • Tooltips and FAQs helped people understand the features and plans.
  • The social proofing messaging on the standard plan was reassuring to users.
  • Separating the add-ons from the core plans reduced confusion.
  • The table format made it easy to compare features between plans.
  • Users didn't know that they could swipe the plans on mobile.

IMPROVEMENTS TO MAKE

  • Make the filters look more clickable or remove the filters.
  • Move the prices to the top of the page.
  • Make plans look more swipe-able on mobile.

6. LEARNINGS
PRICING PAGE

Unfortunately I left Xero before I had a chance to do the UI design, see it through to build, and find out about the results.

Undertaking such a large project where I needed to do all the UX design and research taught me a lot about how much work goes into research. Balancing the competing pressures of a short time frame with my desire to base designs on robust research was a challenge. I now have the experience to be able to request a longer time frame and/or increased support so that I can properly deliver high quality, human centred design.

Creating a prototype which had a filter functionality proved to be extremely difficult. To adhere to the timeline, the filter needed to be a dummy filter which could only work with selection in order from left to right and not deselection or random order. This made the prototype somewhat buggy which skewed the results of the test.

I overlooked how important it was to conduct testing on a mobile device. Since most of the tests were remote, I relied on Google Hangouts which doesn't allow participants to share their screens from their mobiles. Participants could only test the mobile designs from their desktops which may also have skewed the test results.

CHECK OUT THE PAGE IN ACTION

Before I left Xero, I handed over the design to the UI designer who implemented the changes and completed the UI design. It then got implemented permanently on the Xero NZ pricing page.

Visit the page (it will open in a new window)