DirecTV buyflow experience
Optimize DTV's customer purchasing journey and streamline the checkout experience.
2022-Present
Type:
Design system update
Website rebranding
Mobile experience enhancement
Accessibility design
Duration:
24 months
Methods:
User interview
Wireframe
Mockup
Prototype
Design audits
Tools:
Figma
AdobeXD
Photoshop
Illustrator
Tools:
Photoshop
Sketch
Axure
The challenge
Since 2021, DirecTV embarked on a new branding strategy to revitalize its image and adapt to changing market dynamics. This involved updating the visual identity, messaging, and marketing campaigns to reflect its commitment to innovation, quality content, and customer satisfaction.
The television industry has become increasingly competitive with the rise of streaming services like Netflix, Hulu, and Amazon Prime Video. These platforms offer on-demand content at competitive prices, posing a challenge to traditional cable and satellite providers like DirecTV (DTV).
Consumers are increasingly gravitating towards on-demand and personalized content experiences. This shift in preferences necessitates DirecTV to adapt its offerings and branding to meet the evolving needs of its customer base.
User research on consumer segmentation (report findings from research team)
Research objectives:
1. Measure entertainment consumer segments based on core motivations and behaviors (including why consumers watch live, on-demand, pre-recorded, etc.)
2. Understand the shift in TV/Video consumer watching behaviors and how this is reflected in DIRECTV’s customer base
Changes in marketing strategies
Rebranding DIRECTV STREAM
Channel Lineup and Pricing change
Gemini Device Launch
My Role
I joined the team at the moment when DirecTV relaunched the website and the third-party agency worked on the new visual style and design system for the redesign, DirecTV UX buyflow team stepped in and continue the hand-off process and maintained the new design assets.
In my role as Senior UX/UI Designer at DirecTV, I focused on optimizing the satellite and streaming purchase journey, and oversee the entire service purchase flow from the product page to checkout pages. My primary objectives revolved around refining four key pages to ensure a seamless and intuitive experience, ultimately facilitating a streamlined checkout process.
Design iterations ( collaborate with research team)
The Channel Package page is the first step for customers to choose a TV package, showcasing key details, add-on options, and the Gemini device upgrade. Through iterative design, it enhances functionality and visual appeal for a seamless shopping experience.
1 Simplify the hero panel
-
Reduce context volume, deliver succinct message
-
Improve visual language and draw user attention at the first sight
First iteration
Second iteration
Latest iteration
2 Update add-on service section
-
Improve the tile components to fit the specific business and marketing requirements
-
Create a clear click-to-open structure to clarify channel's policy and benefits
-
Maintain and create add-on tile specs in design system
-
Work closely with other buyflow designers to guarantee the design consistency
Maintain and upgrade the tile components in design system
.png)
3 Visualize the device comparison
-
Introduce new wireless device Gemini and display the main features
-
Save user's time on reading the device configuration information.
-
Create a simplified way to clarify Gemini's benefit
-
Visualize the feature differences between two devices to help user make purchase decision
Before
After
4 Improve the checkout experience
I took responsibilities to update the following update according to the business requirements.
-
Editable cart
-
user credit verification
-
Alternate billing address collection in card payment section
-
Update to the forced paperless billing
-
Incorporate an editable feature to enable users to review and make changes before proceeding with their order.
-
Enhance the stepper style to provide clear navigation cues throughout the checkout process
-
Design user-friendly forms with clear labels and input fields.
-
Ensure that all elements are responsive and easy to interact with on smaller screens.
-
Support a variety of payment options to accommodate different user preferences.
Upgrade cart summary to editable cart
Credit verification experience update
Design system components upgrade and study
In addition to creating buyflow pages, I actively collaborate with the design system designer to uphold and enhance our design library. This entails meticulously curating and updating design component variables to align with evolving business requirements, ensuring their applicability and consistency across all three buyflows.
Furthermore, I take pride in my contributions to the design system, where I've developed a range of modal and add-on tile variations. These variations have been specifically crafted to seamlessly address various scenarios encountered during the purchase flow
Audit
As the major designer in buyflow team, I communicate daily with development team to follow up the design implementation, I conduct thorough audits of web and mobile breakpoints, documenting any defects or inconsistencies with the design. These findings are compiled into a comprehensive report, where I emphasize areas for improvement and offer actionable insights to developers, and to improve the overall quality of the user experience.
-
Review Design Specifications
-
Compare with Design Mockups
-
Evaluate Functionalities
-
Check for Consistency
-
Test Interaction
-
Assess Accessibility
-
Document Findings
References
Here's what my director and colleague think of me
Wes Kim
Director of User experience at DirecTV
"As a member of the DIRECTV UX design team, Yangye was key to delivering customer-focused designs for our dev teams to execute against. Working closely with the purchase flow scrum team and the larger UX team, Yangye made sure that the designs she developed met the needs of both our business partners and our customers, while adhering to our UX team's best practices. She would be a good addition to any team!"
Bridget Shepherd
UX designer at DirecTV
“As part of the DIRECTV Buyflow, Yangye and I are opposite sides of the same coin, her updating the Stream side, and me updating the Internet offerings. Yangye has a great drive to create ideal UX scenarios, taking the top standards and applying them to current implementations. She is an asset to any UX team.”