Siggraph 2014: The Glass Class - Designing Wearable Interfaces
-
Upload
mark-billinghurst -
Category
Technology
-
view
3.506 -
download
3
description
Transcript of Siggraph 2014: The Glass Class - Designing Wearable Interfaces
![Page 1: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/1.jpg)
![Page 2: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/2.jpg)
The Glass Class: Designing Wearable Interfaces Mark Billinghurst The HIT Lab NZ, University of Canterbury
The 41st International Conference and Exhibitionon Computer Graphics and Interactive Techniques
![Page 3: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/3.jpg)
INTRODUCTION
![Page 4: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/4.jpg)
Mark Billinghurst ▪ Director of The HIT Lab NZ, University of
Canterbury
▪ PhD Univ. Washington
▪ Research on AR, mobile HCI, Collaborative Interfaces, Wearables
▪ Joined Glass team at Google [x] in 2013
![Page 5: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/5.jpg)
![Page 6: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/6.jpg)
![Page 7: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/7.jpg)
How do you Design for this?
![Page 8: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/8.jpg)
Course Goals In this course you will learn
▪ Introduction to head mounted wearable computers
▪ Understanding of current wearable technology
▪ Key design principles/interface metaphors
▪ Rapid prototyping tools
▪ Areas for future research
![Page 9: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/9.jpg)
What You Won’t Learn ▪ Who are the companies/universities in this space ▪ See the Siggraph exhibit floor
▪ Designing for non-HMD based interfaces ▪ Watches, fitness bands, etc
▪ How to develop wearable hardware ▪ optics, sensor assembly, etc
▪ Evaluation methods ▪ Experimental design, statistics, etc
![Page 10: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/10.jpg)
Schedule • 10:45 am Introduction • 10:55 am Technology Overview • 11:05 am Design Guidelines • 11:25 am Prototyping Tools • 11:55 am Example Applications • 12:05 am Research Directions/Resources
![Page 11: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/11.jpg)
A Brief History of Computing
Trend ▪ Smaller, cheaper, faster, more intimate ▪ Moving from fixed to handheld and onto body
1950’s 1980’s
1990’s
![Page 12: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/12.jpg)
Wearable Computing ▪ Computer on the body that is: ▪ Always on ▪ Always accessible ▪ Always connected
▪ Other attributes ▪ Augmenting user actions ▪ Aware of user and surroundings
![Page 13: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/13.jpg)
Desk Lap Hand Head
![Page 14: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/14.jpg)
The Ideal Wearable ▪ Persists and Provides Constant Access: Designed for
everyday and continuous use over a lifetime. ▪ Senses and Models Context: Observes and models the
users environment, mental state, it’s own state. ▪ Augments and Mediates: Information support for the user in
both the physical and virtual realities. ▪ Interacts Seamlessly: Adapts its input and output modalities
to those most appropriate at the time.
Starner, T. E. (1999). Wearable computing and contextual awareness (Doctoral dissertation, Massachusetts Institute of Technology).
![Page 15: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/15.jpg)
History of Wearables ▪ 1960-90: Early Exploration ▪ Gamblers and Custom build devices
▪ 1990 - 2000: Academic, Military Research ▪ MIT, CMU, Georgia Tech, EPFL, etc ▪ 1997: ISWC conference starts
▪ 1995 – 2005+: First Commercial Uses ▪ Niche industry applications, Military
▪ 2010 - : Second Wave of Wearables
![Page 16: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/16.jpg)
Origins - The Gamblers
• Thorp and Shannon (1961) – Wearable timing device for roulette prediction
• Keith Taft (1972) – Wearable computer for blackjack card counting
Belt computer Shoe Input Glasses Display
![Page 17: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/17.jpg)
Steve Mann (1980s - )
http://wearcomp.org/
![Page 18: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/18.jpg)
Thad Starner (1993 - )
![Page 19: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/19.jpg)
MIT Wearable Computing (1993-)
http://www.media.mit.edu/wearables/
![Page 20: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/20.jpg)
CMU Wearables (1991–2000) ▪ Industry focused wearables ▪ Maintenance, repair
▪ Custom designed interface ▪ Dial/button input
▪ Rapid prototyping approach ▪ Industrial designed, ergonomic
http://www.cs.cmu.edu/afs/cs/project/vuman/www/frontpage.html
![Page 21: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/21.jpg)
Prototype Applications ▪ Remembrance Agent ▪ Rhodes (97)
▪ Augmented Reality ▪ Feiner (97), Thomas (98)
▪ Remote Collaboration ▪ Garner (97), Kraut (96)
■ Maintenance ■ Feiner (93), Caudell (92)
![Page 22: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/22.jpg)
Mobile AR: Touring Machine (1997) ▪ University of Columbia ▪ Feiner, MacIntyre, Höllerer, Webster
▪ Combined ▪ See through head mounted display ▪ GPS tracking, Orientation sensor ▪ Backpack PC (custom) ▪ Tablet input
Feiner, S., MacIntyre, B., Höllerer, T., & Webster, A. (1997). A touring machine: Prototyping 3D mobile augmented reality systems for exploring the urban environment. Personal Technologies, 1(4), 208-217.
![Page 23: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/23.jpg)
Touring Machine View
▪ Virtual tags overlaid on the real world ▪ “Information in place”
![Page 24: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/24.jpg)
Early Commercial Systems ▪ Xybernaut (1996 - 2007) ▪ Belt worn, HMD, 200 MHz
▪ ViA (1996 – 2001) ▪ Belt worn, Audio Interface ▪ 700 MHz Crusoe
■ Symbol (1998 – 2006) ■ Wrist worn computer ■ Finger scanner
![Page 25: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/25.jpg)
Google Glass (2011 - )
![Page 26: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/26.jpg)
The Second Wave of Wearables ▪ Vuzix M-100 ▪ $999, professional
▪ Recon Jet ▪ $600, more sensors, sports
▪ Opinvent ▪ 500 Euro, multi-view mode
▪ Motorola Golden-i ▪ Rugged, remote assistance
![Page 27: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/27.jpg)
Projected Market
![Page 28: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/28.jpg)
![Page 29: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/29.jpg)
Summary Wearables are a new class of computing
Intimate, persistent, aware, accessible Evolution over 50 year history
Backpack to head worn Custom developed to consumer ready device
Enables new applications Collaboration, memory, AR, industry, etc
Many head worn wearables are coming
![Page 30: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/30.jpg)
TECHNOLOGY
![Page 31: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/31.jpg)
▪ fafds
![Page 32: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/32.jpg)
Enabling Technologies (1989-) ▪ Private Eye Display (Reflection Technologies) ▪ 720 x 280 dipslay ▪ Vibrating mirror
▪ Twiddler (Handykey) ▪ Chording keypad ▪ Mouse emulation
![Page 33: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/33.jpg)
Tin Lizzy (Platt, Starner, 1993) ▪ General Purpose Wearable ▪ 150 MHz Pentium CPU ▪ 32-64 Mb RAM, 6 GB HDD ▪ VGA display ▪ 2 PCMCIA slots ▪ Cellular modem
http://www.media.mit.edu/wearables/lizzy/lizzy/index.html
![Page 34: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/34.jpg)
• asda
![Page 35: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/35.jpg)
![Page 36: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/36.jpg)
▪ Hardware ▪ CPU TI OMAP 4430 – 1 Ghz ▪ 16 GB SanDisk Flash, 2 GB Ram
▪ Input ▪ 5 mp camera, 720p recording, microphone ▪ InvenSense MPU-9150 inertial sensor
▪ Output ▪ Bone conducting speaker ▪ 640x360 micro-projector display
Google Glass Specs
![Page 37: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/37.jpg)
Glass Display
![Page 38: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/38.jpg)
View Through Google Glass
Always available peripheral information display Combining computing, communications and content capture
![Page 39: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/39.jpg)
Google Glass Demo
![Page 40: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/40.jpg)
Google Glass User Interface
• dfasdf
![Page 41: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/41.jpg)
Timeline Metaphor
![Page 42: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/42.jpg)
User Experience • Truly Wearable Computing
– Less than 46 ounces
• Hands-free Information Access – Voice interaction, Ego-vision camera
• Intuitive User Interface – Touch, Gesture, Speech, Head Motion
• Access to all Google Services – Map, Search, Location, Messaging, Email, etc
![Page 43: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/43.jpg)
Types of Head Mounted Displays Occluded
See-thru
Multiplexed
![Page 44: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/44.jpg)
Multiplexed Displays ▪ Above or below line of sight ▪ Strengths ▪ User has unobstructed view of real world ▪ Simple optics/cheap
▪ Weaknesses ▪ Direct information overlay difficult ▪ Display/camera offset from eyeline
▪ Wide FOV difficult
![Page 45: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/45.jpg)
Vuzix M-100
▪ Monocular multiplexed display ($1000) ▪ 852 x 480 LCD display, 15 deg. FOV ▪ 5 MP camera, HD video ▪ GPS, gyro, accelerometer
![Page 46: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/46.jpg)
Optical see-through HMD Virtual images from monitors
Real World Optical
Combiners
![Page 47: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/47.jpg)
Epson Moverio BT-200
▪ Stereo see-through display ($700) ▪ 960 x 540 pixels, 23 degree FOV, 60Hz, 88g ▪ Android Powered, separate controller ▪ VGA camera, GPS, gyro, accelerometer
![Page 48: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/48.jpg)
Strengths of optical see-through ▪ Simpler (cheaper) ▪ Direct view of real world ▪ Full resolution, no time delay (for real world) ▪ Safety ▪ Lower distortion
▪ No eye displacement ▪ see directly through display
![Page 49: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/49.jpg)
Video see-through HMD Video cameras
Monitors
Graphics
Combiner
Video
![Page 50: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/50.jpg)
Vuzix Wrap 1200DXAR
▪ Stereo video see-through display ($1500) ■ Twin 852 x 480 LCD displays, 35 deg. FOV ■ Stereo VGA cameras ■ 3 DOF head tracking
![Page 51: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/51.jpg)
Strengths of Video See-Through ▪ True occlusion ▪ Block image of real world
▪ Digitized image of real world ▪ Flexibility in composition, match time delays ▪ More registration, calibration strategies
▪ Wide FOV is easier to support ▪ wide FOV camera
![Page 52: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/52.jpg)
Input Options ▪ Physical Devices ▪ Keyboard, Pointer, Stylus
▪ Natural Input ▪ Speech, Gesture
▪ Other ▪ Physiological sensors
![Page 53: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/53.jpg)
Twiddler Input
▪ Chording or multi-tap input ▪ Possible to achieve 40 - 60 wpm after 30+ hours ▪ cf 20 wpm on T9, or 60+ wpm for QWERTY
Lyons, K., Starner, T., Plaisted, D., Fusia, J., Lyons, A., Drew, A., & Looney, E. W. (2004, April). Twiddler typing: One-handed chording text entry for mobile phones. In Proceedings of the SIGCHI
conference on Human factors in computing systems (pp. 671-678). ACM.
![Page 54: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/54.jpg)
Virtual Keyboards
▪ In air text input ▪ Virtual QWERTY keyboard up to 20 wpm ▪ Word Gesture up to 28 wpm
▪ Handwriting around 20-30 wpm A. Markussen, et. al. Vulture: A Mid-Air Word-Gesture Keyboard (CHI 2014)
![Page 55: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/55.jpg)
Unobtrusive Input Devices
▪ GestureWrist ▪ Capacitive sensing, changes with hand shape
Rekimoto, J. (2001). Gesturewrist and gesturepad: Unobtrusive wearable interaction devices. In Wearable Computers, 2001. Proceedings. Fifth International Symposium on (pp. 21-27). IEEE.
![Page 56: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/56.jpg)
Unobtrusive Input Devices
▪ GesturePad ▪ Capacitive multilayered touchpads ▪ Supports interactive clothing
![Page 57: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/57.jpg)
Skinput
Using EMG to detect muscle activity Tan, D., Morris, D., & Saponas, T. S. (2010). Interfaces on the go.
XRDS: Crossroads, The ACM Magazine for Students, 16(4), 30-34.
![Page 58: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/58.jpg)
Issues to Consider ▪ Fatigue ▪ “Gorrilla” Arm from free-hand input
▪ Comfort ▪ People want to do small gestures by waist
▪ Interaction on the go ▪ Can input be done while moving?
![Page 59: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/59.jpg)
DESIGN GUIDELINES
![Page 60: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/60.jpg)
INTERACTION DESIGN
![Page 61: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/61.jpg)
Design For the Device
• Simple, relevant information • Complement existing devices
![Page 62: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/62.jpg)
Last year Last week Now Forever
The Now machine Focus on location, contextual and timely information, and communication.
![Page 63: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/63.jpg)
Don’t design an app
Glass OS is time-based model, not an app model.
![Page 64: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/64.jpg)
The world is the experience
Get the interface and interac-ons out of the way.
![Page 65: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/65.jpg)
It's like a rear view mirror
Don't overload the user. S-ck to the absolutely essen-al, avoid long interac-ons.
Be explicit.
![Page 66: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/66.jpg)
Micro Interac8ons
The posi-on of the display and limited input ability makes longer interac-ons less comfortable.
Using it shouldn’t take longer than taking out your phone.
![Page 67: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/67.jpg)
Micro-Interactions
On mobiles people split attention between display and real world
![Page 68: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/68.jpg)
Time Looking at Screen
Oulasvirta, A. (2005). The fragmentation of attention in mobile interaction, and what to do with it. interactions, 12(6), 16-18.
![Page 69: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/69.jpg)
Design for MicroInteractions ▪ Design interaction less than a few seconds
– Tiny bursts of interaction – One task per interaction – One input per interaction
▪ Benefits – Use limited input – Minimize interruptions – Reduce attention fragmentation
![Page 70: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/70.jpg)
Make it Glanceable
• Seek to rigorously reduce information density. • Design for recognition, not reading.
Bad Good
![Page 71: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/71.jpg)
Reduce the Number of Info Chunks
• You are designing for recognition, not reading. • Reducing the total # of information chunks will
greatly increase the glanceability of your design. • .
1
2 3
1 2
3
4
5 (6)
![Page 72: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/72.jpg)
Design single interactions < 4 s
Eye movements For 1: 1 230ms For 2: 1 230ms For 3: 1 230ms For 4: 3 690ms For 5: 2 460ms
~1,840ms
Eye movements For 1: 1-2 460ms For 2: 1 230ms For 3: 1 230ms
~920ms
1
2
3
1 2
3
4
5 (6)
![Page 73: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/73.jpg)
Test the glanceability of your design
![Page 74: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/74.jpg)
Don’t Get in the Way
• Enhance, not replace, real world interaction
![Page 75: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/75.jpg)
Design for Interruptions
▪ Gradually increase engagement and attention load ▪ Respond to user engagement
Receiving SMS on Glass
“Bing”
Tap Swipe
Glass
Show Message Start Reply
User Look Up
Say Reply
![Page 76: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/76.jpg)
Do one thing at a time
![Page 77: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/77.jpg)
Keep it Relevant
• Information at the right time and place
![Page 78: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/78.jpg)
Design for Context
![Page 79: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/79.jpg)
Avoid the Unexpected
• Don’t send unexpected content at wrong times • Make it clear to users what your application does
![Page 80: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/80.jpg)
Build for People
• Use imagery, voice interaction, natural gestures • Focus on fire and forget interaction model
![Page 81: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/81.jpg)
VISUAL DESIGN
![Page 82: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/82.jpg)
Transparent displays are tricky
Colors are funny and inconsistent. You can only add light to a scene, not cover anything up.
Mo-on can be disorien-ng. Clarity, contrast, brightness, visual field and aHen-on are important.
![Page 83: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/83.jpg)
![Page 84: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/84.jpg)
White is your new black
![Page 85: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/85.jpg)
Establish hierarchy with color
White is your <h1> and grey is your <h2> or <h3>. Footer text - establishing time, attribution, or distance - is the only place with smaller font size.
![Page 86: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/86.jpg)
Use brand-specific typography
![Page 87: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/87.jpg)
Test your design indoors + outdoors
![Page 88: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/88.jpg)
EXAMPLE APPLICATIONS
![Page 89: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/89.jpg)
• https://glass.google.com/glassware
Glassware Applications
![Page 90: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/90.jpg)
![Page 91: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/91.jpg)
![Page 92: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/92.jpg)
![Page 93: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/93.jpg)
Virtual Exercise Companion
• GlassFitGames – http://www.glassfitgames.com
![Page 94: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/94.jpg)
Vipaar Telemedicine
• Vipaar + UAB - http://www.vipaar.com • Endoscopic view streamed remotely • Remote expert adds hands – viewed in Glass
![Page 95: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/95.jpg)
CityViewAR
• Using AR to visualize Christchurch city buildings – 3D models of buildings, 2D images, text, panoramas – AR View, Map view, List view – Available on Android/iOS market
![Page 96: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/96.jpg)
CityViewAR on Glass
• AR overlay of virtual buildings in Christchurch
![Page 97: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/97.jpg)
PROTOTYPING TOOLS
![Page 98: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/98.jpg)
How can we quickly prototype Wearable
experiences with little or no coding?
![Page 99: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/99.jpg)
Why Prototype? ▪ Quick visual design ▪ Capture key interactions ▪ Focus on user experience ▪ Communicate design ideas ▪ “Learn by doing/experiencing”
![Page 100: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/100.jpg)
Prototyping Tools ▪ Static/Low fidelity ▪ Sketching ▪ User interface templates ▪ Storyboards/Application flows ▪ Screen sharing
▪ Interactive/High fidelity ▪ Wireframing tools ▪ Mobile prototyping ▪ Native Coding
![Page 101: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/101.jpg)
Important Note ▪ Most current wearables run Android OS ▪ eg Glass, Vuzix, Atheer, Epson, etc
▪ So many tools for prototyping on Android mobile devices will work for wearables
▪ If you want to learn to code, learn ▪ Java, Android, Javascript/PHP
![Page 102: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/102.jpg)
Typical Development Steps ▪ Sketching ▪ Storyboards ▪ UI Mockups ▪ Interaction Flows ▪ Video Prototypes ▪ Interactive Prototypes ▪ Final Native Application
Increased Fidelity & Interactivity
![Page 103: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/103.jpg)
Low Fidelity Tools • Sketching • GlassSim • UI Templates • Storyboards • GlassWare flow designer • Android Design Preview • Video sketches
![Page 104: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/104.jpg)
High Fidelity Tools • UXPin/Proto.io • JustinMind • Processing • WearScript • Unity3D • Native Coding
![Page 105: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/105.jpg)
Sketched Interfaces
▪ Sketch + Powerpoint/Photoshop/Illustrator
![Page 106: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/106.jpg)
GlassSim – http://glasssim.com/
▪ Simulate the view through Google Glass ▪ Multiple card templates
![Page 107: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/107.jpg)
GlassSim Card Builder ▪ Use HTML for card details ▪ Multiple templates ▪ Change background ▪ Own image ▪ Camera view
![Page 108: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/108.jpg)
GlassSim Samples
![Page 109: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/109.jpg)
Glass UI Templates
▪ Google Glass Photoshop Templates ▪ http://glass-ui.com/ ▪ http://dsky9.com/glassfaq/the-google-glass-psd-template/
![Page 110: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/110.jpg)
Application Storyboard
▪ http://dsky9.com/glassfaq/google-glass-storyboard-template-download/
![Page 111: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/111.jpg)
Glassware Flow Designer • Features
– Design using common patterns and layouts – Specify interactions and card flow – Share with other designers
• Available from: – https://developers.google.com/glass/tools-downloads/glassware-flow-designer
![Page 112: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/112.jpg)
Example Flow
• Blah
![Page 113: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/113.jpg)
Screen Sharing
▪ Android Design Preview – Tool for sharing screen content onto Glass – https://github.com/romannurik/
AndroidDesignPreview/releases
Mac Screen Glass
![Page 114: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/114.jpg)
▪ Series of still photos in a movie format. ▪ Demonstrates the experience of the product ▪ Discover where concept needs fleshing out. ▪ Communicate experience and interface ▪ You can use whatever tools, from Flash to iMovie.
Video Sketching
![Page 115: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/115.jpg)
See https://vine.co/v/bgIaLHIpFTB
Example: Glass Vine UI
![Page 116: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/116.jpg)
Limitations ▪ Positives ▪ Good for documenting screens ▪ Can show application flow
▪ Negatives ▪ No interactivity/transitions ▪ Can’t be used for testing ▪ Can’t deploy on wearable ▪ Can be time consuming to create
![Page 117: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/117.jpg)
Interactive Wireframing ▪ Developing interactive interfaces/wireframes
▪ Transitions, user feedback, interface design
▪ Web based tools ▪ UXpin - http://www.uxpin.com/ ▪ proto.io - http://www.proto.io/
▪ Native tools ▪ Justinmind - http://www.justinmind.com/ ▪ Axure - http://www.axure.com/
![Page 118: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/118.jpg)
UXpin - www.uxpin.com
▪ Web based wireframing tool ▪ Mobile/Desktop applications ▪ Glass templates, run in browser
![Page 119: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/119.jpg)
Proto.io - http://www.proto.io/ ▪ Web based mobile prototyping tool ▪ Features ▪ Prototype for multiple devices ▪ Gesture input, touch events, animations ▪ Share with collaborators ▪ Test on device
![Page 120: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/120.jpg)
Proto.io - Interface
![Page 121: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/121.jpg)
Demo: Building a Simple Flow
![Page 122: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/122.jpg)
Gesture Flow Scr1
Scr2 Scr3
Scr4 Scr5 Scr6
Tap
Swipe
![Page 123: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/123.jpg)
Start Transitions
![Page 124: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/124.jpg)
Justinmind ▪ Native wireframing tool ▪ Build mobile apps without programming ▪ drag and drop, interface templates ▪ web based simulation ▪ test on mobile devices ▪ collaborative project sharing
▪ Templates for Glass, custom templates
![Page 125: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/125.jpg)
User Interface - Glass Templates
![Page 126: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/126.jpg)
Web Simulation Tool
![Page 127: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/127.jpg)
Wireframe Limitations ▪ Can’t deploy on Glass ▪ No access to sensor data ▪ Camera, orientation sensor
▪ No multimedia playback ▪ Audio, video
▪ Simple transitions ▪ No conditional logic
![Page 128: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/128.jpg)
Processing ▪ Programming tool for Artists/Designers ▪ http://processing.org ▪ Easy to code, Free, Open source, Java based ▪ 2D, 3D, audio/video support
▪ Processing For Android ▪ http://wiki.processing.org/w/Android ▪ Strong Android support, builds .apk file
![Page 129: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/129.jpg)
Basic Processing Sketch /* Notes comment */ //set up global variables float moveX = 50; //Initialize the Sketch void setup (){ } //draw every frame void draw(){ }
![Page 130: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/130.jpg)
Importing Libraries ▪ Can add functionality by Importing Libraries ▪ java archives - .jar files
▪ Include import code import processing.opengl.*;
▪ Popular Libraries ▪ Minim - audio library, OCD - 3D camera views ▪ bluetoothDesktop - bluetooth networking
![Page 131: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/131.jpg)
Processing and Glass ▪ One of the easiest ways to build rich
interactive wearable applications ▪ focus on interactivity, not coding
▪ Collects all sensor input ▪ camera, accelerometer, touch
▪ Can build native Android .apk files ▪ Side load onto Glass
![Page 132: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/132.jpg)
Hello World Image PImage img; // Create an image variable void setup() { size(640, 360); //load the ok glass home screen image img = loadImage("okGlass.jpg"); // Load the image into the program } void draw() { // Displays the image at its actual size at point (0,0) image(img, 0, 0); }
![Page 133: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/133.jpg)
Demo
![Page 134: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/134.jpg)
Touch Pad Input ▪ Tap recognized as DPAD input void keyPressed() { if (key == CODED){ if (keyCode == DPAD) {
// Do something ..
▪ Java code to capture rich motion events ▪ import android.view.MotionEvent;
![Page 135: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/135.jpg)
Motion Event //Glass Touch Events - reads from touch pad public boolean dispatchGenericMotionEvent(MotionEvent event) { float x = event.getX(); // get x/y coords float y = event.getY(); int action = event.getActionMasked(); // get code for action switch (action) { // let us know which action code shows up
case MotionEvent.ACTION_MOVE: touchEvent = "MOVE"; xpos = myScreenWidth-x*touchPadScaleX; ypos = y*touchPadScaleY; break;
![Page 136: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/136.jpg)
Demo
![Page 137: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/137.jpg)
Sensors ▪ Ketai Library for Processing ▪ https://code.google.com/p/ketai/
▪ Support all phone sensors ▪ GPS, Compass, Light, Camera, etc
▪ Include Ketai Library ▪ import ketai.sensors.*; ▪ KetaiSensor sensor;
![Page 138: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/138.jpg)
Using Sensors ▪ Setup in Setup( ) function
▪ sensor = new KetaiSensor(this); ▪ sensor.start(); ▪ sensor.list();
▪ Event based sensor reading void onAccelerometerEvent(…){ accelerometer.set(x, y, z); }
![Page 139: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/139.jpg)
Sensor Demo
![Page 140: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/140.jpg)
Using the Camera ▪ Import camera library
▪ import ketai.camera.*; ▪ KetaiCamera cam;
▪ Setup in Setup( ) function cam = new KetaiCamera(this,640,480,15);
▪ Draw camera image void draw() { //draw the camera image image(cam, width/2, height/2);
![Page 141: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/141.jpg)
Camera Demo
![Page 142: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/142.jpg)
Native Coding ▪ For best performance need native coding ▪ Low level algorithms etc
▪ Most current wearables based on Android OS ▪ Need Java/Android skills
▪ Many devices have custom API/SDK ▪ Vusix M-100: Vusix SDK ▪ Glass: Mirror API, Glass Developer Kit (GDK)
![Page 143: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/143.jpg)
Glassware Development ▪ Mirror API ▪ Server programming, online/web application ▪ Static cards / timeline management
▪ GDK ▪ Android programming, Java (+ C/C++) ▪ Live cards
▪ See: https://developers.google.com/glass/
![Page 144: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/144.jpg)
▪ REST API ▪ Java servlet, PHP, Go,
Python, Ruby, .NET ▪ Timeline based apps ▪ Static cards
- Text, HTML, media attachment (image & video) ▪ Manage timeline
- Subscribe to timeline notifications, contacts - Location based services
Mirror API
![Page 145: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/145.jpg)
GDK ▪ Glass Development Kit ▪ Android 4.0.3 ICS + Glass specific APIs ▪ Use standard Android Development Tools
![Page 146: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/146.jpg)
▪ GDK add-on features ▪ Timeline and cards ▪ Menu and UI ▪ Touch pad and gesture ▪ Media (sound, camera and voice input)
GDK
![Page 147: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/147.jpg)
Glass Summary ▪ Use Mirror API if you need ... ▪ Use GDK if you need ... ▪ Or use both
![Page 148: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/148.jpg)
Hardware Prototyping
![Page 149: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/149.jpg)
Build Your Own Wearable
▪ MyVu display + phone + sensors
![Page 150: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/150.jpg)
Beady-i
▪ http://www.instructables.com/id/DIY-Google-Glasses-AKA-the-Beady-i/
![Page 151: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/151.jpg)
Rasberry Pi Glasses
▪ Modify video glasses, connect to Rasberry Pi ▪ $200 - $300 in parts, simple assembly ▪ https://learn.adafruit.com/diy-wearable-pi-near-eye-kopin-video-glasses
![Page 152: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/152.jpg)
Physical Input Devices ▪ Can we develop unobtrusive input devices ? ▪ Reduce need for speech, touch pad input ▪ Socially more acceptable
▪ Examples ▪ Ring, pendant, ▪ bracelet, gloves, etc
![Page 153: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/153.jpg)
Prototyping Platform
Arduino Kit Bluetooth Shield Google Glass
![Page 154: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/154.jpg)
Example: Glove Input
▪ Buttons on fingertips ▪ Map touches to commands
![Page 155: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/155.jpg)
Example: Ring Input
▪ Touch strip, button, accelerometer ▪ Tap, swipe, flick actions
![Page 156: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/156.jpg)
How it works
Bracelet
Armband
Gloves
1,2,3,4
Values/output
![Page 157: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/157.jpg)
Other Tools ▪ Wireframing ▪ Pidoco, FluidUI
▪ Rapid Development ▪ Phone Gap, AppMachine
▪ Interactive ▪ App Inventor, Unity3D, WearScript
![Page 158: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/158.jpg)
WearScript
▪ JavaScript development for Glass ▪ http://www.wearscript.com/en/
▪ Script directory ▪ http://weariverse.com/
![Page 159: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/159.jpg)
WearScript Features • Community of Developers • Easy development of Glass Applications
– GDK card format – Support for all sensor input
• Support for advanced features – Augmented Reality – Eye tracking – Arduino input
![Page 160: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/160.jpg)
WearScript Playground
• Test code and run on Glass – https://api.wearscript.com/
![Page 161: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/161.jpg)
Summary ▪ Prototyping for wearables is similar to mobiles ▪ Tools for UI design, storyboarding, wireframing
▪ Android tools to create interactive prototypes ▪ App Inventor, Processing, etc
▪ Arduino can be used for hardware prototypes ▪ Once prototyped Native Apps can be built
![Page 162: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/162.jpg)
RESEARCH DIRECTIONS
![Page 163: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/163.jpg)
Challenges for the Future (2001) ▪ Privacy ▪ Power use ▪ Networking ▪ Collaboration ▪ Heat dissipation ▪ Interface design ▪ Intellectual tools ▪ Augmented Reality systems
Starner, T. (2001). The challenges of wearable computing: Part 1. IEEE Micro,21(4), 44-52. Starner, T. (2001). The challenges of wearable computing: Part 2. IEEE Micro,21(4), 54-67.
![Page 164: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/164.jpg)
Interface Design
![Page 165: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/165.jpg)
Gesture Interaction
![Page 166: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/166.jpg)
Gesture Interaction With Glass ▪ 3 Gear Systems ▪ Hand tracking
▪ Hand data sent to glass ▪ Wifi networking ▪ Hand joint position ▪ AR application rendering ▪ Vuforia tracking
![Page 167: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/167.jpg)
Capturing Behaviours
▪ 3 Gear Systems ▪ Kinect/Primesense Sensor ▪ Two hand tracking ▪ http://www.threegear.com
![Page 168: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/168.jpg)
Performance
▪ Full 3d hand model input ▪ 10 - 15 fps tracking, 1 cm fingertip resolution
![Page 169: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/169.jpg)
Meta Gesture Interaction
▪ Depth sensor + Stereo see-through ▪ https://www.spaceglasses.com/
![Page 170: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/170.jpg)
Collaboration
![Page 171: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/171.jpg)
Social Panoramas
![Page 172: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/172.jpg)
Ego-Vision Collaboration
▪ Wearable computer ▪ camera + processing + display + connectivity
![Page 173: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/173.jpg)
Current Collaboration
▪ First person remote conferencing/hangouts ▪ Limitations
- Single POV, no spatial cues, no annotations, etc
![Page 174: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/174.jpg)
Social Panoramas
▪ Capture and share social spaces in real time ▪ Enable remote people to feel like they’re with you
![Page 175: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/175.jpg)
Key Technology
▪ Google Glass ▪ Capture live panorama (compass + camera) ▪ Capture spatial audio, live video
▪ Remote device (desktop, tablet) ▪ Immersive viewing, live annotation
![Page 176: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/176.jpg)
Awareness Cues
▪ Where is my partner looking? ▪ Enhanced radar display, Context compass
![Page 177: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/177.jpg)
Interaction
▪ Glass Touchpad Input/Tablet Input ▪ Shared pointers, Shared drawing
![Page 178: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/178.jpg)
Cognitive Models
![Page 179: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/179.jpg)
Modeling Cognitive Processes • Model cognitive processes
– Based on cognitive psychology • Use model to:
– Identify opportunity for wearable – Predict user’s cognitive load
![Page 180: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/180.jpg)
Typical Cognitive Model 1. Functional Modularity: cognitive system divided
into functionally separate systems 2. Parallel Module Operation: cognitive modules
operate in parallel, independent of each other 3. Limited Capacity: cognitive modules are limited in
capacity with respect to time or content 4. Serial Central Operation: central coordination of
modules (eg monitoring) is serial
![Page 181: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/181.jpg)
Cognitive Interference ▪ Structural interference ▪ Two or more tasks compete for limited
resources of a peripheral system - eg two cognitive processes needing vision
▪ Capacity interference ▪ Total available central processing
overwhelmed by multiple concurrent tasks - eg trying to add and count at same time
![Page 182: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/182.jpg)
Example: Going to work ..
Which is the most cognitively demanding?
![Page 183: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/183.jpg)
Cognitive Resources & Limitations
asdfasdf
![Page 184: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/184.jpg)
![Page 185: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/185.jpg)
Application of Cognitive Model
Busy street > Escalator > Café > Laboratory. But if you made Wayfinding, Path Planning, Estimating
Time to Target, Collision Avoidance easier?
![Page 186: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/186.jpg)
Social Perception
![Page 187: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/187.jpg)
How is the User Perceived?
![Page 188: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/188.jpg)
GlassHoles • safa
![Page 189: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/189.jpg)
TAT Augmented ID
![Page 190: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/190.jpg)
![Page 191: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/191.jpg)
![Page 192: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/192.jpg)
The Future of Wearables
![Page 193: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/193.jpg)
RESOURCES
![Page 194: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/194.jpg)
Online Wearables Exhibit
Online at http://wcc.gatech.edu/exhibition
![Page 195: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/195.jpg)
Glass Developer Resources ▪ Main Developer Website ▪ https://developers.google.com/glass/
▪ Glass Apps Developer Site ▪ http://glass-apps.org/glass-developer
▪ Google Design Guidelines Site ▪ https://developers.google.com/glass/design/
index?utm_source=tuicool
![Page 196: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/196.jpg)
Other Resources ▪ AR for Glass Website ▪ http://www.arforglass.org/
▪ Vandrico Database of wearable devices ▪ http://vandrico.com/database
![Page 197: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/197.jpg)
Glass UI Design Guidelines
• More guidelines – https://developers.google.com/glass/design/index
![Page 198: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/198.jpg)
Books ▪ Programming Google Glass ▪ Eric Redmond
▪ Rapid Android Development: Build Rich, Sensor-Based Applications with Processing ▪ Daniel Sauter
![Page 199: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/199.jpg)
• Beginning Google Glass Development by Jeff Tang
![Page 200: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/200.jpg)
• Microinteractions: Designing with Details – Dan Saffer – http://microinteractions.com/
![Page 201: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/201.jpg)
Conclusions • Wearable computing represents a fourth
generation of computing devices • Google Glass is the first consumer wearable
– Lightweight, usable, etc • A range of wearables will appear in 2014
– Ecosystem of devices • Significant research opportunities exist
– User interaction, displays, social impact
![Page 202: Siggraph 2014: The Glass Class - Designing Wearable Interfaces](https://reader034.fdocuments.in/reader034/viewer/2022052523/555ae539d8b42a4c7d8b4769/html5/thumbnails/202.jpg)
Contact Details Mark Billinghurst ▪ email: [email protected] ▪ twitter: @marknb00
Feedback + followup form ▪ goo.gl/6SdgzA