Shaw.ca e-Commerce Redesign
The new Shaw.ca website was an iterative design exercise informed by data and user testing analysis.
Site Releases & Design Phases
During my time on the Shaw team, we’ve delivered at least 4 releases, including Beta Shaw.ca, New Shaw.ca, Bundle Strategy, and BlueCurve Strategy, which encompassed a full platform release evolution from refreshing the look and feel, improving user experience and narrative, expanding product and service offers, consolidating and elevating overall brand strategy.
(Above left: Above left: Old Shaw.ca co-existed as we used the Beta Shaw.ca to test performance and gain customer insights. Above right: Beta Shaw.ca focused on selling internet plans and related benefits.)
Beta Shaw.ca represented the concept of a simple product offer (Internet plans only) and a quick add-to-cart experience. This site co-existed with the old Shaw.ca for almost a year. The team used it as an A/B test opportunity to see how the market responded to minimal product offers versus the conventional full product lineup. We gained a lot of insights such as how certain components and page layouts generate more conversion. However, it was challenging to compare its full potential against the old site due to the lack of having a holistic strategy in place.
(Above left: New Shaw.ca launched with a new art direction and the hard push for the BlueCurve bundle concept. Customers and users were often confused about what BlueCurve is.
Above middle: We toned down the BlueCurve bundle perception and started to think more holistically about the entire product offers and its connection with BlueCurve. We worked with the content strategists to tell better stories and product benefits. In return, it successfully increased brand and product awareness and bundle sales by almost 50%.
Above right: Although it was a success in increasing customer's product knowledge and willingness to upgrade to bundles. From the heat map study, we noticed the narrative could be more concise and targeted. We introduced the quick comparison plan cards, tested them on different placements and pages, and we saw an increase in conversion and cart start rate.)
After a year of preparation, research, test and planning, we finally launched the New Shaw.ca with richer product offers using BlueCurve Bundles as the main drive. Since then, the team has been closely monitoring the performance and analyzing its data. All that information enabled us and the stakeholders to learn, generate insight, make better decisions and strategically plan towards the future roadmap.
The new look and feel of Shaw was done by the external creative agency. Following that direction, we sketched the wireframes and drew user flows for the new Shaw.ca experience. Below are the visual explorations that we did at the initial stage.
Responsive Web Design
The new Shaw.ca renders well on a variety of devices and window. All the components and modules are fluid and adapts to the size of the screen.
The design output of the new Shaw.ca is backed by a flexible design system that focuses on providing a mobile-friendly, responsive, personalized and accessible user experience.
Quick Tests & Optimization
With one of the main goals being educating and helping customers differentiate products and services, we work with the data analytic team and Optimizely team to understand the respective data and user testing results to helped inform and improve the overall site experience.
Plan Card Study
Plan Cards/Pages are some of the hot components and pages to be tested and analyzed during the feature prioritization exercise. They are the key indicators of conversion rate. From 2018–2020, we ran frequent and multiple A/B testings on the old and New Shaw.ca sites. The results allowed us to understand how certain page layouts or Plan Card elements helped increase cart start rate and digital sales.
Vertical vs. Horizontal Plan Cards/ Layouts
Plan cards can be presented in either a horizontal or vertical fashion and both look elegant. We wanted to find out which one can drive a higher cart start rate and orders. From the results, we saw that Vertical Plan Cards overall had better performance in conversion rate, and we assumed that it allowed easy comparison of the different products.
(Vertical cards performed better than horizontal cards possibly because users can easily compare the information on the cards.)
Plan Card Combinations
After learning that the Vertical Plan Card was the winning option. We then wanted to look at how the Plan Card arrangement has a direct impact on click-through and conversion rate. We used Multivariate Testing to see how descriptions, bullet points, and "View More Detail" CTA perform.
(Winning combination drive +11% increase in cart start, which translates into +500 submitted RGU per month.)
Exploring New Designs
As the site evolved, we did further iteration on the Plan Cards by adding various design elements to test efficacy. Adding icons and brief descriptions significantly increased the RGU conversation rate by +18%. However, the click-through decrease by 7%. It implied the icons and description educated the users leading to a decrease in clicks, but when they did click they were more likely to go ahead with the purchase.
(We did the test on various plan cards including Internet, Bundle and TV plans.)