Fan Expressions - Chris Wang

Explorations: Comments, Moments and GIF Maker

MADE WITH FRAMER

For viewing content, I wanted to test how people would react to a comment thread that’s purely visual content. I also wanted to test the idea of connecting memes back to their origins.  

Viewing Moment

Diverge Ideas - Moments

When we looked at how music fans express themselves through music videos, one of the most popular type  was direct derivative content based on the music video from artists. It could be simply a few second clip from a music video that speaks for what they want to say. Or sometimes they add text overlay on top of the clip to twist the meaning or even create a whole animation short for it , and sometimes when it’s shared publicly and goes viral, it becomes a meme. We had this idea what if we create a place where people can view, create and share derivative content directly from the same space where they are watching music videos. And we gave it a working title “Moments”.

We ran two design sprints in a row, one week for how people view moments, and one week for how to create moments.  I made two prototypes and we tested the ideas at the end of each week.

MADE WITH FRAMER

For creating moment, I wanted to test how people would react when they have a tool set right next to where they are viewing music videos. And I wanted to know how they react to each tool individually. 

Creating Moment

After running these two design sprints we learned that people do love the visual oriented moments  more than text comments. They are faster to consume and more entertaining afterall. Another key learning was that people prefer sharing music video or music video related content in a more private context, like instant messaging than public social space. 

Learnings from two design sprints

Prior Art - Comments

Before I joined Vevo, there was a short project called Notes. It was basically text based comments that are attached to specific timestamp of the the video. At the begining of this rebooted new project  we tested the prototypes of the Notes design to gather some insights. Not surprisingly, people expected a comment section when watching music videos. But one thing people didn’t like particularly was negative comments. Almost all user research participants expressed such concerns. This is also something I observed when doing competitive analysis, like a conversation about what might cause guitar string buzz quickly turns into harsh verbal fights in a thread. 

Some people may say, it’s just the internet. But believed that behaviors can be shaped and influenced. The challenge of designing an online social space is that the invisible social context in real life might collapse or disappear. A lot of times we have to step back and look at people’s behaviors offline, and think how we can create an online environment that drives such behaviors.

So I thought, why does it have to be text? If we think about the motivations behind comments, it’s a way of self-expression. That’s the behavior we should be designing for. 

Converge Ideas - GIF Maker

MADE WITH FRAMER

Now after generating ideas, prototyping and testing, it’s time to narrow down the scope to a project that can be executed by one web front end dev and one back end dev in three months. And our goal was to build and launch a MVP fast and learn from it. Short format looping video clip seemed to be the best option to us. But we chose GIF as the content format because it’s more sharable and it always loops.   

Last updated · 2018

Designed & Coded with Framer

Results & Learnings

Within the first week of launching GIF maker, about 2000 GIFs were created organically. We weren’t able to get licensing rights for over half of our video catalog for GIF creation, these videos include ones from top artists like Taylor Swift, Lady Gaga, Adele, Selena Gomez, Kanye West, Jay-Z Coldplay etc. That might have a big impact on the viability of the GIF feature. The lesson here is that launching a product successfully requires more than just product, design and engineering, sometimes a project might require legal, sales, marketing, business development, community management or what not to succeed. Maybe that’s why there’s great value in Design Thinking as a way to transform organization, or practical process like Design Sprint, because they bring people from different functions in an organization from early on during a project. If we had involved legal consultant early in our design sprint, the result would have been much different. 
Through this project we did learn a lot about user behaviors of creating and sharing content around music video, and the challenges of creating a UGC platform on top of content distribution platform. This was Vevo’s first attempt to build a UGC platform, but it wasn’t the last. GIF Maker was discontinued later in 2017 when we focused more on Vevo Live.

Project Goal

Explore ways for music fans to express themselves through music videos

Vevo has been a product about content consumption for a long time. We wanted to make it more interactive and build a place for music video fans to be creators too. This marks the first time Vevo will be partially a UGC platform.

Project Scope

1 Designer

1 Web Dev

1 PM

1 User Researcher

1 Backend Dev

3 Months

July 2016 - September 2016

Design Sprint

I pre-ordered the Design Sprint book back in February, 2016, a month before it came out, and had been waiting for the book for a few months. Why am I so excited about it? Because it’s practical, and it only takes 5 days! It’s not like the typical UCD process that takes several months just to do the ethnographic research. They worked in academic or agency context, but most of the time, not so much for in house product teams. With Design Sprint, for the first time, for designers like me who need to evangelize User Centered Design Process at their organizations, there’s a source of support with well known branding and well maintained resources. It’s so much easier to convince someone the importance of UCD and suggest they  try design exercises like sketching or prototyping when the suggestion is coming from a third party. 

The one thing that I wished the Sprint book had covered was “How to bring the process to YOUR organization”. Luckily two of our PMs also got the book in March, so we started to have conversations about how we can try the process at Vevo, and I would share any updates about Design Sprint in our slack channels, like coverage from media, or stories of how other companies tried the process. And three months later, our Head of product suggested we give Design Sprint a try with the Fan Expressions project. The project was a perfect candidate because it was the more experimental project.

Fan Expressions

And bring GV Design Sprint to Vevo

Home Redesign

Fan Expressions

And Bring Design Sprint To Vevo

Fan Expressions

Design System

Vevo Live

Artist Version

Design Tooling

Onboarding

Motion

🎸 Music Projects 🎹

FAN EXPRESSIONS

Chris Wang