SPECTRUM WEBMAIL 3.0
| ROLE
| DURATION
| TEAM
| TOOLS
UX/UI Designer
6 Months
Sierra Wren (Content)
Kelsey Janz (PO)
Heidi Christiansen (Lead)
Jonathan Morgan (Accessibility)
Kumar Rai (Engin.)
Joseph Renolayan (Engin.)
Eliot Nguyen (Engin.)
Chris Longfield-Smith (Quantum)
Figma
Jira
Confluence
OVERVIEW & BUSINESS OPPORTUNITY
The Internet & Email Team at Spectrum had the opportunity to overhaul a web-based platform beyond with outdated technical architecture. As part of this, we got to improve the user interface, further improving the user interface.
​
​The primary goals for the Webmail 3.0 update were multifaceted. First, the existing framework was considered end-of-life for over a decade, necessitating an update. Additionally, there were unresolved accessibility defects, and the platform failed to adhere to WCAG 2.1 guidelines. Customer feedback consistently highlighted slow performance, and there was an urgent need to enhance security. Standardizing the user experience for all customers and reducing the rising trend in Webmail support calls, which were significantly increasing customer service costs (~$150k/month), were also key objectives.
PROBLEM
Spectrum provides its internet customers with up to seven free email addresses. Unlike other free email providers, Spectrum prioritizes privacy by not scraping data from users' inboxes. With support to update the back-end of Spectrum Webmail, we took this opportunity to completely overhaul the user interface for a significantly improved experience.
​
How might we inform and encourage users of an updated platform, so that they can more easily & confidently email,
despite our need to walk them through the radically different platform?
PROCESS & ROLE
Define | Design | Refine | Release
The goal of the first release for Webmail 3.0 was to have complete feature parity with the existing platform, which we called Webmail 2.0 throughout the design and development. Once the initial, basic UI was designed (with a modernized vertical, left-aligned navigation bar), the dev team was able to start bridging their newly built back-end services with a front-end. From there, we were in a healthy sprint schedule with design 6-8 weeks ahead of the developers.
​
As we neared the finality of designing the minimum marketable release (total functionality parity with Webmail 2.0), my PO and I began orchestrating a release plan. Knowing the large portion of our browser-based Spectrum email users tended to be over the age of 50, we wanted to provide customers with guidance on the new platform. I came up with the idea of a tutorial, but also wanted the option for customers to return to the tutorial during the first few months of release.
​
To ensure users adapt smoothly to the updated platform, we followed a structured approach:
Empathize:
Recognizing that people resist change, we aimed to introduce the new platform with minimal disruption and limited understandable incentives. We gave select customers the option to adopt early or keep what they had for a little while longer.
Define:
Targeting a select group of users initially helps manage confusion and resistance. Informing users well can reduce hesitancy and prevent costly call-center support. Initial feedback from these early adopters helps ensure we'll have a smoother rollout for our general population.
Ideate:
We considered various approaches, such as Outlook's toggle for new formats, Reddit's alternate URLs, and iOS's beta releases. We planned for a guided tutorial and a support page with animated videos to assist users before, during, and after the release.
Prototype:
After discussions with the product owner and colleagues, we opted for a canary release. We selected a small opt-in group and removed the toggle between the existing and new versions to reduce engineering constraints. Informing users thoroughly was essential for a smooth transition, and our marketing content would serve as support articles and internal reference material.
THE SOLUTION
The canary release allowed the first batch of users to provide live feedback on our communication of benefits and the effectiveness of the guided walk-through. We gathered input from content, accessibility, support, and marketing teams, and consistently checked early adopters' satisfaction. Blending testing and implementation made the process challenging, especially since customers had to stick with the update once tried. The implementation was scheduled for December 31, 2021.
KEY INSIGHTS
CHANGES REQUIRE ANNOUNCEMENT
Customers don't pay attention to web platforms like ISP emails closely or daily - we need to let them know when things change.
​
A SIGNIFICANT TARGET SEGMENT NEEDS INTENTIONAL EXPLANATION
9/10 survey respondents using Spectrum webmail were over the age of 50. This generation trended reports of confusion after UX updates.
​
EMPOWERMENT TO THE CUSTOMER IS KEY
The impetus for the project was to improve the UX for customers, largely focused around strengthening the settings and customization of their email account with Spectrum. Giving them options to participate in an early release and options to return to tutorials affirms the goal of assisting the users use our product.
WEBMAIL 3.0 INTERFACE UPDATES
Webmail 2.0 looked like a product of its time: the mid-2000s web design. Vast amounts of unused white space and minimal color (in part due to lacking a brand system in its conception). It was cramped and limiting for customers.
​
Webmail 3.0 saw a major overhaul in aesthetic to match the Spectrum branding, in addition to leveraging more visual elements and HAT content. Addressing accessibility concerns led to better contrast, spacing, and more consistent labels. Improved hierarchy and multiple visual elements to indicate interactivity created a more dynamic interface. Finally, designing a responsive website that would operate on mobile devices activates the full arsenal of customer tools and comfortable technology.
Below are a handful of select screens and features within Webmail 3.0. While the feature to select messages is not new, the ability to filter through the inbox (and folders) by date, sender, subjects, and more is new to Webmail 3.0 and will be included in the initial release.
​
Also new to Webmail is the ability to compose a message in the web page without changing what is selected on the far right on the page, with an overlay popping up from the bottom right. This feature seems like a no-brainer with how often we see automated feedback and chat prompts on web pages now, but this was new for Webmail. Adding this feature also challenged me to think through what multiple drafts would look like, and how a ribbon of minimized drafts would impact the UI related to pages of emails, folders, and reactions like "reply," and "forward."
MAPPING THE CANARY RELEASE
CANARY PROPOSAL
Left: a highlight of the designed opt-in modal, a selection of the Webmail 3.0 UI guided tutorial
Right: the landing page for customers to learn more information about what to expect with the new Spectrum Email platform
NEXT STEPS
Throughout the Webmail 3.0 project, I went beyond my role as team design lead and product designer. Amid changes and absences, I bridged engineering feasibility and product desirability, serving as the chief advocate for user experience. I worked closely with my team throughout development to shape Webmail’s impact on our millions of customers.
The successful launch of Webmail 3.0 marks a significant milestone in enhancing our email service. By prioritizing accessibility, performance, security, and user experience, we have created a platform that meets modern standards and addresses our customers' needs. Moving forward, continuous feedback and improvement will be key to ensuring the platform remains intuitive and efficient for all users.