Shotclip is an application that aids collaborative movie making, where you can make a movie by yourself or collaborate with a group of friends.
Shotclip prototype
The Brief

Shotclip were looking for lead UX/Visual designer to completely redesign the product from scratch. At the time Shotclip was a desktop only application and was planning on exploring mobile territory with an IOS and Android application.

The Challenge

The challenge was having to wear multiple hats in an agile environment with incremental changes and the constant addition of new features. This required strategic planning, requirement elicitation and constant user validation throughout the design process.

Shotclip prototypes

The Research Process

Shotclip had a user base of 80,000 which gave me plenty of survey candidates and web behavior to quantify. Google analytics was a useful tool in finding the sites bounce rate, pain points and session durations. The research process started by performing a competitor analysis followed by surveys and observational user tests.

Competitor Analysis

I researched online video editors Vine, Magisto, Directr and Flameblast breaking them down into 3 categories; Positive, Negative and Interesting. None of the competitors provided collaborative movie making which reinforced our USP.

Competitive analysis cartoon

Survey

A survey was sent out to gather information to funnel candidates for the interviews, from the 107 that replied.

  • 56% of users would start a collaborative project.
  • 49% would join a collaborative project
  • 62% would make a private project.
  • 74% had trouble using the site.
  • 63% needed more instructional help throughout the site.
Survey cartoon

User interviews

From the interviews I determined three distinctive user groups ; Administrative users (users who start collaborative projects), Invited users (ones invited to collaborative projects) and Single users (ones who decide not to start a collaborative project).

User interview cartoon

Persona Creation

I created 3 persona from the data collected from the research phase, each with varying wants and needs.

Siobhan
The Administrator

“I want to invite my friends to make a movie and share it on facebook.”

Donald
The Invitee

“I love being part of the action and collaborating with friends.”

Steven
The Private User

“I need a free video editor to make a private video.”

User Flow

User flows were created for each persona so I could analysis the the thinking process behind their actions and the various navigational paths into the application.

User Flow

Sketching & Prototyping

I worked my way through many iterations of prototypes. I sketched out rudimentary versions of the UI to pragmatically elicit user feedback and to diagnose omissions of the design process early. This stage enabled me to reassess the information architecture and hierarchy throughout the application.

Testing

I tested my wire frames with users to validate any assumptions and user flows gathered from the research process. I used balsamiq to create the wire frames.

  • Testing!
  • Valentia Isle Site Map
  • Valentia Isle Site Map
  • Valentia Isle Site Map
  • Valentia Isle Site Map

The Shotopus

Testing established the need for something to give prompts to aid users through the application. The Shotopus is a 3 foot baby octopus who knows the score with Shotclip. This was a great chance to create a sense of empathy with the user and have some fun.

  • Shotopus 1
  • Shotopus 2
  • Shotopus 3
  • Shotopus 4
  • Shotopus 5

High Fidelity Mock-up

The agile nature of this start up requested constant feature additions and re-architectures, this resulted in the design chopping and changing throughout to meet business and stakeholder goals. There were many iterations of the interface this clickable prototype showcases the future IOS application which was tested throughout.

Results

I increased the conversion rates on: signing up, starting movie projects and publishing projects on social media. I also significantly enhanced the behavior flows using persuasive design techniques that met targets set out by the CEO and Stakeholders.

Competitive analysis cartoon

Lets chat!

Contact Me