University of Sunderland CDM105 Session 1. University of Sunderland CDM105 Session 1 Assessment This...
-
Upload
philomena-carroll -
Category
Documents
-
view
215 -
download
0
Transcript of University of Sunderland CDM105 Session 1. University of Sunderland CDM105 Session 1 Assessment This...
University of Sunderland CDM105 Session 1
University of Sunderland CDM105 Session 1
AssessmentAssessment
• This module is assessed by 2 pieces of practical Coursework
– Coursework 1 is worth 40% of the final mark and is based on a developing a set of web pages
– Course work 2 is worth 60% of the final mark and is based on developing an advanced multimedia set of web pages
• There are no examinations
University of Sunderland CDM105 Session 1
Course ObjectivesCourse Objectives
• To be aware of Web design issues
• Basic understanding of HTML
• To be capable of adding Java Applets to Web pages
Stage One - Fundamental Skills
University of Sunderland CDM105 Session 1
Course ObjectivesCourse Objectives
• To be able to use Web authoring tools to enhance and manage web sites– e.g. Macromedia Dreamweaver and Macromedia Flash
• To be able to add simple multimedia elements to web sites
• Cascading Style Sheets (CSS)• To fully understand the principles of
information design
Stage Two - Web Authoring Skills
University of Sunderland CDM105 Session 1
Course ObjectivesCourse Objectives
• Web programming– JavaScript and Flash ActionScript
• XML
Stage Three - Advanced Web Development
University of Sunderland CDM105 Session 1
Web SiteWeb Site
• PowerPoint lecture slides available • The machine based session will cover:
– Background Internet information– Searching the web– Basic HTML– HTML layout (tables and frames)– JavaScript and XML– Macromedia Dreamweaver and Flash
University of Sunderland CDM105 Session 1
BooksBooks
• Key texts (i.e. books you must read )
• Bruce, B - Sams Teach Yourself Dreamweaver MX 2004 in 24 hours. Sams
• Ulrich, K - Visual Quickstart Guide FLASH MX 2004 for Windows and Macintosh
University of Sunderland CDM105 Session 1
Web AuthoringWeb Authoring
Multimedia Assets
Pictures, Video and Sound
on the web
University of Sunderland CDM105 Session 1
PicturesPictures
• Vectors - Vector graphics describe the picture according to their geometric characteristics.
• Bitmaps - With bitmaps, images are represented by means of a grid of small squares, like a mosaic, that are known as pixels.
University of Sunderland CDM105 Session 1
VectorsVectors
• mathematical objects that define shapes
• permits them to be scaled up or down to any size without any loss of detail or clarity
• Small file size - Good for Logos
• Used in Macrodmedia FLASH
University of Sunderland CDM105 Session 1
BitmapsBitmaps
• Made up of a number of pixels
if you scale the image
up or down it will lose
some of its detail or
become jagged
GENERAL RULE :Create at the size you want to use it !
University of Sunderland CDM105 Session 1
BitmapsBitmaps
Note that the enlargedimage is slightly blurred
As a software packagehas had to “guess” the colourof the extra pixels addedwhen the image was enlarged
University of Sunderland CDM105 Session 1
Web BitmapsWeb Bitmaps
• GIFs (Graphic Interchange Format)
• JPGs (or JPEGs, which stands for Joint Picture Experts Group)
• PNGs (Portable Network Graphic)
Graphical formats used on the web
University of Sunderland CDM105 Session 1
GIFGIFs
• Hardware independent (cross platform)• Uses the lossless LZW (Lempel-Ziv Welch)
compression algorithm• Limited to 8-bit colour depth
– degradation of photo-realistic images– permits single transparent colour– GIF89A specification permits animations
• Copyright problems - LZW is patented
(Graphic Interchange Format)(Graphic Interchange Format)
University of Sunderland CDM105 Session 1
JPGsJPGs
• Uses a lossy compression algorithm• 24 bit colour depth
• Developed from research into human vision – exploits weakness in human visual perception: greater
sensitivity to changes in brightness than colour– discards some information
• Can reduce file size to 1/25 of their original size
(Joint Picture Experts Group)(Joint Picture Experts Group)
University of Sunderland CDM105 Session 1
JPGsJPGsHighest Quality
Lowest CompressionLarger File Size
Lowest QualityHighest Compression
Smaller File Size
Note how the image degrades
University of Sunderland CDM105 Session 1
PNGsPNGs
• 48 bit colour depth• Layer transparency• Patent and license-free• lossless compression• Support in Internet Exploxer 4+ and Netscape
4+• Been in existence for 6 years but not supported
by most browsers• Widely used by graphical editor
– i.e. Adobe PhotoShop
(Portable Network Graphic)(Portable Network Graphic)Tip: The best format to store Bitmap graphics when you first capture an image and whenyou edit it. When you are happy with theimage convert it to a JPEG to use on the web.
University of Sunderland CDM105 Session 1
Sound File FormatsSound File Formats
• WAV - de facto standard for music and sound in Microsoft Windows– supports mono/stereo, 16 or 8 bit
– different sampling rates
• AU - developed for digital sound on Unix platforms– used as the standard format in Java
• MIDI - Musical Instrument Digital Interface– standard protocol to communicate music (1983 onwards)
• MPEG – A video and sound compression format widely used to download music from the internet
University of Sunderland CDM105 Session 1
Inserting Sounds into HTMLInserting Sounds into HTML
• The only standard tag in HTML at the current time to include sound that will function in the main Browsers
WITHOUT a PLUGIN application
<EMBED SRC="music.wav" WIDTH="150"
HEIGHT="60" CONTROLS="TRUE" LOOP="TRUE">
University of Sunderland CDM105 Session 1
Video File FormatsVideo File Formats• AVI - Audio Video Interleave
– Windows format which has been greatly improved since it was first introduced. It now has a good standard compression algorithm to reduce the file size.
– Single track for video and audio
• QuickTime– Developed by Apple
– Multiple tracks for video and sound but has to be reduced to a single video and audio to work in Windows.
• MPEG - Motion Picture Experts Group– MPEG2 is used by DVDs (Uses the same lossy compression system as
used in JPEG still images)
University of Sunderland CDM105 Session 1
Inserting Video into HTMLInserting Video into HTML
• The only standard tag in HTML at the current time to include sound that will function in the main Browsers
<EMBED SRC="video.avi" WIDTH="160"
HEIGHT="150” CONTROLS="TRUE"
LOOP="FALSE">
University of Sunderland CDM105 Session 1
StreamingStreamingAudio and VideoAudio and Video
• Developed first by RealNetworks– RealVideo and RealAudio
• Video/Audio is broadcast by a server on the network. End users turn in by choosing the correct address. The server breaks the video/sound into small packages/units and sends them to client browser (rather than the client having to download the complete video/sound file first before playing)
• Streaming of video and/or sound is also supported by the Apple Quicktime player and the Microsoft Windows Media Player
University of Sunderland CDM105 Session 1
Streaming Audio and Streaming Audio and VideoVideo
• Today, there are a number of software solutions to streaming but most are based around the MPEG compression codecs – i.e. MPEG 3 for music files– MPEG 2 for video– Plus the new MPEG 4 standard
• The use of MPEG compression codecs results in the smallest file size which is why it is very widely used on the web to deliver multimedia content
University of Sunderland CDM105 Session 1
Java AppletsJava Applets
• Self contained programs that execute or run inside the Browser
• Written in the programming language Java
• HTML structure used to include Applets
<APPLET CODE="first" WIDTH="100" HEIGHT="200">
<PARAM NAME="IMAGE" value="picture.gif">
<PARAM NAME="DATE" value="01/01/2000">
</APPLET>
University of Sunderland CDM105 Session 1
ShockwavesShockwaves
• Web versions of Macromedia programs– Authorware– Director– Flash
• Easier to develop than Java• Browsers require a plug-in
– The plugging is free and often pre-installed on new PCs.
– Latest figures show that over 90% of all devices connected to the Internet has the player installed.
University of Sunderland CDM105 Session 1
Machine Based TutorialMachine Based Tutorial
• The tutorial session requires you to read over web based materials and complete the exercises contented within them
• In the machine based tutorial session you will read about the history of the Internet, develop simple web pages.
• You should aim to complete the machine based tutorial session 1 before the next lecture.