summaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'index.html')
-rw-r--r--index.html22
1 files changed, 11 insertions, 11 deletions
diff --git a/index.html b/index.html
index a8e94e9..003e60f 100644
--- a/index.html
+++ b/index.html
@@ -17,15 +17,15 @@
?</p>
<!-- TODO : Fast travel, SOUNDS -->
<div id="content">
- <h1>MIDI art, and other forms of audio GFX</h1>
+ <h1>MIDI art, and other forms of <span id="sound" style="background: none">audio</span> GFX</h1>
<div class="right-container">
<h2>MIDI notes pixel art</h2>
<h3>MIDI ???</h3>
- <p>So there's this thing called MIDI, which stands for Musical Instrument Digital Interface. I won't get into any technical details, you just need to know that it's a way to make sound with a computer. You can usually write musical pieces with specific softwares called <abbr title="Digital Audio Workstation">DAW</abbr>s.</p>
+ <span>So there's this thing called MIDI, which stands for Musical Instrument Digital Interface. I won't get into any technical details, you just need to know that it's a way to make sound with a computer. You can usually write musical pieces with specific softwares called <abbr title="Digital Audio Workstation">DAW</abbr>s.</span>
<h3>MIDI art ???</h3>
- <p>When composing, the notes are displayed on a grid, which can be seen as a canvas. From there on, we can start making pixel art ! The best part is, you can customize each note with a certain sound and create a very unique sounding pixel art.</p>
+ <span>When composing, the notes are displayed on a grid, which can be seen as a canvas. From there on, we can start making pixel art ! The best part is, you can customize each note with a certain sound and create a very unique sounding pixel art.</span>
<h3>DEMO !!!!</h3>
- <p>Here are a few examples of MIDI art pieces :</p>
+ <span>Here are a few examples of MIDI art pieces :</span>
<h4>A simple pixel art</h4>
<h4>A more complex drawing</h4>
<h4>This one was also made to sound coherent !</h4>
@@ -33,21 +33,21 @@
<div class="left-container">
<h2>~ Oscilloscopes and stuff ~</h2>
<h3>Waveform art</h3>
- <p>So you know how sound is just a wave ? Well turns out you can shape that wave ! I won't get into some complicated math, but basically, the most simple wave is a sine wave, a nice, smooth, round wave, repeating itself as regularly as possible. Using the previously mentioned complicated math, you can shape the waveform to your liking and create some unique designs.<p>
- <p>However, waveform art has a rather cumbersome limitation : Since we are using a mathematical functions (and graphing it in <a href="https://en.wikipedia.org/wiki/Cartesian_coordinate_system">cartesian coordinates</a>, the line can only go right and up or down. This means we can never loop back and go left : to put it simply, this method allows us to draw the letter 'V', but not the letter 'O'. The good part is, other methods allow us to remedy this problem.</p>
+ <span>So you know how sound is just a wave ? Well turns out you can shape that wave ! I won't get into some complicated math, but basically, the most simple wave is a sine wave, a nice, smooth, round wave, repeating itself as regularly as possible. Using the previously mentioned complicated math, you can shape the waveform to your liking and create some unique designs.<span>
+ <span>However, waveform art has a rather cumbersome limitation : Since we are using a mathematical functions (and graphing it in <a href="https://en.wikipedia.org/wiki/Cartesian_coordinate_system">cartesian coordinates</a>, the line can only go right and up or down. This means we can never loop back and go left : to put it simply, this method allows us to draw the letter 'V', but not the letter 'O'. The good part is, other methods allow us to remedy this problem.</span>
<h3>Messing around with oscilloscopes</h3>
- <p>Oscilloscopes are very basic electronic devices, which take 2 signals in entry, and display them on a grid. You can fiddle with the entry signal to manipulate the visual output. But in our case the entry signal is duplicated to both left and right speakers. The process creates a very unique type of music, along with an interesting video clip. This genre was initiated by two polish composers/programmers. They ended up developing a software that functions alongside the Blender 3d modeling program, and outputs the corresponding signal to an oscilloscope. The project is better described on the <a href="https://oscilloscopemusic.com">&gt;Oscilloscope Music&lt;</a> website.</p>
+ <span>Oscilloscopes are very basic electronic devices, which take 2 signals in entry, and display them on a grid. You can fiddle with the entry signal to manipulate the visual output. But in our case the entry signal is duplicated to both left and right speakers. The process creates a very unique type of music, along with an interesting video clip. This genre was initiated by two polish composers/programmers. They ended up developing a software that functions alongside the Blender 3d modeling program, and outputs the corresponding signal to an oscilloscope. The project is better described on the <a href="https://oscilloscopemusic.com">&gt;Oscilloscope Music&lt;</a> website.</span>
<h4>Examples !!</h4>
</div>
<div class="right-container">
<h2>Audio visualizers</h2>
- <p>Audio visualizers are graphical displays mostly used as a video complement to audio content. They illustrate the audio specter by graphing the audio frenquencies all through the audio media.
+ <span>Audio visualizers are graphical displays mostly used as a video complement to audio content. They illustrate the audio specter by graphing the audio frenquencies all through the audio media.</span>
<h3>Graphs</h3>
- <p>Graphs are the most basic audio visualizers. Some are actually made of 2 graphs, displaying data for stereo audio (left and right channels), and some only show a single graph of the overall frequencies. An audio visualizer graph displays audio frequencies at any point in time, from low to high frequencies.</p>
+ <span>Graphs are the most basic audio visualizers. Some are actually made of 2 graphs, displaying data for stereo audio (left and right channels), and some only show a single graph of the overall frequencies. An audio visualizer graph displays audio frequencies at any point in time, from low to high frequencies.</span>
<h3>Circles</h3>
- <p>Circular audio visualizers are somewhat similar to graphs, usually representing both audio channels, and using the center of the circle to display a logo or some other image. Frequencies from low to high are represented from the bottom to the top, extending away from the center of the circle.</p>
+ <span>Circular audio visualizers are somewhat similar to graphs, usually representing both audio channels, and using the center of the circle to display a logo or some other image. Frequencies from low to high are represented from the bottom to the top, extending away from the center of the circle.</span>
<h3>Windows Media Player</h3>
- <p>This one brings up a ton of nostalgia from back when Windows Media Player was still widely used (up until about 15 years ago).</p>
+ <span>This one brings up a ton of nostalgia from back when Windows Media Player was still widely used (up until about 15 years ago).</span>
<!-- Sooooo 2000s -->
</div>
<footer>Submission for the <a href="https://forum.melonland.net/index.php?topic=3244.msg31935#msg31935">Surf Club E-Zine #2</a>, written by <a href="https://marcellus.cc">&gt;Marcellus&lt;</a></footer>