53
SKETCHING MED VIDEO Hvorfor sketching? Video sketching som metode Quick start med Premiere Pro Peter Vistisen mandag den 16. september 13

U-CrAc - Video sketching

Embed Size (px)

Citation preview

Page 1: U-CrAc - Video sketching

SKETCHINGMED VIDEOHvorfor sketching?

Video sketching som metode

Quick start med Premiere Pro

Peter Vistisenmandag den 16. september 13

Page 2: U-CrAc - Video sketching

mandag den 16. september 13

Page 3: U-CrAc - Video sketching

Fra viden mod indsigtNu skal der ideer på bordet

...hvordan når vi fra data om hvad der er, til ideer om hvad der kunne være?

mandag den 16. september 13

Page 4: U-CrAc - Video sketching

Design som oversættelseBetydning af design som begreb for betydning

“A designer begins to act as a translator. Both visualizing ideas as they are developed and refined and also translating vague descriptions, gestures, or references to new ideas, into more actionable concrete representations that can be explored further (...) “

Jon Kolko (2011)

mandag den 16. september 13

Page 5: U-CrAc - Video sketching

Design som oversættelseBetydning af design som begreb for betydning

“ (...) The medium that a designer manipulates is human behavior and experience, and the material is the digital fabric: bits, bytes, pixel and processors.

Jon Kolko (2011)

mandag den 16. september 13

Page 6: U-CrAc - Video sketching

Den svære balance

“Design is compromise.”

Fra Buxton’s “Sketching User Experiences” (2007)

formerfunktionerstilarterproblemerløsningerinteressenterfaglige rationaler

mellem

mandag den 16. september 13

Page 7: U-CrAc - Video sketching

Udfordringen qua BuxtonDet svære ved at arbejde reflekteret med designsyntese

Getting the right design......and getting the design right

mandag den 16. september 13

Page 8: U-CrAc - Video sketching

Udfordringen qua BuxtonDet svære ved at arbejde reflekteret med designsyntese

Getting the right design......and getting the design right

løser vi det rigtige problem?

løser vi problemet hensigtsmæssigt?

mandag den 16. september 13

Page 9: U-CrAc - Video sketching

The Fuzzy Front end

Frit efter Damien Newman 2009

Usikkerhed / Patterns / Indsigter Klarhed / Fokus

Research Koncept Prototype Design

mandag den 16. september 13

Page 10: U-CrAc - Video sketching

...designerens vigtigste redskab Sketching

mandag den 16. september 13

Page 11: U-CrAc - Video sketching

At optage ideerSketching resulterer i sketches som resulterer i nye ideer

“Sketching is the premission to experiment” Tom Kelly - fra IDEO’s TEDx Talk

Vi kan hurtigere og klarere forstå visuelt end symbolskt og derfor skal vi bruge skitsering til optage vores ideer løbende for at undgå at blive fanget af én idé.

mandag den 16. september 13

Page 12: U-CrAc - Video sketching

Figure 52: The Sketch to Prototype Continuum

The difference between the two is as much a contrast of purpose, or intent,

as it is a contrast in form. The arrows emphasize that this is a continuum,

not an either/or proposition.

mandag den 16. september 13

Page 13: U-CrAc - Video sketching

Figure 51: The Dynamics of the Design Funnel

The design funnel begins with ideation, and ends with usability testing. The

former is largely dominated by sketching, which enables ideas to be explored

quickly and cheaply. More refined (and expensive) prototypes provide the ba-

sis for the testing at the later stages of design. Where testing is a key concern,

the most dominant artifacts are more refined (and expensive) prototypes.

The transition from one to the other is represented by the transition from

orange to yellow in the figure. As we progress, our overall investment in the

process grows. This is indicated by the rising arrow and the y-axis label on

the left. The y-axis label on the right side of the figure emphasizes that as

our investment increases, so should the weight of the criteria that we use

to evaluate our design decisions. In other words, you don’t manage ideation

the same way, or with the same rigor, as usability. Finally, the circular arrows

are a reminder that we include users throughout the iterative process, not

just during usability testing.

Bill Buxton (2007)

mandag den 16. september 13

Page 14: U-CrAc - Video sketching

Refleksion i handlenSketching hænger sammen med Schön’s epistemologi

Mind Sketch

Create

Read

teori

erfaring

sund fornuft

intuition

storyboards

mock-ups

prototyper

ideer

wireframes

mandag den 16. september 13

Page 15: U-CrAc - Video sketching

mandag den 16. september 13

Page 16: U-CrAc - Video sketching

Well... så er alt fryd og gammen right?

mandag den 16. september 13

Page 17: U-CrAc - Video sketching

Problemet med skitserGode til meget - men ikke så dynamiske

“The experience is so much in the transition”

Vi skal designe og være opmærksomme på transitions før detaljerne for de enkelte states - med andre ord skal tiden designes før detaljerne.

Buxton 2006

mandag den 16. september 13

Page 19: U-CrAc - Video sketching

Hvad mangler vi?

mandag den 16. september 13

Page 20: U-CrAc - Video sketching

Understandingthe users

...im a cat person

Brugeren er sjældent bare én person, men

et netværk af interessenter, med forskellige

indgangsvinkler og dermed forskellige

interaktioner med produktet/servicen.

Cooper (2003) kalder det ‘Elastic Users’

Hvad med brug over tid

mandag den 16. september 13

Page 21: U-CrAc - Video sketching

...hvad og hvordan?Vi mangler et niveau til at forstå brugssituationen!

“Interaction design is design of the acts that define intended use of things.”

Hallnäs, L. and Redström, J. 2006

...Apple prøvede at bruge video til dette formålmandag den 16. september 13

Page 22: U-CrAc - Video sketching

VisionsskitsenEt værktøj fra ‘den virkelige’ verden

mandag den 16. september 13

Page 23: U-CrAc - Video sketching

Et værktøj fra ‘den virkelige’ verdenVisionsskitsen

mandag den 16. september 13

Page 24: U-CrAc - Video sketching

Problemet med skitserGode til meget - men ikke så dynamiske

“The experience is so much in the transition”

Vi skal designe og være opmærksomme på transitions før detaljerne for de enkelte states - med andre ord skal tiden designes før detaljerne.

Buxton 2006

mandag den 16. september 13

Page 25: U-CrAc - Video sketching

...men holder illusionen?

mandag den 16. september 13

Page 26: U-CrAc - Video sketching

Wizard of Oz’ingmandag den 16. september 13

Page 27: U-CrAc - Video sketching

mandag den 16. september 13

Page 28: U-CrAc - Video sketching

“Up to the point where Toto tipped over the screen and revealed the Wizard to be a fraud, all of Dorothy’s reactions were valid psychologically, anthropologically, and sociologically. To her the Wizard was real, and therefore so were all her experiences.”

Bill Buxton (2007)

mandag den 16. september 13

Page 29: U-CrAc - Video sketching

Oplevelsen

mandag den 16. september 13

Page 30: U-CrAc - Video sketching

Oplevelsen

242

Figure 81: The Wizard’s Listening Typewriter

A perfectly functional listening typewriter is implemented simply by

having a fast typist, hidden behind the screen, who would enter the

text captured from the microphone.

The wizard of airline tickets

mandag den 16. september 13

Page 31: U-CrAc - Video sketching

Det er meget lettere, meget billigere og ikke mindst meget hurtigere at !nde en lille gammel mand, en mikrofon og nogle højtalere, end det er at !nde en rigtig troldmand.

Og sådan er det også med de "este systemer - fake it till you make it!

Peter Vistisen

Get real scarface!

STFU!

mandag den 16. september 13

Page 32: U-CrAc - Video sketching

It is !delity of the experience, not the !delity of the prototype, sketch, or technology that is important from the perspective of ideation and early design.”

Bill Buxton (2007)

“The only way to engineer the future tomorrow is to have lived in it yesterday (...)

mandag den 16. september 13

Page 33: U-CrAc - Video sketching

How does it fit togetherVi skal bruge metoderne til at koble to domæner

...via sketching teknikker

Technology push User needs /Potential marked

mandag den 16. september 13

Page 34: U-CrAc - Video sketching

How does it fit together

Technology push User needs /Potential marked

sweetspot

Vi skal bruge metoderne til at koble to domæner

mandag den 16. september 13

Page 35: U-CrAc - Video sketching

Fra LowFi til HiFiFakter og gestikOrd og sætningerTavletegninerPapirskitserMixed modalityMock-upsWireframesSlidewaresVideoskitserHi-fi prototypeKodet iteration

Low-fidelity

High-fidelity

Videoskitser

mandag den 16. september 13

Page 36: U-CrAc - Video sketching

Fra LowFi til HiFiFakter og gestikOrd og sætningerTavletegninerPapirskitserMixed modalityMock-upsWireframesSlidewares

Hi-fi prototypeKodet iteration

Low-fidelity

High-fidelity

Videoskitser

mandag den 16. september 13

Page 37: U-CrAc - Video sketching

Fra 1D til 4D skitserI U-CrAc vandrer vi frem og tilbage i skitseringsniveauer

mandag den 16. september 13

Page 38: U-CrAc - Video sketching

VideoskitseringVisualisering via videoen som designmateriale

Quick n’ Dirty

Visualiserer konceptet over tid

Undgår ‘death by bullet points’

Får sagt mere - på kortere tid!

som her ;)

mandag den 16. september 13

Page 39: U-CrAc - Video sketching

Hvilke værktøjer?

I need a tool..!!!!

mandag den 16. september 13

Page 40: U-CrAc - Video sketching

En jack of all trades til videoskitsering Skitsering i Premiere

mandag den 16. september 13

Page 41: U-CrAc - Video sketching

SkitseringsprincipperFra stop motion til green screen effekter

Multi layer video

Animation / stopmotion

Green Screen

...og god gammeldags skuespil!mandag den 16. september 13

Page 42: U-CrAc - Video sketching

Stop Motion videoKlassisk animation

mandag den 16. september 13

Page 43: U-CrAc - Video sketching

Video LayersVi sætter videoer og animationer sammen

mandag den 16. september 13

Page 44: U-CrAc - Video sketching

Green screen videoVi fjerner det grønne og indsætter det fede

mandag den 16. september 13

Page 45: U-CrAc - Video sketching

Det lyder joskide svært!

mandag den 16. september 13

Page 46: U-CrAc - Video sketching

Visionen for denne uge

...arbejd i rå skitser der kan smides ud

...lav mindst tre forskellige skitser

...påbegynd arbejdet med web-sitet

...med andre ord hvad vi håber i gør

dvs. jeres produkt!

mandag den 16. september 13

Page 47: U-CrAc - Video sketching

Lyd i jeres videoerEt par kilder til (næsten) gratis lyd og musik

http://freemusicarchive.org/

http://www.partnersinrhyme.com/pir/ free_music_loops.shtml

http://incompetech.com/m/c/royalty-free/

mandag den 16. september 13

Page 48: U-CrAc - Video sketching

Søg hjælp!...nettet er fyldt med how-to’s, do this’ & walkthroughs

http://tv.adobe.com/show/learn-premiere-pro-cs6/

http://www.lynda.com/Premiere-Pro-tutorials/

http://www.iclari!ed.com/entry/index.php?enid=2984

Adobes E-læring

Lynda.com E-learning ($)

Green Screens i iMovie

SørenClaus (post burning man)

Peter

mandag den 16. september 13

Page 49: U-CrAc - Video sketching

HUSK!Det handler ikke om flot grafik

Få testet mange rå, fremfor få HQ

Kombiner teknikker til nye udtryk

Gem jeres rå-skitser til procesvideo

mandag den 16. september 13

Page 50: U-CrAc - Video sketching

Case for vores skitseOptimering af nødkaldet til ældreplejen

Problem: Miskommunikation mellem plejere

Løsningsidé: En bærbar alarm m. automatisk sync

Scenarie: Gamle Søren falder i sin lejlighed

mandag den 16. september 13

Page 51: U-CrAc - Video sketching

RekvisitterPap, papir og grønne skærme

mandag den 16. september 13

Page 52: U-CrAc - Video sketching

ReframingMåske problemet faktisk er tryghed hos den ældre?

Problem: Tryghed ved ulykker i hjemme hos ældre

Løsningsidé: En bærbar alarm m. videolink

Scenarie: Gamle Søren falder i sin lejlighed

mandag den 16. september 13

Page 53: U-CrAc - Video sketching

Rock on!...you must

mandag den 16. september 13