32
1 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 ut- fordring. Jeg ville ha et upretensiøst og håndlaget design. Ragnhild s. 18 Vårsemesteret i Digital mediedesign har vært veldig lærerikt. I Digital video og animasjon har jeg lært om produks- jon av film og redigering. Janne s. 4 Les mer w Digital Visuell kommunikasjon i digitale medier, nr.2 Juni 2012

Digital mediedesign nr 2

Embed Size (px)

DESCRIPTION

Studiet Digital mediedesign har som mål å fremme kompetanse i ulike type medier. Dette magasinet er spesielt for vårsemesteret 2012 om fokuserte på film- og webmediet; «Digital video og animasjon (15 studiepoeng) og Web- og informasjonsdesign (15 studiepoeng)».

Citation preview

Page 1: Digital mediedesign nr 2

1

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 ut-fordring. Jeg ville ha et upretensiøst og ”håndlaget” design.

Ragnhild s. 18

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

Janne s. 4 Les mer w

DigitalVisuell kommunikasjon i digitale medier, nr.2 Juni 2012

Page 2: Digital mediedesign nr 2

Design og layout: Morteza AmariForsidebilde: Erling Nesse

2

Jeg heter Erling Nesse og kommer fra Tysvær utenfor Haugesund. Utdannin-gen 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 vi-deregående skole tok jeg Digital mediede-sign 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.

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

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 kol-legaer i vidaregåande skule. ME under-

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”

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

Bildet på coveret er fra min prosjektop-pgave 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 el-ementer i komposisjon?

Gro Ayla Lillesund

10

Janne Marete Grødum

4

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 informas-jon og kunnskap og samtidig er med å forme våre holdninger og verdier.

Produksjon og konsumering av media gir oss flotte muligheter med hensyn til kunnskapsformidling og tilgang til informasjon, men den enorme og mektige kraften in-nebærer også en del utfordringer.

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

Dannelse i vår tid vil blant annet være å bli kloke konsumenter av medier og å bli kloke deltakere i demokratiet i et mediesamfunn. Mediekompetanse opparbeider ferdigheter i kritisk tenkning som kreves i å ta beslutninger i ulike op-pgaver i samfunnet. Det innebærer også evnen til å finne, analysere, evaluere og formidle kunnskap og informasjon i medier.

Studiet Digital mediedesign har som mål å fremme kompetanse i

Morteza Amari, klasseleder

ulike type medier. Dette magasi-net er spesielt for vårsemesteret 2012 som fokuserte på film- og webmediet; «Digital video og ani-masjon (15 studiepoeng) og Web- og informasjonsdesign (15 studie-poeng)».

Page 3: Digital mediedesign nr 2

Atle Auran

24

StianAbrahamsen

26

Innhold:

FILMSKAPER: Jarle Leirpoll

28

Ragnhild Løvli

18

Jørn Terje Hømann

20

Mona Gullbekk Hansen

22

Gro Ayla Lillesund

10

Yngve Hegreberg

12

Hilde Kristin Hømann

14

Janne Marete Grødum

4

Camilla Steinmoen

6

Marianne Frisvold

8

3

Page 4: Digital mediedesign nr 2

4

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 kortfilm- oppgaver med levende film og ved bruk av animasjon. I prosjektoppgaven min valgte jeg å lage en animasjonfilm av silhuettfigurer.

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.

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.

Nettstudent på Digital mediedesign, Høgskolen i Telemark.Jobber som lærer i barneskolen. Medarbeider i profileringsfirmaet Mikanor.Nett mittdigitalegalleri.blogspot.com

Janne Marete Grødum

Digital mediedesign Digital mediedesign

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.

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

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

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

Vil du se hele filmen min kan du se den på YouTube: Sil-houette 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.

Bilder fra animasjonsfilmen.

A n i m a s j o n

artikkel meg_vår.indd 1-2 14.06.12 10:39

Page 5: Digital mediedesign nr 2

5

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 kortfilm- oppgaver med levende film og ved bruk av animasjon. I prosjektoppgaven min valgte jeg å lage en animasjonfilm av silhuettfigurer.

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.

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.

Nettstudent på Digital mediedesign, Høgskolen i Telemark.Jobber som lærer i barneskolen. Medarbeider i profileringsfirmaet Mikanor.Nett mittdigitalegalleri.blogspot.com

Janne Marete Grødum

Digital mediedesign Digital mediedesign

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.

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

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

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

Vil du se hele filmen min kan du se den på YouTube: Sil-houette 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.

Bilder fra animasjonsfilmen.

A n i m a s j o n

artikkel meg_vår.indd 1-2 14.06.12 10:39

Page 6: Digital mediedesign nr 2

6

Et dykk inn i fremtiden

Film og animasjon

I prosjektoppgaven min valgte jeg å job-be med animasjonsfilm. Jeg forsøkte meg på en av de tidligere animasjnsteknik-kene cut out , som er en 2dimensjonal animasjonsmetode. Med sterk inspirasjon fra Lotte Reniger tegnet jeg skapelsesh-istorien 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.

Et menneske blir skapt ut av sanden på marka og presentert for en ny og spennende verden. Godene er mange, men ensomheten er gnagen-de. Når en kvinne plutselig dukker opp i hagen forandres alt, men ikke slik de hadde tenkt det.

Tekst og design:Camilla Steinmoen

http:/www. Jordijenta.com

Page 7: Digital mediedesign nr 2

7

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 formgi-vere 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 økolo-giske varer. Jeg valgte å lage en veldig ren og enkel webside, der det levende og ekte ved gården kom fram i form av enkel de-sign 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!

Page 8: Digital mediedesign nr 2

Tekst, Foto og Layout:

WEB -OG INFORMASJONSDESIGNVå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ære-plansammenheng. Derimot har jeg allerede turt og kaste meg inn i noen enkle undervisnings-opplegg i Flash. Jeg tror det er uyre viktig å vedlikeholde og utfordre seg selv i å videreformidle den kunnska-pen 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.

Først og fremst ønsket jeg å prestentere meg selv og tegnearbeidene gjennom et visuelt ut-trykk. 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.

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)

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

Eyetracking Komposisjon Manipulering av bakgrunn Roll over Linkeknapper Classic Tween, Timelaps

marianne-frisvold.comHer vises et utvalg fra hjemmesiden “Med strek og pixler”

Hjem (Rollover 1) Hjem (Rollover 2)

Tegninger: Portretter Tegninger: Karikaturer

Tegninger: Pasteller Digital: Grafiskdesign

Hjem: Om arbeidene (Rollover 1) + Timelaps Digital: Webdesign

8

Page 9: Digital mediedesign nr 2

Tekst, Foto og Layout:

WEB -OG INFORMASJONSDESIGNVå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ære-plansammenheng. Derimot har jeg allerede turt og kaste meg inn i noen enkle undervisnings-opplegg i Flash. Jeg tror det er uyre viktig å vedlikeholde og utfordre seg selv i å videreformidle den kunnska-pen 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.

Først og fremst ønsket jeg å prestentere meg selv og tegnearbeidene gjennom et visuelt ut-trykk. 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.

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)

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

Eyetracking Komposisjon Manipulering av bakgrunn Roll over Linkeknapper Classic Tween, Timelaps

marianne-frisvold.comHer vises et utvalg fra hjemmesiden “Med strek og pixler”

Hjem (Rollover 1) Hjem (Rollover 2)

Tegninger: Portretter Tegninger: Karikaturer

Tegninger: Pasteller Digital: Grafiskdesign

Hjem: Om arbeidene (Rollover 1) + Timelaps Digital: Webdesign

9

Page 10: Digital mediedesign nr 2

10

Tekst, foto og layout:Gro Ayla Lillesund

Digital Mediedesign- vårsemesteret

Etter et morsomt og lærerikt høstsemester med Digital Bilde-behandling og Grafisk Design, startet jeg vårsemesteret med video, animasjon og webdesign, modul 3 og 4. Jeg viser her små utdrag fra de to prosjektopp-gavene 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”.

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.

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

Velkommen til min hjemmeside:www.groayla.com

FARGER:

LOGO:

Rollover Image med link til indexsiden.

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

Page 11: Digital mediedesign nr 2

11

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 van-skelig, 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.

Dette er i hovedsak en dokumentarfilm. Det som kjen-netegner 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 bearbei-det noe i Photoshop.

Den verden vi lever i kan for mange mennesker være både slitsom og stressende. Mange av oss haster oss gjen-nom 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.

VALG AV TEMA TIL FILMEN: FILMENS SJANGER:

Et lite utvalg av stillbilder som ble brukt i filmen.

“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.

Page 12: Digital mediedesign nr 2

12

Digital Mediedesign

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 humoris-tisk film. Det ble brukt langt mer tid til arbeid på pc enn det tok å ta bildene.

Monster møter katt.

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 web-sider, kan studiet anbefales.

Page 13: Digital mediedesign nr 2

13

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 redi-gering 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.

Page 14: Digital mediedesign nr 2

Gjennom studiet Digital Grafisk Design utviklet jeg figuren Vimsen. Han er en blid og glad malings-bøtte med menneskelige egenskaper.I dette studiet brukte jeg Vimsen som en gjen-nomgående figur i en år-skalender for barn.

Tekst. bilde og layout:Hilde Kristin Hømann

Digital mediedesign

Jeg har fått noe kunnskap og forståelse i bruk av actionscript og html-koding. I studiet har jeg benyttet programmene Adobe Illustrator, Adobe Dreamweaver og Flash. Adobe Illustrator er et veldig nyttig tegnepro-gram.

Med dagens bruk av iPod Touch, iPhone, iPad tror jeg en videreutvikling av Vim-sen kunne egnet seg som en applikasjon («app»). På DM2 kan jeg kanskje videreutvikle vimsensiden som app.

Videre benyttet jeg Vimsen i et nettsted med animas-joner for barn. Nettstedet utviklet jeg som en del av en prosjektoppgave i Web-og Informasjonsdesign.

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 elev-ene mine.

14

Page 15: Digital mediedesign nr 2

Gjennom studiet Digital Grafisk Design utviklet jeg figuren Vimsen. Han er en blid og glad malings-bøtte med menneskelige egenskaper.I dette studiet brukte jeg Vimsen som en gjen-nomgående figur i en år-skalender for barn.

Tekst. bilde og layout:Hilde Kristin Hømann

Digital mediedesign

Jeg har fått noe kunnskap og forståelse i bruk av actionscript og html-koding. I studiet har jeg benyttet programmene Adobe Illustrator, Adobe Dreamweaver og Flash. Adobe Illustrator er et veldig nyttig tegnepro-gram.

Med dagens bruk av iPod Touch, iPhone, iPad tror jeg en videreutvikling av Vim-sen kunne egnet seg som en applikasjon («app»). På DM2 kan jeg kanskje videreutvikle vimsensiden som app.

Videre benyttet jeg Vimsen i et nettsted med animas-joner for barn. Nettstedet utviklet jeg som en del av en prosjektoppgave i Web-og Informasjonsdesign.

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 elev-ene mine.

15

Page 16: Digital mediedesign nr 2

16

Page 17: Digital mediedesign nr 2

17 Skygge og refleksjon som bærende elementer i komposisjon av: Erling Nesse

Page 18: Digital mediedesign nr 2

Ferdige sider Formatet jeg har laget er fast, ikke dynamisk. Det vil si at designet ikke endres fra skjerm til skjerm. Selve ram-men (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 grunn-lag for å realisere et nettsted om biblio-tekprofilering 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.

Se nettsidene på bloggen min: [email protected] 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 syn-liggjør og forenkler navigasjon.

visuellkommunikasjonfor bibliotek

#E2185D

#F9A24A

#FFD15F

#F2EEE6

Lucida Sans Unicode Gabriola DejaVu Sans Extra Light

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

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 port-foliosider 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 appel-lerer mest til meg. Et overordnet mål i arbeids-prosessen ble derfor å utelate alt unødvendig på nettsidene mine. Å 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å opp-gaven 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.

Visuell appell Tekst, foto og layout:

Ragnhild Løvli

Se nettsidene på bloggen min: [email protected] Prosjektoppgave i web- og informasjonsdesign våren 2012

…within this world of social pro-filing via Twitter and Facebook, the humble website still has a massive role to play in literally providing an in-dependent ”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. (Design Diary, magasinet WebDesigner)

,,

,,

18

Page 19: Digital mediedesign nr 2

Ferdige sider Formatet jeg har laget er fast, ikke dynamisk. Det vil si at designet ikke endres fra skjerm til skjerm. Selve ram-men (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 grunn-lag for å realisere et nettsted om biblio-tekprofilering 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.

Se nettsidene på bloggen min: [email protected] 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 syn-liggjør og forenkler navigasjon.

visuellkommunikasjonfor bibliotek

#E2185D

#F9A24A

#FFD15F

#F2EEE6

Lucida Sans Unicode Gabriola DejaVu Sans Extra Light

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

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 port-foliosider 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 appel-lerer mest til meg. Et overordnet mål i arbeids-prosessen ble derfor å utelate alt unødvendig på nettsidene mine. Å 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å opp-gaven 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.

Visuell appell Tekst, foto og layout:

Ragnhild Løvli

Se nettsidene på bloggen min: [email protected] Prosjektoppgave i web- og informasjonsdesign våren 2012

…within this world of social pro-filing via Twitter and Facebook, the humble website still has a massive role to play in literally providing an in-dependent ”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. (Design Diary, magasinet WebDesigner)

,,

,,

19

Page 20: Digital mediedesign nr 2

“Et konsept er et begrep som beskriver en opplevelse” ( 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”.

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

Folkets åndelige verdier reflek-terte i sølvets farge og mønster.

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

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

Formålet med arbeidet av nettstedet var å utprøve nye kode-standarder 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 gjen-nom 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/

På internett ser nye teknolo-gier 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.

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 utfordring-er.

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

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

Pr

osje

kto

PPga

ve i w

eb- o

g info

rm

asjo

nsd

esig

n vå

re

n 2012

foto og tekst : jørn terje Hømann 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 kul-turhistoriske 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.

HTML5 er et samarbeid mellom World Wide Web Con-sortium (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 å er-

statte scripting

• HTML5 skal være plattformuavhengig• Utviklingsprosessen skal være synlig for alleVi 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.

Hva er Html5

Det skal gi brukeren en opplevelse av hvordan sølvet

kunne speile folkelynne.

20

Page 21: Digital mediedesign nr 2

21

“Et konsept er et begrep som beskriver en opplevelse” ( 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”.

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

Folkets åndelige verdier reflek-terte i sølvets farge og mønster.

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

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

Formålet med arbeidet av nettstedet var å utprøve nye kode-standarder 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 gjen-nom 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/

På internett ser nye teknolo-gier 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.

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 utfordring-er.

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

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

Pr

osje

kto

PPga

ve i w

eb- o

g info

rm

asjo

nsd

esig

n vå

re

n 2012foto og tekst : jørn terje Hømann 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 kul-turhistoriske 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.

HTML5 er et samarbeid mellom World Wide Web Con-sortium (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 å er-

statte scripting

• HTML5 skal være plattformuavhengig• Utviklingsprosessen skal være synlig for alleVi 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.

Hva er Html5

Det skal gi brukeren en opplevelse av hvordan sølvet

kunne speile folkelynne.

Page 22: Digital mediedesign nr 2

22

video og animasjon + webdesign

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 forma-lestetiske 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.

KRISTIANSAND 2012: Mitt eksamensprosjekt i video og animasjon, hadde sin bakgrunn i mange og kjære op-phold 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.

DIGITAL MEDIEDESIGN 2012 HØGSKOLEN I TELEMARK

tekst/layout/foto: Mona Gullbekk Hansen Epost: [email protected]

>

>

Page 23: Digital mediedesign nr 2

23

video og animasjon + webdesign

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 forma-lestetiske 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.

KRISTIANSAND 2012: Mitt eksamensprosjekt i video og animasjon, hadde sin bakgrunn i mange og kjære op-phold 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.

DIGITAL MEDIEDESIGN 2012 HØGSKOLEN I TELEMARK

tekst/layout/foto: Mona Gullbekk Hansen Epost: [email protected]

>

>

Page 24: Digital mediedesign nr 2

24

Figurer brukt i filmen

Tekst og bilder: Atle Auran

Synopsis Når bekken som stor-fotingene henter vann i tørker ut, tar Lille Rufs på seg det farefulle oppdraget å forsøke å finne ut hvorfor vannet er borte. Dette er utgangspunktet for filmen om Lille Rufs, og vi følger ham gjennom et par skumle dager i den store skogen. Her blir han venn med pinnsvinet Pino Pigg og Jostein Bever. Lille Rufs finner ut hvorfor bekken har tørket ut, og sammen med de nye vennene river han beverdemningen som blokkerer bekken og vannet strømmer på nytt fritt ned til storfotingene. Vel tilbake til de andre storfotingene savner han de nye vennene sine, og filmen slutter med at Lille Rufs drar tilbake til Pino Pigg og Jostein Bever for å bo sammen med dem.

Manus og storyboard Før jeg gikk i gang med å gjøre opptak til fil-men, skrev jeg manus og tegnet storyboard. Storyboardet ble teg-net med enkle skisser. Det var et

poeng å lage dette slik at alle nye el-ement som skulle inn i filmen kom-mer fram i tegningene. I tillegg til tegningene står det en kort forklar-ende tekst til hver bilderamme.

Produksjon Å lage animasjons-film er en tidkrevende pros-ess, og selv om det går fortere å jobbe med cut-out enn for ek-sempel tegneanimasjon brukte jeg lang tid på å klargjøre før jeg kunne begynne med filminga.

Karakterutvikling Det første jeg gikk i gang med var å utforme hvordan de ulike karakterene i filmen skulle se ut. Jeg tok ut-gangspunkt i illustrasjonene fra barneboka, men jeg ønsket å gjøre noen endringer på alle figurene.Hovedpersonen, Lille Rufs, var opprinnelig tegnet med små vinger og et stort nebb i samme fargen som resten av figuren. Nå viste det seg at de som leste boka ikke nødvendigvis forsto at det var vinger. Derfor byttet jeg ut vingene med armer. Siden Lille Rufs ikke har noen munn, var

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-out-teknikken 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 opprin-nelige 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 bak-grunner. Det er brukt sju ulike bakgrunner i filmen, noen brukes en gang mens andre er i bruk på flere scener i filmen. Bakgrun-nene 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.

Filming Bildene som er brukt i fil-men er tatt med digitalt speilreflek-skamera. 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 da-tamaskin, 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

til sekvenser. Helt avslutnings-vis, etter at alle scenene var ferdig redigert, la jeg på effektlyder og bakgrunnsmusikk. Jeg valgte to ulike melodier som musikk i bak-grunnen, disse melodiene har ulik stemning og skal være med å for-sterke endringen som skjer med Lille Rufs i løpet av filen; fra mel-ankolsk og trist til positiv og glad.

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

Selve animeringa har vært tidkre-vende, det var jeg klar over før jeg startet opp. Det som likevel har tatt mesteparten av tida er å male bakgrunner og figurer. Samtidig gir cut-out-teknikken mulighet til å variere arbeidsoppgavene, og det

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

Når det gjelder det endelige resul-tatet 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 bev-egelser, 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 lang, og ved første innlesing av manus var lydklippet på over sju og et halvt minutt. Når jeg ser fil-men nå, er jeg godt fornøyd med å ha klart å komprimere histo-rien uten at handlingen og tema-tikken har blitt skadelidende.

Lille Rufs - fra barnebok til animasjonsfilmAnimasjonsfilmen “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.

Skisser fra karakterutvikling Utsnitt fra storyboardet

Maling av bakgrunner Animasjonskassen

Page 25: Digital mediedesign nr 2

25

Figurer brukt i filmen

Tekst og bilder: Atle Auran

Synopsis Når bekken som stor-fotingene henter vann i tørker ut, tar Lille Rufs på seg det farefulle oppdraget å forsøke å finne ut hvorfor vannet er borte. Dette er utgangspunktet for filmen om Lille Rufs, og vi følger ham gjennom et par skumle dager i den store skogen. Her blir han venn med pinnsvinet Pino Pigg og Jostein Bever. Lille Rufs finner ut hvorfor bekken har tørket ut, og sammen med de nye vennene river han beverdemningen som blokkerer bekken og vannet strømmer på nytt fritt ned til storfotingene. Vel tilbake til de andre storfotingene savner han de nye vennene sine, og filmen slutter med at Lille Rufs drar tilbake til Pino Pigg og Jostein Bever for å bo sammen med dem.

Manus og storyboard Før jeg gikk i gang med å gjøre opptak til fil-men, skrev jeg manus og tegnet storyboard. Storyboardet ble teg-net med enkle skisser. Det var et

poeng å lage dette slik at alle nye el-ement som skulle inn i filmen kom-mer fram i tegningene. I tillegg til tegningene står det en kort forklar-ende tekst til hver bilderamme.

Produksjon Å lage animasjons-film er en tidkrevende pros-ess, og selv om det går fortere å jobbe med cut-out enn for ek-sempel tegneanimasjon brukte jeg lang tid på å klargjøre før jeg kunne begynne med filminga.

Karakterutvikling Det første jeg gikk i gang med var å utforme hvordan de ulike karakterene i filmen skulle se ut. Jeg tok ut-gangspunkt i illustrasjonene fra barneboka, men jeg ønsket å gjøre noen endringer på alle figurene.Hovedpersonen, Lille Rufs, var opprinnelig tegnet med små vinger og et stort nebb i samme fargen som resten av figuren. Nå viste det seg at de som leste boka ikke nødvendigvis forsto at det var vinger. Derfor byttet jeg ut vingene med armer. Siden Lille Rufs ikke har noen munn, var

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-out-teknikken 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 opprin-nelige 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 bak-grunner. Det er brukt sju ulike bakgrunner i filmen, noen brukes en gang mens andre er i bruk på flere scener i filmen. Bakgrun-nene 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.

Filming Bildene som er brukt i fil-men er tatt med digitalt speilreflek-skamera. 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 da-tamaskin, 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

til sekvenser. Helt avslutnings-vis, etter at alle scenene var ferdig redigert, la jeg på effektlyder og bakgrunnsmusikk. Jeg valgte to ulike melodier som musikk i bak-grunnen, disse melodiene har ulik stemning og skal være med å for-sterke endringen som skjer med Lille Rufs i løpet av filen; fra mel-ankolsk og trist til positiv og glad.

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

Selve animeringa har vært tidkre-vende, det var jeg klar over før jeg startet opp. Det som likevel har tatt mesteparten av tida er å male bakgrunner og figurer. Samtidig gir cut-out-teknikken mulighet til å variere arbeidsoppgavene, og det

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

Når det gjelder det endelige resul-tatet 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 bev-egelser, 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 lang, og ved første innlesing av manus var lydklippet på over sju og et halvt minutt. Når jeg ser fil-men nå, er jeg godt fornøyd med å ha klart å komprimere histo-rien uten at handlingen og tema-tikken har blitt skadelidende.

Lille Rufs - fra barnebok til animasjonsfilmAnimasjonsfilmen “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.

Skisser fra karakterutvikling Utsnitt fra storyboardet

Maling av bakgrunner Animasjonskassen

Page 26: Digital mediedesign nr 2

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, desper-asjon og redsel. Dette er

historien om romvesenets første møte

med menneskeheten.

Jeg heter Stian Abraham-sen 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 Dram-men 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 fi kk jeg ordnet det slik at jeg kunne følge de obligatoriske nett-forelesningene. 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 fi re ukene prosjekt-perioden pågikk. Jeg begynte prosjektet med å tråle alt av “stop motion” på youtube for å fi nne inspirasjon. Den svenske kunstanimatøren Natalie Djurberg var en stor inspirator for meg. Hun lager animasjoner som berører tabulagte temaer. Jeg liker fi lmene hennes fordi de er følelsesladede og tar opp vik-tige temaer som kvinneundertrykkelse og menneskerettigheter. Jeg bestemte meg for å prøve å lage en fi lm som kanskje kunne vekke tanker og følelser hos seeren. Det måtte være et spennende tema som passet for en klasse i ung-domskolen. Valget ble historien om romvesnet Xe-non. Som man ser på bildene, ble kulissene laget av Kapa- plater. Figurene laget jeg av plastelina med skjelett av aluminiumstråd. Figurene ble så fl yttet på litt og litt og fotografert for hver lille bevegelse. Når bildene ble satt sammen til fi lmsekvenser valgte jeg å vise femten bilder i sekundet. Totalt brukte jeg godt over tre tusen bilder i fi lmen. 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 fi lmen. Jeg fi kk også betalt for alt strevet i form av karakteren A.

Animasjon

Page 27: Digital mediedesign nr 2

27

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, desper-asjon og redsel. Dette er

historien om romvesenets første møte

med menneskeheten.

Page 28: Digital mediedesign nr 2

Det har blitt enkelt å lage egne filmer. Man kan filme med mo-bilen og legge filmen rett ut på Facebook med enkle grep. Profes-jonell videoproduksjon er litt mer komplisert, men utstyret koster nå en brøkdel av hva det gjorde for bare få år siden, og man kan redi-gere på sinn egen laptop.

All denne enkelheten er litt farlig, for det er lett å glemme at film- og videoproduksjon faktisk er et fag. Gleden over å ha fått til å filme og redigere en film gjør at man tror man er ferdig når filmen er ferdig klippet. Det er man ikke!

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 foto-graferer gjerne i RAW format for å kunne justere eksponering, kon-trast og farger i etterarbeidet. De samme menneskene legger gjerne ut en film hvor de ikke har behan-dlet hver scene. Ikke helt enkelt å forstå hvorfor.

Vi har ingen gode norske fagutt-rykk for dette fagfeltet, så jeg vel-ger å bruke de engelske uttrykkene i denne artikkelen. Utrykket farge-korrigering er i seg selv litt upre-sist, for det er så mye mer enn kor-rigering 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 action-filmer ser ut for tiden.

Primary Color Correction

Dette er første steg i prosessen. Her justerer du kontrast, farger og gam-ma slik at bildene blir mest mulig «korrekte». Hvis bildet er litt over-eksponert drar vi nivåene litt ned. Er det mørkt drar vi dem opp. Og har bildet fargestikk justerer vi for det. Et godt justert bilde har gjerne svartnivå nær null, og hvittnivå

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 fargene har forskjellig svartnivå kan du justere svartnivået på hver farge. Så justerer du hvittnivåene til de ligger nær 100 %. Til slutt just-erer du gammaen, altså midten av kurvene.

F ør og etterprimary color correction

Filmen er ikke ferdig før den er fargekorrigert

Før

Etter

Page 29: Digital mediedesign nr 2

Secondary color correction

Noen ganger er primary color cor-rection 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.

Av Jarle Leirpoll: Filmskaper

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

nevneverdig grad.

Før

Etter

Maske

Page 30: Digital mediedesign nr 2

30

Secondary color correction med Masker

Et veldig utbredt problem, spesielt med billige kameraer, er at him-melen blir utbrent når resten av bildet er riktig eksponert. Da kan man lage en maske som bestem-mer 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.

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

Hvis du ikke har tatt to eksponer-inger 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.

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

Mørkt

Lyst

Maske

Ferdig

Page 31: Digital mediedesign nr 2

31

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

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 LeirpollFilmskaper

www.leirpoll.com/tv/www.premierepro.netForfatter av boka Video i Praksis og The Cool Stuff in Premiere Pro

Nøytral Bleach Bypass

Teal & Orange Warm

Page 32: Digital mediedesign nr 2

32

Fakultet for estetiske fag, folkekultur og lærerutdanning (EFL) Studietilbud på Institutt for forming og formgiving og Institutt for folkekultur

MasterstudierFormgiving, kunst og håndverkFormgiving, kunst og håndverk, nettbasertTradisjonskunst

BachelorstudierFaglærer i formgiving, kunst og håndverkFolkekunst - tre - metall - tekstilFolkemusikkVisuelle 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. aprilFor spesiell vurdering, forhåndsløfte og realkompetanse er fristen 1. mars.

Ta kontakt med fakultetet for informasjon og søknadsskjema.Telefon: 35026200