Info + Web Tech Course
Digital Media
Production
Anselm Spoerri PhD (MIT)
SC&I @ Rutgers University
aspoerri@rutgers.edu
anselm.spoerri@gmail.com
Digital Media Production
© Anselm Spoerri
Lecture 1 - Overview
Course Overview
‒
‒
‒
‒
Course Goals | Learning Objectives
In a Nutshell
Your Guide
Gameplan
Multimedia Story Design
‒
‒
‒
Types of Stories
Steps of Developing Digital Story
Knight Digital Media Center
‒
‒
Trends & How To
Examples and Resources
Lectures – Week 1 Content
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Lectures.html#week1
Digital Media Production
© Anselm Spoerri
Course Goals
1. Plan + Develop Digital Multimedia Story
2. Design + Construct Website
that uses standard compliant XHTML, HTML5 and CSS.
3. Apply Video Editing Principles
to produce concise video pieces.
4. Apply Animation Design Principles
to create interactive animations.
Digital Media Production
© Anselm Spoerri
Learning Objectives
1. Plan + Develop Multimedia Story
that is well researched.
2. Capture Photo & Video Footage
that is visually engaging
3. Create Storyboard
of video story to be produced.
4. Create + Upload XHTML Web pages
standards compliant and contain relative and absolute links,
tables, images and embedded video
5. Design external Cascading Style Sheets
control the layout and visual appearance of Web pages.
Digital Media Production
© Anselm Spoerri
Learning Objectives
6. Understand Basics of JavaScript
to create interactive slideshow with concise captions.
7. Edit Video Footage using Premiere Elements
to produce well structured video in post-production.
8. Create Animation using Flash
presents information in a well timed and interactive way.
Digital Media Production
© Anselm Spoerri
Individual Exercises
Exercise 1: Web Design – Present Story Outline for
major multimedia project.
Due Week 4 | Rev Week 7
Exercise 2: Photography – Create Photo Essay using
JavaScript.
Due Week 6 | Rev Week 9
Exercise 3: Web Design – Develop Website with
Storyboard for video.
Due Week 8 | Rev Week 11
Exercise 4: Video – Capture & Edit Video using good
camerawork and editing techniques.
Due Week 10 | Rev Week 13
Exercise 5: Animation – Design Animation using Flash
to communicate key facts or concepts.
Due Week 12 | Rev Week 14
Digital Media Production
© Anselm Spoerri
Term Project and Discussions
Term Project: Digital Multimedia Story – Create
Website using XHTML, CSS, JavaScript that contains
interactive Slideshow, Video and Animation.
Due Week 15
Discussions – Three Graded Discussions
‒
Topic 1: Identify Key Elements of Engaging Multimedia Story – Week 2
‒
Topic 2: Analyze Video – Week 7
‒
Topic 3: Analyze Animation – Week 11
‒
Students provide constructive feedback for exercises
Digital Media Production
© Anselm Spoerri
In a nutshell
Master
Digital Media Production Mechanics
Create Something of Meaning
 Able to Create
Web pages | Image Slideshows | Video | Animations
Analyze  Emulate  Create
 Able to Code & Troubleshoot
Copy  Paste  Understand  Customize
Digital Media Production
© Anselm Spoerri
Your Guide
Anselm Spoerri
–
–
–
–
–
Computer Vision
Filmmaker – IMAGO
Information Visualization – searchCrystal
Media Sharing – Souvenir
Rutgers Website
Teaching
– Information Technology | Web Design
– Multimedia Production – student highlights
– Information Visualization - whereRU
Digital Media Production
© Anselm Spoerri
Gameplan
Course Website
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Home.html
‒ Schedule
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Schedule.html
– Lectures
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Lectures.html
– Narrated Lectures | Handout | Video Demos | Step-by-Step files
‒ Requirements
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Requirements.html
‒ Exercises
http://comminfo.rutgers.edu/~aspoerri/Teaching/DMPOnline/Exercises.html
Digital Media Production
© Anselm Spoerri
Gameplan
Course Content
MCIS 507 – Digital Media Production
and will incorporate customized content from
– MLIS 550 – Info Tech + Web Design
– MLIS 555 – Multimedia Production
LyndaCampus
Adobe TV
https://lynda.comminfo.rutgers.edu/Login
http://tv.adobe.com/
Web Resources
Digital Media Production
© Anselm Spoerri
Gameplan
Communication
− Online Discussions – use eCollege.
− Virtual Office – use Discussion board in eCollege to create
communal resource.
− Virtual Meeting – chat, voice conferencing and screen /
application sharing service.
− Virtual Help – use Skype or Adobe Connect service.
− Email
Digital Media Production
© Anselm Spoerri
Gameplan
Hardware
− Digital Camera to capture photos and videos.
− Headset with built-in microphone.
Software
− Web Editing: NotePad++ (Win; free); TextWrangler (Mac, free).
− File Transfer: Filezilla (Win / Mac; free).
− Image Editing: Pixlr (Win / Mac; free); Photoshop Elements
(Win / Mac; $120).
− Audio Editing: Audacity (Win / Mac; free).
− Video Editing: Premiere Elements (Win / Mac; $120).
− Animation: Flash (Win / Mac; accessible for free via
SoftwareAnywhere@SC&I).
Digital Media Production
© Anselm Spoerri
Multimedia Story Design - Overview
Multimedia Story Design
Source: Digital Storytelling Cookbook by Joe Lampert
‒
Story is learning, celebrating, healing, and remembering.
‒
Most have little voice, an editor, telling us that what we
have to say is not entertaining or substantial enough.
‒
Start with a small idea to overcome creative block.
‒
Describe “picture-by-picture” to create story elements.
Observe the patterns of words used.
‒
Combine “Analytical” with “Emotive”
‒
Interview / Self-Interview process can help to develop story.
Digital Media Production
© Anselm Spoerri
Multimedia Story Design – Types of Stories
Someone Important
‒
Character Stories: how we love, are inspired by, want to recognize,
and find meaning in our relationships.
‒
Memorial Stories: honoring and remembering people who have
passed is an essential part of the grieving process.
Event in My Life
‒
Adventure Stories: we travel to break away from the normalcy of
our lives and to create new vivid memories. Before trip, create a story
outline of what kinds of images, video, or sounds useful for story.
‒
Accomplishment Stories: about achieving a goal and easily fit into
the desire–struggle–realization structure of a classic story.
Place in My Life
‒
Your insights into place give us insight about your sense of values
and connection to community.
What I Do
‒
Jobs help to give some sense of identity, people also refer to their
hobbies or social-commitments when thinking about who they are.
Digital Media Production
© Anselm Spoerri
Multimedia Story Design – Types of Stories
Recovery
‒
Sharing the experience of overcoming a great challenge in life is a
fundamental archetype in human story making: descent-crisisrealization pattern.
Love
‒
Romance, partnership, familial or fraternal love all naturally lend
themselves to the desire-struggle-realization formula.
Discovery
‒
Process of learning is a rich field to mine for stories, illustrating how
we uncovered the facts to get at a truth or insight.
Good Story often comes from looking at the familiar in a
new way and with a new meaning.
Stories ask us to reveal things about ourselves that make
us feel vulnerable.
Digital Media Production
© Anselm Spoerri
Steps of Developing Digital Story
Help storytellers fully visualize their story before they begin to write script.
Identify the moment of change in their story.
1. Owning Your Insights
What it’s really about: the storyteller, as the person who lived
through the story. How does this story show who you are?
Change came to you or you went towards change archetype of symbolic journey of self-understanding.
2. Owning Your Emotions
Become aware of the emotional resonance of story.
Sharing your story (idea), what emotions did you experience?
Become aware of contrasting and complex feelings and
express without relying in clichés or using “feeling” words.
Knowing your intended audience shapes emotional
content of your story.
Digital Media Production
© Anselm Spoerri
Steps of Developing Digital Story
3. Finding The Moment
Identify moment that you can use to illustrate your insight.
Once this moment of change is identified, you need to
determine how it will be used to shape the story.
If you can paint the audience a portrait of both you, and
your experience of moment of change, then you are
creating a scene.
Digital Media Production
© Anselm Spoerri
Steps of Developing Digital Story
4. Seeing Your Story
Describe images when recalling moment of change.
Why this image? What is it conveying to you?
Is the meaning explicit or implicit?
Literal or direct images are used to illustrate a story.
Implicit image have multiple layers of meaning.
Two common techniques to convey meaning through the use
of implicit imagery are visual metaphor and juxtaposition.
Well-chosen images mediate between story and audience.
5. Hearing Your Story
Sound is one of the best ways to convey emotional tone
through how voice-over is performed and ambient sound +
music work with story.
Is ambient sound or music enhancing the story, or not?
Music can alter our perception of visual information.
The more spoken voice is inserted into the written script, the
more you will pull audience into story.
Digital Media Production
© Anselm Spoerri
Steps of Developing Digital Story
6. Assembling Your Story
How are you structuring the story?
How are layers of visual + audio narratives working together?
At what point will moment of change appear?
What are the necessary parts of my story?
Determine how much to tell audience and at what point.
Don’t give away too much information all at once.
Once basic structure in place, the next step is scripting and
storyboarding: laying out how visual and audio narratives
will complement each other to best tell the story.
If an image conveys my meaning better than words can, how
can I use my words to tell another aspect of the scene?
Closure: audience understands pieces as single idea.
How does the pacing contribute to the story’s meaning?
Fast pace, quick edits + upbeat music can convey urgency.
Slow pace with gradual transitions and extended shots may
convey calmness.
Digital Media Production
© Anselm Spoerri
Steps of Developing Digital Story
7. Sharing Your Story
Who is your audience?
What was your purpose in creating the story?
Contextualizing: if you know who the audience will be and
what they know about you, then it will help determine how
much context to provide about the story.
You may choose to provide contextual information outside or
inside of the story.
If you know presentation setting, this will help you
determine what kind of contextualizing materials to provide.
Digital Storytelling Cookbook:
Approaches to Scripting and Storyboarding
Digital Media Production
© Anselm Spoerri
Digital Media Production – Further Required Readings
Knight Digital Media Center
•
Transition to Digital Journalism
•
What is a Multimedia Story?
•
Assembling Your Story?
•
Picking Right Media for Story
Covers major digital tools and trends that are disrupting
news industry and changing the way journalists work.
Best multimedia stories are multi-dimensional.
Go into field to report the story face-to-face with sources.
Gather as much information as possible in rough storyboard outline of the story that lays out the multimedia possibilities.
Describes different elements that can go into a multimedia
story and steps and stages needed to pull it together.
Understand strengths and weaknesses of video, images,
audio, text and data and types of stories lend themselves.
Digital Media Production
© Anselm Spoerri
Digital Media Production – Digital Multimedia Story
Examples
•
Spilling Over created by students at School of Journalism and Mass
Communication University of North Carolina at Chapel Hill.
•
What is the True Cost of Gasoline? an animated feature created by the
Center for Investigative Reporting.
•
The Reckoning: New York Times journalists use digital media to present
stories and information about Sept. 11 on the 10-year anniversary.
Resources
•
News21
•
Knight Digital Media Center
•
NY Times Multimedia
•
Economist Multimedia
Digital Media Production
© Anselm Spoerri