Yahoo! Livestand

iPad App & Beyond – An ambitious attempt to magazine-ize the web

Project Overview

Yahoo! Livestand was an ambitious project to “magazine-ize” the web. Our native apps design team created 100’s of page templates comprised of modules that could be populated with content from Yahoo! Properties (weather, finance, photos, sports, etc). The content modules could be curated within a page to craft compelling stories. While the ultimate goal was to have Livestand appear across all of web and mobile exreriences, the launch would target iPad.

My Contributions

Our very talented team of 8 designers all wore many hats during this project, frequently sharing responsibilities and taking lead on various aspects of the project. I played a key role in the home screen design and interaction, comments, page layout logic of the modules, overall visual design, motion design (including transitions), as well as product visualization and announcement videos.

Project Kickoff

Several of us in the Yahoo! Native Apps team had been exploring ways to make a more rich web browsing experience. We had a large body of exploratory work towards this effort that we stitched together to form the Livestand concept. I created this product vision video to demonstrate what a finished product might look like. We shared with the executive team to get buy-in, which happened! This led to assembling approx. 75 people across product, design, engineering, and QA to form the Livestand team.

Project Definition

Having assembled such a large team from across many product verticals made it a challenge to define what we would build. The project would require many back-end systems for curators to craft experiences, as well as complicated logic to have these layouts work well across mobile devices and the web (this was before responsive design was a thing). We were able to clearly define the modular approach to the content as well as the general structure of the iPad app, but most of the project was not well defined or left open-ended. In the face of ambiguity, the design team and I focussed on what was known.

Template Explorations

We had loosely held ideas as to how the screen templates would work. The team and I starting gathering content sources from around Yahoo! and manually formatting into page layouts. I created rules around how modules would layout based on the screen orientation. Here are a few explorations that I crafted:

Navigation & Surfaces

I was responsible for creating the different surfaces, structure, and overall navigation of the app. Each edition or topic would could have the ability to comment or customize depending on the content type

Mobile World Congress Announcement Video

The product team wanted to announce of Yahoo! Livestand during the Mobile World Conference (3GSM) in Barcelona. Though the app was not full built, they wanted to generate buzz around the offering and begin to line up advertising partners. I worked with PM and executives on a script that covers key features that played during the announcement.

Lessons Learned

For most of this project, I was unclear as to what exactly we were building. We had designed many beautiful screens and content, but there were many missing pieces and conversations needed to turn them into a reality. We should have spent more time up front defining the product, that was a big learning moment for me.

I moved on to Motorola shortly after the Mobile World Congress announcement. The app launched several months later in a watered down version of the original design. Several competitors with similar objectives to Livestand came out during that time. Livestand was shut down within a year as Yahoo! was looking to shift its mobile strategy. I'm Still proud of the work the team and I did here.

Back End Tools Required

An ambitious effort such as this required strong back end tools to power it. The tools team should have worked much more closely with product team. Understanding the back end tools would have given us the constraints needed to design the content modules in ways to maximize re-use and reduce overall effort.

Where's the Research?

I worked on this project long ago and while I don't recall every detail, I know that user research was not core to this project. It was unclear (to me) as to what user problem we were trying to solve. Having data and user feedback would have been invaluable in helping us navigate the ambiguity of this project.

Next Steps

Thanks for making it this far. If you have any feedback or questions about this case study, please send me a note. If you'd like to learn more about my experiences, check out another case study below.