Multimediapresentasjon for amatørmurere

Like dokumenter
INF 1040 Digital representasjon 2006 Utkast til - Obligatorisk oppgave nr 3

TDT4105/TDT4110 Informasjonsteknologi grunnkurs:

Sampling av bilder. Romlig oppløsning, eksempler. INF Ukens temaer. Hovedsakelig fra kap. 2.4 i DIP

INF1040 Digital representasjon

Temaer i dag. Mer om romlig oppløsning. Optisk avbildning. INF 2310 Digital bildebehandling

INF januar 2017 Ukens temaer (Kap med drypp fra kap. 4. i DIP)

INF 1040 høsten 2008: Oppgavesett 11 Farger (kapittel 15)

UNIVERSITETET I OSLO

Merombilderogvideo. Fra bilder til video. Fra Edison til moderne kino. Luminans-variasjon

Løsningsforslag til kapittel 15 Fargerom og fargebilder

"Dette skjer når jeg trykker på denne knappen" "Når jeg skriver i dette feltet, ser jeg at det andre forandrer seg"

Midtveiseksamen. INF Digital Bildebehandling

INF 1040 høsten 2008: Oppgavesett 9 Sampling og kvantisering av lyd (kapittel 11)

INF 1040 høsten 2009: Oppgavesett 11 Farger (kapittel 15) Løsningsforslag Flervalgsoppgaver

Midtveiseksamen Løsningsforslag

Klask-en-Muldvarp. Introduksjon. Skrevet av: Basert på MITs "MoleMash for App Inventor 2"-guide (

Klask-en-Muldvarp. Steg 1: Gjøre klart spillbrettet. Sjekkliste. Introduksjon

UNIVERSITETET I OSLO

INF Stikkord over pensum til midtveis 2017 Kristine Baluka Hein

Fargebilder. Lars Vidar Magnusson. March 12, 2018

Digitale verktøy Mina Gulla 28/09/10. Grafikk og bilder. Oppgave T4: Digitale bilder

2) Redegjør for de mest brukte filformater for digitale fotografier. Diskuter fordeler, ulemper og bruksområder for de ulike formatene.

MAT-INF 2360: Obligatorisk oppgave 1

1.Raster(bitmap) versus vektorer

Oppgave T4 Digitale Bilder

INF 1040 høsten 2009: Oppgavesett 8 Introduksjon til lyd (kapittel 9 og 10)

DV - CODEC. Introduksjon

Raster VS Vektor. Stian Larsen Raster

UNIVERSITETET I OSLO

Temaer i dag. Mer om romlig oppløsning. Optisk avbildning. INF 2310 Digital bildebehandling

Noen presiseringer mhp Diskret Fourier Transform. Relevant for oblig 1.

Arnstein Andreassen. Windows media series? Familie av digital media software

Sampling, kvantisering og lagring av lyd

Web fundamentals. Web design. Frontend vs. Backend Webdesign 17. januar Monica Strand

UNIVERSITETET I OSLO

Løsningsforslag, Ukeoppgaver 9 INF2310, våren kompresjon og koding del I

UNIVERSITETET I OSLO

CSS-formatering: stilark med kommentarer

UNIVERSITETET I OSLO

Litteratur : I dag og neste uke: Cyganski kap. 5-6

Repetisjon: Sampling. Repetisjon: Diskretisering. Repetisjon: Diskret vs kontinuerlig. Forelesning, 12.februar 2004

Løpende strekmann Erfaren Videregående Python PDF

Eksamen i INF 1040, 5. desember Det matematisk-naturvitenskapelige fakultet

Forkunnskapskrav. Hva handler kurset om. Kontaktinformasjon. Kurset er beregnet på en student som kan

Grunnleggende om Digitale Bilder (ITD33515)

Inf109 Programmering for realister Uke 5. I denne leksjonen skal vi se på hvordan vi kan lage våre egne vinduer og hvordan vi bruker disse.

INF1040 Oppgavesett 7: Tall og geometrier

Eksamen i INF 1040, 5. desember Det matematisk-naturvitenskapelige fakultet. Ditt kandidatnr: DETTE ER ET LØSNINGSFORSLAG

HØGSKOLEN I SØR-TRØNDELAG

Ut i rommet. Læringsmål. Punkter i endimensjonalt rom Skalarer. Punkt i todimensjonalt rom. Geometrier, tid, kart, bilder, animasjoner, CAD/CAM,

VEILEDNING FOR BRUK AV LOGO

Kodetime for Nordstrand barneskole

INF 2310 Digital bildebehandling

CSS: Animasjon Nybegynner

INF 2310 Digital bildebehandling

INF 2310 Digital bildebehandling

Øving 13. Et diffraksjonsgitter med N meget smale spalter og spalteavstand d resulterer i en intensitetsfordeling. I = I 0, φ = πdsin(θ)/λ

Fysisk Lag. Overføringskapasitet. Olav Lysne med bidrag fra Kjell Åge Bringsrud, Pål Spilling og Carsten Griwodz

Øyet og synssystemet vårt. INF 1040 Syn, avbildning og digitale bilder. Øyets linsesystem. Iris og pupillen. Motivasjon for å kunne noe om dette:

Installasjon InfoMediaPlayer:

INF1510: Bruksorientert design

Løsning av øvingsoppgaver, INF2310, 2005, kompresjon og koding

IN1060: Bruksorientert design

Datakonvertering. analog til digital og digital til analog

Løsningsforslag, Ukeoppgaver 10 INF2310, våren 2011 kompresjon og koding del II

Tema nr 1: Synssystemet vårt. INF 1040 Syn, avbildning og digitale bilder. Øyets linsesystem. Øyet og synssystemet vårt

Nadine Pedersen GRIT Datamaskinen- kjenn din Mac

Javascript. Mer om layout

UNIVERSITETET I OSLO

Steg 1: Animasjons-attributtet

UNIVERSITETET I OSLO

Forelesning, 23.februar INF2400 Sampling II. Øyvind Ryan. Februar 2006

GEOGEBRA (3.0) til R1-kurset

Digitale bilder. Det er i hovedsak to måter å representere digitale bilder på: rastergrafkk (punkter) og vektorgrafkk (linjer og fater).

MMT105 Internettprogrammering Uke 44, høst 2007

Analog. INF 1040 Sampling, kvantisering og lagring av lyd. Kontinuerlig. Digital

PhotoShop Grunnleggende ferdigheter

UNIVERSITETET I OSLO

Oblig2 - obligatorisk oppgave nr. 2 (av 4) i INF1000 v2008

TDT4110 IT Grunnkurs Høst 2016

Kanter, kanter, mange mangekanter. Introduksjon: Steg 1: Enkle firkanter. Sjekkliste. Skrevet av: Sigmund Hansen

UTVIDET TEST AV PROGRAM

Bildebehandling i GIMP

INF 2310 Digital bildebehandling

Forelesning, 17.februar INF2400 Sampling II. Øyvind Ryan. Februar 2005

Øyet og synssystemet vårt. INF 1040 Syn, avbildning og digitale bilder. Øyets linsesystem. Iris og pupillen. Motivasjon for å kunne noe om dette:

INF 1040 Syn, avbildning og digitale bilder

LOKALE BRUKERVEILEDNINGER FOR BRUK AV LYD OG LYSUTSTYR I KONSMO FLERBRUKSHALL (sist oppdatert )

INF 1040 Syn, avbildning og digitale bilder

Øyet og synssystemet vårt. INF 1040 Syn, avbildning og digitale bilder. Øyets linsesystem. Iris og pupillen. Motivasjon for å kunne noe om dette:

INF Algoritmer og datastrukturer

I denne oppgaven skal du lære hvordan du kan flytte rundt på elementer og gjemme elementene bak andre elementer ved hjelp av CSS.

y(t) t

UNIVERSITETET I OSLO. Dette er et løsningsforslag

Grafisk pakke dataseminar ARK6 12.feb 2008

ToPlayer. Steg 1: Kom i gang med metodene setup og draw. Gjør dette: Introduksjon:

Om du allerede kjenner Scratch og har en Scratchbruker kan du gå videre til Steg 1.

MAT1030 Diskret Matematikk

3. obligatoriske innlevering, høsten 2014

Transkript:

Multimediapresentasjon for amatørmurere Hjemmeeksamen, INF1040 Universitetet i Oslo Institutt for informatikk høsten 2004 Kandidatnummer 126

Oppgave 1 Forutsetninger Vi skal avblide en murer som legger skift i et forband, der vi mørtelfugene er 1 cm brede. Vi kan anta at denne avstanden (1 cm) er den minste detaljen som skal adskilles i fokalplanet, og at bølgelengden for dette lyset er λ = 639 10 9 m. Vi benytter en linse som gir samme synsfelt som det menneskelige øyet, dvs. med fokallengde 50 mm. Kameraet er et digitalt RGB-videokamera med en detektorstørrelse på 24 36 mm. Vi går ut fra en aperturdiameter på D = f 16. Det skal tas opp tilsammen 90 sekunder med lyd til videosekvensen: Et preludium og et postludium (med musikk tatt direkte fra en CD) på henholdsvis 20 og 10 sekunder, samt stemmen til mureren (samplingsrate 11025 Hz med 8 bits per sample i mono) som snakker i 1 minutt. 1.1 Maksimal avstand mellom objekt og kamera Vi vet at filming på vanlig 35 mm film med en linse med fokallengde 50 mm gir tilsvarende synsfelt som det menneskelige øyet (47º). Dette er gitt en detektorstørrelse på 24 36 mm. Grunnet kostnader har svært få digitalkameraet så stor detektorstørrelse, og dette påvirker synsfeltet hvis man bruker tilsvarende linser. 1.1.1 Detektorstørrelse. Fokallengde Eksempelvis ville synsfeltet til et digitalkamera med halvert 1 detektorstørrelse brukt med en linse med fokallengde 50 mm tilsvart synsfeltet til et 35 mm kamera med en linse med fokallengde 100 mm. Vi måtte med andre ord trengt 50 2 = 25 mm fokallengde på linsen vår for å oppnå synsfeltet til det menneskelige øyet for et slikt kamera. For enkelhets skyld går jeg her ut fra at vi har å gjøre med et dyrt, fint kamera med en detektorstørrelse på hele 24 36 mm, og en en linse med fokallengde 50 mm for å oppnå tilsvarende synsfelt som øyet. 1 Uttrykket focal length multiplier bruker ofte til å beskrive detektorstørrelsen i digitalkameraet relativt i forhold til det hos tilsvarende 35 mm-kameraer. 1

linse s y f f F 1 F 2 y s Figur 1.1: Objekt/bilde-relasjon. 1.1.2 Oppløsning. Rayleigh-kriteriet Vi går ut fra at linsen kan blendes ned, slik at vi at forholdet mellom aperturdiameter og fokallengde kan bli så stort som f D = 16, slik at D = f/16 = 50 mm 16 = 3, 125 mm (1.1) Et punkt avbildes i fokalplanet som et diffraksjonsmønster, bestemt av form (sirkulær) og apperturdiameter (se 1.1). Se [3], foil 7. Et diffraksjonsmønster i denne sammenhengen er en sirkulær disk av lys (såkalt Airy disc) omringet av ringer av avtagende intensitet [4]. Rayleigh-kriteret [2] er et kriterium for når to punkter på avstand kan adskilles i bildet. To diffraksjonsmønster (separert av vinkelen θ) kan adskilles hvis de ligger slik at sentrum i den ene disken faller sammen med den første ringen i den andre: 1, 22 λ sin θ = (1.2) D der λ er bølgelengden til lyset og D er diameteren på aperturen. θ er vinkeloppløsningen. Se [5]. Merk at θ er en meget liten vinkel slik at sin θ θ. Hvis diffraksjonsmønstrene er nærmere hverandre enn dette, vil de ikke (ifølge Rayleigh) kunne adskilles. 1.1.3 Løsning Vi skal finne den maksimale avstand mellom murvegg og kamera, gikk at de minste detaljene på murveggen skal være synlige (kunne adskilles). (1.1) satt inn i (1.2) gir sin θ θ = 1, 22 (639 10 9 m) 3, 125 10 3 m 2, 49 10 4 rad Når min er den minste detaljen som skal adskilles i bildet, og s er avstanden 2

mellom murvegg og kamera 2 er slik at θ = min s s = 1 10 2 m 2, 49 10 4 rad 40 m 1.2 Detaljer i fokalplanet 1.2.1 Objekt/bilde-relasjon Vi har et forhold mellom objekt/bilde som er slik at Jfr. figur 1.1. y y = s s (1.3) 1.2.2 Løsning Vi skal finne størrelsen av den minste detaljen som dannes i fokalplanet. Vi går for enkelhets skyld ut fra at bildet dannes i avstand fra linsen s som er lik fokallengden f 3. Vi løser (1.3) med hensyn på y og får at y = fy s = (50 10 3 1 10 2 ) m = 50 10 6 = 12, 5 µm 40 m 1.3 Pixelstørrelse i fokalplanet Et digitalt bilde består i et endelig todimensjonalt rutenett 4 av punkter (pixler). Analoge bilder, til sammenlikning, er kontinuerlige, og består at et uendelig antall (mer elller mindre) ulike frekvenser. 1.3.1 Sampling av bilder. Nyquist-teoremet Fourier-teori sier at vi kan representere et bilde med en endelig sum av sinusog cosinusfunksjoner av varierende frekvens, altså periodisk. Ved digitalisering plukker man med jevne mellomrom (for hver enkelt pixel) ut frekvenser for det kontinuerlige bildet. Dette kalles sampling. Når det digitale bildet består av et endelig antall frekvenser, må man man sample i henhold til Nyquist-teoremet for å representere bildet digitalt: [The Nyquist-theorem] states that, when converting from an analog signal to digital (or otherwise sampling a signal at discrete intervals), the sampling frequency must be greater than twice the highest frequency of the input signal in order to be able to reconstruct the original perfectly from the sampled version. 5 2 Jfr. enhetssirkelen. Se [6], absolutt vinkelmål, s. 11. 3 Se figur 1.1 og [3] ukeoppgaven. 4 Se [3], foil 24 5 Se [7]. 3

Vi må med andre ord sample to pixler for per periode for den minste periodiske struktur (den gode, gamle mørtelfugen) i det analoge bildet. 1.3.2 Løsning Vi skal angi den fysiske pixelstørrelsen for fokalplanet. Vi har allerede kommet frem til den størrelsen for mørtelfugen i det analoge bildet, slik at forutsetningen over gir at gir at y = 2y digital y digital = y 2 1.4 Bildestørrelse = 12, 5 µm 2 = 6, 25 µm Detektorflaten for videokameraet et 24 36 mm og vi går ut fra en pixelstørrelse som over, 25 mm. Bildet lagres som 24-bits RGB. 1 10 Antall pixler per millimeter er 3 6,25 10 = 160, slik at antall pixler er 6 24 160 36 160 = 22118400 pixler 24-bits RGB-bilder er lagret med 1 byte for hver farge (3 8 = 24 bits) for hver pixel, slik at 22118400 3 = 66355200 bytes 63804 Kilobytes 6 1.5 HSI og plassbehov HSI er en fargemodell som består av tre komponenter; hue, saturation og intensity. Hue er ren farge, og angis som en vinkel mellom 1 og 360 grader. Saturation er metningen av fargen, og angis som en verdi mellom 0 og 255 der 0 (255 er full metning og 0 er en gråfarge, uavhengig av hva slags verdi H måtte ha). H og S er kromatisitetskomponentene og beskriver fargen uavhengig av intensiteten. 1.5.1 Kromatisitet og øyet Det menneskelige øyet er langt dårligere til å adskille kromatisitetskomponentene (varianter av farger) enn varianter av intensitet eller lysstyrker, slik at mange av HS-variantene er overflødige. Vi kan lagre kromatisitetskomponentene med halv geometrisk oppløsning ved å ta gjennomsnitt av to og to pikselverdier i horisontal og vertikal retning. Antall pixler som trenger å lagres med kromatisitetskomponentene blir altså 24 2 160 36 2 6 I den grad 1 Kilobyte er 2 10 = 1024 bytes. 160 = 5529600 4

For 22118400 pixler (se over) må lagres med intensitetskomponenten. Hvis vi går ut fra at det brukes 8 bits eller 1 byte for hver komponent, gir dette at vi trenger 5529600 2 + 22118400 = 33177600 bytes = 31902 Kilobytes for å lagre et slikt bilde, med andre ord ca. halvparten av representasjonen i 1.4. 1.5.2 Synet og 19 bits Ifølge [1] s. 88 kan det mennesklige øyet skille mellom ca. nivåer 100 rene farger, 60 nivåer av fargemetning og ca. 6000 nivåer av intensitet. I den grad farger er noe som oppfattes, er det svært vanskelig å si akkurat når 7 fargen blir viktigere enn intensiteten, men det er i alle fall helt klart at vi må bruke mer plass på å lagre informasjon om intensitet (I) enn informasjon om kromatisitet (H og S). Vi kan for eksempel bruke 11 bits for I (2 11 = 2048 nivåer) per pixel. Da har vi igjen 9 bits, hvorav 5 kan brukes til H (2 4 = 16) og 4 kan brukes til S (2 4 = 16). Dette burde gi 2048 32 16 = 524288 farger. Vi bruker altså 1 byte per pixel på kromatisitetskomponentene, slik at vi trenger 5529600 bytes for H og S med halv geometrisk oppløsning, og 9 bits per pixel for I for samtlige 22118400 pixler. Totalt gir dette 22118400 11 8 + 5529600 = 34560 Kilobytes. Dette tar altså noe mer plass enn representasjonen over, men i og med at øyet er mer sensitivt for I, har vi forhåpentligvis gitt en bedre representasjon av bildet. 1.5.3 Murveggen og HSI Strengt tatt har vi bare å gjøre med to forskjellige rene farger på murveggen, slik at vi kan representere H med bare 1 bit. Hvis vi er riktig gjerrige kan vi la fargemetningen være konstant, slik at S også kan representeres med 1 bit (vi får da en helt flat farge). Hvor mye informasjon vi velger å bruke på I avhenger da av hvor mange nivåer av intensitet (f.eks. skygger o.l) vi vil representere. Eksempelvis kan vi bruke hele 1 byte på I. En kjapp regning gir at vi må bruke ca. 26585 Kilobytes for et slikt bilde med full geometrisk oppløsning for alle komponentene altså betydelig mindre enn representasjonene over. 1.6 Lyden Det brukes lyd til animasjonen henholdsvis 30 sekunder stereolyd ukomprimert fra CD og 60 sekunder med samplingsrate 11050 Hz med 8 bits per sample. Bitrate for CD er som regel 16 bits per sample, og samplingsraten er 44100 Hz. 1.6.1 Plassbruk Dette gir følgende plassbruk: 30 16 44100 = 21168000 2 10 Kilobytes 2067 Kilobytes 60 8 11025 = 5292000 2 10 Kilobytes 517 Kilobytes 7 Jeg har heller ingen programvare til rådighet for å teste dette, slik at alle overslag må sees på som forslag. 5

altså total ca. 5 Megabytes 8. 1.6.2 Forskjellige reduksjoner av plassbehov I den grad den høyeste frekvensen for en stemme er 3000 Hz, kunne vi trygt redusert samplingsraten for de 60 sekundene til 8000 Hz (jmf. Nyquist-teoremet) uten å miste så mye informasjon at vi ikke kan høre hva mureren sier. Dette er en samplingsrate som tilsvarer telefon, slik at tapet av kvalitet ville vært relativt drastisk. Bitraten vil ikke kunne reduseres uten å bruke spesielle talekompresjonsformater 9. Vi kan også trygt redusere både bitraten og samplingsraten for CD-lyden, men vi må huske på at musikk krever lagt høyere samplingsrate en tale, slik at vi kan ikke regne med å være like gjerrige her. Man vil relativt fort kunne merke tap av kvalitet hvis man senket samplingsrate til under 22050 Hz eller bitrate til under 16 bits per sample. I hvor høy grad vi ønsker at representasjonen skal ta lite plass bestemmer hvor langt vi er villige til å ofre lydkvalitet. Et godt alternativ for CD-lyden (og tale-lyden, for den saks skyld) ville være å komprimere lyden. Komprimering går ut på å bruke lite informasjon for det som måtte skje svært ofte og mer informasjon for det som måtte skje svært sjelden. Hva som måtte skje sjelden eller ofte kommer man frem til ved hjelp av sannsynlighetsregning. Merk at bruk av kompresjon forutsetter av lyden spilles av på en avspiller som er i stand til å dekode kompresjonen. 8 CD-lyden er i to kanaler 9 Se [8]. 6

Oppgave 2 Forutsetninger Det skal lages en mulitmediapresentasjon som tar mindre plass enn videosekvensen i oppgave 2. Lyd, bilde og tekst skal kunne lagres på separate filer, og det forutsettes at det finnes et program som kan spille av presentasjonen på en PC, PDA eller mobiltelefon. Hvert bilde i presentasjonen er slik at det er en komplett representasjon som ikke bygger på informasjon om foregående bilder, og at animasjonen skal kunne oppfattes som en kontinuerlig bevegelse. Det er ikke benyttet komprimering til presentasjonen. 2.1 Antagelser Jeg går her ut fra at programmet på PCen/PDAen/mobiltelefonen (heretter fremviseren) er webbasert. Dette er en rimelig antagelse i og med at fremviseren etter all sannsynlighet er så avansert at den inneholder en nettleser av et eller annet slag. Det er også rimelig å anta at amatørmurerene har tilgang til et helt system av forskjellige muranimasjoner, og at fremviseren ikke behøver å ta vare på informasjon om alle disse aninmasjonene samtidig bare en av gangen i en nettleser. Forøvrig Dette har flere fordeler av litt mer avansert art. Både lyd og bilder kan streames, slik at fremviseren kan spille av presentasjonen etterhvert som den mottar dataene. Videre kan vi da tenke oss at en del av systemet (alt som ikke har med selve avspillingen) kan foregå på en server, hvilket øker fleksibiliteten betraktelig. For eksempel kan kode (PHP, MySQL, XSLT) kjøres serverside, slik at datasystemet kan håndtere mer avanserte funksjoner og være mer dynamisk, hvilket gjør det enklere å drifte og lettere å utvide. 2.2 Om SVG SVG [9] er et relativt avansert XML-vokabular for vektor-grafikk som egner seg glimrende til dette formålet. I stedet for å lagre informasjon om hvert enkelt bilde (60 24 = 1440 bilder for et minutt), kan bevegelsen i bildet ses på som en kontinerlig bevegelse langs en vektor, som f.eks V (x 0 x 1, y 0 x 1 ). Fremviserens evne til å vise presentasjonen uten å hakke, begrenses altså da bare av fremviserens kapasitet til å regne ut posisjonen (x n, y n ), og hvor fort den kan tegne om skjermen (som regel langt raskere enn 24 ganger i sekundet. 7

2.2.1 SVG: Noen eksempler SVG er består som alle XML-vokabularer av elementer og atributter. I SVG er enkelte (strengt tatt de aller fleste) atributter såkalt animerbare, slik at man relativt enkelt kan forandre en egenskap ved et element som en funksjon av tiden. Ta følgende eksempel 1 <rect class="tegl" width="100" height="30" x="-103"> 2 <animate attributename="x" from="-100" to="155" dur="1s" begin="3s" fill="freeze" /> 3 <animate attributename="y" from="0" to="270" dur="1s" begin="3s" fill="freeze" /> 4 </rect> Koden over flytter en trekant fra øverst til venstre til og ned til et punkt i mursteinsforbandet. Atributtene x og y animeres fra et sted til et annet. Klassen tegl, samt andre klasser vi måtte trenge, kan defineres med CSS: 1 <defs> 2 <style type="text/css"><![cdata[ 3.tegl { 4 fill: red; 5 stroke: gray; 6 stroke-width: 1; 7 } 8 9.undertekst { 10 font-family: Arial; 11 font-size: 15; 12 fill: DarkGray; 13 visibility: hidden; 14 text-anchor: middle; 15 } 16 17 #tittel { 18 font-family: Arial; 19 font-size: 20; 20 font-weight: bold; 21 text-anchor: middle; 22 } 23 24 ]]></style> 25 </defs> Videre er følgende kode et eksempel på hvordan tekst kan inngå i SVG: 1 <text class="undertekst" dur="2s" x="300" y="130" > 2 <animate attributename="visibility" from="visible" to="hidden" dur="3s" 3 fill="freeze" /> 4 Sålen ligger klar. 5 </text> Her animeres atributten visibility, altså synlighet, som en funksjon av tiden, slik at teksten dukker opp på det ønskede tidspunkt. De 15 fargene kan endres relativt enkelt, enten ved å bytte ut stilark, eller manipulere atributter med JavaScript. Med Adobe-namespace, kan lyd også lett inngå i presentasjonen: 1 <svg xmlns:a="http://ns.adobe.com/adobesvgviewerextensions/3.0/" 2 viewbox="0 0 465 250" width="20cm" height="20cm"> 3 <a:audio xlink:href="lyd.wav" begin="4s" dur="10s"></a:audio> 4 </svg> Her spilles lyd-filen lyd.wav av i det fjerde sekundet med en varighet på ti sekunder. 8

2.3 Plassbehov Det er svært vanskelig å fastslå nøyaktig hvor stor plass en slik vektorrepresentasjon vil ta (i forhold til video, som er svært enkelt), men eksempelfilen i tillegg A (tatt med i sin helhet for enkelhets skyld), er på om lag 6336 tegn. For enkelhets skyld, kan vi tenke oss at 10% av disse tegnene ligger utenfor ASCII 10. Da teksten er lagret i UTF-8, kan forskjellige tegn representeres med forskjellige antall bits, dermed får vi at 6636 (0, 1 16 bits + 0, 9 8 bits) 7 Kilobytes Med andre ord, nesten ingenting, i disse bredbåndsdager. Mht. lyd kan vi tenke oss at 1 minutt ukomprimert lyd med samplingsfrekvens 8 bits per sample og samplingsrate 11025 Hz tar ca 580 Kilobytes med plass. Vi kan altså tenke oss at en slik presentasjon kan ta ca. 7 5+580 = 615 Kilobytes tilsammen, når man skriver selve animasjonen i SVG. 10 Dette er langt mer enn i virkligheten, da storparten av filen er SVG-kode, som bare består av ASCII-tegn. 9

Oppgave 3 Når lyd og bilde spilles av samtidig, kan det være svært vanskelig å spille av begge deler slik at de blir sammenfallende. Å synkronisere lyd og bilde er å koordinere lyd og bilde som en funksjon av tiden [10]. Særlig når lyden/bildet er komprimert, har man behov for å vite at riktig informasjon dekodes på riktig tid. Vi kan bruke cue points som inneholder informasjon om relasjonen mellom lyd og bilde i tiden for å løse dette problemet. Et eksempel på et system av slike punkter er time code. A time code is a sequence of numeric codes generated at regular intervals by a timing system. [11] Dette er såkalt metadata data om data. En avspiller kan hente ut informasjon om timing mellom lyd og bilde med gitte intervaller, og sørge for at den spiller av riktig lyd til riktig bilde. Det finner ulike formater for slik data, skjønt det vil være naturlig å lagre informasjonen på formen time/minuttt/sekund/bilde [11]. 10

Bibliografi [1] Cyganski & Orr, Information Technology: Inside and outside, Prentice Hall, New Jersey 2001. [2] Eric W. Weisstein, Rayleigh Criterion, [online], http://scienceworld.wolfram.com/physics/rayleighcriterion.html [3] Fritz Albregtsen, Bilder I, [online], http://www.ifi.uio.no/ inf1040/foiler2004/bilde1_2004.pdf, samt ukeoppgaver uke 46, [online], http://www.ifi.uio.no/ inf1040/oppgaver2004/uke46_47.pdf [4] Melles Griot Optics Guide Diffraction, [online], http://www.mellesgriot.com/products/optics/fo_3_1.htm [5] Wikipedia, Angular resolution, [online], http://en.wikipedia.org/wiki/rayleigh c riterion [6] Wahlström & Widstrand, norsk utave ved Willian Nilsen Gunnesdal, Matematikkleksikon, Kunnskapsforlaget, Gjøvik 1997. [7] Wikipedia, Nyquist-Shannon sampling theorem, [online], http://en.wikipedia.org/wiki/nyquist_theorem [8] Wikipedia, Speech encoding, [online], http://en.wikipedia.org/wiki/speech_encoding [9] J. Ferraiolo m. fl., Scalable Vector Graphics (SVG) 1.0 Specification, [online], http://www.w3.org/tr/2001/rec-svg-20010904, 4. september 2001. [10] Wikipedia, Synchronisation, [online], http://en.wikipedia.org/wiki/synchronisation [11] Wikipedia, Time code, [online], http://en.wikipedia.org/wiki/time_code 11

Tillegg A Eksempel på en murianimasjon i SVG 1 <?xml version="1.0" encoding="utf-8" standalone="no"?> 2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" 3 "http://www.w3.org/tr/2001/rec-svg-20010904/dtd/svg10.dtd"> 4 <svg xmlns:a="http://ns.adobe.com/adobesvgviewerextensions/3.0/" 5 viewbox="0 0 465 250" width="20cm" height="20cm"> 6 7 <defs> 8 <style type="text/css"><![cdata[ 9.tegl { 10 fill: red; 11 stroke: gray; 12 stroke-width: 1; 13 } 14 15.undertekst { 16 font-family: Arial; 17 font-size: 15; 18 fill: DarkGray; 19 visibility: hidden; 20 text-anchor: middle; 21 } 22 23 #tittel { 24 font-family: Arial; 25 font-size: 20; 26 font-weight: bold; 27 text-anchor: middle; 28 } 29 30 ]]></style> 31 </defs> 32 33 <text id="tittel" x="300" y="75" font-rendering="optimizelegibility"> 34 <animate attributename="fill-opacity" from="0" to="1" dur="2s" begin="0" /> 35 1/2-steins løperforband 36 </text> 37 38 <a:audio xlink:href="lyd1.wav" begin="0s" dur="2s"></a:audio> 39 <text class="undertekst" dur="2s" x="300" y="130" > 40 <animate attributename="visibility" from="visible" to="hidden" dur="3s" fill="freeze" /> 41 Sålen ligger klar. 42 </text> 43 44 <rect width="310" height="10" fill="black" x="150" y="300" /> 45 46 <a:audio xlink:href="lyd2.wav" begin="3s" dur="6s" /> 47 <text class="undertekst" x="300" y="130" > 48 <animate attributename="visibility" from="visible" to="hidden" begin="3s" dur="6s" fill="freeze 12

" /> 49 Vi starter med tre løpere. 50 </text> 51 52 <rect class="tegl" width="100" height="30" x="-103"> 53 <animate attributename="x" from="-100" to="155" dur="1s" begin="3s" fill="freeze" /> 54 <animate attributename="y" from="0" to="270" dur="1s" begin="3s" fill="freeze" /> 55 </rect> 56 <rect class="tegl" width="100" height="30" x="-103"> 57 <animate attributename="x" from="-100" to="255" dur="1s" begin="4s" fill="freeze" /> 58 <animate attributename="y" from="0" to="270" dur="1s" begin="4s" fill="freeze" /> 59 </rect> 60 <rect class="tegl" width="100" height="30" x="-103"> 61 <animate attributename="x" from="-103" to="355" dur="1s" begin="5s" fill="freeze" /> 62 <animate attributename="y" from="0" to="270" dur="1s" begin="5s" fill="freeze" /> 63 </rect> 64 65 <a:audio xlink:href="lyd3.wav" begin="6s" dur="4.7s" /> 66 <text class="undertekst" x="300" y="130" > 67 <animate attributename="visibility" from="visible" to="hidden" begin="6s" dur="12s" fill="freeze " /> 68 Neste skift må starte med en 1/2-stein. 69 </text> 70 71 <rect class="tegl" width="50" height="30" x="-103"> 72 <animate attributename="x" from="-103" to="155" dur="1s" begin="9s" fill="freeze" /> 73 <animate attributename="y" from="0" to="240" dur="1s" begin="9s" fill="freeze" /> 74 </rect> 75 76 <a:audio xlink:href="lyd4.wav" begin="12s" dur="1.7s" /> 77 <text class="undertekst" x="300" y="130" > 78 <animate attributename="visibility" from="visible" to="hidden" begin="12s" dur="4s" fill="freeze " /> 79 Så to løpere. 80 </text> 81 82 <rect class="tegl" width="100" height="30" x="-103"> 83 <animate attributename="x" from="-103" to="205" dur="1s" begin="12s" fill="freeze" /> 84 <animate attributename="y" from="0" to="240" dur="1s" begin="12s" fill="freeze" /> 85 </rect> 86 <rect class="tegl" width="100" height="30" x="-103"> 87 <animate attributename="x" from="-103" to="305" dur="1s" begin="12" fill="freeze" /> 88 <animate attributename="y" from="0" to="240" dur="1s" begin="12s" fill="freeze" /> 89 </rect> 90 91 <a:audio xlink:href="lyd5.wav" begin="14s" dur="2.7s" /> 92 <text class="undertekst" x="300" y="130" > 93 <animate attributename="visibility" from="visible" to="hidden" begin="14s" dur="7s" fill="freeze " /> 94 Så en 1/2-stein. 95 </text> 96 97 <rect class="tegl" width="50" height="30" x="-103"> 98 <animate attributename="x" from="-103" to="405" dur="1s" begin="14s" fill="freeze" /> 99 <animate attributename="y" from="0" to="240" dur="1s" begin="14s" fill="freeze" /> 100 </rect> 101 102 <a:audio xlink:href="lyd6.wav" begin="18s" dur="5s" /> 103 <text class="undertekst" x="300" y="130" > 104 <animate attributename="visibility" from="visible" to="hidden" begin="18s" dur="7s" fill="freeze " /> 105 Tredje skift legges som første skift. 106 </text> 107 108 <rect class="tegl" width="100" height="30" x="-103"> 109 <animate attributename="x" from="-100" to="155" dur="1s" begin="17s" fill="freeze" /> 110 <animate attributename="y" from="0" to="210" dur="1s" begin="17s" fill="freeze" /> 111 </rect> 112 <rect class="tegl" width="100" height="30" x="-103"> 113 <animate attributename="x" from="-100" to="255" dur="1s" begin="17s" fill="freeze" /> 114 <animate attributename="y" from="0" to="210" dur="1s" begin="17s" fill="freeze" /> 115 </rect> 116 <rect class="tegl" width="100" height="30" x="-103"> 117 <animate attributename="x" from="-103" to="355" dur="1s" begin="17s" fill="freeze" /> 13

118 <animate attributename="y" from="0" to="210" dur="1s" begin="17s" fill="freeze" /> 119 </rect> 120 121 <a:audio xlink:href="lyd7.wav" begin="22s" dur="2s" /> 122 <text class="undertekst" x="300" y="130" > 123 <animate attributename="visibility" from="visible" to="hidden" begin="22s" dur="7s" fill="freeze " /> 124 Og så videre... 125 </text> 126 127 <rect class="tegl" width="50" height="30" x="-103"> 128 <animate attributename="x" from="-103" to="155" dur="1s" begin="22s" fill="freeze" /> 129 <animate attributename="y" from="0" to="180" dur="1s" begin="22s" fill="freeze" /> 130 </rect> 131 132 <rect class="tegl" width="100" height="30" x="-103"> 133 <animate attributename="x" from="-103" to="205" dur="1s" begin="22s" fill="freeze" /> 134 <animate attributename="y" from="0" to="180" dur="1s" begin="22s" fill="freeze" /> 135 </rect> 136 137 <rect class="tegl" width="100" height="30" x="-103"> 138 <animate attributename="x" from="-103" to="305" dur="1s" begin="22" fill="freeze" /> 139 <animate attributename="y" from="0" to="180" dur="1s" begin="22s" fill="freeze" /> 140 </rect> 141 142 <rect class="tegl" width="50" height="30" x="-103"> 143 <animate attributename="x" from="-103" to="405" dur="1s" begin="22s" fill="freeze" /> 144 <animate attributename="y" from="0" to="180" dur="1s" begin="22s" fill="freeze" /> 145 </rect> 146 147 <rect width="320" height="262" stroke="gray" stroke-width="1" fill-opacity="0.1" 148 x="144" y="54"/> 149 </svg> 14