HTML5 for mobile Development tutorial

GOOGLE-GLASS-LOGOGoogle Glass is around the corner it’s time to prepare our services for this new device type. Reading the specs for the first time can be a little overwhelming; therefore I’ll try to make a quick go through the Glass app development process, the mirror API and its HTML5 support.

The new screen

A mobile experience is not a smaller version of a desktop app or website. And a Google Glass app is not a mobile app or website on a transparent background.

If you have a mobile website or a mobile app and you want to support Google Glass, you need to sit down and understand how the device works and what users will expect from an app on it. BTW, a Google Glass app is known as Glassware.


Google Glass is not a mobile replacement; it’s more than a companion. The Glass, not having a cellular connection, needs a phone companion or WiFi to access its heart: the Google cloud. For example, geolocation is provided only if the Glass is paired with an Android 4.x phone.

Important ideas

  • Users don’t browse the web on Glass (well, they can ask questions to Google but there is no API for that yet) UPDATE 1/7/13: A web browser is now available. Check post.
  • Users don’t install apps yet, they authorize just Glassware to communicate with the device as we authorize a website/app to access our Facebook/Google+ account
  • We need to let the user decide when to access your services and data, we should not force the user to read what we have to say
  • Create an specific and optimized architecture for Google Glass
  • While everybody thinks on Glass with AR (Augmented Reality), today the device is not offering AR features apart from Map Directions. We can send contextual information, images and videos to user’s device but we will not augment the reality on user’s vision today.
  • It’s not a mobile replacement; it’s not a desktop replacement. It’s a new and different kind of device.

accionDevice specs

The first Google Glass device has a high-resolution nHD display 640×360 (one ninth of a full HD) equivalent of a 25″ HD screen from 2.5 meters or 8 feet away. It has a 5MP camera, a bone conduction transducer for audio (that means you don’t need to put earpieces for listening), accelerometer, a touch lateral panel, Bluetooth and WiFi. Check more about technical specs.

native vs. web?

Glassware can be developed today only by using RESTful HTTP services. There is no native development or offline apps. UPDATE 29/5/13: At Google IO 2013, a GDK (Google Development Kit) was announced and it will allow native Glass app development for offline and full sensor access on the device. These apps will coexist with Glassware and its UI and interaction is not yet known.

Everything on Glass runs over the cloud and if we want to develop Glassware we have to use a server-side platform, such as Java, PHP, Node.JS or Python.

We authorize Googleware to access our Glass device through a website using OAuth 2.0 Once connected to our Glassware, we can see and edit on the browser how cards look like

You might also like

For Dummies HTML, CSS, and JavaScript Mobile Development For Dummies
Book (For Dummies)
  • Used Book in Good Condition