Optimising the EE’s Web and App Homepage
Resigning how customers shop at EE on both Web and App.
My role
Lead Product Designer
UX Design, UI Design, Research, User-Testing, Analysis, Stakeholder Management, Design System
Highlights
Reduced the drop-off rate, and increased page visability and customer engagement. With overwhelming possitive feedback from the business, partners, and customers.
Backstory
As the product design lead for the optimisation squad at EE, I am responsible for reshaping how customers explore and shop via our website and app. Most notably, leading on the UX of our major partner launches (Apple, Samsung and Google), as well as redesigning our key consumer touchpoints including the homepage and shop hubs.
The goals
1.
Introduce information architecture
Create a reusable information architecture, prioritising the consumer/partner/business needs in a cohesive way. Displaying relevant content while creating a welcoming entrance to the site for all users, by utilising analytics, research and insights.
2.
Increase engagement and customer satisfaction (CSAT scores)
EE witnessed a significant drop-off rate from customers when landing on the homepage. As well as feedback claiming that the page was confusing, with no clear structure or hierarchy.
3.
Increase conversions on the site
Directing the large volumes of customers to new and existing product categories was a key objective.
4.
Adaptive visual design to showcase a dynamic range of products and services
The key EE Shopping pages were very outdated and used old components, with existing issues and limitations. Without accommodating or showcasing EE’s broad portfolio.
5.
Accessible design
The existing pages were outdated, and did not meet certain accessibility requirements needed for all users to experience it.
Analysing the live pages
Began by analysing how customers use the existing site, utilising heat maps to better understand where and what customers want when initially entering the site. This process helped us spot underutilised areas of the page that weren’t engaging to customers.
Using analytics, we were able to visualise where customers clicked within the site. Giving us a clearer understanding of their behaviour and motivations when on the homepage.
The competition and understanding design patterns
A homepage has become a familiar digital experience for many. We conducted an in-depth competitor analysis to understand what customers have grown to expect from a shop homepage. We conducted a feature analysis to establish our competitors successes and shortcomings. Alongside evaluating the information architecture, to better understand the best placement for features within our own site. As well as researching best practice methodologies from Baymard research articles.
key insight uncovered:
- 62% of sites don’t assist users in selecting a well-defined scope directly from the homepage. Lack of subcategories, leading to customers entering broader higher-level pages.
59% of sites user overly aggressive & distracting ads. It’s critical to be mindful of the size, placement, aesthetics, and integration of ads within the overall homepage design.
6% of sites don’t offer a broad enough range of product types on the homepage. Users underestimate the product range due to an overly narrow selection shown on the homepage
Utilising analytical search terms
Intrigued with why the highest engagement was with the search bar on the homepage. I analysed the top search terms to understand why a large portion of customers were interacting with it, instead of using other types of navigation.
Giving an insight into what customers want upon entering the site and what they struggle to see at first glance. Creating an opportunity to accommodate this need early on in the customers journey, eliminating unnecessary clicks and effort.
Exploring potential creative directions
Our wireframes focussed on simplified designs that would introduce a new information architecture. Prioritising all of the insights and analytics discovered. Ensuring that all the new components introduced met at least one need/goal from all our stakeholders. This ensured that the design balanced all our stakeholder requirements and needs.
Designing reusable components and patterns
For improved efficiency and faster development we focussed on building reusable components and producing templates throughout. Accommodating for all possible edge cases, based on our knowledge of the existing page. Allowing our design to be completely adaptive, for whatever use case, from Black Friday, Apple iPhone launch, to showcasing brand new categories like EE Broadband. Ensuring all the components are content edible, allowing for everything to be interchangeable without any further development effort.
Final design and outcomes
The final design balances business, partner and user needs. With overwhelming positive feedback from senior stakeholders and executives. As well as partners, being very positive with the new digital real estate offered to them to showcase their latest offerings. The reusable components have decreased further development effort, allowing for more seamless updates to the website.
We’ve introduced new components based on the search term analysis, to streamline the customer journeys. Accommodating for our top actions users from our page, that we previously didn’t accommodate for.
The latest design has passed all our latest accessibility compliances. Ensuring that screen readers are now able to read everything clearly on the page. As well as all of our components and assets being WCAG AA level, allowing for all to experience our site with ease now.
Next steps and lessons learned
With the new EE homepage now live. We’ve introduced new components based on the search term analysis, to eliminate any unnecessary clicks. However, I plan to develop this component, utilising further analytics and insights (for use with seasonal and trending categories). I plan to develop personalisation into this design, ensuring we are able to showcase relevant and meaningful products early in their shopping experience. I’m currently measuring the new pages performance, ensuring I iterate on any insights discovered.
See more of my work
EE
EE One
H&B
Self Scan Checkout
H&B