<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:atom="http://www.w3.org/2005/Atom"
    xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
    xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
    >

<channel>
    <title>Webmonkey &#187; Eno</title>
    <atom:link href="http://www.webmonkey.com/tag/eno/feed/" rel="self" type="application/rss+xml" />
    <link>http://www.webmonkey.com</link>
    <description>The Web Developer&#039;s Resource</description>
    <lastBuildDate>Fri, 05 Apr 2013 20:20:46 +0000</lastBuildDate>
    <language>en-US</language>
    <sy:updatePeriod>hourly</sy:updatePeriod>
    <sy:updateFrequency>1</sy:updateFrequency>
    <generator>http://wordpress.org/?v=3.4.2</generator>
    
    <item>
        <title>New HTML5 Tools Make Your Browser Sing and Dance</title>
        <link>http://www.webmonkey.com/2010/05/new-html5-tools-make-your-browser-sing-and-dance/</link>
        <comments>http://www.webmonkey.com/2010/05/new-html5-tools-make-your-browser-sing-and-dance/#comments</comments>
        <pubDate>Mon, 03 May 2010 17:48:37 +0000</pubDate>

                <dc:creator>Scott Gilbertson</dc:creator>

        <guid isPermaLink="false">http://www.webmonkey.com/?p=47275</guid>
        		<category><![CDATA[APIs]]></category>
		<category><![CDATA[Browsers]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Multimedia]]></category>
		<category><![CDATA[audio]]></category>
		<category><![CDATA[Eno]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[mozilla]]></category>
            <enclosure url="http://www.webmonkey.com/wp-content/uploads/2010/05/kraftwerk_live_in_stockholm.jpg" type="image/jpeg" length="48000" />
                    <description><![CDATA[<div class="rss_thumbnail"><img src="http://www.webmonkey.com/wp-content/uploads/2010/05/kraftwerk_live_in_stockholm.jpg" alt="New HTML5 Tools Make Your Browser Sing and Dance" /></div>HTML5&#8242;s &#60;audio> tag gives you a way to embed audio files directly into a web page without requiring a plug-in. But the audio element could do a lot more than just offer Flash-free inline audio players on your favorite MP3 blogs. The audio player element could end up fueling a whole new class of web [...]]]></description>

            <content:encoded><![CDATA[<p><!-- wpautop enabled --><a href="http://www.webmonkey.com/wp-content/uploads/2010/05/kraftwerk_live_in_stockholm.jpg"><img src="http://www.webmonkey.com/wp-content/uploads/2010/05/kraftwerk_live_in_stockholm-300x224.jpg" alt="kraftwerk_live_in_stockholm" title="kraftwerk_live_in_stockholm" width="300" height="224" class="alignleft size-medium wp-image-47278" /></a>
<p>HTML5&#8242;s <code>&lt;audio></code> tag gives you a way to embed audio files directly into a web page without requiring a plug-in. But the audio element could do a lot more than just offer Flash-free inline audio players on your favorite MP3 blogs.</p>
<p>The audio player element could end up fueling a whole new class of web applications &#8212; online audio editing suites. Some online audio editors written in Flash already exist, and people are using them to creative ends. But we&#8217;re just now starting to see truly amazing audio editors, synthesizers, visualizations and musical creation tools running in the browser without the need for Flash.</p>
<p>To see what it&#8217;s possible to do with the HTML5 audio element and some accompanying JavaScript, David Humphrey, Lead of Mozilla Education as the Mozilla Foundation, has been <a href="http://vocamus.net/dave/?cat=25">experimenting with audio in Firefox</a>. To cap off his series of experiments Humphrey recently showcased a number of vary impressive Firefox <a href="http://hacks.mozilla.org/2010/04/beyond-html5-experiments-with-interactive-audio/">interactive audio experiments</a> on the Mozilla Hacks blog. </p>
<p>The videos (more of which can be seen on the Mozilla blog) highlight possible future webapps: collaborative music creation using multiple browsers, touch-screen audio interfaces, real-time audio analysis software, online mixing boards, beat detection scripts and even an online clone of Brian Eno&#8217;s <a href="http://vimeo.com/2184392">Bloom iPhone app</a>.</p>
<p>The best part about these demos is that, as Humphrey&#8217;s says, &#8220;this is real code, running in a real browser, and it’s all being done in HTML5 and JavaScript.&#8221; Of course the main caveat is that, for some of them to work, you&#8217;ll need a patched version of the Firefox development trunk.</p>
<p>The reason is that some of experiments rely on non-standard APIs. In other words, much of what&#8217;s happening in these experiments hasn&#8217;t been blessed by the W3C just yet. But plenty of what we use on the web right now &#8212; XMLHttpRequest anyone? &#8212; started out exactly the same way. Technology like this ultimately succeeds only if browser vendors and web developers work together to push it forward.</p>
<p>Thinking you&#8217;d really like to see an online version of ProTools? Well, according to Humphrey, &#8220;the web is fast enough to do real-time audio processing now, powerful enough and expressive enough to create music.&#8221; All that remains is for someone to build it.</p>
<p>If you&#8217;d like to experiment with Firefox and audio, have a look at the Mozilla developer documents <a href="https://developer.mozilla.org/En/Using_audio_and_video_in_Firefox">using audio and video in Firefox</a>.</p>
<p>An example of audio filtering tools:</p>
<p><object width="580" height="435"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=11335434&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=00ADEF&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=11335434&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=00ADEF&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="580" height="435"></embed></object></p>
<p>Amazing, real-time analysis of audio with synchronized 3D graphics:</p>
<p><object width="581" height="363"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=11345262&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=00ADEF&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=11345262&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=00ADEF&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="581" height="363"></embed></object></p>
<p><em>Photo: Kraftwerk by Andreas Hagstrom, via <a href="http://commons.wikimedia.org/wiki/File:Kraftwerk_live_in_Stockholm.jpg">Wikimedia</a>, CC</em></p>
<p><strong>See Also:</strong><br/></p>
<ul>
<li><a href="http://www.webmonkey.com/2009/11/a_brave_new_web_will_be_here_soon__but_browsers_must_improve/">A Brave New Web Will Be Here Soon, But Browsers Must Improve</a></li>
<li><a href="http://www.webmonkey.com/2009/12/google_translate_brings_text-tospeech_to_the_web/">Use Google for Text-to-Speech Translations in the Browser</a></li>
<li><a href="http://www.webmonkey.com/2010/02/embed_audio_and_video_in_html_5_pages/">Embed Audio and Video in HTML 5 Pages</a></li>
<li><a href="http://www.webmonkey.com/2009/11/tim_berners-lee_sees_promise__challenges_in_html5/">Tim Berners-Lee Sees Promise, Challenges in HTML5</a></li>
</ul>
<div id='linker_widget' class='contextly-widget'></div>]]></content:encoded>
            <wfw:commentRss>http://www.webmonkey.com/2010/05/new-html5-tools-make-your-browser-sing-and-dance/feed/</wfw:commentRss>
        <slash:comments>40</slash:comments>

        
    </item>
    </channel>
</rss>