HTML5Rocks - Posts & Tutorialshttp://www.html5rocks.com2012-04-24T00:00:00ZA non-responsive approach to building cross-device webapps2012-04-24T00:00:00Zsmustag:www.html5rocks.com,2012-04-24:/mobile/cross-device//Responsive design is great for changing the styling of your UIs depending on screen size, but as your projects increase in complexity, you may want to serve custom versions of your client depending on what kind of device your visitors are using. This article covers classifying visitor's devices into device classes, and serving the appropriate version, while maximizing code reuse between versions.Case Study: A Tale of An HTML5 Game with Web Audio2012-04-24T00:00:00Zzgoddardtag:www.html5rocks.com,2012-04-24:/tutorials/webaudio/fieldrunners//Gradient Studios ported their award-winning Fieldrunners game to HTML5. This article chronicles their journey in utilizing the Web Audio API to implement sound for Fieldrunners.WebGL Transforms2012-04-18T00:00:00Zgmantag:www.html5rocks.com,2012-04-18:/tutorials/webgl/webgl_transforms//How 3D transforms work and how you can use them in WebGL.Creating a Mobile-First Responsive Web Design2012-04-16T00:00:00Zbradfrosttag:www.html5rocks.com,2012-04-16:/mobile/responsivedesign//Responsive web design gives web creators some tools for making layouts that respond to any screen size. This article uses fluid grids, flexible images and media queries to get the layout looking great regardless of the size of the device's screen dimensions.Introduction to JavaScript Source Maps2012-03-21T00:00:00Zryanseddontag:www.html5rocks.com,2012-03-21:/tutorials/developertools/sourcemaps//Have you ever found yourself wishing you could keep your client-side code readable and more importantly debuggable even after you've combined and minified it, without impacting performance? Well now you can through the magic of source maps.Developing Game Audio with the Web Audio API2012-02-28T00:00:00Zsmustag:www.html5rocks.com,2012-02-28:/tutorials/webaudio/games//Varied intensity background music, overlapping sound effects and randomization, sound source and listener spatialization (and directional sound cones), room effects via convolution, detect and prevent clipping, and implement dynamics compression. Including interactive inline demos!Writing Augmented Reality Applications using JSARToolKit2012-02-28T00:00:00Zilmaritag:www.html5rocks.com,2012-02-28:/tutorials/webgl/jsartoolkit_webrtc//Using the JSARToolKit library with WebRTC to build augmented reality applications in JavaScript.Case Study: Building Technitone.com2012-02-27T00:00:00Zgskinnerdotcomtag:www.html5rocks.com,2012-02-27:/tutorials/casestudies/technitone//How Technitone.com was built with the Web Audio API, WebGL, WebSockets, and a decent amount of magic.Capturing Audio & Video in HTML52012-02-22T00:00:00Zericbidelmantag:www.html5rocks.com,2012-02-22:/tutorials/getusermedia/intro//How to capture audio and video using the navigator.getUserMedia() API.Case Study: Bouncy Mouse2012-02-18T00:00:00Zericrktag:www.html5rocks.com,2012-02-18:/tutorials/casestudies/munkadoo_bouncymouse//Bouncy Mouse is a slingshot platformer by Munkadoo Games. This article talks about porting the game to HTML5 and WebAudio.Mixing Positional Audio and WebGL2012-02-16T00:00:00Zilmaritag:www.html5rocks.com,2012-02-16:/tutorials/webaudio/positional_audio//How to use the positional audio features in Web Audio API with Three.js.WebGL Fundamentals2012-02-09T00:00:00Zgmantag:www.html5rocks.com,2012-02-09:/tutorials/webgl/webgl_fundamentals//Fundamentals of using WebGL as a 2D drawing API and using shaders for image processing.Getting Started With the Track Element2012-02-08T00:00:00Zduttontag:www.html5rocks.com,2012-02-08:/tutorials/track/basics//The track element provides a simple, standardized way to add subtitles and captions to video and audio, but can also be used with other kinds of timed data, to improve searchability and enable deep linking.Google Photography Prize Gallery2012-02-07T00:00:00Zilmaritag:www.html5rocks.com,2012-02-07:/tutorials/closure/photographyprize//Building the gallery widget for the Google Photography Prize site using Closure.Animating a Million Letters Using Three.js2012-01-30T00:00:00Zilmaritag:www.html5rocks.com,2012-01-30:/tutorials/webgl/million_letters//A guide to using shaders to animate large amounts of particles.Case Study: Building the Stanisław Lem Google doodle2011-12-21T00:00:00Zmarcinwicharytag:www.html5rocks.com,2011-12-21:/tutorials/doodles/lem//A walk through of the HTML5 tech behind the Stanisław Lem Google doodle.Migrating your WebSQL DB to IndexedDB2011-12-05T00:00:00Zidogreentag:www.html5rocks.com,2011-12-05:/tutorials/webdatabase/websql-indexeddb//A look at what it would take to port a WebSQL based application to IndexedDB.Using CORS2011-10-26T00:00:00Zmonsurhossaintag:www.html5rocks.com,2011-10-26:/tutorials/cors//An introduction to Cross Origin Resource Sharing (CORS), which gives scripts the ability to make cross-origin XHRs.The Synchronous FileSystem API for Workers2011-10-25T00:00:00Zericbidelmantag:www.html5rocks.com,2011-10-25:/tutorials/file/filesystem-sync//The HTML5 FileSystem API offers an synchronous version to be used in the context of Web Workers. The tutorial introduces the Synchronous API, and gives practical examples of using it.Getting Started with Web Audio API2011-10-14T00:00:00Zsmustag:www.html5rocks.com,2011-10-14:/tutorials/webaudio/intro//A gentle introduction to loading and playing, cross-fading, and filtering sound using the Web Audio API.