Purchasing online and offline is converging, as digital experiences become designed around the in-store experiences that we’re used to. We all know what it feels like to walk into a book store, or even a library, and browse the books on the shelf.
Apple’s Books app is a gorgeous design and experience, mimicking that of a bookshelf, but Google has outdone them with its WebGL Bookcase which is hosted on its “Chrome Experiments” site. The site has hundreds of beautiful interface projects that you can check out.
Google said this about the WebGL Bookcase today on its blog:
A digital interface needs to be familiar enough to be intuitive, while simultaneously taking advantage of the lack of constraints in a virtual space. In this case, we imagined something that looks like the shelves in your living room, but is also capable of showcasing the huge number of titles available online—many more than fit on a traditional shelf. With this in mind, we designed a digital bookcase that’s an infinite 3D helix. You can spin it side-to-side and up and down with your mouse. It holds 3D models of more than 10,000 titles from Google Books.
The books are organized into 28 subjects. To choose a subject, click the subject button near the top of your screen when viewing the bookcase. The camera then flies to that subject. Clicking on a book pulls it off the shelf and brings it to the front and center of the screen. Click on the high-resolution cover and the book will open to a page with title and author information as well as a short synopsis, provided by the Google Books API. All of the visuals are rendered with WebGL, a technology in Google Chrome and other modern browsers that enables fast, hardware-accelerated 3D graphics right in the browser, without the need for a plug-in.
If you’ve finished your browsing and find a book you want to read, you can click the “Get this book” button on the bottom right of the page, which will send you to that book’s page on books.google.com. Or, you can open the title on your phone or tablet via the QR code that’s in the bottom left corner of the page, using a QR code app like Google Goggles. You can also browse just free books by selecting the “Free Books” subject in the subject viewer.
Google posted the video below, which shows how intuitive it is to browse through books, get more information on them, and even “get the book” by purchasing it from Google Books.
You can try it out for yourself, here. Fair warning though, the project appears to work best using Google’s Chrome Browser, and if you have a slower machine the intensive graphical WebGL technology could slow you down.
Would you purchase more books with an experience like this? I feel like Amazon‘s layout and display of items is old, and relies mostly on its recommendations for other products. It doesn’t feel like a store at all, and Google has shown that it’s possible to bring you a better browsing and purchasing experience with WebGL.