Presentation laddar. Vänta.

Presentation laddar. Vänta.

INT3 medieteknik Om text, bild, ljud och video DSV Peter Mozelius.

Liknande presentationer


En presentation över ämnet: "INT3 medieteknik Om text, bild, ljud och video DSV Peter Mozelius."— Presentationens avskrift:

1 INT3 medieteknik Om text, bild, ljud och video DSV Peter Mozelius

2 En texts läsbarhet  Teckensnitt  Teckengrad  Radlängd  Radavstånd  Papper/Skärm  Bakgrundsfärg

3 Teckensnitt Teckensnitt kan delas in i två huvudgrupper:  Antikva, med anor från renässansen – MED serifer som i denna föreläsnings rubriker Några av de antikva-teckensnitt som framtogs under och 1500-talet anses allmänt ge mycket god läsbarhet när det gäller löpande text (brödtext) på papper.

4 En antikva från 1500-talet Garamond skuren av Claude Garamond

5 Teckensnitt  Sanserif, utvecklades under 1800-talet – utan serifer som i texten på denna rad Andra benämningar för sanserif: Grotesk, linjär, gothic, egyptian … Exempel på sanserifer: Arial, Helvetica, Franklin Gothic och Verdana

6 Sanserif Grekisk ursanserif från 500 f Kr. Ett bustrofedon med växlande skrivriktning för varannan rad.

7 En modern sanserif  Verdana – Designad för datorskärm – Skuren av Matthew Carter – Beställd av Microsoft – Hela denna bild är Verdana – En intervju med Carter finns på:

8 Teckengrad/radlängd Teckengrad = bokstävernas storlek  För god läsbarhet i löpande text: – 10 –12 punkter Radlängd = antal tecken per rad En ideal rad i en brödtext innehåller 55 – 65 tecken.

9 Radavstånd  Avståndet mellan rader kallas även kägel.  Kägeln ska vara minst lika stor som textens teckengrad och gärna lite större.  Olika radavstånd för olika teckensnitt.  Ibland anges teckensnitt – kägel enligt 10/12 med betydelsen: 10 punkters teckengrad / 12 punkters radavstånd

10 Papper / skärm En grundregel för brödtext kan vara: Antikva för papperspublikationer Sanserif för det som ska läsas på en skärm  i Cascading Style Sheets Paus 15 min

11 Digitala bilder  Vi gör även här en distinktion mellan – PAPPER – SKÄRM  Exempel på format för bilder som ska tryckas med hög upplösning: – Photoshops egna.psd – Det mer allmänna.tif Hög kvalitet MEN mycket stora filer.

12 Digitala bilder  Då datorskärmarnas upplösning fortfarande är så låg som 96 dpi så kan vi på datorn ändå inte tillgodagöra oss den höga kvaliteten.  Det är också nödvändigt att minska bildstorleken vid internetpublicering.  Stora filer ger lång nedladdningstid.  Lösningen är komprimeringsalgoritmer.  Ett exempel är GIF-bildens LZW-komprimering.

13 Bildformat för Internet  Vektorgrafik och punktgrafik (bitmap)  Vektorgrafik byggs upp av formler  En populär variant av vektorgrafik är SVG  Exempel på punktuppbyggda bildformat som passar för internetpublicering är: GIF JPEG PNG

14 Bildformat för Internet  GIF, en gammal trotjänare  GIF87a och den uppdaterade GIF89a  8 bitars färgdjup färger  Transparens för 1 färg  Interlace (sammanflätning)  Animering genom en serie av GIF-bilder  Passar bra för diagram, ikoner och teckningar

15 Bildformat för Internet  JPEG-formatet – Framtaget av Joint Photographic Experts Group  24-bitars färgdjup för fotorealistiska bilder  Förstörande irreversibel kompression  Passar för fotografier, målningar och liknande  Progressiva JPEG-bilder i stil med GIF-interlace  Stödjs precis som GIF av de flesta webb-läsare

16 Bildformat för Internet  PNG-bilder – Portable Network Graphics  PNG = GIF + JPEG + lite till  Icke-förstörande kompression utan ägare med bättre packratio än GIF/LZW  16-bitars alfa-kanal för transparens  Framtidens bildformat?

17 Framtidens format  Det har i flera år talats om att PNG ska ta över  Det har gått lite trögt JPEG2000  Nu finns också JPEG2000  En vidareutveckling av JPEG  Förbättrad komprimering: – högre packratio – mindre filer – högre kvalitet vid kraftig komprimering

18 Bildformat i Authorware  Stödjer internetformaten – jpg – gif – png  Men även ”Windowsformatet”.bmp  Och Photoshops.psd MEN då måste först eventuella lager ha plattats ihop till ett enda  Animerade gif-bilder går också bra

19 Aliasing  I bilder < 500KB  Ögat kan se pixeluppbyggnaden  Framför allt problem med nästan horisontella eller nästan vertikala linjer  Syns extra tydligt vid skarpa linjer och detaljer med hög kontrast mot bakgrunden  Som motmedel finns tekniken anti-aliasing

20 Text och bild i Photoshop  Hur ska vi då praktiskt tillämpa det som vi hittills har pratat om?  Vi ska titta på några av dessa tekniker när vi nu i Adobe Photoshop scannar in en bild.  På denna bild lägger vi sedan på en text med anti-aliasing och spar den sedan som en JPEG. Vi behöver nog först en rast.

21 Digitala ljudformat  En dator arbetar mest med samplade ljud  Analogt ljud Digitalt ljud  Ljudfiler skapas med samplingsfrekvenser  Sampling med 44 KHz ger CD-kvalitet och återger ljud upp till ca 20 KHz (hi-fi)  Övertoner gör musiken njutbar!?

22 Digitala ljudformat  En annan faktor som påverkar ljudkvaliteten är lagringsformatet  Fler bitar --- bättre kvalitet --- större filer  1bit ger ljud eller icke ljud  16 bitar ger möjliga värden  Talat ljud brukar lagras med 8 bitar  Avancerade ljudformat >= 24 bitar

23 Digitala ljudformat  Vid sampling av tal räcker < 4 KHz  En telefon jobbar mellan Hz  Harry Nyquists samplingsteorem  Du ska sampla med dubbla frekvensen för ljudfrekvensen du vill återge  Exempel: Ljud mellan 0 - 4KHz du samplar med 8KHz (8000/sek)

24 Digitala ljudformat  Riktigt bra ljudkvalitet som t ex Dolby Digital(AC-3) eller DTS (DTS = Digital Theater Sound) kräver stort lagringsutrymme och tar tid att skicka över Internet  Det som fungerar via bredband kan ge kraftiga problem på en modemuppkoppling.

25 Digitala ljudformat  Lagringsutrymmet = A * B * C – A = Samplingsfrekvensen i Hz – B = Representationen i bitar – C = Antalet kanaler – 44KHz * 16 bitar * 2 kanaler = CD-kvalitet – vilket slukar ca 166K/sekund  Tur att hårddiskarna blir större [:=)

26 Digitala ljudformat  Några vanliga samplade filformat – filnamn.au, 8-bitars kompakt ljudformat (Solaris) – filnamn.wav, 16-bitarformat (Windows/Atari) – filnamn.aif ELLER.aiff (Mac)  Icke-samplat ljudformat – Filnamn.mid (midi-filer)

27 Digitala ljudformat MIDI-formatet  Små snabbladdade icke-samplade filer  Innehåller inte själva musiken utan styrsignaler till ljudkort eller synthesizer  Enkelt att omvandla till notskrift  Nackdelar: – Ej för röster och sång – beroende av ljudkortet

28 Digitala ljudformat  MP3 – MPEG Layer 3  Utvecklat i Tyskland av Karlheinz Brandenburg  En perceptuell brusformningsmetod – att plocka bort de frekvenser som örat inte hör – tar bort höga toner i diskanten – tar bort de frekvenser med låg volym som slås ut av närliggande frekvenser med hög volym  Delade meningar om kvalitetsförsämringen

29 Ljudformat i Authorware  I Authorware (och Director) fungerar: – wav-filer – MP3-filer  Det går också att använda filmformaten: –.mov –.avi –.mpg

30 Digitala videoformat  Video är ännu mera skrymmande än audio  För Internet krävs komprimering  Smarta algoritmer för t ex – Inkrementell uppdatering (som i tecknade filmer) – Interlace (gammal TV-teknik)  Vanliga digitala videoformat på datorer: – fil.mov (Apple/Quicktime) – fil.avi (Windows/Microsoft)

31 Strömmande media  En populär teknik på hemsidor som fungerar både för audio och video.  Istället för att ladda hem hela filen till datorns hårddisk innan uppspelningen påbörjas så spelas innehållet upp under hämtningen.  Ett format för strömmande media är Realmedias fil.ram (metafil) + fil.rm  Detta går bl a att skapa i Adobe Premiere

32 För dig som vill läsa mera  Delar av materialet till denna föreläsning är hämtat från följande litteratur: – Christer Hellmark, Typografisk handbok – Astrid Haugland, Digital bildbehandling – Jennifer Niederst, Web design in a nutshell – Chapman & Chapman, Digital multimedia – Lon Barfield, Design for new media Finns på välsorterade bibliotek.

33 Länkar till övningar  Mina photoshopövningar: –  Skolverkets övningar: –  Ekdahls övningar: – Tack för mig! Tack för mig!


Ladda ner ppt "INT3 medieteknik Om text, bild, ljud och video DSV Peter Mozelius."

Liknande presentationer


Google-annonser