Video Editing Overlay for The Sensel Morph

OBJECTIVE

Design a video editing overlay that makes basic video editing commands accessible to novice video editors and create a novel way to interaction with video editing software like Adobe Premiere Pro.

MOTIVATION

Inspired by the Universal Media Editing Overlay, the winner of an Overlay contest that Sensel held back in 2015, we wanted to create an Overlay that made video editing accessible with the Morph. We also wanted to explore how using pressure sensing with video editing softwares could disrupt the video editing world.

ABOUT

The Video Editing Overlay 1 of 10 Overlays that Sensel promised to its backers on Kickstarter. We shipped out 300+ units of the Video Editing Overlays to our backers. This Overlay is available for purchase at the Sensel Online Store.

MY ROLE

Product Designer

OTHER SUPPORTERS

CEO, 1 Mechanical Engineer, 1 User Experience Designer

MORE INFORMATION

Sensel’s Video Editing Blob Post

Video Editing Overlay Reviews


 

1 - Defining the Problem

I talked to 10+ video editors of different levels of Adobe Premiere Pro experience. I asked them about to describe their video editing experience, and show me how they might editing some of there film. What I found was that there is a huge barrier of entry to video editing because of learning tools scattered across the internet, and video editing hot keys that are mapped all over the keyboard which make the hot keys hard to learn.

 
Abby is the brilliant founder of RogueMark, an animation studio in the Bay Area. She has been using Premiere Pro for a couple years now and admits that she is still learning shortcuts and ways to speed up her workflow.

Abby is the brilliant founder of RogueMark, an animation studio in the Bay Area. She has been using Premiere Pro for a couple years now and admits that she is still learning shortcuts and ways to speed up her workflow.

Kristen is a creative, adventurer, and photographer. She is just starting to get into video editing to be able to use different medias to capture her outdoor adventures. She is teaching herself Adobe Premiere Pro through online tutorials and has bee…

Kristen is a creative, adventurer, and photographer. She is just starting to get into video editing to be able to use different medias to capture her outdoor adventures. She is teaching herself Adobe Premiere Pro through online tutorials and has been frustraed with how much memorization there is.

John is a tinkerer, maker, and musician. He loves prototyping beats on the go, and sharing his maker projects on Youtube. John has an amazing home workstation where he has all his extra video editing gear, but when he has to work remotely, his workf…

John is a tinkerer, maker, and musician. He loves prototyping beats on the go, and sharing his maker projects on Youtube. John has an amazing home workstation where he has all his extra video editing gear, but when he has to work remotely, his workflow is stagnated by being limited to his laptop.

 
 

Video editors are saying...

"I always refer to me cheat sheet to remember the hot keys"

"I waste time switching back and forth between my keyboard and mouse to navigate my timeline."

"I just haven't put enough time into watching tutorials to speed up my workflow. Some shortcuts are 3 or 4 buttons which is sometimes a headache!"

 

Morph users using the Video Editing Overlay range from novice video editors looking to get into video editing, to professional video editors who are looking to speed up their workflow. The Video Editing Overlay gives a powerful, intuitive solution to those just getting into video editing, but also provides a way for professionals to be productive with video editing when they are working remotely.

 

How Might We

Make basic video editing features more visible and accessible on a controller so that novice and intermediate video editors so that they can more easily learn basic controls without having to watch as many tutorials.

Organize most used Adobe commands on a Sensel Overlay in a way that is easy to comprehend so that video editors can have a logical way to learn and practice commands which so that they can speed up their workflow

Explore how pressure can enhance the video editing experience by making more intuitive controls so that video editors can more easily edit their videos.

 

 

 

2 - Research

 
 

What's out there?

Gestures, external physical devices, and apps currently provide alternative solutions for easier video editing. We tested these solutions and collect data on how easy they were to use initially, how easy they were to use after practicing a couple times, how comfortable they felt, and how intuitive they were. In addition, we asked which performed best in different timeline navigation situtations.

3 Types of Timeline Navigation

1. Discrete, frame by frame

2. Slow Continuous

3. Fast Continuous

 
 

Results

Clicks, buttons, or tactile feedback was important for discrete, frame by frame.

Continuous circular motions made users feel like they had more control when slowly navigating the timeline.

Gestures and force buttons helps users quickly navigate the timeline with less hand motion.

IMG_5438.JPG
 

 

3 - Prototyping Ergonomics

Ergonomics

Being able to access as many controls as possible without having to move your entire hand across the keyboard is important for speeding up workflow. I printed our different navigation control layouts and tested basic video editing functions to test usability.

 
 

 

4 - Exploring Layout Opportunites

 
 

Keyboard Limitations

Keyboards are an array of buttons that users have to memorize to give commands to a software program. Below you can see how different Premiere Pro commands are mapped onto a keyboard. No wonder it takes a long time to get good at video editing!

 
skin.jpg
 

To get a sense of the most commonly used keys, I asked my interviewees what there most common tasks and shortcuts used were. In addition, I went on lynda.com, watched 20+ basic video editing tutorials and highlighted which keys were my most often used keys. Below you can see the darker pink keys were more frequently used and the lighter pink keys were less frequently used. 

Key Insights

Navigation controls (J,k,l, arrow keys) are in two different locations -- video editors constantly have to move there  entire hand across different areas of the keyboard.

Most commonly used shortcuts are also scattered across the keyboard which makes basic commands hard to learn.

 
Keyboard hot keys-01.png
 

The prototypes below explore ways to consolidate navigation controls and other similar task shortcuts. We tested each overlay with different users asking them to perform different tasks and watching how quickly they were able to learn the commands.

 

 

5 - 3D Jog Wheel and Button Shape Exploration

I made many 3D prototypes of our Jog Wheel and buttons with a UV printer and in Solidworks. 

Design Guidelines

Make buttons and 3D features on Overlay so that a user can navigate their fingers without having to look at the controller. 

Scroll Bars should gently guide finger movement without the finger feeling too restricted

Make the Jog Wheel center tactile so that users can guide their finger in a circular motion

Make the Jog Wheel control fast and slow navigation movement by having a smooth path and a path with discrete "ticks".

Use keyboard ticks to help guide fingers in button array clusters.

 
IMG_7060.JPG
IMG_6826 2.JPG

 

6 - Final Product

 
DSC_9680.JPG
Callouts_VEOverlay.jpg

7 - Press

Adjustments.jpeg