WEEK!5:!Sequen,al!Design! - Simon Fraser Universitycgibsonb/weekly slides/IAT100 Week 5 .pdf · plot elements at play ! ... beOer!suityour!interests!(think!of!all!the!versions!of!Romeo!and!

WEEK 5: Sequen,al Design IAT100 – Digital Image Design Fall 2013 Chantal Gibson

Today’s Agenda •  Project 1 grading process •  iClicker quiz •  Project 2 •  Narra,ve Structure •  Sequen,al Transi,ons

ScoO McCloud on Comics, Sequencing & the Web

View “Scott McCloud on comics” on TED: Ideas worth sharing. http://www.ted.com/talks/scott_mccloud_on_comics.html

Icons and Symbols

Notice how the slow and heavy drip represents time here.

Closure

The act of observing the parts but perceiving the whole.

The guOer (where the magic happens)

The space between comic frames

Subject-‐to-‐Subject

Focus – Who or what it happens to ¤  Same scene, different subject ¤  Guides viewer to consider the various

plot elements at play ¤  Reader involved – must relate the two

images ¤  Can strongly enable closure

Scene-‐to-‐Scene

Place / Time –  Transports viewer in ,me –  Expansive – Creates a sense of space

–  OZen between short narra,ve sequences

**Careful use of scene-‐to-‐scene transi,ons may allow for

you to cut down on number of frames

Aspect-‐to-‐Aspect

Same ,me, different Point-‐of-‐View –  Different aspects of a place,

idea or mood –  Shows Personal Perspec,ve –  Different Angles on the same

scene ** unlike first four transi4ons doesn’t

advance 4me

Construc,ng a Graphic Narra,ve

Assignment 2 Highlights Type: Sequen,al Web Narra,ve (Graphic Story) Title: Composing Through Time—Life Before Video, Making the Old New Theme: Adap,ng an exis,ng wriOen text into a visual narra,ve. Format: Web: 3-‐5 html pages. Images: photographic. WriOen: Short write up. Submission: On-‐line, uploaded to your SFU webspace. Link & WriOen submiOed to WebCT. Teams: Project may be Individual or teams of 2 (same lab only). Team Contract: Due in Lab Week 6—emailed to the class this morning! Due: Week 8, presented and cri,qued in class

Assignment 2 •  Assignment Theme: Web Adapta4on •  Your graphic short story will be based on an exis,ng wriOen piece of

literature— song lyrics from the 60s and 70s •  You will adjust the way the original text tells the story to adapt if to

this graphic narra4ve style; for example, think of the difference between a novel and how it is adapted for a movie.

•  You may adapt a story's parameters (such as sekng or culture) to

beOer suit your interests (think of all the versions of Romeo and Juliet).

Narra,ve •  Iden,fiable Beginnings, Middles, Endings

–  Freytag’s Pyramid: Exposi,on > Complica,on > Climax > Resolu,on > Denouement

•  Strong focus on Time/Temporality –  Reten,on of the past, aOen,on to present ac,on,

and future an,cipa,on

•  Focus on Characters •  Narra,on or Implied Author

Project 2: Sequen,al Web Narra,ve •  Web Adapta,on of a selected song lyric.

–  Popular works from the 60s and 70s (Western culture) –  Before your ,me-‐-‐Make something old completely new –  Save you ,me on research/more ,me to build story –  Shared context with classmates and teaching team

•  VigneOe – a Short Illumina,ng Scene –  Narra,ve

•  Beginning middle and end •  Moves across ,me and space

–  Web Comic Adapta,on •  Reduce textual informa,on •  Increase visual informa,on

Boy Named Sue (1969): lyrics analysis full arc

Hotel California (1976): lyrics analysis full arc

Your Process: Web as Medium for Narra,ve •  Researching/Wri4ng

–  Select a poem or Song lyric from list –  Map out character, sekng, plot, ac,on

•  Photography –  Form and Content –  Composi,onal Elements –  Sequen,al Design

•  Storyboarding –  Planning shots –  Sequences –  Frames –  Panel shape/size –  Text

•  Browser Interface

–  Browser Window –  Scrolling –  Back / Forward –  Clicking –  Interac,on

Project 2: Sequen,al Web Narra,ve •  What is the story? Purpose? •  Where does it start? End? •  What is the climax? •  Who is telling the story? •  Why is the story being told? •  Who are the characters and what

do they represent?

•  What is the viewer’s experience? •  How does the viewer move

through or navigate the story? •  What is the role of the viewer as

story teller? •  Does the viewer have agency? •  How is the story told?

–  What parts of the story are told? –  What parts are leZ to the viewer?

Project 2 – Thinking about Topics

•  Do not use a story outside of the list •  Do not glorify violence or abuse towards

anyone or group (bullying, racism, homophobia, sexism, etc.)

Avoid Cliches •  No Overt Life Lessons

–  Don’t drink/text and drive –  Don’t commit suicide/gamble/do drugs

•  No School Exam/Class/Project stories –  Late for exam –  Showed up a day early –  Skipped studying and par,ed instead

•  No woke-‐up-‐and-‐it-‐was-‐all-‐a-‐dream-‐stories

•  Be crea,ve. Read. Think. –  Provide a contemporary version of the

poem or song –  Put your genera,onal, cultural,

technological lens on the work –  Use the images, icons & symbols as

tools for storytelling (ie: gun, drugs, etc.)

–  Consider the ,mes the works were wriOen in the West

•  Vietnam War •  Civil Rights in the US •  Women’s Rights •  Genera,onal divide

What has or hasn’t changed?

Transi,ons

The GuOer •  What happens outside the frame? •  What happens between the frames? •  Meaning in Transi,ons •  Variety in Perspec,ve •  Where the viewer’s imagina4on takes over •  Where the principle of closure allows us to construct a unified reality

Icons and Symbols

Establishing & Recalling Icons

Moment-‐to-‐Moment

Time ¤  Consistent subject with small changes ¤  Small changes create center of interest ¤  Creates movie-‐like mo,on ¤  Requires liOle closure

Moment-‐to-‐Moment

Same subject, same frame… small changes from moment to moment

Ac,on-‐to-‐Ac,on

Event – How it happens ¤  Single-‐subject progression ¤  Advances the plot ¤  Pace is brisk

Ac,on-‐to-‐Ac,on

Whaam! by Roy Lichtenstein, 1963.


Focus – Who or what it happens to ¤  Guides viewer to consider the various

plot elements at play ¤  Reader involved – must relate the two

images ¤  Can strongly enable closure



Same scene, the same idea, but different subjects—first the mean guy with the bat, and then the other miserable guy. **Notice frame within a frame construction.

Scene-‐to-‐Scene

Place / Time ¤  Transports viewer ¤  Expansive – Creates a sense of

space ¤  OZen between short narra,ve

sequences

**Careful use of scene-‐to-‐scene transi,ons may

allow for you to cut down on number of frames

We move across Space and time


Point of View ¤  Different aspects of a place, idea

or mood ¤  Shows Personal Perspec,ve ¤  Different Angles on the same

scene ** unlike first four transi,ons doesn’t

advance ,me


Same place/location different points of view.


Non-‐Sequitur

No Logical Rela4onship ¤  Different Angles on the same

scene ¤  Comic or gag effect ¤  Poe,c effect ¤  Ambient effect

•  Emphasizing the whimsical, or nonsensical

•  Viewer sees disparate images as part of a larger whole

Non-‐Sequitur

Igort: Baobab and more 19. set. 2008

McCloud argues, we search for meaning and we find it-‐-‐ in the guOer. Even if it doesn’t make sense in the tradi,onal way, some sort of rela,onship develops.

TRANSITIONS = STORY TYPES Transi,ons that help clarify the nature of an ac,on, idea or mood:

–  Ac4on –  Subject –  Scene

Suitable for goal driven or narra,ves that are of interest on the strength of content.

TRANSITIONS = STORY TYPES Transi,ons that add POV:

–  Moment-‐to-‐moment –  Aspect-‐to-‐aspect

Suitable for nuanced or emo,onally driven plots or concepts. Interest is produced by how the story is told.

**You may use different transi,on types at different

points in narra,ve.

How to select Transi,on Types In order of importance

1.  Emo,on: reveals just the right thing to move the story forward

2.  Story: advances the narra,ve but asks “could this have been leZ out?”

3.  Rhythm: created by transi,oning and spacing at the right moment (expressing ,me, building interest)

4.  Eye-‐trace (composi,on across panels): understands the eye’s journey from panel to panel

It’s not what you show, but what you don’t..

visual storytelling is as SUBTRACTIVE an art as it is ADDITIVE

Contact –  Chantal Gibson –  [email protected] –  ALWAYS Include IAT100 and your lab sec,on number in the subject

line of all emails to me or your TA. (Example – Subject: IAT100 E106 –

– Office Hours –  When: Tuesday (9:00am-‐12:00pm (or by appointment) –  Where: My office, Pod 2, 2808

Widescreen Test PaOern (16:9)

Aspect Ratio Test

(Should appear

circular)

16x9

4x3

WEEK!5:!Sequen,al!Design! - Simon Fraser Universitycgibsonb/weekly slides/IAT100 Week 5 .pdf · plot elements at play ! ... beOer!suityour!interests!(think!of!all!the!versions!of!Romeo!and!

Documents