Developing for

Wearable Devices

Erica Stanley

@ericastanley

@connect_js

#WearableDev

Vision

@ericastanley

#WearableDev

Cameras

@ericastanley

#WearableDev

Smartwatches

@ericastanley

#WearableDev

Wristbands

@ericastanley

#WearableDev

Head Gear

@ericastanley

#WearableDev

Industries/ Solutions

• Health/ Fitness
• Home/ Environment Enhancement
  • Automation
  • Navigation
• Identity

@ericastanley

#WearableDev

Behind the Scenes: The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

Technical Challenges

• Connectivity & Processing vs Power Consumption
• Fragmentation
• Privacy and Security

@ericastanley

#WearableDev

Technology Challenges

• Understand your vulnerabilities
• Build security from the ground up
• Start with the OS
• Build an End-to-End Security Solution

Security Guidelines

@ericastanley

#WearableDev

 The Technology

• Foundations
  • Networking
  • Sensors
  • Cloud Computing
  • Big Data
  • Machine Learning/ Artificial Intelligence
  • Computer Vision
  • Augmented Reality
• The Physical Graph
• Technical Challenges
• Tools

@ericastanley

#WearableDev

Tools

• Arduino Compatible
  • LilyPad
  • Adafruit Flora and Gemma
  • Intel Edison
• Tessel
  • Hardware + Software Platform
  • Node Compatible
• Metawear
  • Kickstarter Grad
  • Open Source hardware + software

Hardware

@ericastanley

#WearableDev

Tools

• Vendor SDKs and APIs
  • Android-based
    • Google Glass
      • GDK, Mirror API
    • Android Wear
    • Sony Smartwatch
  • Pebble
  • iOS
• Tizen SDK (open source, used in Samsung Gear S)

Software

• Spark Core
• IoT Toolkit
• Open.Sen.se
• Hybrid Group
  • Cylon.js
  • Artoo
  • Gobot
• Computer Vision
  • Open CV
  • SimpleCV

@ericastanley

#WearableDev

Tools

• Proto.io for Android Wear

Software (UX/ Design)

@ericastanley

#WearableDev

Prototyping for Wearables

• Mix of Design and Technology
• Rapid Iterations/ Fail Fast.
• Cross-skill talent and training

@ericastanley

#WearableDev

Designing for Wearables

• No longer own the foreground
• Integration with other platforms & devices
• Discoverability of Functionality
  
• Low Energy/ Computing Power

Challenges

@ericastanley

#WearableDev

Designing for Wearables

• Form Factor
• Natural Interfaces
• Microinteractions

Philosopy

@ericastanley

#WearableDev

Designing for Wearables

• Cost vs Benefits
• Social Weight

Form Factor

@ericastanley

#WearableDev

Designing for Wearables

SW = CL + PP + SC

• CL → cognitive load
• PP → physical presence
• SC → social convention

Social Weight

@ericastanley

#WearableDev

Designing for Wearables

Social Weight

@ericastanley

#WearableDev

CL:

PP:

SC:

CL:

PP:

SC:

CL:

PP:

SC:

CL: Cognitive Load      PP: Physical Presence      SC: Social Convention

Source: Moe Tanabian, Solid 2014, Bringing Life to Wearables

Designing for Wearables

Social Weight

@ericastanley

#WearableDev

CL:

PP:

SC:

CL: ?

PP:

SC:

CL:

PP:

SC:

CL: Cognitive Load      PP: Physical Presence      SC: Social Convention

Source: Moe Tanabian, Solid 2014, Bringing Life to Wearables

Designing for Wearables

• Form Factor
• Natural Interfaces
• Microinteractions

Philosopy

@ericastanley

#WearableDev

Designing for Wearables

• Inputs
  • Touch
  • Hand Gestures
  • Voice
  • Eye/ Head Movement
  • Thought?! (Um, did I mention the future is now?)

Natural Interfaces

@ericastanley

#WearableDev

Designing for Wearables

• Outputs
  • Haptic
  • Visual
  • Audio

Natural Interfaces

@ericastanley

#WearableDev

Designing for Wearables

• Form Factor
• Natural Interfaces
• Microinteractions

Philosopy

@ericastanley

#WearableDev

Designing for Wearables

Contained product moments that revolve around a single use case and have one main task.

Microinteractions

@ericastanley

#WearableDev

Designing for Wearables

• No one size fits all
• Don't get in the way
• Keep it Timely
• Avoid the unexpected

Guidelines

@ericastanley

#WearableDev

Designing for Wearables

• Scale with User's Attention
• Design with Data
• Service Design
• Design for Identity

Practices

@ericastanley

#WearableDev

Developing for Wearables

• Little to No Standards
• Interface Development Challenges
  • Screen Real Estate / No Display
  • Programmatic Interface Testing
• Restricted memory and processing capabilities
• Integration Testing
  • Sensors
  • Firmware
  • Devices

Challenges

@ericastanley

#WearableDev

Example: Pebble Geolocation 

Sending and Receiving Messages

@ericastanley

#WearableDev

Pebble.sendAppMessage({"0": "Your first value", "1": "Your second value", "2": "Your third value"},
  function(e) {
    console.log("Successfully delivered message with transactionId=" + e.data);
  },
  function(e) {
    console.log("Unable to deliver message with transactionId=" + e.data + ". Error is: " + e.error.message);
  }
);

Example: Pebble Geolocation 

Geolocating

@ericastanley

#WearableDev

var locationOptions = {timeout: 15000, maximumAge: 60000}; 

Pebble.addEventListener('ready', function(e) {
  locationWatcher = window.navigator.geolocation.watchPosition(
                                                    fetch_location_data, 
                                                    fetch_location_error, 
                                                    locationOptions);
});

function fetch_location_error() {
  Pebble.sendAppMessage({location: 'Unable to retrieve location'});
}

Example: Pebble Geolocation 

Making Requests

@ericastanley

#WearableDev

var req = new XMLHttpRequest(),
    version = Date.now(),
    clientId = 'BNBFMG541RT1SJBWRZ1NPS1F1QQKK2B19SMS0EDAU3DR7ZZA',
    clientSecret = '4AFKSBKJHQAKJHFBNGERON0LYMSMG1AKJ2KJHBWKS8KJHSDKHE',
    latitude = pos.coords.latitude,
    longitude = pos.coords.longitude;

req.onload = function(e) {
  if (req.readyState == 4 && req.status == 200) {
    if (req.status == 200) {
      var response = JSON.parse(req.responseText);
      if (response && response.meta.code == '200' && response.response) {

var venue = response.response.venues[0];

Pebble.sendAppMessage({location: venue.location.address + ', ' + venue.location.city});

Developing for Wearables

• Native Mobile Development is optional but a good start
• Choose your hardware
• DIY Tutorials
  • http://makezine.com/projects/
• Hackathons
  • AT&T
  • Intel
• Local User Groups
  • Atl Mobile Dev
  • Freeside Atlanta
  • Sensors and Startups

Next Steps

@ericastanley

#WearableDev

Sources

• http://postscapes.com/internet-of-things-resources/
• http://iot-datamodels.blogspot.com/2013/02/an-open-source-platform-for-internet-of.html
• http://www.slideshare.net/alui0000/reorientating-ux-design-for-the-internet-of-things
• http://solidcon.com/solid2014/
• http://www.wearablestechcon.com/
• http://www.cmo.com/articles/2014/6/16/Mind_Blowing_Stats_Wearable_Tech.html
• http://www.sitepoint.com/pebble-watch-development-javascript/
• http://www.deloittedigital.com/us/blog/the-truth-about-wearables-what-they-are-and-arent

@ericastanley

#WearableDev

Thank you!

Questions?

@ericastanley

#WearableDev