Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Designing for context not the device

Designers often think “context” is the device someone uses to interact with websites and apps. But context goes far beyond the device. Time, proximity, and state of mind are just a few contextual clues we can use to make our designs more responsive to peoples’ needs.

I want to challenge you to think beyond the device and begin designing for context.

Presented at #uxt-toronto Nov 20, 2014

Related Books

Free with a 30 day trial from Scribd

See all

Designing for context not the device

  1. 1. DESIGN FOR CONTEXT, NOT THE DEVICE UX THURSDAY TORONTO 2014 @feather
  2. 2. GREAT EXPERIENCES ARE HEAVILY BASED ON CONTEXT
  3. 3. CONTEXT IS OFTEN SEEN AS A DEVICE THING
  4. 4. so. much. FUN!
  5. 5. Really?
  6. 6. What defines context? TIME, LOCATION, PROXIMITY, DEVICE, STATE OF MIND CAPABILITIES, ACTIVITY, INTERESTS, INTERACTION
  7. 7. WHAT RESOLUTIONS DO WE DESIGN FOR?
  8. 8. WHAT RESOLUTION RANGES DO WE DESIGN FOR?
  9. 9. <p> To receive all of these useful resources, simply complete the form to the right: </p> <p> To receive all of these useful resources, simply complete <a href=“#subscribe> the subscription form </a> </p>
  10. 10. What defines context? TIME, LOCATION, PROXIMITY, DEVICE, STATE OF MIND CAPABILITIES, ACTIVITY, INTERESTS, INTERACTION
  11. 11. 1 2 3 4
  12. 12. function schedule_change_home_page() { if(date('Y-m-d') == get_option('wp_schedule_date')) { update_option('show_on_front', 'page'); update_option('page_on_front', 381); } else { update_option('show_on_front', 'posts'); } }
  13. 13. Context Map Content Priority over Time Logistics & Sell CONTENT PRIORITY CHANGES Speaker Info Tweets Schedule Photos Content Importance WITH RESPECT TO TIME Time Pre-event Event Post-event
  14. 14. Context Map Content Priority over Time Logistics & Sell Speaker Info Tweets Schedule Photos Pre-event Event Post-event 65% 0% 0% 20% 5% 15% 10% 10% 40% 0 80% 5% 5% 5% 40%
  15. 15. Sell: 65% Inform: 15% Find a provider: 20%
  16. 16. Sell: 45% Inform: 20% Inform: 15% Find a provider: 20%
  17. 17. APPLY TIME TO CONTENT FOR ANY INDUSTRY
  18. 18. Where is the train station? What building is the event in? Which rooms are we using? Where can I park? Can I walk there? (directions) Which entrance should I use? What is the nearest public transit stop? Local car rental places? What hotels are nearby? How do I get there from the airport? Where am I on a map? Is the facility accessible to my wheelchair? Help me get there using public transit
  19. 19. Context Map Content Priority with respect to Location CONTENT PRIORITY CHANGES WITH RESPECT TO Building LOCATION City Block Farther away AIRPORT INFO CAR RENTAL HOTEL INFO PUBLIC TRANSIT TRAIN INFO BUILDING MAP WHICH ROOM? WHICH ENTRANCE? WALKING DIRECTIONS BIKE DIRECTIONS PARKING LOTS
  20. 20. APPLY LOCATION TO CONTENT FOR ANY INDUSTRY
  21. 21. CONTENT DISPLAY CHANGES WITH RESPECT TO LOCATION
  22. 22. CONTENT CHANGES WITH RESPECT TO LOCATION
  23. 23. var show_banner = function(){ navigator.geolocation.getCurrentPosition(function(position){ var metroYMCA = { 'latitude': 43.663155 'longitude': -79.385028 }, distance = calculateDistance(position.coords.latitude, position.coords.longitude, contemporary.latitude, contemporary.longitude); // Check to see if the user is within 1000m of location if(distance <= 1){ // Show custom message } }); };
  24. 24. WARNING!
  25. 25. ALL SAVED CONTEXT MUST BE RESETTABLE
  26. 26. Context Map Content changes with respect to Proximity 3 ft / 1m 100 ft / 30m 1000 ft / 300m .6 mi / 1km 6 mi / 10km CONTENT CHANGES WITH RESPECT TO PROXIMITY
  27. 27. Context Map Content changes with respect to Proximity 3 ft / 1m 100 ft / 30m 1000 ft / 300m .6 mi / 1km “Ethan is nearby. I’ve locked your phone already.” “Your twitter friend Karen is near. Get a photo together?” “Kate and Jason are at Signs restaurant waiting for your reservation. Let them know you’re almost there?” “Kevin just sat down for lunch at Cosmic Ray’s (5 min away) Ask if you can join?” 6 mi / 10km “Ethan is at the Wild Kingdom. Your phone is safe.”
  28. 28. Context Map Content changes with respect to Proximity 3 ft / 1m 100 ft / 30m CONTENT CHANGES WITH RESPECT TO PROXIMITY 1000 ft / 300m .6 mi / 1km 6 mi / 10km Sitting at your desk. Notices on iMac only In the building. Notices on all devices (choice). Away from office. Notices on phone only.
  29. 29. DISPLAY CHANGES WITH RESPECT TO CAPABILITIES
  30. 30. DISPLAY CHANGES WITH RESPECT TO CAPABILITIES
  31. 31. PREFERENCES CHANGE WITH RESPECT TO ACTIVITY
  32. 32. DISPLAY CHANGES WITH RESPECT TO ACTIVITY
  33. 33. MINIMUM VIABLE INTERACTION
  34. 34. Could we design content that works for someone: so they don’t need to take their phone out of their pocket? so they don’t need to unlock their phone? so they don’t need to open the email?
  35. 35. DISPLAY CHANGES WITH RESPECT TO INTERESTS
  36. 36. • Can we make this work well for someone that only reads headings?
  37. 37. DISPLAY CHANGES WITH RESPECT TO STATE OF MIND?
  38. 38. WHAT DEFINES CONTEXT? TIME, LOCATION, PROXIMITY, DEVICE, STATE OF MIND CAPABILITIES, ACTIVITY, INTERESTS, INTERACTION
  39. 39. DESIGN FOR CONTEXT NOT FOR THE DEVICE
  40. 40. Thank you. DEREK FEATHERSTONE @feather feather@simplyaccessible.com

×