1. Digital Video
Faraz Khan

2. Basic Digital Video Concepts
Movie length
Frame size
Frame rate
Quality
Color bit depth
Data rate (bit rate)
CS118 – Web Engineering

3. Movie length File size is proportional to the movie length.
Videos longer than 1 or 2 minutes cause long download times.
If it is a long video, consider to use streaming video.
CS118 – Web Engineering

4. Frame size “Full-screen” video is 640x480 pixels.
The most common frame size for web video is 160x120 pixels.
Not recommend to use a frame size larger than 320x240.
The size depends on the CPU power and the Internet connection bandwidth.
CS118 – Web Engineering

5. Image and Video?
CS118 – Web Engineering

6. Frame rate
Frame rate is measured in number of frames per second (fps).
Standard TV-quality video uses 30 fps.
For the web, 15 or even 10 fps is more appropriate and produces fair smooth quality for the user.
Commercial Internet Broadcasts are using 0.5, 0.25 frames per second.
CS118 – Web Engineering

7. Quality
Many video-editors allow you to set the overall quality of the video.
The degree of compression controls the target quality.
The low or medium setting results a fairly high compression which is appropriate for web delivery.
Frame rate and quality are usually tradeoff in different applications.
CS118 – Web Engineering

8. Color bit depth
The number of pixel colors in each frame affects the size of the video.
The file size of the video will be greatly reduced by changing the number of colors from 24-bit to 8-bit.
It sacrifices the image quality of the video.
CS118 – Web Engineering

9. Data rate (bit rate)
This is the rate that the data must be transferred in order to ensure the video can play smoothly without interruption.
It is measured in kilobytes per second (K/sec or Kbps).
It can be calculated by dividing the size of the file (in K) by the movie length (in seconds).
E.g. the video file size is 1.9MB  1900K
Play 40 seconds long, Data rate = 47.5K/sec
Consider the Internet bandwidth!
CS118 – Web Engineering

10. Calculate space requirements of Video
NTSC video (640 x 480 and fps)
Frame size = ([Pixel width x pixel height x bit depth]/8)/1024
E.g. 200KB/Frame : 6.0 MB/sec
200KB x 30 fps = 6000KB/s, 6 MB/sec
PAL video (768 x 576 and 25 fps)
E.g. 200KB/Frame : 5.0 MB/sec
200KB x 25 fps = 5000KB/s, 5 MB/sec
CS118 – Web Engineering

11. Video CODECs CODEC is “Compression/Decompression” algorithms.
The sound and frame images of a digital video must be compressed.
The vast amount of data
Compressed in a number of ways
Lossless and Lossy compression
Spatial and Temporal compression
CS118 – Web Engineering

12. Video Clip Demo
reference
CS118 – Web Engineering

13. Lossless and Lossy compression
Lossless compression means no information is lost and the final file is the same as the original.
Most compression methods are lossy.
Sacrifices some data from the file in order to achieve higher compression rates.
Use complicated algorithm to toss out some data that is not discernible to the human eye or ear.
CS118 – Web Engineering

14. Spatial and Temporal compression
Spatial (Intraframe) compression takes place on each individual frame of the video.
Temporal (Interframe) compression applies on a series of frames, it takes advantages of areas of the image remain unchanged from frame to frame.
Relies on the key frames and delta frames.
A key frame is placed once every second.
E.g. 15 fps, a key frame once 15 frames.
CS118 – Web Engineering

15. Delta frame
CS118 – Web Engineering

16. Video File Formats QuickTime Movie (.mov) How to create? How to play?
Introduced by Apple Computer in 1991.
First developed for Macintosh, now also supports the PCs.
Also supports streaming.
How to create?
Most video editor, QuickTime Pro.
How to play?
QuickTime plug-in or QuickTime player.
CS118 – Web Engineering

17.
Quicktime
CS118 – Web Engineering

18. RealMedia (.rm) Industry standard streaming format.
RealPlayer for playback.
RealServer for serving streams.
RealProducer for creating .rm files.
Good for
Long-playing video or broadcast to many people.
How to create?
RealSystem Producer
How to play?
RealPlayer (Free), RealPlayer Plus (Commerical)
CS118 – Web Engineering

19. Windows Media (.wmv/ .asf)
Created by Microsoft, closely integrated with Windows OS.
Support Windows Media Video (.wmv) and Advanced Streaming Format (.asf) and other formats (.avi, .mpeg, …)
Also support streaming.
How to create?
Windows Media Encoder, Windows Media Author
How to play?
Media Player in Windows OS
CS118 – Web Engineering

20. AVI (.avi) Stands for Audio/Video Interleaved.
Introduced by Microsoft in 1992.
In a AVI file, the audio and video information are interleaved every frame.
Good for
Short web clips, high-quality video
How to create?
Most video editing tools.
How to play?
Windows Media, QuickTime, etc.
CS118 – Web Engineering

21. Video Clip Demo
reference
CS118 – Web Engineering

22. MPEG (.mpg/ .mpeg) Created by Moving Picture Experts Group (MPEG).
Supports 1) Video, 2) Audio, 3) Streaming.
Extremely high compression rates with small quality degradation (lossy).
MPEG-1 : VHS quality
MPEG-2 : HQ standard for TV broadcast
MPEG-4 : Very HQ for AV compression
MPEG can be compressed by using three schemes: Layer-I, Layer-II, Layer-III.
CS118 – Web Engineering

23. Official MPEG page
reference
CS118 – Web Engineering

24. MPEG Comparison MPEG-1 MPEG-2 MPEG-4 Standard since 1992 1995 1999
Default Video resolution (NTSC)
352 x 288
640 x 480
Max. Audio Frequency range
48 KHz
96 KHz
Max. audio Channel 2 8
Regular data rate
1380 kbit/s
6500 kbit/s
880 kbit/s
Frames per sec (NTSC) 30
Video Quality
Satisfactory
Very good
Very Good
Hardware requirement for encoding/decoding
Low
Medium
High
CS118 – Web Engineering

25. Flash & Shockwave Advantages: Disadvantages: File sizes are small
Image quality is high
It uses streaming technology
It uses high-quality streaming audio
It is scriptable
Disadvantages:
A plug-in player is required
Expensive authoring software
Problems on printing their content
CS118 – Web Engineering

26. Summary Discuss the basic digital audio/video terminology.
Introduction to different formats: WAV, MP3, QuickTime, RealMedia, Windows Media, AVI, MPEG.
To deliver long-playing audio/video or live broadcasts, you should choose one of the streaming media.
Flash and shockwave are popular and appropriate format for the Web.
CS118 – Web Engineering