finallogo.png
 

Tools to make virtual reality easier to build & distribute.

Summary

I was hired in November 2016 to be Entrypoint's full-time Product Designer. When I started, the product was just an idea. Through my visualization of the product, I helped turn this idea into a fully-realized 360 video drag-and-drop editing tool, with an accompanying 360 video player. Below, you'll see the design processes I used, which incorporated user research, design thinking, and lots of iterations of UI mockups. I also designed our branding and marketing efforts, which included the logo you see above and the pitch decks we used to raise money. We raised $2 million in funding and had an official partnership with Snapchat. Read below for the full story.

The Problem

Studies show that 360 video has the potential to drive engagement in ways traditional video can’t. The new technology encourages viewers to get in on the action-- which is great for brands and storytellers, as the experience not only makes people want to explore but also to share.

However, creating an interactive 360 experience is expensive and labor intensive due to the costs of 360 video cameras and the software necessary to stitch together the footage. To make matters worse, there’s a bottleneck effect on the distribution of VR experiences due to the steep costs of headsets and the often cumbersome process of downloading content on mobile devices.

My startup, Entrypoint, raised $2 million in seed funding and hired me as its 2nd employee with the responsibilities of a product designer. My goal was to make sure all aspects of the product came together, including the UX/UI design, development, branding and marketing.

During my time at the company, we created a three-step process:

  1. Upload the 360 video to the platform

  2. Use the drag-and-drop 360 video editor to add things like subtitles, hotspots, images to your video (without programming)

  3. Distribute your 360 video on the web using our player

 
 
SystemGreyedFinal2-01.png
 

 

User Research

After speaking with hundreds of potential clients, we categorized them into four main categories:

  1. Advertising agencies -- to make their brands see & modern with 360 content

  2. Broadcasting companies -- to showcase 360 events and live-streams, such as concerts, comedy shows, and sports

  3. News outlets -- to take advantage of a new form of journalism

  4. Filmmakers -- to tell stories in a new way

 
 
The GIF above demonstrates a 360 video.

The GIF above demonstrates a 360 video.

Product #1 - The Editing Tool

Our editor allowed content creators to drag-and-drop elements onto a 360 video, such as images, GIFs, text, and portals to other videos. Content creators would be able to create immersive, interactive experiences without programming and could then distribute their content anywhere on the web to wherever their audience is.


Interviewing: Content Creators

In order to learn about the needs of the content creator, we had to speak to lots of people. We spoke with filmmakers, advertisers, educators, executives, journalists, and more. We asked questions like…

  • Why do you want to create 360 content?

  • What kind of engagement are you looking for on your videos?

  • How do you currently use analytics to improve your content?

  • How has your content changed over the last 1, 2, 5 years?

  • Who is your intended audience? Why would they benefit from 360?

  • How do you stay innovative in your respective industry?

marvelous-hairstyles-for-men-with-glasses-with-extra-haircut-with-glasses-choice-image-haircuts-2018-men-fade.jpg

High-Expectation Customer:

  • Media Advertising Professional

  • Content creator interested in pushing the boundary to stand out

  • Goals:

    • Leverage innovative technology to garner more views/user engagement on his company’s content.

    • Distribute content on the web -- not an app -- from websites to social media

    • Promote certain actions from their viewers

    • Understand how their video performed through unique 360 video analytics


Interviewing: Millennials

Because 360 video is still brand new technology, no one truly understands what it means to make good 360 content. Therefore, it was just as important for our team to learn and pave the way as it was for our clients to do the same, too. If we could understand the principles of good 360 content, we could then design our software in such a way that encouraged good practice.

In order to create a supreme user experience for the viewer, we had to do additional consumer research about the way people consumed digital video. We wanted to know questions such as...

  • Think about the last time you shared something with a friend, what was it and why did you share it?

  • What is the most memorable VR/360 video experience you’ve encountered?

  • What do you do when you encounter a 360 video on social media?

  • What kind of content do you enjoy on the Internet?

Cell+Phone+Use+Hazards%2C+Specially+for+Teens.jpg

Our customers’ customer: Millennials

  • Tech-savvy millennials potentially interested in VR/360 video

  • Active on social media

  • Always on their phone

  • Goals:

    • Find continuous new content for personal enjoyment or to share with friends

    • Expend minimal energy in finding, engaging with, or sharing content

 
 

Design Processes

Early sketches of the editing platform.

Early sketches of the editing platform.

 

There were a lot of moving parts to this monumental design and engineering task. Therefore, it was essential that we stuck to processes that kept the entire team creative, productive and organized. We used a product roadmap to keep the entire team up-to-date on a timeline for what was being built and who was responsible for it. 



Product Roadmap

 
ProductRoadmapTest-01.png
 


User Flow for Uploader

Below is a sample user flow for how a user would upload and share a 360 video.

z.png

UI Mockups of Uploader

UI Mockups of Editing Tool

The next part of the process was the most important and what we spent most of our time executing on. The examples below show what it would look like for a broadcasting company to drag-and-drop portals and other interactive elements on top of 360 concerts.

 
 

 

We received the following press for our design:

“The Entrypoint platform, which is due to launch this summer, looks friendlier than Apple's iMovie program (not to mention professional editing software like Final Cut Pro).”

—FORTUNE.com

 
 
 

Product #2 - Video Player

PacificParkFinal (2).png
 

User Experience

As mentioned earlier, we had already been gathering information about people's 360 viewing habits. Here were some of the key insights we used when designing the video player.

  • People often don't realize they are looking at a 360 video

  • People don’t enjoy the “magic window” as the only way to navigate (pivoting the phone to look around); it is too laborious

  • People have anxiety about not knowing where to look; they don't want to miss the action

 
 

Sketch Process - Video Player

Sketches of the player.

Sketches of the player.

 
 

Here are some examples of features or concepts we designed with our design framework.

Feature: GIF Capture
Problem: How do we design a mechanism that users understand the purpose and are encouraged to use?
Design principles:

  • Borrow mechanisms from other similar software (Snapchat, iPhone camera, Instagram)

  • Use video recording iconography

  • Be visible & loud (we want to encourage usage of this)

  • Don't relay important information obscured by the thumb (like time left of recording)

 
Iterating different options for GIF capture animations.

Iterating different options for GIF capture animations.

 

Feature: Using UI to make things seem faster
Problem: How can we implement animations and clever design to make the player appear faster than it is?
Design principles:

  • Use placeholder UI until it is finished loading, which is a greyed out or color blocked version of the UI

  • Limit the number of times a spinning animation is used and save it only for major loading events

We didn't want the slowness of the app to take away from the UX, so we implemented designs that would make things "feel" faster.

We didn't want the slowness of the app to take away from the UX, so we implemented designs that would make things "feel" faster.

 

Takeaways

It is better to risk boldness than triviality.

Working in the VR industry has been brutal. I’ve seen some startups that were too committed to an inflexible business plan and failed to adjust when sales numbers for VR hardware underperformed year after year. Other startups were too fickle to the demands of stakeholders, hoping the “versatility” could keep them afloat through the ups-and-downs. The downsides of this approach were diluted visions, lost motivation and products that seemed more like iterations of the status quo rather than something truly innovative. Looking back, I wish we had committed to our more ambitious visions that we had at the beginning. If most startups fail anyway...why not fail doing something fun?

Test assumptions early and often.

Many people have the false belief that learning can only happen when you have something functional to work with -- which can mean months of wasted learning opportunity. With creativity and wit, it is possible to test assumptions from the very beginning. While we did talk to a lot of people in industry who reassured us that we were building something they needed, we fooled ourselves into thinking their words were proper validation for our product. We needed to amp up our research and develop user tests with the intent on learning, not self-validation.