Storyboarding a Serious Comic

STORYBOARDING A SERIOUS COMICCase Study

Created by the Community Prevention and Intervention Unit of University of Texas Southwestern Medical Center with a grant funded by the Centers for Disease Control (CDC).

PROFILE

SITUATION

Prevention with Positives (PwP) is an initiative to help persons living with HIV to get assistance and care through 10 components and related resources.

•UTSW wanted to share the importance of PwP. •Did not with traditional elearning.•More of an awareness campaign in support of CDC initiative. •Tell a story about the journey of two people with different circumstances

learning of their HIV positive status and the managed care received.

SOLUTION

Write a story with an educational emphasis presented in a graphic novel format and comic style artwork. Develop in an accessible authoring software for packaging and delivery to the PwP website.

Splash screen concept sketch

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

THE SCRIPT

SCRIPT – ORIGINAL

Audio filename indicator

Example: 2A.wav included 2.1, 2.2, and 2.3 dialogue

SCRIPT – REVISED FOR VO

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

THE STORYBOARDING PROCESS

STEP 1: Sequential narrative sketches

STEP 2: Adjust flow

STEP 3: Get a really big board

STEP 4: Create storyboard from sequential narrative sketches

STEP 5: Rinse & Repeat

STEP 6: Keep working and refining the storyboard from script

StoyrboardingSTEP 7: OMG! What have I got myself into?!

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

CHARACTER DEVELOPMENT

GREG Need Pro

Artist Dude

STEP 1:

@hubriscomics

STEP 2: Feed the artist!

STEP 3: Pick a style, research, and draw a lot of concepts

INITIAL character development model sheet lineup

FINAL character development model sheet lineup

•No change to Frances and Carlos•#1 RJ look became #2 Stu•#2 RJ got a new look•Tiffani needed to be “cuter”•Jan needed to look “older”

#1

#2

CHARACTER MODEL SHEETS

FOUR INCH THICK FOLDER of ARTWORK

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

ART DIRECTION

SCENE 4:Frances reviews Tiffani’s file

SCENE 4:Frances leaves en route to Tiffani’s apartment

SCENE 5:Frances knocking on Tiffani’s apartment door.

Q: Health Department to Tiffani’s apartment. How do we know that’s Frances knocking on the door?

A: The prop. The large purple beaded bracelet in earlier scenes establishes the character in later scenes.

USE REAL OBJECTS TO MODEL

Frances’ bracelet

Health Department Community Health Clinic Community Support Center

The story revolved around three Community-Based Organizations (CBOs) that had to look similar as they are all in the same urban neighborhood.

Parkside CommunityThe overhead shapes need to match the building elevations (previous slide).

Health Department

Positive Empowerment

Community Health Clinic

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

speech334

‘nuff said!

bubbles

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

UI LAYOUT & DESIGN

Global access to slide out panels

Global access to slide out panels

Global access to slide out panels

Slide out panel to review character backgrounds and biographies

Slide out panel to review an interactive map of the three agencies

Slide out panel to review an interactive DVD-style [Menu]

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE

ASSET MANAGEMENTGet and STAY organized!

Audio file naming convention matches script.

ALL artwork split out from background and followed same script naming convention

ALL speech bubbles follow same script naming convention including dialogue number and character name.

PROCESS

•Script writing•Voiceover (VO) recording•Storyboarding•Character Development•Art Direction•Speech Bubbles•UI layout & design•Asset Management•Lessons Learned

IDEA DONE7 months-ish

LESSONS LEARNED

Script before StoryboardCharacter Development early and DEFINE characteristicsCharacter voice actors record dialogue at same timePrioritize visual design changes in phasesArt directing an artist in an unfamiliar industry

THANK YOU!LET’S DO IT AGAIN!

Kevin ThornStoryboarding, art direction, development

@learnnuggetsNuggetHead Studiozhttp://nuggethead.net

Greg CravensIllustrations

@HubrisComicsHubris Comicshttp://hubriscomics.com