Craftsy Tutorial Creator

lindsay-stacking-cake.jpg

Members of the Craftsy online community enjoy viewing a variety of professionally produced do-it-yourself video tutorials.  But until now there was not a way for them to create and share their own videos.

 

Scope

 

A concept feature addition for the existing Craftsy iPad app

Project duration:  2 weeks

Project team:  3 designers

Project scope:  Interviews, synthesizing data, ideation, sketching, testing, wire framing, more testing, mock ups, presentation

Tools used:  Affinity mapping, feature prioritization, journey mapping, Sketch, Marvel, InVision, Keynote, Trello

My role:  Research, interviewing, synthesize and distill findings, brand research, persona development, information architecture, presentation

 
Screen Shot 2018-04-09 at 8.32.26 PM.png
 

 

Discovery

After recruiting and interviewing users, we systhesized our data using affinity mapping, feature prioritization and journey mapping to help define the task.  

Through the research we also determined that users would be better served by a feature addition to the existing Craftsy app, rather than a new stand alone app.
 
Affinity1.JPG
2x2.JPG
journeymap2.JPG

 

Personas were developed and refined.  We ended up with 2 different personas- the novice video maker and the experienced video maker.

Screen Shot 2018-04-10 at 10.07.58 PM.png
 
Screen Shot 2018-04-11 at 8.47.02 AM.png

 

Ideation

We created a series of hand sketches and put them into a Marvel clickable prototype for the iPad.  We did several rounds of testing and iteration before creating hi-fidelity mock-ups.  

Some of our take aways from the lo-fi testing were:  A banner was added instead of a button on the opening page to draw attention to this new feature.  The title My Tutorials was better represented by Tutorial Creator on the welcome screen for the new feature.  The icons on the editing screen were changed from scissors and knives to arrows to indicate the cut points.  A progress bar was added to the success page.

Sketches.JPG
lofi3.JPG

 

Design

The hi-fi mock-ups were designed in Sketch and put into an InVision clickable prototype.  We tested and re-tested the hi-fi prototype and made several more design modifications.  

Some of the modifications made after testing of the hi-fi prototype were:  The welcome page was changed to more clearly show the user that this is where their tutorials will live.  A bar was added to the left side of the camera screen so that the control buttons were more visible to the user.  A brief explanation of the company review process was added on the success page.

 

Here are some of the first hi-fi mock ups.

aCategories.png
aWelcome.png
aReview.png
aSuccess screen.png

 

Here are some of the modified screens in the final version.

bWelcome Laura.png
bCameraPlayback RecordingLaura.png
bMedia import - photo selected.png
bSuccess screen Laura.png