Digital mediedesign nr 2

Digital Visuell kommunikasjon i digitale medier, nr.2 Juni 2012

Horisontale sider er noe som igjen har blitt trendy, og på grunn av vår økende bruk av mobile enheter og nettbrett er det et mer funksjonelt design enn noen gang.

Mona S. 22

Fokuset legges på formalestetiske virkemidler via ny webteknologi som CSS3 og tagger for innholdsstruktur via HTML5.

Jørn Terje s. 20

Å designe noe personlig er en utfordring. Jeg ville ha et upretensiøst og ”håndlaget” design.

Ragnhild s. 18

1

Vårsemesteret i Digital mediedesign har vært veldig lærerikt. I Digital video og animasjon har jeg lært om produksjon av film og redigering.

Janne s. 4

Les mer w

Jeg heter Erling Nesse og kommer fra Tysvær utenfor Haugesund. Utdanningen min har jeg fra Høgskolen i Telemark, Notodden; faglærerutdanning, og Master i Formgiving, Kunst og håndverk.

Etter å ha jobbet noen år som lærer i videregående skole tok jeg Digital mediedesign ved samme høgskole. Jobber nå ved Etne videregående skole i Sunnhordaland hvor jeg er kontaktlærer for vg2 Interiør og utstillingsdesign og faglærer på Media og kommunikasjon.

viser i design og handverksfag, og leikar med design og handverksfaget både i og utanom arbeidstida. PåGløtt er eit lite eksperiment - og ein stor leikeplass”

Liker veldig godt faget mitt og leker med formgiving både i og utenfor arbeistida.

Bildet på coveret er fra min prosjektoppgave i Digital bildebehandling, 2010 der jeg jobbet med problemstillingen: På hvilke måter kan arbeid med lyssetting av objekter under fotografering nyttes slik at skygge og refleksjon blir bærende elementer i komposisjon?

Som et motivasjonstiltak for å jobbe mer med eget kreativt skapende arbeid startet jeg i 2009 PåGløtt sammen med en tidligere medstudent i Notodden og nåværende kollega.

Beskrivelse av PåGløtt fra bloggen: ”ME i PåGløtt består av M og E, vener og kollegaer i vidaregåande skule. ME under-

Mediekompetanse i vår tid Media er det mektigste kulturelle fenomenet i vår tid. Vi er daglige konsumenter av en eller annen form for medier.

Media i denne sammenhengen referer til budskap overført til alle former for elektroniske- og trykte medier og kunstneriske uttrykk.

Medier gir oss tilgang til informasjon og kunnskap og samtidig er med å forme våre holdninger og verdier.

Blogg: http://paaglott.blogspot.com/

Design og layout: Morteza Amari Forsidebilde: Erling Nesse

ulike type medier. Dette magasinet er spesielt for vårsemesteret 2012 som fokuserte på film- og webmediet; «Digital video og animasjon (15 studiepoeng) og Webog informasjonsdesign (15 studieDannelse i vår tid vil blant annet poeng)». være å bli kloke konsumenter av medier og å bli kloke deltakere i Morteza Amari, klasseleder demokratiet i et mediesamfunn.

Mediekompetanse opparbeider ferdigheter i kritisk tenkning som kreves i å ta beslutninger i ulike oppgaver i samfunnet. Det innebærer også evnen til å finne, analysere, evaluere og formidle kunnskap og informasjon i medier.

Kunnskap om medieproduksjon og distribusjon, samt kunnskap om mediets makt og påvirkning er viktige for å mestre oppgaver i et mediesamfunn.

Produksjon og konsumering av media gir oss flotte muligheter med hensyn til kunnskapsformidling og tilgang til informasjon, men den enorme og mektige kraften in- Studiet Digital mediedesign har nebærer også en del utfordringer. som mål å fremme kompetanse i

2

Innhold: Janne Marete Grødum

Camilla Steinmoen

Marianne Frisvold

4

6

8

Gro Ayla Lillesund

Yngve Hegreberg

Hilde Kristin Hømann

10

12

14

Ragnhild Løvli

Jørn Terje Hømann

Mona Gullbekk Hansen

18

20

22

Atle Auran

Stian Abrahamsen

FILMSKAPER: Jarle Leirpoll

24

26

28

3

Animasjon

Digital mediedesign

Janne Marete Grødum Nettstudent på Digital mediedesign, Høgskolen i Telemark.

Jobber som lærer i barneskolen. Medarbeider i profileringsfirmaet Mikanor.

Nett mittdigitalegalleri.blogspot.com Tekst, foto og layout av Janne Marete Grødum

Vårsemesteret i Digital mediedesign har vært veldig lærerikt. I Digital video og animasjon har jeg lært om produksjon av film og redigering. Vi har hatt kortfilmoppgaver med levende film og ved bruk av animasjon. I prosjektoppgaven min valgte jeg å lage en animasjonfilm av silhuettfigurer.

Gutten vandrer av sted og møter flere utfordringer på veien.

Figurene i filmen ble først tegnet i tegneprogrammet Illustrator. Tegningene ble skrevet ut og brukt som mal når jeg klippet ut figurene i tynn kartong. Alle figurene er laget med bevegelige ledd, som en sprellemann, slik at de får naturlige bevegelser i filmen. Det mest givende med animasjonsoppgaven var å utvikle egne karakterer og så få de til å leve på filmen.

Jeg ble inspirert av andre animasjonsfilmer som jeg fant på nettet. Jeg ønsket å bruke cut-out animasjonsteknikk, da dette er en enkel form for animasjon og en fin måte å jobbe med animasjon i skolen. Idèen min var å lage en silhuett animasjon med svarte pappfigurer på et lysbord. Jeg brukte mitt vanlige speilreflekskamera og tok bilde for bilde etter hvert som jeg flyttet på figurene. Dette kalles stop-motion teknikk. Bildene ble så spilt av som en film med 24 bilder i sekunder i programmet Photoshop. Videre redigerte jeg effekter og lyd på filmen i Premiere. Det ble til slutt 2326 bilder og en film på litt over 2 minutter.

På Digital video og animasjon har jeg lært utrolig mye om animasjonsteknikker og fått utviklet min kunnskap innen film og redigering. Det har vært mange spennende og kreative oppgaver.

Vil du se hele filmen min kan du se den på YouTube: Silhouette Animation - Short Film by Janne Marete Grødum.

Eller du kan besøke bloggen min: mittdigitalegalleri.blogspot.com Her viser jeg også flere av oppgavene mine som student på Digital mediedesign.

I prosjektoppgaven var det å skrive manus og synopsis óg en viktig del. Storyboard ble også tegnet og var til stor hjelp under opptakene. Historien i filmen min handler om en liten gutt som får kjeft hjemme fordi han knuser en vase.

Bildet til venstre viser utstyret som ble brukt i opptaket. Bildet over viser hvordan hovedkarakteren består av flere ledd. Delene ble sydd sammen med tynn tråd, slik at figuren fikk mobile ledd.

4

Digital mediedesign

Bilder fra animasjonsfilmen.

5

Et dykk inn i fremtiden Tekst og design: Camilla Steinmoen

Film og animasjon

Et menneske blir skapt ut av sanden på marka og presentert for en ny og spennende verden.

Godene er mange, men ensomheten er gnagende. Når en kvinne plutselig dukker opp i hagen forandres alt, men ikke slik de hadde tenkt det.

I prosjektoppgaven min valgte jeg å jobbe med animasjonsfilm. Jeg forsøkte meg på en av de tidligere animasjnsteknikkene cut out , som er en 2dimensjonal animasjonsmetode. Med sterk inspirasjon fra Lotte Reniger tegnet jeg skapelseshistorien i tykt papir, malte, dekorerte og skar ut del for del. Alle beveglige deler festet jeg sammen med kitt for å kunne flytte på dem underveis i prosessen. Jeg laget min egen animasjonskasse der jeg fotograferte hver scene i filmen ovenifra med stabilt lys. Dette var et krevende prosjekt! Jeg fotograferte mange tusen bilder til den 7 min lange filmen min, noe som gav meg ny kunnskap og viktige erfaringe.

http:/www. Jordijenta.com

6

Jeg er utdanna innen kunsthåndverk med hovedvekt på hardeplastiske materialer, spesiellt keramikk. Jeg har lenge ønsket å kunne tegne, lage mønster og utforme digitale utrykk. Foto og grafikk er et stort interessefelt hos meg.

Vårt digitale mediesamfunn krever at vi også som formgivere og visuelle aktører utvider horisonten vår. Digital Mediedesign har gitt meg et puff til å utvikle meg på en ny og bredere måte. Den digitale verden er kommet for å bli!

Web og informasjonsdesign I prosjektoppgaven min i Web falt valget raskt på temaet økologisk mat. Jeg kjøpte meg et lite småbruk for flere år tilbake og la det om til økologisk drift. Jeg videre utdannet meg så innen jordbruk for å ha bredere kunnskap rundt foredling og dyrehold. I prosjektet mitt laget jeg en hjemmeside til firmaet på gården der vi har en liten gårdsbutikk og selger økologiske varer. Jeg valgte å lage en veldig ren og enkel webside, der det levende og ekte ved gården kom fram i form av enkel design og appelerende bilder. I tillegg laget jeg en blogg som jeg kaldte tips og triks, her var ideen å dele oppskrifter, kunnskap og informasjon rundt mat, foredling og gårdsdrift. Det var veldig gøy for meg å få jobbe med noe som var mitt eget. Web og informasjonsdesign har lært meg design på en helt ny måte!

7

Tekst, Foto og Layout:

WEB -OG INFORMASJONSDESIGN Vårsemesteret 2012

Modulen for Web - og informasjonsdesign, har vært en krevende men interessant modul. Å dykke dypere inn i kunnskap om informasjonsteknologi og å få et mer bevisst fohold til all den digitale informasjonen vi stadig blir utsatt for i hverdagen har vært givende. Å selv skape webddesign har derimot vært en langt større utfordring teknisk, enn det en tegner og bildeskaper til vanlig utsetter seg for.

Til daglig jobber jeg som lærer ved studiespesialiserende i formgivingsfag ved Hønefoss vgs.

Webdesign er noe som i første omgang ikke er helt relevant i undervisnings - og læreplansammenheng. Derimot har jeg allerede turt og kaste meg inn i noen enkle undervisningsopplegg i Flash.

Jeg tror det er uyre viktig å vedlikeholde og utfordre seg selv i å videreformidle den kunnskapen en tilegner seg ved disse studiene.

I denne avsluttede prosjektoppgaven valgte jeg “å promotere meg selv som kunstner”, og presentere mitt bildeskapende arbeid, som primært dreier seg om tegnearbeid i blyant og pastellkritt: Jeg har gjort en rekke portrett - og karikaturoppdrag, og har ellers brukt motiv kretset rundt ark - og papirlapper, maskeringstape og postit lapper. I tillegg har jeg bl.a. en serie med blekkspruter i pastellkritt.

Bearbeiding og tilpasning av bildeserier i Photoshop for timelaps på nettsiden “Om arbeidene”.

Først og fremst ønsket jeg å prestentere meg selv og tegnearbeidene gjennom et visuelt uttrykk. Manipulerte fotoer fra prosjektoppgaven i Digital bildebehandling ble rammene for hjemmesidene, og tegnede postitlapper ble linkeknapper.

Utfordringen lå i det å kombinere visuelt formspråk med det brukervennlige, og det kreative med det funksjonelle.

Eyetracking

Komposisjon

Manipulering av bakgrunn

Roll over

Linkeknapper

Classic Tween, Timelaps

Det ble mye jobb med klargjøring av bilder og innskannede tegninger i Photoshop, og mange timer i Flash for å lage bildegallerier.

Jeg brukte “pilgallerier” der det ikke var for mange bilder, og gallerier med “Thumbnail scrollebar” der det var mange: Link: http://www.youtube.com/watch?v=2TrIQqu2MkU og http://www.youtube.com/watch?v=i1EJpc68EIs (Actionscript 2) 8

Her vises et utvalg fra hjemmesiden “Med strek og pixler�

marianne-frisvold.com

Hjem (Rollover 1)

Hjem (Rollover 2)

Tegninger: Portretter

Tegninger: Karikaturer

Tegninger: Pasteller

Digital: Grafiskdesign

Hjem: Om arbeidene (Rollover 1) + Timelaps

Digital: Webdesign

9

Digital Mediedesign - vårsemesteret

Tekst, foto og layout: Gro Ayla Lillesund Velkommen til min hjemmeside: www.groayla.com

Etter et morsomt og lærerikt høstsemester med Digital Bildebehandling og Grafisk Design, startet jeg vårsemesteret med video, animasjon og webdesign, modul 3 og 4. Jeg viser her små utdrag fra de to prosjektoppgavene som var avsluttende for semesteret.

Web- og informasjonsdesign - prosjektoppgave Høsten 2010 etablerte jeg meg som kunstner og dette medførte at jeg så det hensiktsmessig å ha et nettsted der jeg kunne vise andre hva jeg drev med. Den gangen hadde jeg ikke noe kjennskap til Dreamweaver, derfor ble den laget i Weebly; et enkelt program med “drag & drop” funksjon. I forhold til programmet Weebly opplevde jeg at valg i maler var enten / eller.

Det å være forsiktig i fargebruken er jo noe av “min stil”, men i utgangspunktet syntes jeg at sidene i mitt opprinnelige nettsted var litt kjedelig både med tanke på farger og tekst.

Utfordringen ble derfor å lage et nettsted som inneholdt en noe større grad av fargebruk og som ikke var helt statisk, men allikevel tilfredsstillende for meg. Med Dreamweaver hadde jeg muligheten til å styre utformingen av sidene helt selv og bygge de opp “tag by tag”.

Indexsiden. Bildene var tenkt å skiftes ut med jevne mellomrom for å skape litt liv i nettstedet.

FARGER:

LOGO:

Rollover Image med link til indexsiden.

Nettstedet skulle formidle billedkunst i form av foto og grafikk. Det skulle vise brukeren hva slags kunst jeg har, priser og info om utstillinger og kontaktinfo. Nettstedet er i hovedsak et middel for å få solgt det jeg produserer.

En av de seks gallerisidene. Med de blå pilene kan en manøvrere mellom bildene.

10

Digital video og animasjon - prosjektoppgave Oppgaveteksten til denne prosjektoppgaven var veldig åpen og jeg sto helt fritt til å velge tema og teknikk. Dette gjorde det vanskelig, men ga meg også muligheter til å velge å bruke noe jeg er god til. Jeg mener selv at jeg har en styrke i foto og har derfor brukt en del av dette i filmen. Å arbeide med filmredigering var helt nytt for meg da jeg startet dette semesteret. Den største utfordringen jeg ga med selv var en animasjon som skulle integreres i filmen.

Et lite utvalg av stillbilder som ble brukt i filmen.

VALG AV TEMA TIL FILMEN:

FILMENS SJANGER:

Den verden vi lever i kan for mange mennesker være både slitsom og stressende. Mange av oss haster oss gjennom dagen og har kanskje ikke tid til å oppdage “de små tingene” i hverdagen. Som for eksempel møter med andre mennesker eller vakre ting rundt oss. I det sistnevnte tenker jeg først og fremst på hva man kan oppdage av spennende detaljer i et bybildet eller ute i naturen.

Jeg konstruerte meg et tenkt oppdrag; NRK har et program det tema er helse og livsstil. Det går over flere uker og er delt inn i flere småprogrammer. Et omhandler stress og hjerteproblemer, og tar for seg hvordan vi kan forebygge for å unngå dette. Jeg har fått i oppdrag å lage vignetten til denne delen. Den fikk tittelen “hjerteslag”, som kunne tolkes på flere måter.

De to viktigste grunnene til det valgte tema er; jeg er opptatt av helse og jeg ønsker å vise andre mennesker det vakre og spennende som finnes rundt oss, både i byen og i naturen.

Dette er i hovedsak en dokumentarfilm. Det som kjennetegner det er at den gjenspeiler virkeligheten. Enkelte av stillbildene i filmen mener jeg representerer en “kreativ behandling av virkeligheten”. Dette fordi det er små utsnitt fotografert av virkeligheten og fotoene er videre bearbeidet noe i Photoshop.

“oppdagelse i en fjellvegg”, utgangspunkt for animasjonen.

I samtlige overganger mellom stillbildene og mellom filmsekvenser og stillbilder satt jeg inn en Cross Dissolve. Det ga en flyt i filmen og myke overganger. Dette er også et nyttig verktøy for å vise at det har gått en stund f.eks. senere på dagen. Halveis i overtonningen er bildene like sterke.

Cross Dissolve mellom to stillbilder.

Cross Dissolve mellom filmsekvens og et stillbilde.

11

Digital Mediedesign

Etter et givende første semester med Digital Mediedesign stod det andre semesteret for tur. Denne gang med video og webdesign.

Mens det første semesteret fikk meg til å ta mange bilder, har det andre semesteret gjort nesten det samme for video.

Om du ønsker å få en fin innføring i videoproduksjon og laging av websider, kan studiet anbefales.

Tekst, foto og layout av: Yngve Hegreberg (Overstående

bilde tatt av Njål Sand,

under filmingen av prosjektoppgaven)

Den ene oppgaven gikk ut på lage en animasjonsfilm. En runde i huset oppdrev et par leker og pyntefigurer, og så var “skuespillerne” på plass. Da variabelt lys burde unngås, endte fryserommet og fryseboksen opp som lokasjon for bildetagningen. Resultatet ble en kort og humoristisk film. Det ble brukt langt mer tid til arbeid på pc enn det tok å ta bildene.

Monster møter katt.

12

For semesteroppgaven i video og animasjon gikk jeg for en kort action-film.

Tittelen ble “Utbyttet”, og handler om en person som tar seg inn i en leir kontrollert av flere soldater, med den intensjon å ta noe de har.

Med hjelp fra bekjente som stilte opp med props og som skuespillere, gikk det seg til. Etter noen dager med filming og en god porsjon redigering ble det et akseptabelt resultat.

Som vanlig med slike prosjekter, var det derimot mange ting som kunne vært forbedret.

Men det gav en god erfaring med tanke på hva man må være oppmerksom på når man filmer. Dette være lys, lyd og generell kontinuitet.

For filmingen ble det brukt et systemkamera.

Fra venstre: Yngve Hegreberg, Njål Sand, Tony Sæle og Stefan Rong.

13

Tekst. bilde og layout: Hilde Kristin Hømann

Digital mediedesign Gjennom studiet Digital Grafisk Design utviklet jeg figuren Vimsen. Han er en blid og glad malingsbøtte med menneskelige egenskaper.

I dette studiet brukte jeg Vimsen som en gjennomgående figur i en årskalender for barn.

14

Videre benyttet jeg Vimsen i et nettsted med animasjoner for barn. Nettstedet utviklet jeg som en del av en prosjektoppgave i Webog Informasjonsdesign.

Jeg har fått noe kunnskap og forståelse i bruk av actionscript og htmlkoding. I studiet har jeg benyttet programmene Adobe Illustrator, Adobe Dreamweaver og Flash.

Adobe Illustrator er et veldig nyttig tegneprogram.

Med dagens bruk av iPod Touch, iPhone, iPad tror jeg en videreutvikling av Vimsen kunne egnet seg som en applikasjon («app»).

På DM2 kan jeg kanskje videreutvikle vimsensiden som app.

15

Til daglig jobber jeg som lærer på Hadeland vidergående skole.

Elevene og jeg har jobbet med gavepapir og magasinsider i Adobe Illustrator.

Til høsten planlegger jeg å introdusere flash for elevene mine.

16

17

Skygge og refleksjon som bĂŚrende elementer i komposisjon av: Erling Nesse

Se nettsidene på bloggen min: rlovli@wordpress.com

Visuell appell

Tekst, foto og layout: Ragnhild Løvli

Om prosjektoppgaven i Web- og informasjonsdesign våren 2012.

I temaet “Meg selv som kunstner” har jeg søkt å finne en balanse der nettstedet mitt både skal vise egne arbeider og være en ressursside der bibliotekansatte uten spesiell kompetanse innen design vil kunne finne idéer og tips.

Inspirasjon er hentet fra designeres egne portfoliosider jeg har funnet på nett og i magasinet WebDesigner. Jeg la spesielt merke til hvordan sidene kombinerer personlig design med høy funksjonalitet. Minimalistiske nettsteder appellerer mest til meg. Et overordnet mål i arbeidsprosessen ble derfor å utelate alt unødvendig på nettsidene mine.

,,

…within this world of social profiling via Twitter and Facebook, the humble website still has a massive role to play in literally providing an independent ”home” for who you really are. It can form a marketing identity and give your followers, connections, friends, clients and customers alike a memorable sense of your identity.

Å designe noe personlig er en utfordring. Jeg ville ha et upretensiøst og ”håndlaget” design.

For å skape en kontrast til de litt tunge, solide arbeidene jeg viser fra min jobb på Trondheim folkebibliotek, har jeg brukt jeg lette, lyse og inspirerende farger.

Underveis i prosessen ble det mindre vesentlig å promotere meg selv som designer og å se på oppgaven som en eksamen der man bør vise alt man kan. Fokus endret seg til å vektlegge innhold og nytteverdi for målgruppen. Nettstedet har et uprofesjonelt utseende som forteller brukere at dette ikke er en stor salgsbedrift, men en gratis og personlig inngang til designressurser og -råd.

(Design Diary, magasinet WebDesigner)

18

,,

Prosjektoppgave i web- og informasjonsdesign våren 2012

Design Logoen gir en umiddelbar forståelse av hva nettstedet handler om. Den spiller på ordet “visible” og “vise biblioteket”.

Fontene er nøye utvalgt med tanke på letthet og lesbarhet, og skal passe til “personligheten” i designet. Jeg har brukt fonter som gjenkjennes av alle nettlesere jeg har testet.

Fargene bringebær, mandarin og varm gul inspirerer og skaper glede. De synliggjør og forenkler navigasjon.

visuell kommunikasjon for bibliotek

#E2185D

#F9A24A

Lucida Sans Unicode

Gabriola

#FFD15F

DejaVu Sans Extra Light

#F2EEE6

Innhold Sidene består av lenker, ressurser og idéer. Det er en egen portfolioside med to billedgalleri laget i Flash: papirbasert design og skjermbasert design. Menyen er som følger: VELKOMMEN | IDÉER |DESIGN | RESSURSER | PORTFOLIO | KONTAKT MEG

Ferdige sider Formatet jeg har laget er fast, ikke dynamisk. Det vil si at designet ikke endres fra skjerm til skjerm. Selve rammen (wrapper) har et fast format på 800x600 piksler, så det behøves ingen scrolling selv ved liten skjerm. Ved skalering av sida beholdes forholdet mellom elementene.

Jeg håper oppgaven kan danne grunnlag for å realisere et nettsted om bibliotekprofilering i framtiden. Resultatet av eksamensoppgaven er kun et utkast, det hadde vært fantastisk gøy å kunne legge inn mer innhold og gjerne også et forum for deling av gode idéer.

19

foto

og t ekst

: jør

n

terje

Høm

ann

teknologi og tradisjoner Målet var å utvikle et nettsted for sølvsmedkunsten og filigransarbeid med bakgrunn i en film jeg produserte i 1999. Et websted som skal formidle filmens kunnskap og budskap.

Dette er et håndverk og en historie som er iferd med å bli glemt. Ønske var å bedrive opplysning for den kulturhistoriske skatten dette er og gjennom interaktivitet skape interesse for det.

Fokuset legges på formalestetiske virkemidler via ny webteknologi som CSS3 og tagger for innholdsstruktur via HTML5.

Det skal gi brukeren en opplevelse av hvordan sølvet kunne speile folkelynne.

Hva er Html5 HTML5 er et samarbeid mellom World Wide Web Consortium (W3C) og Web Hypertext Application Technology Working Group (WHATWG).

WHATWG jobbet med webskjemaer og applikasjoner, og W3C jobbet med XHTML 2.0. I 2006, valgte de å gå sammen og utvikle en ny versjon av HTML. Noen regler ble fastsatt: • • • •

Nye funksjoner skulle være basert på HTML, CSS, DOM og Javascript Redusere nødvendigheten av eksterne plugins (som Flash) Bedre feilhåndtering Større muligheter for dokumentstruktur for å erstatte scripting

• HTML5 skal være plattformuavhengig • Utviklingsprosessen skal være synlig for alle Vi har i HTML5 nå vanlige elementer for struktur slik som <header> og <footer> .

API (Application Programming Interface) elementer som <canvas> ,<audio> og <video> vil gi oss frihet til å lage brukervennlige applikasjoner uten å måtte støtte oss til feks Flash.

Når man ser på de nye elementene kan det se ut som de bare erstatter <div id=” ”>. Men ser man på figuren til høyre ser man at elementer som <header> og <footer> kan gjenbrukes flere ganger som en slags <div class=” ”> eller vanlige HTML elementer.

Fordelen med disse elementene er at de er meget nøye definert og kan gi en god semantisk struktur om de brukes riktig.

20

( Furu, 2006 s. 21 )

Med utgangspunkt i filmen hentet jeg konseptbeskrivelsen utifra siste del av filmen hvor det sies at sølvet “speilet selve folkelynne”.

På internett ser nye teknologier stadig dagens lys. Det blir stadig flere plattformer som websider og annet interaktivt innhold skal vises på.

Vi har mobile plattformer som Iphone, Android og andre smarttelefoner, men også nettbrett gjør sitt inntog når det gjelder vårt forbruk av innhold. Mange bruker i dag kun nettbrett når de er hjemme og ikke på jobb.

Vi ser jo gjennom filmen hvordan historien til folket var bundet til det sølvet og ikke minst deres indre.

Folkets åndelige verdier reflekterte i sølvets farge og mønster.

Men tanke på opphavsrett på bilder besluttet jeg å hente det jeg trengte av bildemateriell fra filmen “Bygdesølvetsfortellinger”.

Fant frem til fire gode illustrasjonsbilder som skulle fungere som kommunikasjonselementer på forsiden.

Formålet med arbeidet av nettstedet var å utprøve nye kodestandarder over et tema. Det var litt spesielt å kombinere ny teknologi og historisk innhold som er bundet til såpass dype tradisjoner.

Kun nettleseren Safari støtter all den funksjonaliteten jeg har brukt med CSS3 så nettstedet oppfyller ikke alle punktene i Morville modellen.

Jeg er godt vant med å jobbe med web som medium. Men gjennom det arbeidet jeg har lagt ned i denne prosjektoppgaven har jeg har blitt kjent med nye kodestandarder som er på vei inn.

Ferdig nettsted finner du her http://web.columbiweb.no/jthweb/ 21

Måten websider utvikles på må tilpasses disse mediene.

Allerede i dag har mange utviklet egne mobilsider og egne visninger for nettbrett, men de møter fort utfordringer.

Vårt forbruk av innhold dekker ikke bare tekst og bilder, men også annet innhold. Det kan alt fra animasjoner, lyd, levende bilder til kompliserte skjemaer, nettbanker og annet interaktiv innhold.

Vi trenger nå en teknologi og kodestandard som tilfredstiller brukerne våre og gir verdifullt innhold uansett plattform.

ProsjektoPPgave i web- og informasjonsdesign våren 2012

“Et konsept er et begrep som beskriver en opplevelse”

DIGITAL MEDIEDESIGN 2012

video og animasjon + webdesign tekst/layout/foto: Mona Gullbekk Hansen Epost: mona-nr1@hotmail.com

Jeg heter Mona Gullbekk Hansen, og høsten 2011 startet jeg på digital mediedesign på Notodden. Høsten kom og gikk, de sier tiden flyr når man har det gøy og det stemmer! Når vi så endelig startet opp igjen i januar, var det digital video og animasjon, og web- og informasjonsdesign som sto for tur.

Jeg visste ganske fort hvilke eksamensprosjekter jeg ville velge, og her vil jeg presentere de to prosjektene mine.

>

MATFILOSOFI: Jeg har alltid hatt en stor interesse for mat og lenge hatt lyst til å lage en egen matside. I og med denne interessen for mat, engasjerer jeg meg også i det jeg vil kalle en matfilosofi. Mat skal være en viktig kilde ikke bare til metthet, men også glede, forundring, spenning med mer. Mat bør være gøy og spennende, så jeg ville lage et litt annerledes nettsted. Valget falt på det å lage en horisontal webside. Vi har i flere øvingsoppgaver laget websider som kanskje er mer “tradisjonelle”. Jeg følte et behov for å løsrive meg litt fra dette, og det viste seg å være en veldig god ide for min del.

Horisontale sider er noe som igjen har blitt trendy, og på grunn av vår økende bruk av mobile enheter og nettbrett er det et mer funksjonelt design enn noen gang. Dette bidrar til et rent og minimalistisk uttrykk, hvor det man presenterer som for eksempel foto, står i fokus. Dette var kjernen i prosjektbeskrivelsen, at det formalestetiske går hånd i hånd med budskapet: det enkle kan være det beste. Websiden er designet med en hovedmeny til venstre, hvorpå linkene åpnes til høyre. Dette utvider seg videre mot høyre, altså horisontalt og ikke vertikalt som vanlig. Man blar seg på denne måten intuitivt videre enten med pekefingeren på brett, en mac-mus eller på vanlig måte med scrollbar nederst. Ved bilder med tekst under, vil man ved å føre musen over bildet (roll-over effekt) få opp en tekst som enten er til informasjon, eller en oppskrift. Websiden ble laget i Adobe Dreamweaver.

22

>

HØGSKOLEN I TELEMARK

KRISTIANSAND 2012: Mitt eksamensprosjekt i video og animasjon, hadde sin bakgrunn i mange og kjære opphold i sørlandets hovedstad, Kristiansand. Resultatet ble en kortfilm som fungerer som en stemningsrapport med små og daglige øyeblikk i byen. Gjennom en bevisst fortellerteknikk var målet å formidle den gode følelsen jeg selv føler byen gir en, gjennom stemningsfulle bilder og tilhørende passende musikk. Utfordringen var nettopp dette, å filme de rette øyeblikkene, benytte seg av de rette kamerainnstillingene og ikke minst klippe det hensiktsmessig så seeren opplever denne følelsen. Jeg filmet med et nyinnkjøpt Canon EOS 7D kamera, noe som var både veldig lærerikt og ikke minst utrolig gøy. Jeg følte underveis i prosjektet at jeg fikk benyttet meg av all den teorien vi har lært, fra det å sette filmens premiss, skrive manus, øve seg på ulike filmteknikker og til slutt å redigere i Adobe Premiere Pro.

23

Lille Rufs - fra barnebok til animasjonsfilm Animasjonsfilmen “Lille Rufs” har blitt til som en prosjektoppgave i faget “Digital video og animajson” ved Høgskolen i Telemark våren 2012. Den er baser på en barnebok om Stor-fotingen Lille Rufs.

Tekst og bilder: Atle Auran

poeng å lage dette slik at alle nye element som skulle inn i filmen kommer fram i tegningene. I tillegg til Synopsis Når bekken som stor- tegningene står det en kort forklarfotingene henter vann i tørker ut, ende tekst til hver bilderamme. tar Lille Rufs på seg det farefulle oppdraget å forsøke å finne ut Produksjon Å lage animasjonshvorfor vannet er borte. Dette er film er en tidkrevende prosutgangspunktet for filmen om Lille ess, og selv om det går fortere å Rufs, og vi følger ham gjennom jobbe med cut-out enn for eket par skumle dager i den store sempel tegneanimasjon brukte skogen. Her blir han venn med jeg lang tid på å klargjøre før jeg pinnsvinet Pino Pigg og Jostein kunne begynne med filminga.

Bever. Lille Rufs finner ut hvorfor bekken har tørket ut, og sammen Karakterutvikling Det første jeg med de nye vennene river han gikk i gang med var å utforme beverdemningen som blokkerer hvordan de ulike karakterene i bekken og vannet strømmer på filmen skulle se ut. Jeg tok utnytt fritt ned til storfotingene. Vel gangspunkt i illustrasjonene fra tilbake til de andre storfotingene barneboka, men jeg ønsket å gjøre savner han de nye vennene sine, noen endringer på alle figurene. og filmen slutter med at Lille Rufs Hovedpersonen, Lille Rufs, var drar tilbake til Pino Pigg og Jostein opprinnelig tegnet med små Bever for å bo sammen med dem. vinger og et stort nebb i samme fargen som resten av figuren. Nå Manus og storyboard Før jeg gikk viste det seg at de som leste boka i gang med å gjøre opptak til fil- ikke nødvendigvis forsto at det men, skrev jeg manus og tegnet var vinger. Derfor byttet jeg ut storyboard. Storyboardet ble teg- vingene med armer. Siden Lille net med enkle skisser. Det var et Rufs ikke har noen munn, var 24

jeg nødt til å vise følelsene hans stort sett gjennom øynene og delvis gjennom kroppsspråket.

Pino Pigg har blitt noe endret fra illustrasjonene i boka. Cut-outteknikken krever at det er mulig å klippe ut figurene i papir, og det må derfor være klare kanter på figurene.

Jostein Bever er den figuren som har blitt endret mest. Her var jeg ikke fornøyd med den opprinnelige karakteren, så han har blitt tydeligere og mer tegneserieaktig Tegning/maling Etter at jeg hadde et klart bilde av hvordan de ulike karakterene i filmen skulle se ut, gikk jeg i gang med å male bakgrunner. Det er brukt sju ulike bakgrunner i filmen, noen brukes en gang mens andre er i bruk på flere scener i filmen. Bakgrunnene er 40 x 70 cm store og er malt med akvarellfager. Jeg arbeidet på flere bakgrunner samtidig, slik at jeg alltid hadde en bakgrunn å male på mens de andre tørket.

Skisser fra karakterutvikling

Filming Bildene som er brukt i filmen er tatt med digitalt speilreflekskamera. Kameraet er plassert i toppen av en animasjonskasse, slik at objektivet peker ned på platen i bunnen hvor jeg beveget figurene.

Kameraet var koblet til en datamaskin, slik at bildene ble lagret direkte på maskina.

Klipping Etter hvert som bildene til hver enkelt scene ble ferdige, har jeg gjort redigeringsarbeidet i Adobe Premiere Pro. Jeg syns dette er den mest spennende delen av animeringen, nå får karakterene liv.

Lyd Lyden til filmen om Lille Rufs var både det første og det siste jeg gjorde i produksjonen av filmen.

Før jeg startet med filminga, leste jeg inn et lydspor med min egen stemme som fortellerstemme.

Dette lydsporet brukte jeg når jeg tok bildene og satte dem sammen

Utsnitt fra storyboardet

til sekvenser. Helt avslutningsvis, etter at alle scenene var ferdig redigert, la jeg på effektlyder og bakgrunnsmusikk. Jeg valgte to ulike melodier som musikk i bakgrunnen, disse melodiene har ulik stemning og skal være med å forsterke endringen som skjer med Lille Rufs i løpet av filen; fra melankolsk og trist til positiv og glad.

Oppsummering Det har vært en interessant og lærerik opplevelse å animere historien om Lille Rufs. Det har også vært morsomt å hente fram historien jeg skrev for snart 20 år siden.

Figurer brukt i filmen

veksler mellom maling, filming og redigering. Det er noe jeg liker best med denne teknikken.

Når det gjelder det endelige resultatet er jeg tålelig fornøyd. Det er selvfølgelig flere ting i filmen jeg gjerne skulle endret på. For det første hadde det vært spennende å gi karakterene egne stemmer og dermed gjort dialogen mer ekte og levende. I tillegg syns jeg enkelte av sekvensene har for hakkete bevegelser, og jeg skulle gjerne hatt tid til å jobbe med flere frames per sekund. Men det får bli neste gang.

Filmen om Lille Rufs lå an til å bli Selve animeringa har vært tidkre- lang, og ved første innlesing av vende, det var jeg klar over før jeg manus var lydklippet på over sju startet opp. Det som likevel har og et halvt minutt. Når jeg ser filtatt mesteparten av tida er å male men nå, er jeg godt fornøyd med bakgrunner og figurer. Samtidig å ha klart å komprimere histogir cut-out-teknikken mulighet til rien uten at handlingen og temaå variere arbeidsoppgavene, og det tikken har blitt skadelidende.

Maling av bakgrunner

25

Animasjonskassen

Animasjon Jeg heter Stian Abrahamsen og er fra Drammen.

Jeg tok lærerutdanningen I estetiske fag ved høyskolen i Oslo i tiden 1996-1999. Til daglig jobber jeg som kunst og håndtverkslærer i Drammen og på ungdomshuset G60.

Som lærer i ungdomskolen de siste 10 årene har jeg undervist i mange forskjelige fagomeråder, materialer og teknikker innenfor kunst og håndverk. De siste årene har det blitt mer fokus på visuell kommunikasjon gjennom bruk av digitale verktøy i skolen. Dette var hovedgrunnen til at jeg søkte på digital mediedesign. Måten studiet er tilrettelagt på var også avgjørende for mitt valg av studiet. Med litt godvilje fra arbeidsplassen fikk jeg ordnet det slik at jeg kunne følge de obligatoriske nettforelesningene. Jeg valgte å ta studiet over to år, da jeg er i full jobb ved siden av. Jeg har ikke angret ett sekund på dette studiet.

Det har vært meget lærerikt og spennende.

Denne oppgaven var eksamensprosjektet mitt i “digital video og animasjons delen” våren 2011.

Jeg ønsket å utforske animasjonsteknikken “stop motion” med plastelina som materiale. Tanken var å lære teknikken, for så å bruke videoen og teknikken i undervisningssammenheng i kunst og håndtverksfaget. Det skulle vise seg at prosjektet ble meget omfattende og hver eneste kveld gikk med til prosjektet gjennom de fire ukene prosjektperioden pågikk.

Jeg begynte prosjektet med å tråle alt av “stop motion” på youtube for å finne inspirasjon. Den svenske kunstanimatøren Natalie Djurberg var en stor inspirator for meg. Hun lager animasjoner som berører tabulagte temaer. Jeg liker filmene hennes fordi de er følelsesladede og tar opp viktige temaer som kvinneundertrykkelse og menneskerettigheter. Jeg bestemte meg for å prøve å lage en film som kanskje kunne vekke tanker og følelser hos seeren. Det måtte være et spennende tema som passet for en klasse i ungdomskolen. Valget ble historien om romvesnet Xenon. Som man ser på bildene, ble kulissene laget av Kapa- plater. Figurene laget jeg av plastelina med skjelett av aluminiumstråd. Figurene ble så flyttet på litt og litt og fotografert for hver lille bevegelse. Når bildene ble satt sammen til filmsekvenser valgte jeg å vise femten bilder i sekundet. Totalt brukte jeg godt over tre tusen bilder i filmen. Jeg ble godt fornøyd med resultatet. Filmen gjør også sin nytte, da elevene blir svært ivrige med å sette i gang etter at de har sett filmen. Jeg fikk også betalt for alt strevet i form av karakteren A.

26

Et romskip styrter på jorda. Et av skipets mannskap overlever.

Han blir ført bort av agenter og plassert i det hvite rom.

Et hemmelig militært forskningsenter plassert på ett øde sted.

Dagene går og vi ser hvordan Xenon går fra kjedsomhet til savn, desperasjon og redsel. Dette er historien om romvesenets første møte med menneskeheten.

27

Filmen er ikke ferdig før den er fargekorrigert Det har blitt enkelt å lage egne filmer. Man kan filme med mobilen og legge filmen rett ut på Facebook med enkle grep. Profesjonell videoproduksjon er litt mer komplisert, men utstyret koster nå en brøkdel av hva det gjorde for bare få år siden, og man kan redigere på sinn egen laptop.

nær 100 %. Vi bruker hjelpemidler som Vector Scope og RGB Parade Scope til å vite hva vi gjør. Juster skyggepartiene så de mørkeste delene av bildet er nær bunnen av RGB Parade skopet. Hvis de ulike Primary Color Correction fargene har forskjellig svartnivå Dette er første steg i prosessen. Her kan du justere svartnivået på hver justerer du kontrast, farger og gam- farge. Så justerer du hvittnivåene til ma slik at bildene blir mest mulig de ligger nær 100 %. Til slutt justAll denne enkelheten er litt farlig, «korrekte». Hvis bildet er litt over- erer du gammaen, altså midten av for det er lett å glemme at film- og eksponert drar vi nivåene litt ned. kurvene. videoproduksjon faktisk er et fag. Er det mørkt drar vi dem opp. Og Gleden over å ha fått til å filme og har bildet fargestikk justerer vi for redigere en film gjør at man tror det. Et godt justert bilde har gjerne man er ferdig når filmen er ferdig svartnivå nær null, og hvittnivå F ør og etter klippet. Det er man ikke! primary color correction

Fargekorrigering og finishing De fleste begynnere hopper over fargekorrigering og tar aldri den siste finishen på lyd og bilde.

Dermed fremstår gjerne filmen som amatørmessig. Det pussige er at veldig få fotokyndige mennesker ville finne på å lage en fotobok av ubehandlede stillbilder. De fotograferer gjerne i RAW format for å kunne justere eksponering, kontrast og farger i etterarbeidet. De samme menneskene legger gjerne ut en film hvor de ikke har behandlet hver scene. Ikke helt enkelt å forstå hvorfor.

Vi har ingen gode norske faguttrykk for dette fagfeltet, så jeg velger å bruke de engelske uttrykkene i denne artikkelen. Utrykket fargekorrigering er i seg selv litt upresist, for det er så mye mer enn korrigering av feil. Fargeforbedring er et bedre uttrykk. Ofte lager vi oss

en «look», for eksempel med blågrønne bakgrunnsfarger og likevel friske hudtoner, slik mange actionfilmer ser ut for tiden.

Før

Etter

Av Jarle Leirpoll: Filmskaper Secondary color correction

Før

Noen ganger er primary color correction nok, og bildet ser bra ut.

Men i de fleste tilfeller vil det være ønskelig å justere deler av bildet uten å berøre andre deler. Dette kalles secondary color correction.

Secondary color correction med Qualifiers La oss si at bildet stort sett har god kontrast og farger etter primary color correction, men at ansiktet til personen i bildet er litt feil. Da kan vi velge ut hudtonene basert på lyshet, fargetone og metning.

Dermed skaper vi en maske, og alt innenfor masken vil bli justert mens det utenfor forblir urørt.

Maske

Etter

Her har vi brukt secondary color correction til å gi hudtonene ekstra farge, uten å påvirke andre farger i nevneverdig grad.

Secondary color correction med Masker

Mørkt

Et veldig utbredt problem, spesielt med billige kameraer, er at himmelen blir utbrent når resten av bildet er riktig eksponert. Da kan man lage en maske som bestemmer hvilke deler av bildet som skal behandles.

I eksempelet her har jeg laget en maske som dekker himmelen, og kombinert to eksponeringer av samme motiv.

Lyst

Jeg bruker himmelen fra det mørkeste bildet og resten fra det lyseste bildet.

Hvis du ikke har tatt to eksponeringer er det fortsatt håp: Du kan også bruke denne metoden til å kombinere to kopier av samme bilde, der du korrigerer den ene kopien for å få himmelen så bra som mulig, og den andre for resten av bildet.

Maske

Ferdig

Øye Stavkirke: Mørkt og lyst bilde, maske og ferdig bilde 30

Looks Med fargekorrigering kan vi gi filmen ulike «looks» , avhengig av hva slags stemning vi vil gi den. En film eller en TV-serie har gjerne et lite arsenal av slike «looks» som brukes for å gi de ulike stedene eller miljøene i filmen et særpreg. Noen ganger gjør vi omgivelsene mørkere enn hovedpersonen for å fremheve ham/henne, eller vi «gjemmer» objekter i bildet ved å gå ned på fargemetning og kontrast. Fargekorrigering er i høyeste grad et verktøy som hjelper historiefortellingen!

Her er noen eksempler på populære looks som du kan lære å lage i boka The Cool Stuff in Premiere Pro. Nøytral, Bleach Bypass, Teal & Orange, warm Nøytral

Bleach Bypass

Teal & Orange

Warm

Andre former for bildefiksing Noen ganger vil det også vær nødvendig å fjerne mikrofoner som dupper ned i bildekanten, moiré-mønstre på skjorter og andre problemer i bildet. Dette trenger ikke vær veldig vanskelig, men kan være tidkrevende.

Jeg har laget en video tutorial som omhandler fargekorrigering og finishing på www.premierepro.net. Dette er en nettside som har som formål å støtte og promotere boken The Cool Stuff in Premiere Pro som utgis høsten 2012, og skal handle om tidsbesparende og avanserte teknikker for etterarbeid i Adobe Premiere Pro.

Ikke glem lyden!

Også lyden trenger en siste gjennomgang før du sender fra deg filmen. Pass på at nivåene er jevne og at alle som snakker høres tydelig. Men lydmiks og annen lydfiksing får bli et tema til en annen artikkel.

Jarle Leirpoll Filmskaper www.leirpoll.com/tv/ www.premierepro.net Forfatter av boka Video i Praksis og The Cool Stuff in Premiere Pro 31

Fakultet for estetiske fag, folkekultur og lærerutdanning (EFL)

Studietilbud på Institutt for forming og formgiving og Institutt for folkekultur Masterstudier Formgiving, kunst og håndverk Formgiving, kunst og håndverk, nettbasert Tradisjonskunst Bachelorstudier Faglærer i formgiving, kunst og håndverk Folkekunst - tre - metall - tekstil Folkemusikk Visuelle kunstfag og design Grunnstudier, påbyggings- og fordypningsstudier i kunst og design • Digital bildeskaping og visuell kommunikasjon • Digital mediedesign • Environmental art • Form og design • Kunst og håndverk • Kunst og håndverk 1, trinn 1-7, nett • Kunst og håndverk 1, trinn 5-10 • Kunst og håndverk 2, trinn 5-10, nett • Leire - Kunst og design 1 • Leire - Kunst og design 2 • Tegning - bilde • Tegning og bildekommunikasjon • Tekstil - kunst og design • Tre med metall - Kunst, håndverk og design Grunnstudier, påbyggings- og fordypningsstudier i tradisjonskunst • Design, redesign og saum av klede • Folkekunst - tre - metall - tekstil 1 • Folkekunst - tre - metall - tekstil 2 • Folkekunst - tre - metall - tekstil 3 • Folkemusikk 1 • Folkemusikk 2 • Folkemusikk 3 • Innføring i norsk folkemusikk • Kreativ maskinstrikking 1 • Kreativ maskinstrikking 2 • Norwegian Folk Music • Tradisjonsmat Se for øvrig andre studietilbud på www.hit.no/

Søknadsfrist: 15. april For spesiell vurdering, forhåndsløfte og realkompetanse er fristen 1. mars.

Ta kontakt med fakultetet for informasjon og søknadsskjema.

Telefon: 35026200

32