Workhuman E-Com
Gift Cards Redesign
My internship at Workhuman culminated in a solo project tackling the redesign of the gift cards page. Workhuman is a SAAS company specialising in employee recognition, connecting employees to a personal storefront wherein they can spend their earned points. The storefront consists of both merchandise and gift cards, with a large proportion of employees opting to purchase these gift cards.
Throughout this project I worked alongside the research team, the design team and the development team the business team.
Challenge
Data and user research have shown that there’s a higher inclination from users to redeem for gift cards instead of merchandise. The current state of the GC page needs to be reevaluated to ensure that it is providing an experience that engages users while also enticing them into redeeming high margin gift cards.
Process
Through using the model of Design Thinking & Lean UX, I uncovered and identified the problems/opportunities of the Gift Cards page. Evaluate the current state of the experience and ideate on solutions that meet both business goals and user needs.
Skills
Research (HEAP Analytics, Usability Testing, Baymard Institute)
Design (Wireframing, UI, Design System)
Evaluation (Usability Testing, A/B Testing, Qualitative Feedback
Process
Heuristic Analysis
I first conducted a heuristic analysis of the current gift cards page.
This was done in order to generate initial hypotheses and opportunities for improvement. From the beginning, I noted the main problem areas:
Featured gift card section is confusing. The cards don’t stand out, nor is it apparent what makes them featured.
Digital gift cards icon is confusing and not currently intuitive. Users can purchase digital or physical gift cards. This makes for a confusing experience when the icon is not intuitive.
Product cards are not visually compelling, leading to a lack of interest and a poor conversion rate for potentially higher margin gift cards.
Filters are currently not acting as a filter, but instead as a link to a new page upon being clicked. There is scope here to redesign the flow of the page and ensure that the page works as expected.
Heap Analysis
I worked closely alongside the analytics team to understand to fully understand the conversion rate pertaining to the featured gift cards section and the current filter functionality.
Users that click on a GC filter have a conversion rate of 43.7% versus users that don’t click, who have a 54.8% conversion rate. In summary, users who click on side filters are 20.1% less likely to convert/redeem.
A-Z sort used frequently to access Amazon gift cards which are low margin.
Featured Gift Cards
Less than 10% of people who land on the gift cards page interact with a featured gift card, as well as a certain portion of these gift cards performing significantly better than others. 37% of users who land on the gift cards page are clicking on Amazon, leading to lower high margin card redemption.
Filters
Users are not using the side filter. Those who did were 15% less likely to convert. 36.4% of users who are using the filtered view click A-Z to reach Amazon. There is also an inability to filter between digital and physical gift cards - a strong user need as physical gift cards are significantly less reliable due to shipping times.
Business Opportunities
Increase high margin gift card share and reduce Amazon views.
Hypotheses
A most wanted panel will be surfaced at the top of the page, driving users interest on the content displayed.
A new trending gift cards panel based on gift cards that others are viewing or redeeming will be created to influence users into clicking and redeeming for a gift card in that section.
Introducing two potential filter options - improved side filters and horizontal pills. This will help users to navigate sections and increase awareness on the gift cards variety.
Peer Feedback & Co-Creation Workshop
I conducted a peer feedback session with members of other design teams throughout the company, getting their feedback on the initial phase of the design. This exposure allowed me time early on to consider consistency across all parts of the product from different teams’ input. It also allowed for my questions and ideas to be answered to understand the integration of the new Terra design system.
Prototyping
I took forward two proposed design solutions, one deterring further from the initial page. I wanted to get an understanding of the benefits of changing the hierarchy of the page through A|B testing. Starting with low level wireframes to fully fleshed out designs, I consistently touched base with team members to ensure my design was functional. Both designs feature:
Functionality to filter by digital and physical gift cards, a strong win for user voices.
Placing A-Z functionality in a drop down sort menu instead of being surfaced up front - a huge win for business.
New product cards that feel cleaner and more legible.
Introduction of social proofing.
Design A (Pills)
Prominent featured section.
Filter Pills.
Increased use of striking visuals
Design B (Side Filter)
Redesigned side filter
Ability to toggle digital and physical cards.
Medium impact trending gift cards panel.
Increased use of striking visuals.
Feasibility and technical limitations
To capture any technical limitiations the solutions could have if implemented, a session was scheduled with the engineering team to assess what features would take more effort and how to potentially phase the project in the future. Attendants to the session were the applications architect, front end developers, the QA and the e-com design team.
Testing Overview
I conducted A|B testing, organising 2 unmoderated usability tests over UserZoom Go, with a total of 12 participants (6 per test). Participants were external users (non store or recognition program users). I worked closely with the research team to craft objectives and tasks to concretely deduce which design was functioning better.
Overall, both prototypes tested well with no critical usability issues, proving to be learnable and efficient for users, meaning that they could complete early tasks and more complex tasks later on. Both versions had virtually no task errors and performed highly in terms of both user satisfaction and perceived ease of use. Implementing either design poses low risk in relation to usability.
Version A Feedback
"Extraordinarily easy, I could understand the cost of cards, the filtering and sorting on this page makes it so, so easy.”
Version B Feedback
"Everything was easy to understand, I felt like everything could be done really quickly and easily."
Next steps
Going ahead, scheduling sessions with GC and Merch team to assess how manual or automated can we display content, imagery and digital assets associated with featured GC.
For a discovery session with the team: working on edge case scenarios (long translations, GC only client segment, fallback if less than X number of gift cards for featured panels).
How the design should behave for mobile experiences.
Assess what’s the best approach for an experimentation plan so we can combine qualitative with quantitative data.
How might we use Social Proofing for the different panels and validate that users are getting engaged with these panels or sections.