NFL Sunday Ticket TV

Date

July 2018

Role

UX Consultant, Lead Information Architect

Tools

Illustrator

start with why

“As a product owner, I would like your UX recommendation on optimal presentation for our new streaming service. We have a tight timeline, minimal budget development budget.”

client since

2007

location

Bothell, WA

industry

Telecom & Entertainment

Projects Completed

So many.

Problem

Problem.

  1. The current iteration of the page architecture is based on business goals, not the customer's need.
  2. There is little development budget so the recommendation will likely not be implemented and launch.

Strategy

Process.

I analyzed the customer journey and content strategy. This is what I discovered:

  1. Customer Journey. Not all football fans will be eligible for the streaming service. The original page flow takes the user to the landing page where they can learn and get excited about the benefits, only to realize they may not be eligible. This could lead to user disappointment, and negative feelings toward AT&T. Feelings leave a lasting impression on people.
  2. Content Strategy. The content hierarchy prioritizes the business goals and does not align with the users mental model for processing this type of content. The information layout is not intuitive nor easily scanned.

Solution

Solution.

  1. I created a new customer flow, which moves the eligibility checkbefore the landing page. This way users will be segmented and only those eligible arrive at the landing page.
  2. I re-architected the page by ordering the content from a customer-first perspective and providing a mobile-first copy strategy. I created a wireframe of the page in mobile, then desktop and compared it against the original design by spelling out the differences.


    If the information is presented in a way that it resonates with the user, the business is better positioned for conversion and theoretically meeting the business goal.

Results

Results.

The product owners were receptive to the feedback and agreed with the recommendation. However, their lead time for requesting a consult did not align with development deadlines. They plan to revisit these recommendations in a later phase.

AT&T Switcher Flow
Previous

AT&T Switcher Flow

Leave review
Date
February 2018
Role
Information Architect, Design Consultant
Tools
Adobe XD, PowerPoint
Powered By
Adobe XD
See the prototype ≫
start with why
“As a product owner, I need a functional prototype to user-test the optimal presentation of “call me” functionality in the Switcher Flow.”
Problem

Problem.

FUNCTIONAL: In order for a DIRECTV customer to actually switch wireless carriers, he must speak to a rep. We also know most users will expect to complete a process online when they've started online. How might we mitigate abandonment by creating an efficient way for a customer to speak to a call center rep?

 

DESIGN: The current design does not meet color contrast (accessibility) requirements and the content hierarchy needs improvement.

 

Strategy

Strategy.

To add functionality to the Switcher Flow so the user can schedule a time for the rep to call him instead of waiting on hold indefinitely. Mobile first. This flow contains a lot of content and I need to ensure it's easily understood. If we master the hierarchy on the smaller screen, we can easily apply the design to larger viewports.

Solution

Solution.

I wanted to maintain the original structure of the flow which allowed the user to complete the entire process on one page. Being cognizant of cognitive load, I applied the chunking principle and progressive-reveal to break up the content. Then added in the new feature of collecting the user's contact info allowing him to schedule a call back from as soon as 15 minutes, up to 48 hours.

 

As a courtesy I also presented the product team with a list of the aesthetic issues in the original design. They updated the design as a result.

client since
2007
location
Bothell, WA
industry
Telecom & Entertainment
Projects Completed
Hella

visual design / ux design / art direction / people management / process development

Results

User test results.

 

  • 10 of 10 participants completed the flow quickly and easily—“incredibly easy".
  • 8 of 10 participants wanted earlier notification that switching requires a callback.
  • 9 of 10 participants understood the benefit enough to move forward, most expecting more details before deciding.
  • 10 of 10 participants liked the overall design—“Very appealing” & “Easy to follow and easy on the eyes”.
  • 8 of 10 participants preferred the two page split over a single page flow.
  • 9 of 10 participants quickly and easily used the grid, all liked it—“clear and easy” & “easy and convenient”.
  • 8 of 10 participants preferred the grid over the list.

 

Read More
AT&T Responsive Design System
Next

AT&T Responsive Design System

Leave review
Date
April 2016
Role
Project Lead & Art Director
Tools
PhotoShop, Illustrator, InDesign
Powered By
Adobe Experience Manager CMS
Guidelines doc excerpt ≫
start with why

“As a stakeholder I need our organization to implement a faster, efficient, device agnostic method for delivering offers to customers without a complete redesign or a release for each initiative.”

Problem

Background.

In 2015 AT&T decided to take the plunge into responsive design. In addition, the current site platform which launched in 2010, was not responsive and performing slow. To make up for the lack of responsive content, in 2012 we launched a separate mobile site. However, that created two sites to maintain which doubled the effort in updating and creating new content. Additionally, the methods & styles to design for the 2010 site were archaic by 2015.

Strategy

Strategy.

  1. Update the platform to Adobe Experience Manager (AEM).
  2. Create a responsive website, with a mobile-first content approach.
  3. Move away from page templates and create a modular design system so pages could be built/updated by content implementors and released daily, instead of by developers and released on a project schedule.
  4. Utilize the newly emerged Digital Standards team to ensure design, code, copy and accessibility requirements were built uniformly.
Solution

My role.

I was asked to oversee the creative efforts to redesign and "responsify" the upper funnel pages of att.com. This was 12-15 pages, plus up to 3 versions of each for regional and authenticated-user specific content. The project was underway when I was assigned the initiative. Some of my tasks included:
 

  1. PROJECT LEAD.
    I coordinated the efforts of our external design agency, UX research, content implementors, development team, and copy strategists.
  2. RESOURCE MANAGEMENT & MENTORSHIP.
    The initial design was heavily dictated by an external design agency. I wanted to give our internal talent, who’d be sustaining this work, an opportunity to grow their responsive design skills. So I pulled designers to ensure they were getting acclimated to the responsive design process we were creating before deadline and metric dependent work assignments were handed out.
  3. WIN TRUST.
    I worked with stakeholders to gather their content and functional requirements for a redesign. We started lean, so some of the requested functionality would be placed in a backlog. I made myself available to attend regular Q&A sessions with stakeholders to alleviate their concerns.
  4. PROCESS CREATION.
    I created a workflow with input from the the development and content implementation team, to create a feature request intake process. This allowed product owners to request new pages, content updates, or functionality enhancements starting in Phase 2. As part of this process, I created an intake form to track requests. Requests were submitted to me or my producer. Once vetted, I'd assign an IA to provide an analysis or solution.
  5. PROCESS DOCUMENTATION.
    I designed our module “bible” which contained detailed information on each component at each breakpoint.
  6. QUALITY ASSURANCE.
    I performed Visual QA on each component to ensure each component was coded to spec, at each breakpoint on Chrome, Firefox Safari, and Internet Explorer.
  7. TRAINING & SUPPORT.
    From March - November 2016, I held multiple training sessions to ensure the standards team, design teams, content implementors, and copywriters knew where to access the files, documentation.
client since
2007
location
Bothell, WA
industry
Telecom & Entertainment
Projects Completed
A lot!
Results

Achievements.

The AEM Multi-screen redesign launched in April 2016.

I oversaw the creation of 99 module templates across 3 breakpoints, which replaced over 1500 templates.

Product Owners were no longer restricted to template-based pages. A section of a page could be updated through the daily release process instead of a full development effort.

I created a repository for assets available to all disciplines and external vendors.

I helped promote and encourage collaboration with the newly established standards team by following and referencing their guidelines.

Read More