Intech2100 Lecture Presentation - Multimedia Element - Audio PDF

WEB DESIGN AND MULTIMEDIA INTECH 2100 Types of Multimedia Sound/Audio Sound/Audio A multimedia application may require the use of speech, music and sound effects. These are called audio or sound element of multimedia. Speech is also a perfect way for teaching. Audi...

WEB DESIGN AND MULTIMEDIA INTECH 2100 Types of Multimedia Sound/Audio Sound/Audio A multimedia application may require the use of speech, music and sound effects. These are called audio or sound element of multimedia. Speech is also a perfect way for teaching. Audio are of analog and digital types. Analog audio or sound refers to the original sound signal. Computer stores the sound in digital Designed by macrovector / Freepik form. Therefore, the sound used in multimedia application is digital 3 audio. Uses of Sound/Audio Sound can enhance your website design and social media platforms. It is a multimedia application that uses dialogue, recorded narration, music, and sound effects. When used in moderation, adding multimedia such as sound to your presentation can be a great way to catch and focus the visitor’s attention, deliver information to visitors, and help reinforce the visitor’s comprehension of the information 4 presented. Types of Sound/Audio Short sound tracks are used to capture the user’s attention and make them focused on the map, animation or the selected element. They are no longer than a few seconds. Background sound (often music or ambient sound) creates a pleasant atmosphere for map perception. Positive perception of visually transmitted information can also be enhanced by sound effects that have no relation to the theme of the map. Sound effects that are activated when selecting a symbol or moving the cursor over can include applause (for theatres), fan 5 cheering (for stadiums), a plane taking off (for airports), ocean wave splash (for beaches) or crowd noise (for marketplaces). Types of Sound/Audio Digital audio data is the actual representation of sound, stored in the form of samples. Samples represent the amplitude (or loudness) of sound at a discrete point in time. The quality of digital recording depends on the sampling rate (or frequency), that is, the number of samples taken per second. 6 Digital Audio The three sampling frequencies most often used in multimedia are CD-quality 44.1 kHz, 22.05 kHz, and 11.025 kHz. The number of bits used to describe the amplitude of a sound wave when sampled determines the sample size. 7 Digital Audio Digital audio is device independent. The value of each sample is rounded off to the nearest integer (quantization). 8 Digital Audio Digitization is a process of converting the analog signals to a digital signal. There are three steps of digitization of sound. Sampling - is a process of measuring air pressure amplitude at equally spaced moments in time, where each measurement constitutes a sample. A sampling rate is the number of times the analog sound is taken per second. Quantization - is a process of representing the amplitude of each sample as integers or numbers. How many numbers are used to represent the value of each sample known as sample size or bit 9 depth or resolution. Digital Audio Encoding converts the integer base-10 number to a base-2 that is a binary number. The output is a binary expression in which each bit is either a 1(pulse) or a 0(no pulse). Pulse Code Modulation (PCM) is a method or technique for transmitting analog data in a digital and binary way independent of the complexity of the analog wave form. All types of analog data like video, voice; music etc. can be transferred using PCM. It is the standard form for digital audio in computers. 10 Basic Sound Editing Operations Trimming: Removing dead air or blank space and so on. Done using commands like cut , clear , Erase, Silence. Splicing and Assembly: Removal of extraneous noise , touch up, creating a longer recording by mixing many small recordings. Volume adjustments: when we combine one or more recording with different volume level, they must be made to run with a consistent volume level. We need to normalize it with a sound editor to a particular level. Format Conversion: While saving different formats are made available for sounds. Data may be lost during conversion. Ex. MP3,MP4 Resampling and down sampling: if we have sound recorded and edited the 11 sound at 16 bit sampling rate and using lower rates then RS & DS is necessary, as we may save lots of disk space. Basic Sound Editing Operations Fade in & Fade out: useful for sections that requires this effect. This enveloping helps to smooth out a beginning and end of the sound file. Equalization: allow us to modify a recordings frequency content so that it sounds brighter or darker. Time Stretching: allows to alter the length of the file. Useful but may degrade audio quality of the file. Digital Sound Processing: allows signals with reverberation, multi tap delay, chorus, flange and other special effects using DSP routines. Reversing Sound: Reversing or a part of a recording. Multiple Tracks: Being able to edit and combine multiple tracks, merge tracks 12 and then export them in a final mix to a single audio file is important. The Basics of Sound Quality. Audio Codecs are programs that compress data for transmission and decompress that data on the receiving end. Their speed is measured in thousands of bits processed per second, known as “bitrate” or “kbps,” this number varies even within a single format. Generally, a lower bitrate means a smaller file, but that also means more data (sound) is lost in compression. Other important factors are sample rate and bit depth. The sample rate is the number of samples (of signal amplitude or “sound”) per second. Bit depth refers to the number of bits per sample — the higher 13 this number, the fuller (and potentially louder) the sound. Audio File Formats LOSSY FORMATS MP3 (MPEG-1 Audio Layer III) is the most popular of the lossy formats. MP3 files work on most devices, and the files can be as small as one-tenth the size of lossless files. Advanced Audio Coding, or AAC files (also known as MPEG-4 AAC), take up very little space and are good for streaming, especially over mobile devices. Requiring less than 1 MB per minute of music and sounding better than MP3 at the same bitrate, the AAC format is used by iTunes/Apple Music, YouTube, and Android. Ogg Vorbis is the free, open-source audio codec that Spotify uses. It’s great for streaming, but the compression results in some data loss. Experts consider it a more efficient format than MP3, with better sound at the same bitrate. 14 Audio File Formats LOSSLESS FORMATS Free Lossless Audio Codec (FLAC) offers lossless compression, and it’s free and open-source. Apple’s Lossless Audio Codec (ALAC) allows for lossless compression, but it works only on Apple devices. Monkey's Audio (filename extension.ape) s slightly better to compress files than FLAC and WavPack, but it requires more processing power. WavPack (filename extension.wv) is a free and open-source audio compression format under the BSD license. In addition to the lossless compression, it has a “hybrid” where it creates two files: a high-quality, lossy file (.wv) that can be used 15 stand-alone, and a "correction" file which, when combined with the lossy file, provides full lossless restoration. Audio File Formats UNCOMPRESSED FORMATS WAV (Waveform Audio File) retains all the original data, which makes it the ideal format for sound engineers. It can be 24-bit, 32-bit, all the way up to 192kHz sample rate and even higher these days. WAV holds its time code if you’re collaborating and sending files back and forth. Originally created by Apple, AIFF (Audio Interchange File Format) files are like WAV files in that they retain all of the original sound and take up more space than MP3s. They can play on Macs and PCs, but they don’t hold time codes, so they’re not as useful for editing and mixing. Direct Stream Digital (DSD) is an uncompressed, high-resolution audio format. These files encode sound using pulse-density modulation. They are very large, 16 with a sample rate as much as 64 times that of a regular audio CD, so they require top-of-the-line audio systems. Multimedia Element: Audio in Web Design Significance and Technical Aspects 17 Role of Audio in Web Design Why Use Audio in Web Design? Engages users through auditory learning Enhances storytelling and atmosphere Supports accessibility for visually impaired users Adds feedback sounds to enhance interactivity (e.g., button clicks, notifications) 18 Types of Audio in Web Design Background Music: Sets the tone or ambiance for the website Voiceovers and Narration: Used in tutorials, guides, or storytelling Sound Effects: Enhance user interaction (e.g., hover effects, button clicks) Podcasts & Interviews: Embed audio content that users can listen to directly on the site 19 Significance of Audio in Web Design User Engagement: Audio captures and holds users’ attention. Enhanced User Experience: It adds another layer of interactivity, making sites more immersive. Accessibility Support: Provides an alternative for users with visual impairments or reading difficulties. Brand Identity: Unique sounds can reinforce brand recognition (e.g., company jingles, notifications). 20 Audio Formats for Web Design Common Audio File Formats: ▪ MP3: Most widely used, good compression, small file size, compatible across devices. ▪ WAV: High quality, larger file size, best for uncompressed sound. ▪ OGG: Open-source alternative to MP3, smaller file size, good quality. ▪ AAC: Compressed format, better quality at 21 smaller sizes (common for iOS devices). Technical Aspects of Using Audio Embedding Audio on Websites: ▪ Use HTML tag for compatibility across browsers: Attributes to Control Playback: controls: Displays play/pause buttons autoplay: Automatically plays audio when the page loads loop: Repeats the audio track muted: Mutes audio by default 22 Ensuring Audio Quality Choosing the Right File Format: Consider device compatibility and sound quality needs. Compression and File Size: Smaller files load faster but may compromise quality. Find a balance. Sampling Rate and Bitrate: Standard audio sampling rate: 44.1 kHz, bitrate: 128 kbps or higher for quality sound. Editing Tools: Use tools like Audacity or Adobe Audition to edit, normalize, and optimize audio files. 23 Best Practices for Audio in Web Design Use Audio Sparingly: Avoid overwhelming users with too many sounds. Enable User Control: Allow users to start, pause, or mute audio at their discretion. Optimize for Load Speed: Compress files to ensure quick loading without sacrificing too much quality. Prioritize Accessibility: Provide transcripts or captions for spoken content to aid users with 24 hearing impairments. Accessibility Considerations WCAG Compliance: Audio should be accessible, following the Web Content Accessibility Guidelines (WCAG). Transcripts and Captions: Provide text alternatives for all audio content. Avoid Autoplay for Accessibility: Sudden audio can be distracting or problematic for users, especially those 25 using screen readers. Tools and Libraries for Web Audio Popular Audio Libraries: ▪ Howler.js: Simplifies working with audio across devices and browsers. ▪ Tone.js: Used for creating interactive music and audio-based applications. ▪ SoundManager 2: Provides cross-browser audio compatibility. Audio Editing Software: ▪ Audacity: Free, open-source audio editor ▪ Adobe Audition: Professional tool for audio editing 26 Audio SEO and Performance Audio File Naming & Metadata: Use descriptive names for SEO benefits (e.g., “product-demo-audio.mp3”). Audio File Compression: Compress audio files to reduce loading times. Consider Lazy Loading for Audio: Load audio files only when they are needed to optimize performance. 27 Summary Audio Enhances User Experience: Adds depth, supports accessibility, and strengthens brand identity. Balance is Key: Use audio selectively and avoid autoplay. Technical Know-How: Understand file types, compression, embedding, and accessibility. 28 References ▪▪ Multimedia: Making It Work, 9th Edition, Tay Vaughan, McGraw Hill, 2014 ▪▪ "Multimedia for the Web" by Tay Vaughan (Book) https://www.smashingmagazine.com/ ▪▪ https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Audio_codecs https://www.webfx.com/ ▪▪ ttps://html.spec.whatwg.org/multipage/media.html#the-audio-element https://www.w3schools.com/html/html5_audio.asp ▪▪ https://www.w3.org/WAI/standards-guidelines/wcag/ https://www.deque.com/blog ▪▪ https://webaim.org/techniques/audio/ https://fileinfo.com/help/audio_formats ▪▪ https://www.audacityteam.org/help/tutorials/ https://developers.google.com/web/fundamentals/media/ ▪▪ https://howlerjs.com/ https://tonejs.github.io/ ▪▪ https://www.schillmania.com/projects/soundmanager2/ https://developers.google.com/search/docs/advanced/ ▪▪ https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading https://www.tutorialspoint.com/multimedia/multimedia_introduction.htm ▪▪ https://www.simplyeffectivewebdesign.com/five-elements-of-multimedia/ https://www.freepik.com/ ▪▪ https://atlas.icaci.org/wp-content/uploads/2019/07/Cookbook_6-Multimedia_Elements.pdf https://www.adobe.com/ph_en/creativecloud/video/discover/best-audio-format.html https://newsandviews.dataton.com/common-audio-formats-which-one-to-use 29