© 2017 by Moshe Shmuel.

Yaveo was the first Spanish language streaming service targeted at bilingual, bicultural U.S. Hispanics. It also happened to be DIRECTV’s first streaming service that set the course for the company’s OTT streaming future.

 

As the lead UX designer, my role was to redesign the service architecture and UI components from the ground up. I had to completely transform the onboarding and acquisition flow, and live streaming and account management features to a delightful and competitive experience that was easily accessible across all platforms.

Client: DIRECTV     |    Year: 2014 - 2015      |     Platform: Multi-Platform

Assessing the Product Health

I was brought in to lead and prepare Yaveo for its upcoming market launch set to happen three months later. With a challenging list of goals to achieve and a short timeline to work with, it was essential to first obtain a clear assessment of the product's current condition.

 

I began my evaluation by following a design principle I like to call "Observe and Absorb" - simply using readily available resources and methods to gain a rapid and cohesive perspective* of all the elements that impact the overall user experience - product, market, company, and team. These included subject research papers, market landscape reports, heuristic evaluation, pitch decks, and simple conversations with the different teams.

 

Following these steps helped form a clear picture of the current condition of the product and provided quick insights into what we know, want to know and what it takes to get there.

USER
PRODUCT
MARKET
COMPANY

Products are greater than the sum of their parts. It's absolutely essential to consider and balance all aspects that experiences are influenced by and dependent on (product, market, company, and team). Doing so will lead to a more valuable, meaningful and engaging experience for its users and the business.

I always referred to the above pyramid shape (which also explains my logo) to effectively communicate this cohesive perspective to my team and peers.

*

Identifying the Missing Piece

The above UX artifacts provided a complete and clear view of the problems the product was facing, but there was one more significant question that needed to be answered in order to really understand the core challenges that needed to be overcome:

Was our team healthy?

 

This first set of wireframes (below) described the design spec for the service's Parental Controls feature and was also used to test the team's and vendors' workflow to determine what did/didn't work. In order to capture each team's POVs, we simply launched a follow-up survey that gave us the structured feedback on areas to improve future deliverables and processes.

USER
MARKET
PRODUCT
COMPANY

The Challenges Emerge

Breaking down our core challenges helped us shape the overall product design strategy inside/out. It also contributed to the development of a more fitting product design process to accommodate our scale, scope and short timeline.

“It was about implementing a stable approach to our product development more so than implementing a process."

PACKAGE DEAL

The packaging and presentation of the design deliverables gave way to a strong framework foundation.

  • It had to maintain a clear and consistent layout, so anyone who read it would know where to look, what to ignore and be able to quickly review the scope, rules, and relationship between UI components, pages, and states.

 

  • It had to capture all the relevant requirements gathered from each stakeholder and communicate it in a clean and clear manner.

 

  • It had to present the complete UI behavior for each device type, principles and specific OS requirements.

 

  • It had to be a living document that clearly tracked and displayed the differences in revisions for each version release.

CLEAR PRIORITIES

Guided by core user needs, we carefully prioritized which features/capabilities were important to which team and which ones could be pushed to future releases.

DRAG AND DROP

I created a comprehensive library of modular templates, stencils and UI components to reduce prototyping and UI design turnaround time.

“Fanlab isn't just another project, this is a fully-scaled company that reinvented the way we test projects”

READY FOR THE REAL WORLD

Forget "Lorem ipsum," the wires included real-world marketing and interface copywriting as well as the original iconography that was used in the live product, which helped reduce the design turnaround time and shortened the approval time between departments.

ALL ABOUT THE DETAILS

The wireframework included every possible scenario, user flows and the appropriate UI states for each device. In addition, the detailed annotations combined with relevant business rules and logic, provided clear business logic, context and reduced confusion between all parties involved.

It was essential to conduct rapid user testing before the UX approval process began in order to gain a firm business justification and to support product design decisions. The detailed Hi-fi wires enabled a faster and more accurate creation of test prototypes for user testing sessions, which ultimately led to a higher quality of test results due to users engagement with a product that was closer to the "real thing."

THINK FAST, THINK AHEAD
TEST, ITERATE, OPTIMIZE

Every feature and enhancement was prototyped and
backed by several user tests or in-depth studies that were conducted using various research methods, tools, and vendors, to surface the most optimal solution that works for our users.

Inclusive UX review sessions broke the silos, narrowed the communication gap between teams and provided transparent context as to “why we need to push existing boundaries as much as possible to satisfy our users!”

BETTER TOGETHER
USER
TEAM
PRODUCT
MARKET
COMPANY
CROSS PLATFORM ACCESSIBILITY

Browsing and main navigation features remained consistent and accessible across all devices and platforms.

Content Package Upsell-VOD/Live/Network

Promoted Channels- VOD/Live/Network

Channel sidebar module allowed for an easy channel switch without disrupting the live feed. It also provided a minimalist view of the essentials (channel selected, other available channels, favorite channel, and timestamp) with the option to expand and show the full guide information.

Keeping in mind a user’s desire to quickly scan through the channel guide and be able to easily find the information that guides their content choices, the live guide displayed a simple grid of 4-time slots for each channel with only 6 channels at a time. This provided users with the most relevant and concise information needed to quickly scan, select and watch.

EASILY...

Set a program reminder

GUIDING WHAT'S NEXT...

The next phase of the guide was to introduce a more visual approach to browsing channels by incorporating high-res visuals and short looped videos of the current live program. This solution made it easy to decide on what to watch and reduced endless channel surfing.

SIMPLE GESTURES​

Focusing on key tasks that could be done single-handedly, users could effortlessly swipe to the next channel, scroll to browse while watching, flip orientation to view in full screen, and again, swipe to the next channel in  landscape mode

SCROLL
FLIP
SWIPE

View more info (channel & program)

Mark favorite channels

Purchase premium channels

Navigate using keyboard arrow keys

Skip to date/time

And the List Goes On…

So far, our team made tremendous strides towards designing and developing features and enhancements that elevated the overall user experience of Yaveo. But, we were still halfway there, the product roadmap presented more challenging goals to accomplish that would further stabilize Yaveo’s core functionality and experience, that would ultimately turn it into a premium OTT service.

Looking to the Future

“if you thought that the news of DIRECTV launching a Spanish-language streaming service had nothing to do with you, Mr. or Ms. English speaker, you couldn't be further from the truth. Yaveo is the test bed for many of the technologies you'll be using in 2016 and beyond."

 - Stuart Sweet, The Signal Group LLC.

AT&T made a bold statement as to where the company and consumers were heading by placing a giant DIRECTV Now statue made out of old set-top boxes at the Los Angeles headquarters.

Our team’s greatest success was being able to show the enormous potential of how streaming platforms could deliver the ultimate viewing experience for today’s and future consumers. The product we built demonstrated what it takes to not only stand out in the market but also how to serve a leading experience users enjoyed.

 

These factors alone changed the company’s mindset and paved the road to DIRECTV’s streaming future, today you probably know it as DIRECTV NOW.

 

As a result, it was time to sunset Yaveo and shift our focus, knowledge, and efforts to support DIRECTV NOW. Although not surprising, it was still a bittersweet end for the team as every product design team wants to see their creation evolve to a more delightful experience. However, we were excited by the opportunity of offering the same elevated experience to a larger market, especially now that it was the new flagship product of both AT&T and DIRECTV, forever changing how the company was moving toward its entertainment future.