Storyboarding a Serious Comic

17,305 views

Published on

Newly discovered design methodologies including art direction, asset management, voice over recording, and general project management.

Published in: Design, Education, Technology
3 Comments
34 Likes
Statistics
Notes
No Downloads
Views
Total views
17,305
On SlideShare
0
From Embeds
0
Number of Embeds
700
Actions
Shares
0
Downloads
198
Comments
3
Likes
34
Embeds 0
No embeds

No notes for slide

Storyboarding a Serious Comic

  1. STORYBOARDING A SERIOUS COMICCase Study
  2. Created by the Community Prevention and Intervention Unit ofUniversity of Texas Southwestern Medical Center with a grant funded bythe Centers for Disease Control (CDC).PROFILE
  3. SITUATIONPrevention with Positives (PwP) is an initiative to help persons living withHIV to get assistance and care through 10 components and relatedresources.•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 differentcircumstances learning of their HIV positive status and the managedcare received.
  4. SOLUTIONWrite a story with an educational emphasis presented in a graphic novelformat and comic style artwork. Develop in an accessible authoringsoftware for packaging and delivery to the PwP website.
  5. Splash screen concept sketch
  6. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  7. THE SCRIPT
  8. SCRIPT – ORIGINAL
  9. Audio filename indicatorExample: 2A.wav included2.1, 2.2, and 2.3 dialogueSCRIPT – REVISED FOR VO
  10. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  11. THE STORYBOARDING PROCESS
  12. STEP 1: Sequential narrative sketches
  13. STEP 2: Adjust flow
  14. STEP 3: Get a really big board
  15. STEP 4: Create storyboard from sequential narrative sketches
  16. STEP 5: Rinse & Repeat
  17. STEP 6: Keep working and refining the storyboard from script
  18. StoyrboardingSTEP 7: OMG! What have I got myself into?!
  19. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  20. CHARACTER DEVELOPMENT
  21. GREGNeedProArtistDudeSTEP 1:@hubriscomics
  22. STEP 2: Feed the artist!
  23. STEP 3: Pick a style, research, and draw a lot of concepts
  24. INITIAL character development model sheet lineup
  25. FINAL character development model sheet lineup
  26. • 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
  27. CHARACTER MODEL SHEETSFOUR INCH THICK FOLDER of ARTWORK
  28. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  29. ART DIRECTION
  30. SCENE 4:Frances reviews Tiffani’s fileSCENE 4:Frances leaves en routeto Tiffani’s apartmentSCENE 5:Frances knocking on Tiffani’sapartment 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.
  31. USE REAL OBJECTS TO MODELFrances’ bracelet
  32. Health Department Community Health Clinic Community Support CenterThe story revolved around three Community-BasedOrganizations (CBOs) that had to look similar as theyare all in the same urban neighborhood.
  33. Parkside CommunityThe overhead shapes need to match the building elevations (previous slide).Health DepartmentPositive EmpowermentCommunity Health Clinic
  34. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  35. speech334‘nuff said!bubbles
  36. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  37. UI LAYOUT & DESIGNGlobal access to slide out panelsGlobal access to slide out panelsGlobal access to slide out panels
  38. Slide out panel to review characterbackgrounds and biographies
  39. Slide out panel to review an interactivemap of the three agencies
  40. Slide out panel to review aninteractive DVD-style [Menu]
  41. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE
  42. ASSET MANAGEMENTGet and STAY organized!
  43. Audio file naming convention matches script.
  44. ALL artwork split out from background andfollowed same script naming convention
  45. ALL speech bubbles follow same script naming conventionincluding dialogue number and character name.
  46. PROCESS• Script writing• Voiceover (VO) recording• Storyboarding• Character Development• Art Direction• Speech Bubbles• UI layout & design• Asset Management• Lessons LearnedIDEA DONE7 months-ish
  47. LESSONS LEARNEDScript 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
  48. THANK YOU!LET’S DO IT AGAIN!Kevin ThornStoryboarding, art direction, development@learnnuggetsNuggetHead Studiozhttp://nuggethead.netGreg CravensIllustrations@HubrisComicsHubris Comicshttp://hubriscomics.com

×