SlideShare une entreprise Scribd logo
1  sur  79
Datatium – Radiation free
responsive experiences
Web Directions South
18 October, 2012



Andrew Fisher - CTO@JBA
@ajfisher
Welcome back Andrew




Image (CC) – @pevennett
What I wanted
What I got instead




Image (CC) flickr – Michael Gil
github.com
Is this too much to ask?




Image (CC) flickr – Lisa Brewster
Where is the web now?
0

Da
Datatium
0.000751
1. Conditionally responsive experiences
2. Behaviourally responsive experiences
3. Contextually responsive experiences
Conditionally responsive experiences
if THIS
then THAT
Getting the data
Using conditional data
Show off what you’ve got




Image (CC) flickr – Andrew Hitchcock
Don’t annoy your users




Image (CC) flickr – Joe Shlabotnik
Simple can go a long way




Image (CC) Wikipedia
Remove friction for fun




Image (CC) flickr – martinhoward
Beautifully frictionless




TSS Surry Hills – R Stolz
Take users on a journey




Image (CC) flickr – wolfgangstaudt
Set lots of small goals




linkedin.com
Users don’t start as heroes




Zelda Twilight Princess © Nintendo
Design process
User data as process
Remove optional items
Small things matter




Virgin Australia check-in
Behaviourally responsive experiences
Getting the data
Aggregate behaviour
Ask questions about behaviour

Why did the user do that?
Are they getting stuck somewhere?
How can I tell what they are doing?
What do they do next?
How do I validate my views on their behaviour?
Understand desire lines




Image (CC) flickr – wetwebwork
Using behavioural data
Recommendations
Start by recommending




NYTimes
Repetition
Home   Account login   Recharge




                       Payment




           Exit        Complete
Empower your users
Design process
Consider behavioural slots
Failure means learning




Image (CC) flickr – Aristocrats Hat
Be transparent to users




amazon.com recommendations
Capture failure data




facebook.com ads
If you’re not buying the
product then you are the
product.
Provide feedback to users




last.fm playlist data
Build data products




linkedin.com profile stats
Contextually responsive experiences
The Avengers, 2012 – © Marvel
Mostly works




themoderngentleman.de
Getting the data
Device shapes behaviour
Time shapes behaviour




Image (CC) flickr – Martina Photography
Location shapes behaviour
Context shapes behaviour




Image (CC) flickr – Henry Stratford
Context variables
Using contextual data
Externally adaptive contexts
Change assets as well
Task oriented contexts
Context drives need




ANZ GoMoney
Micro moments




Image (CC) flickr – Ed Yourden
Consider desktop too




Google Docs
Adaptive contexts
Starting to adapt to me




Google Now
A responsive real world




Image (CC) flickr – Design.Gallery
Design process
Embrace the chaos




Image (CC) flickr – Page Dooley
Responsive experiences

Conditional
Behavioural
Contextual
Creating responsive experiences
1. You don’t know everything
2. Data is worth more than opinion


  “If we have data, let’s look at data. If all we
  have are opinions, let’s go with mine”
                 -- Jim Barksdale, former Netscape CEO
3. Take the bold decisions
Learn to love data




Image (CC) flickr – Zebrasquares
Starting a punk band




 From Sideburns magazine, December 1976
Data science punk




With apologies to Sideburns mag
Datatium – Radiation free
responsive experiences
Web Directions South
18 October, 2012


@ajfisher
slideshare.net/andrewjfisher
jbadigital.com

Contenu connexe

En vedette

Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web DevelopmentRachel Andrew
 
Groovy & Grails eXchange 2012 - Building an e-commerce business with gr8 tec...
Groovy & Grails eXchange 2012 - Building an  e-commerce business with gr8 tec...Groovy & Grails eXchange 2012 - Building an  e-commerce business with gr8 tec...
Groovy & Grails eXchange 2012 - Building an e-commerce business with gr8 tec...Domingo Suarez Torres
 
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...Ruth Cheesley
 
Something from Nothing: Simple Ways to Look Sharp When Time is Short
Something from Nothing: Simple Ways to Look Sharp When Time is ShortSomething from Nothing: Simple Ways to Look Sharp When Time is Short
Something from Nothing: Simple Ways to Look Sharp When Time is Shortkenwtw
 
Rapid Product Design in the Wild - Agile Iceland
Rapid Product Design in the Wild - Agile IcelandRapid Product Design in the Wild - Agile Iceland
Rapid Product Design in the Wild - Agile IcelandMichele Ide-Smith
 
UXD v. Analytics - WIAD13 Ann Arbor
UXD v. Analytics - WIAD13 Ann ArborUXD v. Analytics - WIAD13 Ann Arbor
UXD v. Analytics - WIAD13 Ann ArborChris Farnum
 
About VisualDNA Architecture @ Rubyslava 2014
About VisualDNA Architecture @ Rubyslava 2014About VisualDNA Architecture @ Rubyslava 2014
About VisualDNA Architecture @ Rubyslava 2014Michal Harish
 
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud Computing
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud ComputingOSCON 2013 - The Hitchiker’s Guide to Open Source Cloud Computing
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud ComputingMark Hinkle
 
SST 2014; The Reluctant SME
SST 2014; The Reluctant SMESST 2014; The Reluctant SME
SST 2014; The Reluctant SMEElisa Sawyer
 
Alternative Design Workflows in a "PostPSD" Era
Alternative Design Workflows in a "PostPSD" EraAlternative Design Workflows in a "PostPSD" Era
Alternative Design Workflows in a "PostPSD" EraJeremy Fuksa
 
ReactJS maakt het web eenvoudig
ReactJS maakt het web eenvoudigReactJS maakt het web eenvoudig
ReactJS maakt het web eenvoudigRick Beerendonk
 
FSharp for Trading - CodeMesh 2013
FSharp for Trading - CodeMesh 2013FSharp for Trading - CodeMesh 2013
FSharp for Trading - CodeMesh 2013Phillip Trelford
 
Using Cascalog to build an app with City of Palo Alto Open Data
Using Cascalog to build an app with City of Palo Alto Open DataUsing Cascalog to build an app with City of Palo Alto Open Data
Using Cascalog to build an app with City of Palo Alto Open DataOSCON Byrum
 
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud Infrastructure
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud InfrastructureSCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud Infrastructure
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud InfrastructureMatt Ray
 
Big Data, Big Changes: Data-Driven Product Development at Etsy
Big Data, Big Changes: Data-Driven Product Development at EtsyBig Data, Big Changes: Data-Driven Product Development at Etsy
Big Data, Big Changes: Data-Driven Product Development at EtsyJason Davis
 
Taxonomy of Scala
Taxonomy of ScalaTaxonomy of Scala
Taxonomy of Scalashinolajla
 
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014Alexandre Morgaut
 
Drupal, varnish, esi - Toulouse November 2
Drupal, varnish, esi - Toulouse November 2Drupal, varnish, esi - Toulouse November 2
Drupal, varnish, esi - Toulouse November 2Marcus Deglos
 
Sakai Meet MORPHEUS: Slides
Sakai Meet MORPHEUS: SlidesSakai Meet MORPHEUS: Slides
Sakai Meet MORPHEUS: Slidesalienresident
 

En vedette (20)

Rails traps
Rails trapsRails traps
Rails traps
 
Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web Development
 
Groovy & Grails eXchange 2012 - Building an e-commerce business with gr8 tec...
Groovy & Grails eXchange 2012 - Building an  e-commerce business with gr8 tec...Groovy & Grails eXchange 2012 - Building an  e-commerce business with gr8 tec...
Groovy & Grails eXchange 2012 - Building an e-commerce business with gr8 tec...
 
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...
Microdata, Authorship, Google+ and Joomla! - Ruth Cheesley - Joomla! World Co...
 
Something from Nothing: Simple Ways to Look Sharp When Time is Short
Something from Nothing: Simple Ways to Look Sharp When Time is ShortSomething from Nothing: Simple Ways to Look Sharp When Time is Short
Something from Nothing: Simple Ways to Look Sharp When Time is Short
 
Rapid Product Design in the Wild - Agile Iceland
Rapid Product Design in the Wild - Agile IcelandRapid Product Design in the Wild - Agile Iceland
Rapid Product Design in the Wild - Agile Iceland
 
UXD v. Analytics - WIAD13 Ann Arbor
UXD v. Analytics - WIAD13 Ann ArborUXD v. Analytics - WIAD13 Ann Arbor
UXD v. Analytics - WIAD13 Ann Arbor
 
About VisualDNA Architecture @ Rubyslava 2014
About VisualDNA Architecture @ Rubyslava 2014About VisualDNA Architecture @ Rubyslava 2014
About VisualDNA Architecture @ Rubyslava 2014
 
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud Computing
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud ComputingOSCON 2013 - The Hitchiker’s Guide to Open Source Cloud Computing
OSCON 2013 - The Hitchiker’s Guide to Open Source Cloud Computing
 
SST 2014; The Reluctant SME
SST 2014; The Reluctant SMESST 2014; The Reluctant SME
SST 2014; The Reluctant SME
 
Alternative Design Workflows in a "PostPSD" Era
Alternative Design Workflows in a "PostPSD" EraAlternative Design Workflows in a "PostPSD" Era
Alternative Design Workflows in a "PostPSD" Era
 
ReactJS maakt het web eenvoudig
ReactJS maakt het web eenvoudigReactJS maakt het web eenvoudig
ReactJS maakt het web eenvoudig
 
FSharp for Trading - CodeMesh 2013
FSharp for Trading - CodeMesh 2013FSharp for Trading - CodeMesh 2013
FSharp for Trading - CodeMesh 2013
 
Using Cascalog to build an app with City of Palo Alto Open Data
Using Cascalog to build an app with City of Palo Alto Open DataUsing Cascalog to build an app with City of Palo Alto Open Data
Using Cascalog to build an app with City of Palo Alto Open Data
 
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud Infrastructure
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud InfrastructureSCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud Infrastructure
SCALE12X Build a Cloud Day: Chef: The Swiss Army Knife of Cloud Infrastructure
 
Big Data, Big Changes: Data-Driven Product Development at Etsy
Big Data, Big Changes: Data-Driven Product Development at EtsyBig Data, Big Changes: Data-Driven Product Development at Etsy
Big Data, Big Changes: Data-Driven Product Development at Etsy
 
Taxonomy of Scala
Taxonomy of ScalaTaxonomy of Scala
Taxonomy of Scala
 
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014
Conquer Architectural Challenges with End-to-End JavaScript - enterJS 2014
 
Drupal, varnish, esi - Toulouse November 2
Drupal, varnish, esi - Toulouse November 2Drupal, varnish, esi - Toulouse November 2
Drupal, varnish, esi - Toulouse November 2
 
Sakai Meet MORPHEUS: Slides
Sakai Meet MORPHEUS: SlidesSakai Meet MORPHEUS: Slides
Sakai Meet MORPHEUS: Slides
 

Similaire à Datatium - radiation free responsive experiences

"The evolution of mobile apps". Alan Cannistraro, Facebook
"The evolution of mobile apps". Alan Cannistraro, Facebook"The evolution of mobile apps". Alan Cannistraro, Facebook
"The evolution of mobile apps". Alan Cannistraro, FacebookYandex
 
Future-of-wearable-computing
Future-of-wearable-computingFuture-of-wearable-computing
Future-of-wearable-computingHessel van Tuinen
 
2012 ASTD Project Tin Can – Tim Martin
2012 ASTD Project Tin Can – Tim Martin2012 ASTD Project Tin Can – Tim Martin
2012 ASTD Project Tin Can – Tim MartinRustici Software
 
Responsive content and user context
Responsive content and user contextResponsive content and user context
Responsive content and user contextAndrew Fisher
 
Webinar on DataUp: Describe, Manage, and Share Data
Webinar on DataUp: Describe, Manage, and Share DataWebinar on DataUp: Describe, Manage, and Share Data
Webinar on DataUp: Describe, Manage, and Share DataCarly Strasser
 
RDAP 15: You’re in good company: Unifying campus research data services
RDAP 15: You’re in good company: Unifying campus research data servicesRDAP 15: You’re in good company: Unifying campus research data services
RDAP 15: You’re in good company: Unifying campus research data servicesASIS&T
 
Blogging 202: Visibility, Monitoring & Content Inspiration
Blogging 202: Visibility, Monitoring & Content InspirationBlogging 202: Visibility, Monitoring & Content Inspiration
Blogging 202: Visibility, Monitoring & Content InspirationMichelle Golden
 
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_q
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_qTechdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_q
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_qMiguel López
 
Fake It While We Make It (Data-Driven Prototyping)
Fake It While We Make It (Data-Driven Prototyping)Fake It While We Make It (Data-Driven Prototyping)
Fake It While We Make It (Data-Driven Prototyping)Ryan LaBouve
 
FrameChanges (How to be Effective)
FrameChanges (How to be Effective)FrameChanges (How to be Effective)
FrameChanges (How to be Effective)Peter Bromberg
 
Makerspaces - Beyond the Buzzword
Makerspaces - Beyond the Buzzword Makerspaces - Beyond the Buzzword
Makerspaces - Beyond the Buzzword Kay Oddone
 
RubyConf 2012: Custom Reverse Proxies
RubyConf 2012: Custom Reverse ProxiesRubyConf 2012: Custom Reverse Proxies
RubyConf 2012: Custom Reverse Proxiesnickblah
 
Data Management for Scientists: Workshop at Ocean Sciences 2012
Data Management for Scientists: Workshop at Ocean Sciences 2012Data Management for Scientists: Workshop at Ocean Sciences 2012
Data Management for Scientists: Workshop at Ocean Sciences 2012Carly Strasser
 
Out in the Open Range
Out in the Open RangeOut in the Open Range
Out in the Open RangeAlan Levine
 
Creating an action plan for learning analytics
Creating an action plan for learning analyticsCreating an action plan for learning analytics
Creating an action plan for learning analyticsDoug Clow
 
AI and Robotics at an Inflection Point
AI and Robotics at an Inflection PointAI and Robotics at an Inflection Point
AI and Robotics at an Inflection PointSteve Omohundro
 
The Next Big Thing is Web 3.0. Catch It If You Can
The Next Big Thing is Web 3.0. Catch It If You Can The Next Big Thing is Web 3.0. Catch It If You Can
The Next Big Thing is Web 3.0. Catch It If You Can Judy O'Connell
 

Similaire à Datatium - radiation free responsive experiences (20)

"The evolution of mobile apps". Alan Cannistraro, Facebook
"The evolution of mobile apps". Alan Cannistraro, Facebook"The evolution of mobile apps". Alan Cannistraro, Facebook
"The evolution of mobile apps". Alan Cannistraro, Facebook
 
Future-of-wearable-computing
Future-of-wearable-computingFuture-of-wearable-computing
Future-of-wearable-computing
 
2012 ASTD Project Tin Can – Tim Martin
2012 ASTD Project Tin Can – Tim Martin2012 ASTD Project Tin Can – Tim Martin
2012 ASTD Project Tin Can – Tim Martin
 
Responsive content and user context
Responsive content and user contextResponsive content and user context
Responsive content and user context
 
Webinar on DataUp: Describe, Manage, and Share Data
Webinar on DataUp: Describe, Manage, and Share DataWebinar on DataUp: Describe, Manage, and Share Data
Webinar on DataUp: Describe, Manage, and Share Data
 
RDAP 15: You’re in good company: Unifying campus research data services
RDAP 15: You’re in good company: Unifying campus research data servicesRDAP 15: You’re in good company: Unifying campus research data services
RDAP 15: You’re in good company: Unifying campus research data services
 
Blogging 202: Visibility, Monitoring & Content Inspiration
Blogging 202: Visibility, Monitoring & Content InspirationBlogging 202: Visibility, Monitoring & Content Inspiration
Blogging 202: Visibility, Monitoring & Content Inspiration
 
Jay Y
Jay Y Jay Y
Jay Y
 
Building our Future
Building our FutureBuilding our Future
Building our Future
 
CV
CVCV
CV
 
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_q
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_qTechdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_q
Techdays 2009 beauty_and_thebeast_v1.0_final_audio_1-solid_q
 
Fake It While We Make It (Data-Driven Prototyping)
Fake It While We Make It (Data-Driven Prototyping)Fake It While We Make It (Data-Driven Prototyping)
Fake It While We Make It (Data-Driven Prototyping)
 
FrameChanges (How to be Effective)
FrameChanges (How to be Effective)FrameChanges (How to be Effective)
FrameChanges (How to be Effective)
 
Makerspaces - Beyond the Buzzword
Makerspaces - Beyond the Buzzword Makerspaces - Beyond the Buzzword
Makerspaces - Beyond the Buzzword
 
RubyConf 2012: Custom Reverse Proxies
RubyConf 2012: Custom Reverse ProxiesRubyConf 2012: Custom Reverse Proxies
RubyConf 2012: Custom Reverse Proxies
 
Data Management for Scientists: Workshop at Ocean Sciences 2012
Data Management for Scientists: Workshop at Ocean Sciences 2012Data Management for Scientists: Workshop at Ocean Sciences 2012
Data Management for Scientists: Workshop at Ocean Sciences 2012
 
Out in the Open Range
Out in the Open RangeOut in the Open Range
Out in the Open Range
 
Creating an action plan for learning analytics
Creating an action plan for learning analyticsCreating an action plan for learning analytics
Creating an action plan for learning analytics
 
AI and Robotics at an Inflection Point
AI and Robotics at an Inflection PointAI and Robotics at an Inflection Point
AI and Robotics at an Inflection Point
 
The Next Big Thing is Web 3.0. Catch It If You Can
The Next Big Thing is Web 3.0. Catch It If You Can The Next Big Thing is Web 3.0. Catch It If You Can
The Next Big Thing is Web 3.0. Catch It If You Can
 

Plus de Andrew Fisher

Datatium - using data as a material for contextually responsive design.
Datatium - using data as a material for contextually responsive design.Datatium - using data as a material for contextually responsive design.
Datatium - using data as a material for contextually responsive design.Andrew Fisher
 
Droids, java script and web connected hardware
Droids, java script and web connected hardwareDroids, java script and web connected hardware
Droids, java script and web connected hardwareAndrew Fisher
 
Building Droids with JavaScript
Building Droids with JavaScriptBuilding Droids with JavaScript
Building Droids with JavaScriptAndrew Fisher
 
A Device API Safari - Web Directions Code 2014
A Device API Safari - Web Directions Code 2014A Device API Safari - Web Directions Code 2014
A Device API Safari - Web Directions Code 2014Andrew Fisher
 
How well are you delivering your experience?
How well are you delivering your experience?How well are you delivering your experience?
How well are you delivering your experience?Andrew Fisher
 
Designing a Moving Experience
Designing a Moving ExperienceDesigning a Moving Experience
Designing a Moving ExperienceAndrew Fisher
 
The Wonderful-Amazing-Orientation-Motion-Sensormatic Machine
The Wonderful-Amazing-Orientation-Motion-Sensormatic MachineThe Wonderful-Amazing-Orientation-Motion-Sensormatic Machine
The Wonderful-Amazing-Orientation-Motion-Sensormatic MachineAndrew Fisher
 
Web Facilitated Play in the Real World
Web Facilitated Play in the Real WorldWeb Facilitated Play in the Real World
Web Facilitated Play in the Real WorldAndrew Fisher
 
Getting Touchy Feely with the Web
Getting Touchy Feely with the WebGetting Touchy Feely with the Web
Getting Touchy Feely with the WebAndrew Fisher
 
Arduino and the real time web
Arduino and the real time webArduino and the real time web
Arduino and the real time webAndrew Fisher
 
How the web is going physical
How the web is going physicalHow the web is going physical
How the web is going physicalAndrew Fisher
 
Device API - now with added fun
Device API - now with added funDevice API - now with added fun
Device API - now with added funAndrew Fisher
 
ad:tech Melbourne - Mobile and social strategies for retailers
ad:tech Melbourne - Mobile and social strategies for retailersad:tech Melbourne - Mobile and social strategies for retailers
ad:tech Melbourne - Mobile and social strategies for retailersAndrew Fisher
 
The future of Australian mobile
The future of Australian mobileThe future of Australian mobile
The future of Australian mobileAndrew Fisher
 
Cloud Sourcing the Business
Cloud Sourcing the BusinessCloud Sourcing the Business
Cloud Sourcing the BusinessAndrew Fisher
 

Plus de Andrew Fisher (15)

Datatium - using data as a material for contextually responsive design.
Datatium - using data as a material for contextually responsive design.Datatium - using data as a material for contextually responsive design.
Datatium - using data as a material for contextually responsive design.
 
Droids, java script and web connected hardware
Droids, java script and web connected hardwareDroids, java script and web connected hardware
Droids, java script and web connected hardware
 
Building Droids with JavaScript
Building Droids with JavaScriptBuilding Droids with JavaScript
Building Droids with JavaScript
 
A Device API Safari - Web Directions Code 2014
A Device API Safari - Web Directions Code 2014A Device API Safari - Web Directions Code 2014
A Device API Safari - Web Directions Code 2014
 
How well are you delivering your experience?
How well are you delivering your experience?How well are you delivering your experience?
How well are you delivering your experience?
 
Designing a Moving Experience
Designing a Moving ExperienceDesigning a Moving Experience
Designing a Moving Experience
 
The Wonderful-Amazing-Orientation-Motion-Sensormatic Machine
The Wonderful-Amazing-Orientation-Motion-Sensormatic MachineThe Wonderful-Amazing-Orientation-Motion-Sensormatic Machine
The Wonderful-Amazing-Orientation-Motion-Sensormatic Machine
 
Web Facilitated Play in the Real World
Web Facilitated Play in the Real WorldWeb Facilitated Play in the Real World
Web Facilitated Play in the Real World
 
Getting Touchy Feely with the Web
Getting Touchy Feely with the WebGetting Touchy Feely with the Web
Getting Touchy Feely with the Web
 
Arduino and the real time web
Arduino and the real time webArduino and the real time web
Arduino and the real time web
 
How the web is going physical
How the web is going physicalHow the web is going physical
How the web is going physical
 
Device API - now with added fun
Device API - now with added funDevice API - now with added fun
Device API - now with added fun
 
ad:tech Melbourne - Mobile and social strategies for retailers
ad:tech Melbourne - Mobile and social strategies for retailersad:tech Melbourne - Mobile and social strategies for retailers
ad:tech Melbourne - Mobile and social strategies for retailers
 
The future of Australian mobile
The future of Australian mobileThe future of Australian mobile
The future of Australian mobile
 
Cloud Sourcing the Business
Cloud Sourcing the BusinessCloud Sourcing the Business
Cloud Sourcing the Business
 

Dernier

FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...Rishabh Aryan
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一diploma 1
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdfSwaraliBorhade
 
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfArchitecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfSumit Lathwal
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一z xss
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一Fi L
 
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改yuu sss
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证nhjeo1gg
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxmapanig881
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIyuj
 
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一F dds
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case StudySophia Viganò
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Nightssuser7cb4ff
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 

Dernier (20)

FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
 
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf
 
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfArchitecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdf
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
 
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
 
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case Study
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 

Datatium - radiation free responsive experiences

Notes de l'éditeur

  1. Hi. My name is Andrew Fisher and I’m a User Experience focused Data Scientist and today I’m going to talk about how we use Datatium to make responsive user experiences for the next 45 minutes.I must admit I was a bit daunted at first at the thought of speaking in the design track at web directions because I’m not a designer, I’m a programmer with a fascination about human behaviour. So I thought, I’m not going to be able to speak about design, but I can speak about where I think the web is lacking, some things I think can help from a technology point of view and talk about what I want it to become.The web as it stands has got remarkably prettier over the last few years, and we’re seeing some interesting effects as the web is joining together nearly two billion people and that’s all great. But the web is still not truly responsive to me as a person, it responds to my device and reflows nicely but not to my behaviour. We’re not evolving to respond to our users the same way we’re responding to technology choices.
  2. Amazon, for all it’s early innovation on this front in personalisation is becoming less adept not more so. Every day that goes buy transforms Amazon into the digital equivalent of the local $2 store but one that just happens to move some things that might be relevant to the front of it when it sees me coming down the street.
  3. That’s not the type of web I signed up for when I started as a developer far too many years ago and this is why I’m getting grumpy, like the other grumpy old man of the web talking now on the main stage - I was sold a personal jetpack
  4. and what I’ve been given is a Honda Civic.In my future I want all my data made securely available to any service I give access to and I want those services to shape themselves around me all the time. I want applications that change their nature based on how I behave not just as a result of what device I’m on but how I use the service. I want all the features of the web - search, social, location, information, service layered around me all the time with relevant pieces popping into existence when I’m likely to need them, seamlessly integrated into my day.Image: http://www.flickr.com/photos/msvg/6681896655/
  5. I want the alarm in my phone able to access my diary, the weather, the traffic and the public transport system and decide whether to wake me 10 minutes earlier because it’s going to take me that much longer to get to work.
  6. I want github to recommend that I check out three other projects after I commit some code because it looks like I might be doing something similar and I might be better placed contributing there rather than making a fourth project.
  7. I want the moon on a string, I want a pony, and I want it now. Is that too much to ask?Image: http://www.flickr.com/photos/sophistechate/3040380182/
  8. Responsive Design is an important aspect of the next evolution of the web. People are starting to become unbound not only from desktops towards mobile devices but our notion of what is a web browser is beginning to change due to the fragmentation of the web across so many devices and services. The web is the only thing that can possibly keep these things glued together but responsive experiences are what allows the adaptivity between them.
  9. And data is the fuel of truly responsive experiences and allows them to function.My aim here today isn’t to turn you into data scientists, though if I do make you decide to become one then that’s awesome. Rather I want to start injecting some data science thinking into your approach to design and hopefully make you interested enough to pick up some of the tools and techniques I’m going to talk about today and start using them/The third decade of the web is going to be led by those that understand data both from the insight it can give in shaping the user experience and by those who can get to grips with the mountains of data we’re generating and design totally new data products from it. The next age of the web will become increasingly elastic and fluid that will react to the way we want to experience it. And today I’m going to show you how using a little bit of datatium can really start to shift the types of experiences we can create.
  10. So to do this we’re going to concentrate on three key areas:We’ll start with looking at direct feedback experiences.We’ll then look at how we can use behaviour to shape a response.And finally we’ll look at the effect of context on experience.So let’s get started.
  11. Conditional experiences are the simplest type of responsive experience. They take explicit pieces of information and shape the experience based on what you tell them. I call these conditionally responsive experiences because they are pretty much like big programming “if” statements:
  12. IF I do this thing or provide this information THEN the application does something in response..This stuff is pretty simple as it’s entirely driven by explicitly given data points and a lot of these things we can ask for and we can usually trust the data once we have it. For example if someone picks “tall” from a gender selection list we can start doing something with that information because we’re going to be fairly happy that the information is correct and we ignore people that are lying and treat them as though they were telling the truth. I can get a long way by designing this type of experience because it all comes back to what the user has told me they want. Conditionally responsive experiences should be the baseline for most web experiences by now, but sadly they aren’t or are often ignored -
  13. how many of you get annoyed when you set some kind of preference about how you want to interact with a service and then it’s blatantly ignored?So let’s look at how we get the data to do this, the types of experiences we can create with it and then how we weave it into the design process.
  14. What sort of data do we want to get when we’re designing conditionally responsive experiences. Well largely it doesn’t matter so long as it as clean as possible and you use what you ask for.Start by just keeping it simple. Ask questions and ask for corrections from the users.
  15. The obvious things are items like demographic and preference information and wherever possible provide a pick list.Sometimes you can’t do this however so you need to take a guess and roll with it or suggest an alternative to the user.
  16. A really good example of this is Google’s “Confused User” mode where it says “Showing results for xxxx”.
  17. Also consider best guessing and providing the results to the user showing what assumptions you’ve put in place - for example Wolfram Alpha when you type Ruby gives it a go and then asks for further clarification. So don’t underestimate asking and validating with your users in order to get clean data that you can use.
  18. So we’ve worked out how to get the data so what can we do with it now we’ve got it.One thing to point out here is that if you’ve gone to effort of getting it,
  19. make a bit of effort to show the user how you’re making their experience better as a result. If you’ve got it, flaunt it.So the first and most obvious use of all this data is to simply make things more frictionless throughout the experience. These don’t need to be massive mods, they can be little tweaks to help make the person’s process a little more frictionless.Image: http://www.flickr.com/photos/adpowers/540161726/sizes/z/
  20. Like one of my pet hates is when I buy something online and I have an account because I’ve shopped there before and yet things like the contact form doesn’t populate my details with name and email address. Why do I need to be asked again? You already know who I am, I’ve already provided that info...Image http://www.flickr.com/photos/joeshlabotnik/2936583930/
  21. Another way you can do this is by leading questions that might ask for something which helps a later decision. If we put the postcode field first in our address field set then we can pre-populate state and country with information derived from it. Now as an engineer I KNOW you need to do a real look up on postcodes to determine state because we have some wacky exceptions but a user is a little forgiving. You don’t have to be perfect in every instance. If you can get 99% with about 10 lines of javascript why wouldn’t you?Image: http://en.wikipedia.org/wiki/File:2_digit_postcode_australia.png
  22. Don’t underestimate the value of tiny removals of friction, especially in things like checkout processes. The way I think about this is like a slide right. Remember when you were a kid and they made a slide out of some sort of metal that you just didn’t seem to slide on so you had to wiggle your way down. Pretty soon you got bored and went and set fire to things or did something more interesting. Image: http://www.flickr.com/photos/martinhoward/2936215386/sizes/o/
  23. One of my favourite examples of this frictionless interaction is actually from a sandwich shop over in Surry Hills. When you place your order you have to give your name. If you pay with a card though they use your name off the card and just confirm it with you “You’re Andrew right?”. Beautiful! We can do this so much more often than we do.Image: RikardStolz / The Sandwich Shop, Surry Hills.
  24. We can also use conditional response to lead a user through a process to supply more data or gain experience.This works by constantly shifting the goal slightly so you always have another destination but in doing so you build up your skill with the service.Image: http://www.flickr.com/photos/wolfgangstaudt/2280426320/
  25. Linkedin leads people through the process of getting their profile built up and it doesn’t feel like an interrogation. They need to get a full profile on everyone so they lead the user and stretch them with goals to supply more incrementally which helps the user as well because they aren’t overwhelmed in the initial sign up process.
  26. How many of you have played a game like Zelda or some other Nintendo, SquareEnix or EA RPG of some sort? Okay most of you.Notice how when you start playing one of these games you start off with a really limited palette of actions. You move around, maybe jump and maybe fire.So you have this purposefully limited set of actions while you develop familiarity and then more and more complex actions are given to you over time. Eventually you end up with these control systems where you’re clicking buttons like mad and it feels quite natural but if you tried to put that in front of someone in their first 30 seconds of a game it would be almost impossible to play with.This is a responsive experience in action - the game helps you along the way but until you master the ability to do something you don’t move on to higher degrees of complexity.So we can use the data that surrounds our user to open up the experience around them as they are capable. As complexity arises in modern web applications, this keeps them engaged, doesn’t overwhelm them and gives you more data to work with to create even more responsive experiences down the line. We could do this much more than we do now.www.zelda.com
  27. How do you approach this in the design process?
  28. One of the ways I incorporate this is by calling it out explicitly during the wireframing and prototyping phases. I draw little stick men asking what do I know about the user to this point and what should I be asking them now which will help me give them something more later
  29. I constantly look at forms and attempt to pare things back to only that which is required. You know when you go through that process of marking fields as required or optional? get rid of the optional ones! If they are optional create another process to fill them in later as part of “profile completion” tasks.Every time you put a field down question what you are going to use it and what does the user get out of it by supplying the information.
  30. Look at whether there’s a better arrangement of requests for data that allow you to make the experience have less friction. Keep asking this over and over and work with your dev team to see if they have any additional sources they can pull in to help this as well - for example address validators or importers.We’ve looked at the most straightforward type of responsive experience, the one that lends itself towards obvious user personalisation. We’ve looked at how we get data from the users and how that creates certain types of experiences and we’ve looked at how we can weave this into the design process. Now we’ll take a look at responding to a user’s behaviour.
  31. Behaviourally responsive experiences are a little harder to create because we will look at what a user does as well as what they say - actions speak a lot louder than words. A thing that we also need to be aware of is that behaviourally responsive experiences can start get a bit murky as well because the user isn’t always aware of what is causing the application’s behaviour so we need to consider transparency.So we’re going to talk about what data is useful for these types of experiences, the types of experiences we can create with them and how we factor this into the design process as well.
  32. So how do we get the data we need to make responsive experiences from people’s behaviour? This data is largely implicit in nature.Now, implicit data is generally the stuff we derive from other sources - like familiarity with our system is a function of clicks to finish a task or time spent on a particular page or interaction with particular content. It’s less reliable and we can’t say things definitively though we can start to infer things from this behaviour.
  33. I just want to mention Web Analytics for a moment here. Even though I work with this every single day, I don’t consider it real behavioural data. It’s marketing spend justification data. So it’s not that useful for us when designing experiences. No, what we’re interested in is in getting data that is actionable - that helps us form opinions about how design should unfold or about giving us direction for iteration. So that helps us; but we’re also interested in data that shapes the experience for the user. It’s about them too remember?
  34. So we look at why is a user doing or not doing what you’ve set out to build for them? Are they getting stuck? How do we even know if they are getting stuck?
  35. We can ask questions about a user’s intent. What are they after? Are they exhibiting any sorts of behaviour where we can start predicting what they are ultimately wanting to do? Are they using our system in a particular way that allows us to tune the experience for that. Often to make this type of data work you need to start working with a developer or a data scientist in order to start making sense of it, but it’s worth considering these questions up front as it allows you to craft experiences around the answers.Image: http://www.flickr.com/photos/wetwebwork/2847766967/
  36. So once we have some behavioural data what can we do with it? Using behavioural data doesn’t need to be ridiculously clever to be extremely effective.
  37. Recommendations of what other things to look at is an obvious first step but one that’s ignored many times. In my experience, a machine with a reasonable model will beat a human on recommendations just about every time.Amazon are the obvious example here and have got consumers used to the idea of affinity matching - this model is also dead simple to implement too but it can work on other types of content too
  38. like this recommended stories panel from the New York Times site.So recommendations is a great way to help the user and increase discoverability and you use the data from thousands or millions of users to create the correct associations. When you’ve got a product catalogue that literally has hundreds of thousands or millions of items in it then you need to be able to do this.
  39. What can you do in order to get people to the things they really want to be able to see as fast as they can. One of the things I’ve been toying around with is to consider the thing someone does most frequently and consider having a slot for it in your main nav or homepage.For example if I have a pay as you go mobile phone and I recharge it online, chances are most of my visits to the website are probably going to follow a pretty well defined path.
  40. Home page, account login, select recharge, put in the recharge details, complete, exit.Why not make this a link that surfaces when I start exhibiting this behaviour. Sure it makes it a little harder to design for but if we just make the slot available for responsive experience customisation and define constraints around it then it makes it much more useful for the user.Taking Amazon as an example - the thing I do more than anything on the Amazon site is check my Gift Card balance because I read so many ebooks on my kindle.
  41. Creating a responsive experience for me would be taking that piece of data and then exposing it on the site AND exposing it through the API that is available to the kindle. That’s the sort of stuff that starts empowering users and making them feel as though the application is reacting to their behaviour.So behaviourally responsive experiences start becoming a lot more elastic in terms of design.
  42. Now the problem with behaviour is it’s inherently chaotic. It’s messy and it’s now reliant on users who could be doing all sorts of different things and behavioural data can be contradictory as well. Argh - how can you design for it without it looking like 20 random things have just been vomited up onto your home page.Start small and build upwards. Consider using behavioural rules like we do media queries to show behaviours once a threshold is reached.Some thresholds will be low - for example product recommendation based on the product you’re looking at. Others will take time to develop say surfacing content that is based on previous interactions with the service over long periods.
  43. Design for slots / modules as high up as your primary page structure where you can dynamically allocate them as the user’s experience evolves. And make sure you do this early on as this helps constrain the chaos a little bit can stop data vomit later on.
  44. Now, we need to consider designing in methods to allow people to correct a mistake. If you embrace the chaos of behaviourally responsive design you ARE going to make mistakes in what you put to the user but they are good opportunities to learn.So in your design process you need to do two things. Image: http://www.flickr.com/photos/36821100@N04/3537999137/
  45. The first is to make it transparent to the user about WHY they are being provided with the information you’re providing them. Sometimes this can be hard to articulate easily so you might need to work at it.Amazon recommendations work quite well here because it tells you what you purchased or looked at in order to get the recommendation.
  46. The second is allowing the user to correct things. Facebook ads are a good example of this as they let you fix a problem and in fact they look at it as an opportunity to collect some additional data about WHY it was no good for you which helps them with their targeting ongoing.
  47. Correcting failure starts the process of closing the loop on behaviour, however, we can extend this and provide the data back to the user in some other form to start using for themselves to give them feedback on their own behaviour rather than just brutally harvesting data from your user base.
  48. A nice obvious example of that is say Last FM which shows succinctly what I’ve been listening to over different time periods, by tracks, albums and artists.
  49. Linkedin gives you stats about how your profile has performed over the last week or month to show how effective your profile is in search and visits. In fact they built an entire data product around this for “vanity users” who want to see all the details of how many people are looking at them.So behaviourally responsive experiences take a bit more work but they completely change the nature of the experience from one of linear progressions down a decision tree to something that is a bit more fluid. It sits on the edge of chaos from a design and system perspective a lot of the time but if you embrace it you will end up with a bunch of unexpected consequences as a result which you can turn to even greater experiences for your users.Now we understand how conditionally and behaviourally responsive experiences work we’re going to talk about how we really start to change thinlook at contextually responsive experiences.
  50. These experiences are ones that constantly evolve, they are highly chaotic and require you to think more about intent than about anything else. They are shaped by external factors to the user as well as to the explicit and implicit data they have generated for you.
  51. To give you an example of how seamless this looks when you see it in action here’s a clip from the Avengers movie. Notice here how the HUD changes from a general display on what’s going on to full threat tactical display in a heartbeat. Stark doesn’t activate it at all and it becomes perfectly tuned to the tactical situation around him, responding contextually to the threats nearby.Now clearly this HUD doesn’t exist in anything other than a fictional sense but this completely sums up how I want the web to behave every day - and I’ll settle for this without the flying suit of armour and pulse cannons in my hand. A contextually responsive experience is really easy in theory but super difficult in practice. How many of you are using media queries to create responsive pages? Great - just about all of you. So you’re already familiar with the basics of contextually responsive experiences.
  52. Now I’m sure many of you have come across this problem where you have a nice desktop site and you use media queries to reformat it to work on mobile but it doesn’t feel right or worse it feels terrible? It ends up as a big long scrolly page, the navigational system doesn’t work very well and you end up with something that whilst it’s reflowed nicely doesn’t really elicit the feel or the usability you were striving for. Has this happened to anyone? Right so the issue here is that whilst the mechanics have worked properly using a different device has created a totally different context from one interaction type to another. This is the hardest type of responsive experience to create because we haven’t been trained to consider it, we don’t have a lot of tools to make it work and it’s really difficult to get the data for it. But this is where the web transforms into something else - something that’s entirely and seamlessly linked into our every day.So we’ll look at how we get some data to work with, what we can do with it once we get it and then look at how we factor it into the design process.
  53. Getting the data to use for contextual responsiveness can be a bit hit and miss. The key here is to experiment, to use all sorts of data sources and blend them together.
  54. The obvious starting point is devices but that just lets you know capabilities you’ve got to play with.
  55. Next we can consider time, different people use devices differently over the day and week. Using your tablet at 9pm is a different behaviour at 9am. Image: http://www.flickr.com/photos/martinaphotography/7482296868/sizes/l/
  56. We can also consider location - is the person moving or stationary? You can infer location but you can also ask a user for their location if you think it will make it a better experience. Does the person’s location overlap with known places like a train station, a train line or say you were a retailer one of your stores (or close to it).These are just a few points that can create a whole bunch of different contexts that the user may be in. Image:
  57. If I visit a site on my phone at about 8am every morning through the week and I’m moving chances are I’m on my commute. This is very different to me using a tablet in landscape mode at 9pm where I’m connected via a high speed wifi link from a static location. Image: http://www.flickr.com/photos/henry_stradford/5348910688/sizes/o/
  58. Context starts creating a significant number combinations of variables and this can quickly spiral out of control but start by just considering device, location, time and speed and you’ll get a surprising number of contexts from them to consider in your design.
  59. We’ve got all these different contexts so what can I do with this information?
  60. Traditional responsive design starts here looking at capabilities first and foremost. I can start shaping the type of experience based on the device. By looking at connection speeds I can start shaping what they see. A mobile phone on a WiFI connection is a fundamentally different to one on a 3G network especially when you change cells and the network has to do a hand off.
  61. As such we can change assets based upon this. As well as our media queries, we can send different quality images to users on poorer connections. Indeed we can even consider removing heavy images altogether and making them request based. Reacting to these types of external events can really make the difference between a great experience and a terrible one. Make the external factors that go into the experience something you can start to control.
  62. Now, a lot of companies when they “go mobile” have this belief they need to be able to offer everything on their site on the mobile site as well. This is rubbish. The user might tell you they want something but actually when it comes down to it, they’ll do something else entirely. The reason for this is because of task oriented context.
  63. I’ve been told anecdotally that when ANZ came to build their GoMoney application for mobile devices it was based around the insight that the majority of users logged in to the existing web application on their phone, looked at their account balance and exited again. As such in their mobile app they put it front and centre and then tacked on making a payment as well as that was the number two task. Context drives need and requirements.When I’m out and about and I’m really mobile, I don’t need the full capabilities of the entire ANZ online banking platform. I just want to see whether I’ve been paid and whether I have enough money to buy that new Vita game or not.
  64. Don’t underestimate task oriented context as it’s a massive factor in behaviour. As we all have smartphones and tablets available to us one of the big shifts you see is in starting to use micro moments to be more effective. Smashing out a quick tweet, taking a photo and uploading it somewhere, paying a bill, reading an email. These are all massively task oriented behaviours that are bound to the context of our locations and our devices.Image: http://www.flickr.com/photos/yourdon/2681687374/sizes/o/
  65. This works for desktop sites as well. For example I love the way when you’re doing something in google docs all other Google services melt away. You can still access them when you need to, but the application becomes your primary context. So understand what the user is trying to do and get them into that mode as easily as possible and maximise their ability to work within it given the constraints of the external factors that drive the context.
  66. The last type of experience we can create is adaptive contextualisation. Adaptive context is where all those context variables are being considered all of the time and they are constantly changing our experience on the fly.
  67. The only real example of this right now is the work google is attempting to do with Google Now. It doesn’t really work just yet and is almost useless in Australia but it’s a sign of the things to come. This is showing how the future of much of the web will be fragmented and will slide across our various devices in different ways based on the data that’s coming from all around me. Google knows I’m likely to be going home about 5pm so it can start showing related information to me. This could pop up in a widget in chrome, come into my Android home screen or be beamed to my pebble watch (well maybe in the future it will be).
  68. This is where the web starts bumping up against the physical world. Where physical and web data starts seamlessly flowing back and forth and influences the way I interact with both. Imagine walking into a store and little highlights are shown where product is that you might like based on your previous purchases that ALSO includes availability of stuff that’s in your size. This is where adaptive context starts to go once we get things architected the right way.Image: http://www.flickr.com/photos/design-gallery/5735567308/sizes/l/
  69. So how do we work this type of experience into design? This is really where system thinking really starts to take hold in order to make this work completely.
  70. The first thing to do is to truly and totally embrace chaos. Contextually responsive experiences are complex systems. This is why they are so powerful as they are deeply adaptive. You can end up with some quirks so try to find out where the quirks happen and give the user the ability to take a decision that fixes it such as those I described before with behaviour.To help with this we use intent. Intent gives you a framework without having to be prescriptive. To design with intent you should design and build prototypes rather than design in photoshop.Once you have intent, you can then emit some rules for behaviour. These are your non-negotiables but the key here is to be sufficiently relaxed that you ONLY define the non-negotiables. This allows you to define really adaptive systems and maintain some standards but not have to define every single little thing which kills you in complex systems. Think of this as like an uber-style guide, where you’re defining an approach to design rather than the specifics.Image: http://www.flickr.com/photos/pagedooley/3199296759/sizes/l/
  71. As I said at the start my aim has not been to turn you into data scientists but give you some thinking about how this notion of datatium can help you evolve much more complex and responsive experiences by looking at conditions, behaviour and context to do so.I want you all to go away from here and start creating highly responsive experiences in everything you do. I feel as though the web is about to hit another tipping point, where it is so ingrained into everything we are doing that it’s about to morph again into these amazingly adaptive and responsive experiences that surround us every day, constantly shifting and changing.Hopefully the examples I’ve talked through will give you some ideas of where to start but I want to leave you with a couple of things to act upon
  72. Firstly here are my golden rules for using datatium to create responsive experiences:
  73. You don’t know everything, be open to ideas and open to what the data tells you to do.
  74. Data is worth more than opinion discussion shifts when there’s data to hand and stops it from being an “I think” type of conversation
  75. Be bold - design is about exploring a domain space. No real explorer we know about now got there by sitting on their couch. Make a judgement and go with it a lot of the time you’ll be wrong - who cares at least you’ll learn something.. Grow some!
  76. The other thing I want to leave you with is something I mentioned at the start. Data and data thinking is one of the most critically required skills of the coming decade of the web and society generally. Don’t be afraid of data because you don’t need a PhD in stats to do interesting things with it.Image: http://www.flickr.com/photos/zebrasquares/4556045398/sizes/l/
  77. Data science is like punk:Back in the 70s a magazine was launched to help you make a punk band. In it there was this page:Here’s a chord, here’s another, here’s a third - go start a band.data science is like punk. It’s all about exploring the possibilities of what data can do for user experience.
  78. So here’s my equivalents:Here’s a question - What’s the behaviour look like over a period?Here’s another - How does this change from one period to the next?Here’s a third - How does that change itself change over the period?
  79. Now go make some responsive experiences! Thank you.