The first presentation from StoryCode's Tech Immersion - topic is Technology Process for creating Immersive Stories.

1. May 8, 2012
StoryCode Immersions #3
Technology Process

2. AGENDA
• Technology Process Overview - 45 Minutes
• Working with Developers / Deep-Dive: 45 Minutes
Mark Harris - www.desperatecomfort.com
Twitter: @MegaMarkHarris
• #storycodeorg

3. OVERVIEW
• Immersive media projects blend processes from Editorial
+ Film + Tech
• New type of project process has evolved
• Blend of the three
• Inspired by the work of Loc Dao (Creator of Bear71) of
National Film Board (www.nfb.ca)

4. BLENDED PROCESS
• Concept
• Script
• Information Architecture
• Wireframes
• Storyboards
• Tech Spec
• Design
• Development

5. CONCEPT
• Overarching idea for the project
• Keep it high-level - consider including premise of the
story here
• Examples:
• Distribute film on Facebook - hook into Social Graph
• Explore randomized presentation of scenes

6. SCRIPT
• Stick to traditional screenwriting tools here
• However some scenes may be abstracted (not scripted
but controlled by technology)
• Indicate where the narrative jumps platforms and which
platforms are which
• Examples:
• Scene 2, 4, 6 - list of images from Flickr with labels
• Scene 10 - randomly selected video clip from YouTube

7. INFORMATION ARCHITECTURE
• Site Map for your Story
• Indicate platforms
• Typically shows “user flow”
• Helps communicate how/where users will experience the
story

8. INFORMATION ARCHITECTURE EXAMPLE

9. WIREFRAMES
• Non-Designed Screen Comps
• Focused on Front-End Functionality
• Great place for notes to begin Technical Requirements
• Provides roadmap for prototypes

10. WIREFRAME EXAMPLES

11. STORYBOARDS
• Similar to traditional film storyboards or sketches
• Could also be rough screen comps to start to flesh out
key scenes

12. TECHNICAL SPECIFICATIONS
• Analyze every aspect of the functionality and make
technical notes - review in detail with technology team
• Goal is to capture all potential outcomes and baseline
tech functionality
• Consider a Use Case approach: use cases define
interactions between an “actor” and a “system” to
achieve a goal.
• Example:
• Bank Customer uses ATM to withdraw money
• Users wants to watch film on Facebook

13. DESIGN
• Traditional user interface design approach
• Design, review internally, review with tech team
• Consider showing to potential users, get feedback
• Revise, review, repeat

14. DEVELOPMENT
• Prototype
• Test to ensure it meets baseline tech requirements and
handles alternate outcomes (password fails)
• Develop Alpha / Test
• Work with development team to deal with traffic
issues / load balancing
• Develop Beta / Test
• Soft Launch / Fix Bugs
• Launch / Fix Bugs

15. CONTACT
mike@storycode.org
www.storycode.org
@storycodeorg
mark@desperatecomfort.com
www.desperatecomfort.com
@MegaMarkHarris