2. November 1, 2001ICTCM Workshop1 Multi-Media on Your Website No longer just a silent movie Professor Michael S. Pilant Department of Mathematics Texas A&M University

3. November 1, 2001ICTCM Workshop2 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

4. November 1, 2001ICTCM Workshop3 Multi-Media on Your Website Part I What is multimedia? What is multimedia? “I’ll know it when I see it …” Pre-World Wide Web  Movies, slide-shows  Audio-visual presentations, laser disks  IBM PC (introduced in 1981)  Apple Macintosh (introduced in 1984)

5. November 1, 2001ICTCM Workshop4 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Post-World Wide Web (1989)  Apple QuickTime (1991)  Windows AVI and Video for Windows (1992)  Windows 3.1 (1992)

6. November 1, 2001ICTCM Workshop5 Multi-Media on Your Website Part II What is multimedia? What is multimedia?  Creating Multimedia We will focus on applications with:  Mathematical Content  Student Audience  Integration with courseware  Examples

7. November 1, 2001ICTCM Workshop6 Multi-Media on Your Website What is multimedia? What is multimedia? Common components  Mixed-media  Nonlinear  Modular  Interactive  Computer-based  Just-in-time

8. November 1, 2001ICTCM Workshop7 Multi-Media on Your Website What is multimedia? What is multimedia? Example – Microsoft PowerPoint

9. November 1, 2001ICTCM Workshop8 Multi-Media on Your Website What is multimedia? What is multimedia?  Background  Evolution of Personal computers  Graphics standards  Graphical user interfaces  Hypermedia  Internet  World Wide Web

10. November 1, 2001ICTCM Workshop9 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Personal Computers In 1981, IBM introduces the PC (personal computer) In 1984, Apple launches the Macintosh - integrates a GUI and a mouse

11. November 1, 2001ICTCM Workshop10 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards GIF87 (Graphics Interchange Format) – June, 1987. [CompuServe]. The purpose was to allow interchange of high resolution graphics on the internet using loss-less compression

12. November 1, 2001ICTCM Workshop11 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards GIF89a extension [CompuServe]. Extended the 1987 GIF standards to allow, for example, animation.

13. November 1, 2001ICTCM Workshop12 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards JPEG – August, 1990. [Joint Photographic Experts Group]. ISO (International Standards Organization) lossy compression algorithm.

14. November 1, 2001ICTCM Workshop13 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards PNG – October, 1996. [Portable Network Graphics]. W3C Standard. Lossless compression algorithm supporting true color (24 bit), transparency.

15. November 1, 2001ICTCM Workshop14 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards QuickTime – 1991. [Apple]. Extended QuickDraw API to include timing information (hence QuickTime)

16. November 1, 2001ICTCM Workshop15 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphics Standards AVI (Audio Video Interleave) and VFW (Video for Windows) – 1992. [Microsoft]. Developed for general purpose video capture in Windows 3.1

17. November 1, 2001ICTCM Workshop16 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Graphical User Interfaces (GUIs) November 20, 1985 – Windows 1.0 ships April 6, 1992 – Windows 3.1 ships May 24, 1993 – Windows NT 3.1 launched August 24, 1995 – Windows 95 launched July 31, 1996 – Windows NT 4.0 launched June 25, 1998 – Windows 98 launched

18. November 1, 2001ICTCM Workshop17 Multi-Media on Your Website What is multimedia? What is multimedia? Background – Hypermedia and the Internet In 1945, Vannevar Bush proposes Memex, a microfiche based repository of linked documents. In 1965, Ted Nelson proposes Xanadu, an electronic repository of world literature. In 1983, the Internet is created.

19. November 1, 2001ICTCM Workshop18 Multi-Media on Your Website What is multimedia? What is multimedia? Background – World Wide Web In 1989, Tim Berners ‑ Lee, a researcher at the CERN high energy physics facility in Geneva Switzerland, proposed the development of a tool to enable collaboration between physicists and other researchers in the high energy physics community.

20. November 1, 2001ICTCM Workshop19 Multi-Media on Your Website What is multimedia? What is multimedia? Background – World Wide Web Berners-Lee drafted a proposal called A Hypertext and CERN @ and sent out a request for comments. His proposal included the first formulations of the HTML, the http protocol, and the concept of client software (web browser). The world wide web (WWW) is born…

21. November 1, 2001ICTCM Workshop20 Multi-Media on Your Website What is multimedia? What is multimedia? Background – World Wide Web Mosaic 1.0 - released Nov. 1993. Netscape 1.0 - December 1994. Internet Explorer 1.0 - August 1995. Opera 1.0 - December 1996.

22. November 1, 2001ICTCM Workshop21 Multi-Media on Your Website What is multimedia? What is multimedia? Background – World Wide Web Netscape 2.0 –support for Java, JavaScript and plug-ins Netscape 4.0, IExplorer 4.0 – support for dynamic HTML (DHTML) IExplorer 5.0 – support for XML

23. November 1, 2001ICTCM Workshop22 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

24. November 1, 2001ICTCM Workshop23 Multi-Media on Your Website Do I need it? Do I need it? How is your valuable class time utilized?   Introduce new concepts   In-depth explanations and examples   One-on-one student interaction   Group discussion   Overview

25. November 1, 2001ICTCM Workshop24 Multi-Media on Your Website Do I need it? Do I need it? What would you like to be done outside of class?  Repetitive tasks  Reinforcement of basic concepts  Practice tests  Homework  Pre- and post- tests  Equalizing skill level  Projects Web-enhanced instruction and multimedia…

26. November 1, 2001ICTCM Workshop25 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

27. November 1, 2001ICTCM Workshop26 Multi-Media on Your Website What can I do with it? What can I do with it? As an instructor:  Engage students’ attention  Re-use resources  Visualize abstract concepts  Capture lectures  Add interactivity to web-based materials

28. November 1, 2001ICTCM Workshop27 Multi-Media on Your Website What can I do with it? What can I do with it? As an mathematics instructor:  Develop mathematical content [HTML]  Provide drawings, illustrations [GIF, Animations, digital whiteboard]  Provide descriptions in words [Audio]  Explain by actions [Video]

29. November 1, 2001ICTCM Workshop28 Multi-Media on Your Website What can I do with it? What can I do with it? As an student:  Watch a concept being presented, step by step, as many times as you wish  Interact with related materials (synchronized multimedia)

30. November 1, 2001ICTCM Workshop29 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

31. November 1, 2001ICTCM Workshop30 Multi-Media on Your Website What are the costs? What are the costs?  Development of content  Converting existing content  Training  Annotating, indexing  Delivery  Commercial software

32. November 1, 2001ICTCM Workshop31 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

33. November 1, 2001ICTCM Workshop32 Multi-Media on Your Website What are the benefits? What are the benefits?  Re-usability of content  Maintaining quality as class size increases  Just-in-time instruction  Instruction-at-a-distance  Scalability

34. November 1, 2001ICTCM Workshop33 Multi-Media on Your Website Part I What is multimedia? What is multimedia? Do I need it? Do I need it? What can I do with it? What can I do with it? What are the costs? What are the costs? What are the benefits? What are the benefits? How do I get started? How do I get started?

35. November 1, 2001ICTCM Workshop34 Multi-Media on Your Website How do I get started? How do I get started?  Choose a platform (PC, Mac, Unix)  Create audio/video content  Get it onto the computer  Convert it  Index, annotate  Put it all back together …

36. November 1, 2001ICTCM Workshop35 Multi-Media on Your Website Levels of Complexity Levels of Complexity 5. Audio/Visual 6. Plug-ins 7. Streaming Video 8. Synchronized Multimedia 1. Static Images 2. Animation 3. Audio segments 4. Music

37. November 1, 2001ICTCM Workshop36 Multi-Media on Your Website Multimedia Input Multimedia Input  External  Digital cameras (IEEE 1394= Fire Wire)  Analog video (TV, VCR)  Analog audio (microphones) Generally, you need a video input (e.g. a video capture card) and sound input (e.g. a sound card)

38. November 1, 2001ICTCM Workshop37 Multi-Media on Your Website Multimedia Input Multimedia Input  Internal  Screen captures  Existing multimedia files

39. November 1, 2001ICTCM Workshop38 Multi-Media on Your Website Video Input Video Input  NTSC  PAL  SECAM  Composite  S-Video  Digital Video

40. November 1, 2001ICTCM Workshop39 Multi-Media on Your Website Video Compression/Decompression (CODECs) Video Compression/Decompression (CODECs)  Cinepak – developed in 1990  H.261 and H.263 – based on DCT, used for videoconferencing (basis for MPEG)  Indeo 3.2 – developed in 1980’s  Photo-JPEG – for slideshows

41. November 1, 2001ICTCM Workshop40 Multi-Media on Your Website Video CODECs Video CODECs  M-JPEG – Motion JPEG – JPEG compression of each individual frame  MPEG-1 – fixed bit rate (1.15 Mbps)  MPEG-2 – variable bit rate (4-9.8 Mbps)  MPEG-4,7,21 –

42. November 1, 2001ICTCM Workshop41 Multi-Media on Your Website Video CODECs Video CODECs  Real Video 8 – wavelet, variable bit rate  Sorenson Video – basic codec for QuickTime  Windows Media – based on MPEG-4

43. November 1, 2001ICTCM Workshop42 Multi-Media on Your Website Audio CODECs Audio CODECs  MP3 – MPEG Layer III Audio  Real Audio – basic codec for QuickTime  Windows Media – based on MPEG-4  G.723.1 - videoconferencing

44. November 1, 2001ICTCM Workshop43 Multi-Media on Your Website Streaming Formats (current) Streaming Formats (current)  Windows Media 8  H.263, MPEG-4 (primary), Indeo 3.2 and Indeo 4.1  QuickTime 4, 5  Sorenson, Cinepak, Indeo 3.2 and 4.1  Real Media G2, 8

45. November 1, 2001ICTCM Workshop44 Multi-Media on Your Website Step by Step Step by Step 1. Create one or more AVI video files by video capture card, screen capture, or other means 2. Create one or more sound/music files by sound card or other means 3. *Edit the video and sound files to incorporate any “special effects,” captions, titles, etc.

46. November 1, 2001ICTCM Workshop45 Multi-Media on Your Website Step by Step Step by Step 4. Encode audio/video file into streaming format 5. Index streaming media file 6. Synchronize media

47. November 1, 2001ICTCM Workshop46 Multi-Media on Your Website Bandwidth Matrix Bandwidth Matrix Cellular [9.6 – 19.2 Kbps] Slideshows, Flash Modem [28.8 – 56 Kbps] Low band streaming ISDN [64 – 128 Kbps] Videoconferencing DSL/Cable [128 K – 2 Mbps] Hi band streaming T1[1.5 Mbps] Hi band streaming Wireless [1 – 11 Mbps] Hi band streaming Ethernet [10 – 100 Mbps] Full screen video

48. November 1, 2001ICTCM Workshop47 Multi-Media on Your Website Useful Links Useful Links http://www.academicsolutions.com/workshop/ http://www.math.tamu.edu/~dallen/ictcm2001/ http://ictcm.tamu.edu/ http://www.math.tamu.edu/~mpilant/ictcm/