35
Designing for Wearable Devices Saturday September 13, 2014 Stephanie Nguyen @nguyenist

Designing for Wearable Devices

Embed Size (px)

DESCRIPTION

Workshop presented at DC Web Women's Code(Her) Conference on September 13, 2014.

Citation preview

Page 1: Designing for Wearable Devices

Designing for Wearable Devices

Saturday September 13, 2014Stephanie Nguyen@nguyenist

Page 2: Designing for Wearable Devices

Today

• Intro: Smartwatches

• Apple Watch vs. Moto 360DifferencesSimilaritiesExamples

• Case Study: LandmarkFrom Mobile to Smartwatch

• Design SprintBuild your own prototype

Page 3: Designing for Wearable Devices

Apple vs. Google #codeher2014@nguyenist

Page 4: Designing for Wearable Devices

New Considerations

• Accessing apps

• Inputting information

• Mobile-dependency 

• Notifications

• Round vs. square screen 

• Smaller screen real estate

• Shorter battery life 

Page 5: Designing for Wearable Devices

Key Differences

Page 6: Designing for Wearable Devices

Development #codeher2014@nguyenist

Page 7: Designing for Wearable Devices

Charge + Hardware Considerations #codeher2014@nguyenist

Page 8: Designing for Wearable Devices

UX/UI Impact: Rounded square vs. Round interface #codeher2014@nguyenist

Page 9: Designing for Wearable Devices

Accessing Apps #codeher2014@nguyenist

Page 10: Designing for Wearable Devices

Maps & Navigation #codeher2014@nguyenist

Page 11: Designing for Wearable Devices

Similarities

Page 12: Designing for Wearable Devices

Voice Commands + No Keyboard #codeher2014@nguyenist

Page 13: Designing for Wearable Devices

Glanceable #codeher2014@nguyenist

Page 14: Designing for Wearable Devices

Contextual + Hyperlocal #codeher2014@nguyenist

Page 15: Designing for Wearable Devices

The Quantified Self + Health + Fitness #codeher2014@nguyenist

Page 16: Designing for Wearable Devices

Wearable Philosophy(Courtesy of Google / Android Wear)

Page 17: Designing for Wearable Devices

Source: Google & #AndroidWear

Page 18: Designing for Wearable Devices

Launched automatically

Source: Google & #AndroidWear

Page 19: Designing for Wearable Devices

Glanceable

Source: Google & #AndroidWear

Page 20: Designing for Wearable Devices

Suggest & Demand

Source: Google & #AndroidWear

Page 21: Designing for Wearable Devices

Zero or no interaction

Source: Google & #AndroidWear

Page 22: Designing for Wearable Devices

App Examples

Page 23: Designing for Wearable Devices

Request a car: Lyft, Uber #codeher2014@nguyenist

Page 24: Designing for Wearable Devices

Taking notes: Notepad, Evernote, Trello #codeher2014@nguyenist

Page 25: Designing for Wearable Devices

Payment: Apple Pay #codeher2014@nguyenist

Page 26: Designing for Wearable Devices

Creative Communication: Heartbeats, Emoticons and Drawings #codeher2014@nguyenist

Page 27: Designing for Wearable Devices

Case Study:

#codeher2014@nguyenist

Page 28: Designing for Wearable Devices

1492

Page 29: Designing for Wearable Devices

500 years later...

Page 30: Designing for Wearable Devices
Page 31: Designing for Wearable Devices

Evolution of Maps Are we there yet?

Page 32: Designing for Wearable Devices

“Head Northwest on Connecticut Ave.” ...which way is that?

Page 33: Designing for Wearable Devices

Landmarks #codeher2014@nguyenist

Page 34: Designing for Wearable Devices

Right when you see the Flat Iron Building at E 23rd Street

In 2Blocks

Slight Right toward Shake In 200

To start, begin walking in this directionon Broadway toward E 23rd Street

Page 35: Designing for Wearable Devices

Stephanie Nguyen | @nguyenist | [email protected]

Say hello: