Responsive web design is coming to VR

Oculus Rift, Google Cardboard and Samsung’s Gear VR are all trying to get developers excited about building immersive virtual reality (VR) experiences. But as VR is capturing our imaginations, developers are left to wonder whether this new world will once again be dominated by competing and incompatible platforms, just the way mobile and desktop computing have been for so long.

Some developers think they’ve found a solution to this problem. “Remember the old ‘write once, run anywhere’ promise,” asked Google employee and VR enthusiast Boris Smus in a blog post this week, adding: “The web is the closest thing we have to fulfilling it.” Instead of building native apps that just work on one platform or even just one single VR headset, developers could build their VR experiences in HTML, and simply have them run in a browser.

This idea, commonly known as WebVR, is championed by a variety of developers and organizations, with one big proponent being Mozilla. The browser maker launched its own MozVR website for web-based VR experiences last year, and added VR support to the nightly (pre-alpha) builds of Firefox last month. There are also efforts to bring VR to Chrome, and Google launched a website highlighting VR Chrome experiments when it unveiled its own DIY Cardboard VR viewer last year.

Mozilla is one of the early proponents of web-based VR.

Mozilla is one of the early proponents of web-based VR.

However, so far, these efforts aren’t compatible. “The latest VR wave has barely begun and already the web VR world is fragmented,” wrote Smus, adding: “Case in point, don’t work on Oculus, and demos don’t work in Cardboard.” Developers can now either wait until Google, Mozilla, Oculus and others agree on a common standard — or simply get their own cross-platform approach ready.

That’s exactly what Smus did this week by launching what he calls “responsive WebVR.” The idea: Make HTML-based VR work across headsets, and even without any headset at all. His inspiration? Responsive web design that automatically detects whether a user accesses a site with a desktop or a mobile browser, and optimizes the experience accordingly:

“Responsive web design promises content which automatically adapts to your viewing environment by using fluid layouts, flexible images, proportional grids; a cocktail of modern web technologies. Similarly, WebVR experiences need to work even without VR hardware.”

Smus’ WebVR boilerplate open source project allows developers to create HTML-based VR experiences that work with both Oculus Rift and Google Cardboard, as well as with no VR headset at all, using a phone’s gyroscope to allow users to tilt the display to explore worlds. For now, it still requires developers to download a special build of Chrome, but developers should feel encouraged by the promise of cross-platform capabilities — and the potential of web-based experiences that work in an ordinary desktop or mobile browser as well as a VR headset is pretty exciting.

13th Lab raises $700,000 to build its ‘UI for reality’

Swedish startup 13th Lab has just raised $700,000 from Nordic investors Creandum to help build its augmented reality browser and developer tools for iOS. But forget about tacky versions of AR: this team is trying to build a real interface between the digital and the physical.

If web apps take off, Mozilla is prepared on mobiles

Could a smartphone run solely on web code instead of native software? Mozilla thinks so and recently demonstrated such a device on video, replacing the Google Android operating system on a Samsung Galaxy S II phone with its Boot 2 Gecko (B2G) technology.

Hands on with iBooks Author: The desktop publisher grows up

iBooks Author is like a candy land for aspiring, adventurous writers; it’s easily as intuitive as something like Keynote, iPhoto or iMovie, and it integrates smoothly with all those programs to allow you to use content from each in creating your e-books.

Cars, gadgets on collision course at CES

The line between car and home entertainment center is getting blurrier by the minute as electronics makers and car companies take to the Consumer Electronics Show 2012 and concurrent Detroit Auto show to strut their stuff. Here’s a sampling of the news.

Wheels of Steel lets wannabe DJs drive the decks

The success of Pandora’s public offering underscores the popularity of online music, and the thousands of ways you can listen to tracks online. But how many can claim to be as fun as new virtual turntable setup Wheels of Steel?

Sure, RSS Is Dead — Just Like the Web Is Dead

A brush fire has been swirling through the blogosphere of late over whether RSS is dead or possibly dying. But is it actually doomed, or even ailing? Not really. Like plenty of other technologies, it is just becoming part of the plumbing of the real-time web.

TechUniversity: HTML Signatures in Mail

Apple makes it fairly easy to do basic text formatting for HTML signatures, but using HTML to create more complex signatures requires a bit more work. We’ll walk you through, step by step, how to create a custom HTML email signature is Apple’s Mail app.

How-To: Turbocharge Your Browsing With Greasemonkey

Greasemonkey Icon

While the debate over Mac versus PC will last for eternity, one of the elements that many “diehard” PC users have thrown at Apple fanboys is the ability to really tweak their experience, through application add-ons and plugins.

Mac users who use Firefox have had a little taste of this with Greasemonkey, a Firefox add-on that allows support for on the fly changes to websites. If you haven’t heard of Greasemonkey, this is a must read for you and if your browser of choice isn’t Firefox, we’ll show you how to install its equivalent, GreaseKit with Safari.

What Is Greasemonkey?

Greasemonkey is an add-on for browsers that allow users to install “scripts” that are fine tuned to affect how different websites function. For example, if you’re a person who uses MySpace and really hates how the login page is full of ads, you can install a script that adjusts the display of the page when it loads and gives you a cleaner experience.

Cleaning up MySpace is just the beginning; there are scripts for just about everything. If you’re not a fan of the default Gmail web interface, you can use a script that declutters it.

But it’s not just about changing the look and feel of a website; there are scripts that remove content like ads and scripts that add functionality, like a script that lets you add notes to entries in your Netflix queue.

Installing GreaseKit in Safari

While Greasemonkey is an easy add-on if you use Firefox, you can also use similar add-ons in Safari. For Safari users, begin by downloading SIMBL and install it. Then download GreaseKit and install the bundle file inside to ~/Library/Application Support/SIMBL/Plugins. If this folder doesn’t exist, just add it before dropping the file inside.

Next, relaunch Safari and, provided things worked well, you’ll see a new menu entry for GreaseKit. Now go find some scripts (see below) and click “Install This Script” to copy it into GreaseKit. You’ll see the JavaScript flash on screen and eventually it should be added to your GreaseKit menu.


Getting Scripts

There are a variety of places to find the scripts that integrate with Greasemonkey or GreaseKit. is perhaps the largest of these and an excellent place to start. I urge caution though as these scripts can become dated when the websites they affect are updated. Also, because you’re not running the scripts in Greasemonkey on Firefox for Windows (where they are usually tested), the add-ons may not function exactly as described. This is likely to happen in Safari if the script is overly complex, requiring additional interfaces to manage it.

Here are the scripts I’ve discussed in this article:

You also might enjoy the Unfriend Finder for Facebook that lets you know when (and who) has unfriended you. This particular script doesn’t work well in Safari, so I recommend using it in Firefox.

Have you found any good scripts? Feel free to use the comments below and let us know what you think.