Physical Web Cookbook

How To Walk Up and Use Anything

The Physical Web is an approach to unleash the core superpower of the web: interaction on demand. People should be able to walk up to any smart device – a vending machine, a poster, a toy, a bus stop, a rental car – and not have to download an app first. Everything should be just a tap away. The Physical Web is actually fairly simple. It has just two main parts:

  • a wirelessly broadcasted URL
  • software on a device that detects and displays the URL when requested

This document shows you simple patterns of use, giving you a range of ways to use the Physical Web in your projects.

The Physical Web is not a Google proprietary project. This is an open approach based on URLs and the web which can be used by anyone.

Getting Started with the Physical Web

To get started with the Physical Web, all you need is a Bluetooth Low Energy (BLE) beacon that supports Eddystone-URL and a website. Simply follow your specific beacon’s instructions to configure the URL to your website, place the beacon and that’s it: you’re now part of the Physical Web!

Simple Static Beacon

With just a webpage and a beacon, you can quickly create what we call a simple static beacon, where the broadcasted URL points to an informational webpage. Here are a couple examples:

Info Page

The beacon broadcasts a URL that points to a page with relevant information. For example, a movie poster points to a page with the movie’s trailer and showtimes. An identifier for the movie poster’s location can be encoded into the broadcasted URL such that the webpage can filter for only show times that are nearby.

Swarm Page

Several beacons are placed into a space that is too large to be covered by a single beacon, and each broadcasts exactly the same URL. The user’s mobile device will only show the URL once in the results list, so no need to worry about duplication. This technique is useful for a mall with an interactive mobile map or a large retail space with an in-store website.

Let’s Dive Deeper

We can build even more compelling experiences when we introduce a link between the Physical Web object and the webpage loaded on the user’s device.

Active Web Server

Instead of a static informational page, the beacon broadcasts the URL of a web app that uses more advanced web technologies to offer interactive experiences. Here are a couple examples:

Push Notifications

The beacon broadcasts the URL of a webpage that implements a Service Worker with push notifications. For example, a restaurant can create a queueing system that doesn’t require the user to ask the hostess for a piece of plastic with a buzzer and LEDs in it. Instead, the user easily opens up the queuing web app, grabs a spot in a digital line, and gets notified when the time is right.

Here is a demo of how this could work:

Parking Meter

The parking meter has a radio antennae providing internet access. The beacon within points to a webpage (with the meter’s ID encoded in the URL) that uses websockets to connect to the parking meter. From this webpage, the user can easily use credit card autofill or other online payment APIs to add time to the meter.

Here is a demo of how this could work:

 

New possibilities with Web Bluetooth

A standardized open web JavaScript Bluetooth API is currently in the works. This API will allow webpages to directly connect to nearby Bluetooth devices.

Web Bluetooth enables devices to offer advanced interactions without requiring a connection to the internet. For example, the parking meter from the active web server section above could be implemented with only a direct Bluetooth connection and with no internet connection of its own. A direct Bluetooth connection can also be much faster than passing interaction through the cloud, since network latency is avoided. Not to mention, a Bluetooth antenna is much cheaper than providing internet-connectivity, enabling more ubiquitous interactivity in everyday devices:

Happy Meal Toy

In this example, the toy broadcasts a URL to a webpage that contains JavaScript to directly connect to the toy via Bluetooth.The toy is a standalone device that can be played with by youngsters, while the webpage interaction lets the parent easily configure and personalise the toy.