title
17.11: Sound Visualization: Frequency Analysis with FFT - p5.js Sound Tutorial

description
In this "p5.js Sound Tutorial" video, I use the p5.FFT object to analyze the frequencies (spectrum array) of a sound file. I create a "graphic equalizer" like visualization. Support this channel on Patreon: https://patreon.com/codingtrain Send me your questions and coding challenges! Contact: https://twitter.com/shiffman p5.js sound library reference: https://p5js.org/reference/#/libraries/p5.sound p5.FFT object reference: https://p5js.org/reference/#/p5.FFT Kristian Pedersen's this.dot song: https://soundcloud.com/kristianpedersen/this-dot-feat-daniel-shiffman Source Code for the Video Lessons: https://github.com/CodingTrain/Rainbow-Code p5.js: https://p5js.org/ Processing: https://processing.org For More Sound in p5.js videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6aFcVjlDAkkGIixw70s7jpW Help us caption & translate this video! http://amara.org/v/YIOn/ 📄 Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

detail
{'title': '17.11: Sound Visualization: Frequency Analysis with FFT - p5.js Sound Tutorial', 'heatmap': [{'end': 203.222, 'start': 179.424, 'weight': 0.701}, {'end': 251.525, 'start': 232.437, 'weight': 0.728}, {'end': 292.386, 'start': 268.833, 'weight': 0.76}, {'end': 470.382, 'start': 447.29, 'weight': 1}, {'end': 579.22, 'start': 537.796, 'weight': 0.741}, {'end': 629.573, 'start': 594.248, 'weight': 0.778}], 'summary': 'Tutorial covers the use of the fft object in p5 to analyze sound, differentiate amplitude between low and high frequency sounds, visualize sound data through frequency spectrum and time domain graphs, and request fft algorithm for frequencies at resolutions like 256 or 512, as well as obtaining a 1024-length spectrum array with optional smoothing and visualizing fft spectrum array from a sound file using canvas manipulation and band drawing.', 'chapters': [{'end': 96.337, 'segs': [{'end': 26.687, 'src': 'embed', 'start': 0.289, 'weight': 0, 'content': [{'end': 7.914, 'text': "Hello In this video, I'm going to take what I did previously, which is drawing a kind of graph of the volume of a song.", 'start': 0.289, 'duration': 7.625}, {'end': 15.84, 'text': 'And instead of drawing the volume of the song, the amplitude of the song across all frequencies,', 'start': 9.135, 'duration': 6.705}, {'end': 26.687, 'text': "I'm going to use an object in P5 called the FFT object to analyze the sound in a way that I can get the amplitude for low frequency sounds for high frequency sounds.", 'start': 15.84, 'duration': 10.847}], 'summary': 'Using fft object to analyze sound frequencies for amplitude.', 'duration': 26.398, 'max_score': 0.289, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4289.jpg'}, {'end': 96.337, 'src': 'embed', 'start': 48.157, 'weight': 1, 'content': [{'end': 52.262, 'text': 'So we used p5.amplitude to get the current volume of a sound.', 'start': 48.157, 'duration': 4.105}, {'end': 61.012, 'text': 'p5.fft analyzes the sound, returns the results from the frequency spectrum or time domain.', 'start': 52.783, 'duration': 8.229}, {'end': 63.315, 'text': 'What are those things? The frequency spectrum.', 'start': 61.052, 'duration': 2.263}, {'end': 65.456, 'text': 'The time domain.', 'start': 64.116, 'duration': 1.34}, {'end': 73.662, 'text': "Anyway, so the issue is here, there's raw data coming in from an MP3 file, a microphone, whatever.", 'start': 65.777, 'duration': 7.885}, {'end': 81.488, 'text': 'And that raw data has to be processed and analyzed through an algorithm to pull things that we care about out of it.', 'start': 73.742, 'duration': 7.746}, {'end': 84.93, 'text': 'One methodology for doing this is called FFT.', 'start': 82.008, 'duration': 2.922}, {'end': 88.472, 'text': 'So if I go to the Wikipedia page, you can read a lot more about it.', 'start': 85.31, 'duration': 3.162}, {'end': 90.454, 'text': 'Fast Fourier Transform.', 'start': 88.833, 'duration': 1.621}, {'end': 96.337, 'text': "I'm not going to write this algorithm from scratch or create the engine that does the FFT analysis.", 'start': 91.094, 'duration': 5.243}], 'summary': 'Using p5.amplitude to measure sound volume and p5.fft to analyze frequency spectrum or time domain, involving raw data processing through fft algorithm.', 'duration': 48.18, 'max_score': 48.157, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi448157.jpg'}], 'start': 0.289, 'title': 'Using fft object in p5', 'summary': 'Explains the use of the fft object in p5 to analyze sound, enabling differentiation of amplitude between low and high frequency sounds and visualization of sound data through frequency spectrum and time domain graphs.', 'chapters': [{'end': 96.337, 'start': 0.289, 'title': 'Using fft object in p5 for sound analysis', 'summary': 'Explains the use of the fft object in p5 to analyze sound, allowing for the differentiation of amplitude between low and high frequency sounds, ultimately enabling the creation of frequency spectrum and time domain graphs to visualize sound data.', 'duration': 96.048, 'highlights': ['The FFT object in P5 is used to analyze sound and differentiate the amplitude between low and high frequency sounds, enabling the creation of frequency spectrum and time domain graphs to visualize sound data.', 'P5.fft object is utilized to analyze the sound and returns the results from the frequency spectrum or time domain, providing a way to process and analyze raw data from an MP3 file or a microphone.', 'The methodology of using Fast Fourier Transform (FFT) to process and analyze raw sound data is explained, allowing for the extraction of important information from the raw data.']}], 'duration': 96.048, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4289.jpg', 'highlights': ['The FFT object in P5 is used to analyze sound and differentiate the amplitude between low and high frequency sounds, enabling the creation of frequency spectrum and time domain graphs to visualize sound data.', 'P5.fft object is utilized to analyze the sound and returns the results from the frequency spectrum or time domain, providing a way to process and analyze raw data from an MP3 file or a microphone.', 'The methodology of using Fast Fourier Transform (FFT) to process and analyze raw sound data is explained, allowing for the extraction of important information from the raw data.']}, {'end': 244.682, 'segs': [{'end': 131.937, 'src': 'embed', 'start': 97.097, 'weight': 2, 'content': [{'end': 105.22, 'text': 'Luckily for us, P5, sound made by Jason Siegel, which is built on top of the Web Audio API, has this built into it.', 'start': 97.097, 'duration': 8.123}, {'end': 110.301, 'text': 'And so the idea is that what it does is it takes the sound and chops it up.', 'start': 105.78, 'duration': 4.521}, {'end': 111.962, 'text': "Well, that's not really right.", 'start': 111.062, 'duration': 0.9}, {'end': 115.243, 'text': 'But let me come over here for a second to see if we can think about this.', 'start': 112.062, 'duration': 3.181}, {'end': 131.937, 'text': 'So if this is me analyzing the sound, the amplitude object gives me a single value, volume.', 'start': 120.888, 'duration': 11.049}], 'summary': 'P5 uses web audio api to analyze sound and extract volume data.', 'duration': 34.84, 'max_score': 97.097, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi497097.jpg'}, {'end': 185.768, 'src': 'embed', 'start': 152.29, 'weight': 0, 'content': [{'end': 156.152, 'text': 'In other words, what is the amplitude at different frequency levels?', 'start': 152.29, 'duration': 3.862}, {'end': 163.255, 'text': 'And I can request the FFT algorithm to give me the frequencies at various resolutions, so to speak.', 'start': 156.492, 'duration': 6.763}, {'end': 172.38, 'text': 'So I can ask for 256 bands, so frequencies with a level of detail of 256 or 512 or whatever.', 'start': 163.476, 'duration': 8.904}, {'end': 177.722, 'text': 'Generally, the sort of standard here are these powers of two, so to speak.', 'start': 172.5, 'duration': 5.222}, {'end': 185.768, 'text': "I encourage you to, I'll try to put some resources in this video's description that's more about FFT stuff and how it works.", 'start': 179.424, 'duration': 6.344}], 'summary': 'Fft algorithm provides frequencies at different resolutions, e.g. 256 or 512 bands.', 'duration': 33.478, 'max_score': 152.29, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4152290.jpg'}, {'end': 203.222, 'src': 'heatmap', 'start': 179.424, 'weight': 0.701, 'content': [{'end': 185.768, 'text': "I encourage you to, I'll try to put some resources in this video's description that's more about FFT stuff and how it works.", 'start': 179.424, 'duration': 6.344}, {'end': 188.39, 'text': "But for right now, let's actually just try to make it work.", 'start': 186.189, 'duration': 2.201}, {'end': 195.136, 'text': 'So one thing I want to do is I want to change this amplitude object to be an FFT object.', 'start': 188.731, 'duration': 6.405}, {'end': 203.222, 'text': 'And then I want to say instead of making a new P5 amplitude object, I want to make a new P5 FFT object.', 'start': 195.916, 'duration': 7.306}], 'summary': 'Encouraging to explore fft in video description, transitioning from amplitude to fft object.', 'duration': 23.798, 'max_score': 179.424, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4179424.jpg'}, {'end': 234.958, 'src': 'embed', 'start': 203.602, 'weight': 1, 'content': [{'end': 204.563, 'text': "Let's go to the reference.", 'start': 203.602, 'duration': 0.961}, {'end': 207.268, 'text': 'and click on FFT.', 'start': 205.908, 'duration': 1.36}, {'end': 209.949, 'text': "And let's look at what the functions are.", 'start': 208.209, 'duration': 1.74}, {'end': 211.89, 'text': 'So I can waveform.', 'start': 210.35, 'duration': 1.54}, {'end': 213.111, 'text': "We'll look at waveform later.", 'start': 211.91, 'duration': 1.201}, {'end': 217.932, 'text': 'But analyze computes the amplitude values along the frequency domain.', 'start': 213.451, 'duration': 4.481}, {'end': 220.353, 'text': 'The array indices, it gives me an array.', 'start': 218.232, 'duration': 2.121}, {'end': 226.055, 'text': 'And those indices correspond to specific frequencies, lowest to highest.', 'start': 220.613, 'duration': 5.442}, {'end': 228.056, 'text': "So let's just say we can look here.", 'start': 226.335, 'duration': 1.721}, {'end': 231.297, 'text': 'Actually, one of the things that I think I need to do, or maybe it does it by default.', 'start': 228.216, 'duration': 3.081}, {'end': 232.377, 'text': "Let's just see.", 'start': 231.877, 'duration': 0.5}, {'end': 234.958, 'text': "OK So I'm going to say analyze.", 'start': 232.437, 'duration': 2.521}], 'summary': 'Analyzing fft computes amplitude values along the frequency domain with specific indices.', 'duration': 31.356, 'max_score': 203.602, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4203602.jpg'}], 'start': 97.097, 'title': 'Using fft for sound analysis', 'summary': 'Explains the use of fast fourier transform (fft) in sound analysis, enabling the visualization of sound amplitude at different frequency levels and the ability to request fft algorithm for frequencies at resolutions like 256 or 512.', 'chapters': [{'end': 244.682, 'start': 97.097, 'title': 'Using fft for sound analysis', 'summary': 'Explains the use of fast fourier transform (fft) in sound analysis, enabling the visualization of sound amplitude at different frequency levels and the ability to request fft algorithm for frequencies at resolutions like 256 or 512.', 'duration': 147.585, 'highlights': ['The FFT algorithm allows visualization of sound amplitude at different frequency levels and resolutions like 256 or 512. FFT enables the visualization of sound amplitude at different frequency levels and the ability to request FFT algorithm for frequencies at resolutions like 256 or 512.', 'The FFT object in P5.js allows for sound analysis in the frequency domain. The chapter discusses the use of FFT object in P5.js for sound analysis in the frequency domain, providing insight into specific frequencies from lowest to highest.', 'The P5 FFT object provides functions like waveform and analyze for sound analysis. The P5 FFT object offers functions like waveform and analyze, which compute the amplitude values along the frequency domain and provide array indices corresponding to specific frequencies, lowest to highest.']}], 'duration': 147.585, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi497097.jpg', 'highlights': ['The FFT algorithm allows visualization of sound amplitude at different frequency levels and resolutions like 256 or 512.', 'The P5 FFT object provides functions like waveform and analyze for sound analysis.', 'The FFT object in P5.js allows for sound analysis in the frequency domain.']}, {'end': 1056.167, 'segs': [{'end': 336.726, 'src': 'heatmap', 'start': 268.833, 'weight': 0, 'content': [{'end': 271.735, 'text': 'Oh, cannot read property analyze of undefined.', 'start': 268.833, 'duration': 2.902}, {'end': 280.58, 'text': "So I've got an issue here, var fft, oops, fft equals new p5 fft, and now analyze.", 'start': 271.995, 'duration': 8.585}, {'end': 281.541, 'text': "OK, let's try that again.", 'start': 280.66, 'duration': 0.881}, {'end': 287.364, 'text': "So we can see here that what I'm getting is this array.", 'start': 283.862, 'duration': 3.502}, {'end': 292.386, 'text': 'Now, how big is that array? That array is spectrum.', 'start': 287.424, 'duration': 4.962}, {'end': 295.108, 'text': "Let's look at the length of that array.", 'start': 293.226, 'duration': 1.882}, {'end': 300.393, 'text': 'It is 1024.', 'start': 295.128, 'duration': 5.265}, {'end': 303.575, 'text': 'So by default, I get 1024 frequency bands.', 'start': 300.393, 'duration': 3.182}, {'end': 310.961, 'text': 'I believe if I give it an argument, like 512, No.', 'start': 305.837, 'duration': 5.124}, {'end': 315.042, 'text': 'Smoothing bins.', 'start': 312.861, 'duration': 2.181}, {'end': 318.242, 'text': 'So it takes two arguments.', 'start': 315.262, 'duration': 2.98}, {'end': 322.123, 'text': 'The first argument, and these are optional, is a smoothing amount.', 'start': 318.623, 'duration': 3.5}, {'end': 323.383, 'text': "So we'll play with that later.", 'start': 322.143, 'duration': 1.24}, {'end': 325.704, 'text': "I guess let's try doing it.", 'start': 323.403, 'duration': 2.301}, {'end': 328.464, 'text': 'Oh, and I could do set input, analyze, get energy.', 'start': 325.804, 'duration': 2.66}, {'end': 328.884, 'text': "Let's see.", 'start': 328.504, 'duration': 0.38}, {'end': 330.085, 'text': 'Get centroid smooth.', 'start': 328.944, 'duration': 1.141}, {'end': 334.465, 'text': 'Smooth FFT analysis by averaging with the last analysis frame.', 'start': 330.905, 'duration': 3.56}, {'end': 336.726, 'text': "Wow, that's so wonderful that it does that for you.", 'start': 334.966, 'duration': 1.76}], 'summary': 'Using p5 fft to analyze audio data, default 1024 frequency bands, with optional smoothing amount.', 'duration': 91.323, 'max_score': 268.833, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4268833.jpg'}, {'end': 477.484, 'src': 'heatmap', 'start': 447.29, 'weight': 1, 'content': [{'end': 448.951, 'text': "That's just kind of a guess.", 'start': 447.29, 'duration': 1.661}, {'end': 450.552, 'text': "It's probably in the documentation.", 'start': 449.011, 'duration': 1.541}, {'end': 452.673, 'text': 'So let me fix that range.', 'start': 451.152, 'duration': 1.521}, {'end': 457.015, 'text': 'And we can say 256 kind of as the top.', 'start': 454.654, 'duration': 2.361}, {'end': 458.316, 'text': 'There we go.', 'start': 457.715, 'duration': 0.601}, {'end': 464.4, 'text': "So now what we're seeing here is this kind of frequency analysis.", 'start': 459.016, 'duration': 5.384}, {'end': 470.382, 'text': 'And you can see the lower frequency sounds are much higher than the high frequency sounds.', 'start': 464.48, 'duration': 5.902}, {'end': 477.484, 'text': "Let's change the song to this dot.", 'start': 470.662, 'duration': 6.822}], 'summary': 'Frequency analysis shows lower sounds much higher than high sounds.', 'duration': 30.194, 'max_score': 447.29, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4447290.jpg'}, {'end': 579.22, 'src': 'heatmap', 'start': 537.796, 'weight': 0.741, 'content': [{'end': 545.298, 'text': 'And that w would be equal to the width of the window divided by the total number of bands, or 64.', 'start': 537.796, 'duration': 7.502}, {'end': 547.178, 'text': 'And I could probably make that in a variable.', 'start': 545.298, 'duration': 1.88}, {'end': 553.52, 'text': 'So now what I want to do is I want to draw the bands at.', 'start': 547.478, 'duration': 6.042}, {'end': 556.822, 'text': "So now if I do this, right? There's only that many bands, only 64 now.", 'start': 553.56, 'duration': 3.262}, {'end': 558.803, 'text': 'So what I want to do is draw it at i times w.', 'start': 556.842, 'duration': 1.961}, {'end': 571.313, 'text': 'And you can see now these lines are spaced out.', 'start': 568.53, 'duration': 2.783}, {'end': 579.22, 'text': 'And I could also now make this a rectangle instead.', 'start': 574.335, 'duration': 4.885}], 'summary': 'Drawing 64 bands spaced out in a window.', 'duration': 41.424, 'max_score': 537.796, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4537796.jpg'}, {'end': 629.573, 'src': 'heatmap', 'start': 594.248, 'weight': 0.778, 'content': [{'end': 599.172, 'text': "Oops, it's width is W, sorry.", 'start': 594.248, 'duration': 4.924}, {'end': 600.874, 'text': "That's kind of an interesting effect.", 'start': 599.292, 'duration': 1.582}, {'end': 603.376, 'text': "So you can see I'm drawing them as rectangular bands.", 'start': 600.994, 'duration': 2.382}, {'end': 619.329, 'text': 'And now certainly I could give them a fill, and I could say fill, you know, I, 255, 255, and I could make the color mode HSB, and now you can see.', 'start': 605.177, 'duration': 14.152}, {'end': 623.411, 'text': 'And I could obviously expand and map the colors differently.', 'start': 620.25, 'duration': 3.161}, {'end': 625.272, 'text': 'But you can see the idea here now.', 'start': 623.651, 'duration': 1.621}, {'end': 629.573, 'text': 'I could make w minus 2.', 'start': 625.552, 'duration': 4.021}], 'summary': 'Drawing rectangular bands with fill color in different modes and sizes.', 'duration': 35.325, 'max_score': 594.248, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4594248.jpg'}, {'end': 701.403, 'src': 'embed', 'start': 663.502, 'weight': 4, 'content': [{'end': 668.185, 'text': 'So remember that you can do this thing, you can actually smooth these values.', 'start': 663.502, 'duration': 4.683}, {'end': 669.887, 'text': "Let's give it 0.5.", 'start': 668.225, 'duration': 1.662}, {'end': 670.547, 'text': 'See what that looks like.', 'start': 669.887, 'duration': 0.66}, {'end': 671.648, 'text': "I can't tell what's going on here.", 'start': 670.567, 'duration': 1.081}, {'end': 683.67, 'text': "Let's make that 1.", 'start': 671.668, 'duration': 12.002}, {'end': 684.871, 'text': '0.9? Yeah, OK.', 'start': 683.67, 'duration': 1.201}, {'end': 687.112, 'text': 'So you can see this smoothing now.', 'start': 685.271, 'duration': 1.841}, {'end': 693.235, 'text': "What it's doing is it's taking each frequency and averaging it with the value before.", 'start': 687.512, 'duration': 5.723}, {'end': 701.403, 'text': 'So you get this quality of of smoother values as an amplitude gets higher.', 'start': 693.615, 'duration': 7.788}], 'summary': 'Demonstrating smoothing process with 0.5, 1, and 0.9 values, improving amplitude quality.', 'duration': 37.901, 'max_score': 663.502, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4663502.jpg'}, {'end': 1048.296, 'src': 'embed', 'start': 1020.752, 'weight': 5, 'content': [{'end': 1023.954, 'text': "There's all sorts of possibilities here, but I'm kind of showing you a range.", 'start': 1020.752, 'duration': 3.202}, {'end': 1026.276, 'text': 'So, hopefully you enjoyed this and got something out of it.', 'start': 1024.233, 'duration': 2.043}, {'end': 1032.02, 'text': 'You know, obviously I would hope that you watching this could come up with sort of more..', 'start': 1026.616, 'duration': 5.404}, {'end': 1040.767, 'text': 'I want to say more creative ideas or your own take on what it means to visualize the FFT spectrum array from a sound file.', 'start': 1032.02, 'duration': 8.747}, {'end': 1043.03, 'text': "OK? And I'll see you in a future video.", 'start': 1041.007, 'duration': 2.023}, {'end': 1046.493, 'text': "I'm going to do a few more videos that'll be next to this playlist.", 'start': 1043.05, 'duration': 3.443}, {'end': 1048.296, 'text': "And I don't know what's going to be in them yet.", 'start': 1047.035, 'duration': 1.261}], 'summary': 'Encouraging viewers to explore creative ideas for visualizing fft spectrum array from sound files in future videos.', 'duration': 27.544, 'max_score': 1020.752, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi41020752.jpg'}], 'start': 245.403, 'title': 'Fft analysis and visualization', 'summary': 'Covers using fft analysis in javascript to obtain a 1024-length spectrum array with optional smoothing, and demonstrates visualizing fft spectrum array from a sound file using canvas manipulation and band drawing.', 'chapters': [{'end': 336.726, 'start': 245.403, 'title': 'Using fft for spectral analysis', 'summary': 'Demonstrates using fft analysis in javascript to obtain a 1024-length spectrum array and explores optional arguments like smoothing amount while highlighting the convenience of built-in functions for fft analysis.', 'duration': 91.323, 'highlights': ['The default spectrum array obtained through FFT analysis is 1024 in length.', 'Optional smoothing amount and other arguments can be provided for FFT analysis, such as averaging with the last analysis frame.', 'The console.log statement is used to display the spectrum array obtained through FFT analysis.']}, {'end': 1056.167, 'start': 337.727, 'title': 'Visualizing fft spectrum array', 'summary': 'Demonstrates visualizing fft spectrum array from a sound file by manipulating the canvas, drawing bands and applying smoothing, with the potential for more sophisticated analysis and creative visualizations.', 'duration': 718.44, 'highlights': ['Demonstrating the visualization of FFT spectrum array by manipulating the canvas and drawing bands The chapter explains the process of setting the canvas size to 256 by 256, drawing one pixel per band, and looping through the array to draw lines for each band.', 'Applying smoothing to the FFT spectrum array values to obtain smoother amplitudes The demonstration includes applying smoothing techniques to the FFT spectrum array values, averaging each frequency with the value before to obtain smoother amplitudes.', 'Exploring the potential for more sophisticated analysis and creative visualizations of the FFT spectrum array The chapter discusses the possibility of more sophisticated analysis, such as beat detection for high-frequency sounds, and creative visualizations using FFT values to map a two-dimensional space or a three-dimensional landscape.']}], 'duration': 810.764, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/2O3nm0Nvbi4/pics/2O3nm0Nvbi4245403.jpg', 'highlights': ['The default spectrum array obtained through FFT analysis is 1024 in length.', 'Optional smoothing amount and other arguments can be provided for FFT analysis, such as averaging with the last analysis frame.', 'The console.log statement is used to display the spectrum array obtained through FFT analysis.', 'Demonstrating the visualization of FFT spectrum array by manipulating the canvas and drawing bands.', 'Applying smoothing to the FFT spectrum array values to obtain smoother amplitudes.', 'Exploring the potential for more sophisticated analysis and creative visualizations of the FFT spectrum array.']}], 'highlights': ['The FFT object in P5 is used to analyze sound and differentiate the amplitude between low and high frequency sounds, enabling the creation of frequency spectrum and time domain graphs to visualize sound data.', 'The P5.fft object is utilized to analyze the sound and returns the results from the frequency spectrum or time domain, providing a way to process and analyze raw data from an MP3 file or a microphone.', 'The methodology of using Fast Fourier Transform (FFT) to process and analyze raw sound data is explained, allowing for the extraction of important information from the raw data.', 'The FFT algorithm allows visualization of sound amplitude at different frequency levels and resolutions like 256 or 512.', 'The default spectrum array obtained through FFT analysis is 1024 in length.', 'Optional smoothing amount and other arguments can be provided for FFT analysis, such as averaging with the last analysis frame.', 'The console.log statement is used to display the spectrum array obtained through FFT analysis.', 'Demonstrating the visualization of FFT spectrum array by manipulating the canvas and drawing bands.', 'Applying smoothing to the FFT spectrum array values to obtain smoother amplitudes.', 'Exploring the potential for more sophisticated analysis and creative visualizations of the FFT spectrum array.', 'The FFT object in P5.js allows for sound analysis in the frequency domain.']}