Designing Without the Browser - We are the makers of things

We are the makers
of things
Designing Without the Browser
27 May, 2011 • Hannah Donovan
My name is Hannah,
My name is Hannah,
Last.fm Kinect
Last.fm Kinect
Last.fm Kinect
Last.fm Kinect
Why was it hard?
!"#"$%&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
/*1-0(.&'%(%)*$+ 2(3&'%(%)*$+,* &/".+*$(0&'%(%)*$+
45(6"7&!(8)* 45(6"7&!(8)* 45(6"7&!(8)*
9(+%:;6&<)$"#%
9)=.(.>&!(8)* ?)@&!(8)* !"#*66"$8"8&!(8)*
/*1-0(.&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
A.%)+%&!(8)*
9(+%:;6&<)$"#%
9(+%:;6&<)$"#%
2(3&'%(%)*$+
9(+%:;6&<)$"#%
A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%&!(8)* A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%
A.%)+%
A.%)+%

)#*$ )#*$ )#*$
B=*@&<)$"#%&5(C)3(%)*$
'"0"#%)$3&+%(%)*$+
D*$%.*0+E&F+".&+"0"#%+&(&%)0"&=>&GH*08)$3I&%H").&H($8
'%(%"+E&/".+*$(0&+%(%)*$+&J)00&="&"61%>&K($8&$""8&(&H"01&+#.""$L&-$%)0&%H"&-+".&H( +&
0)+%"$"8&%*&@&%.(#M+N&1-00&."#"$%&+%(%)*$+&;.*6&-+".O+&9P?&H)+%*.>:
'"0"#%)$3&%H"+"&+%(.%+
%H"&+%()*$N&."Q-)."+
10(>&)#*$
'"0"#%)$3&%H"+"
*1"$&(&G;*08".I
K+H*-08&$*%&H(C"&(&
10(>&)#*$L
Flexibility today
Increasingly, the medium we’re
designing for is not the browser.
And these mediums are (at the moment)
are less flexible to work with.
Flexibility today
The plateau of profitability
Gartner’s Hype Cycle (image from BERG’s ‘Mining the Trough of Disillusionment’)
Flexibility today
The plateau of profitability
Gartner’s Hype Cycle (image from BERG’s ‘Mining the Trough of Disillusionment’)
= flexibility
Photo credit: Jeffrey Beall
But what about
lunch?
The story of the shark

Hong Kong
The story of the shark
Hong Kong
From ‘The Art of Finding Nemo” by Mark Cotta Vaz (Pixar)
!"#"$%&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
/*1-0(.&'%(%)*$+ 2(3&'%(%)*$+,* &/".+*$(0&'%(%)*$+
45(6"7&!(8)* 45(6"7&!(8)* 45(6"7&!(8)*
9(+%:;6&<)$"#%
9)=.(.>&!(8)* ?)@&!(8)* !"#*66"$8"8&!(8)*
/*1-0(.&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
A.%)+%&!(8)*
9(+%:;6&<)$"#%
9(+%:;6&<)$"#%
2(3&'%(%)*$+
9(+%:;6&<)$"#%
A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%&!(8)* A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%
A.%)+%
A.%)+%
)#*$ )#*$ )#*$
B=*@&<)$"#%&5(C)3(%)*$
'"0"#%)$3&+%(%)*$+
D*$%.*0+E&F+".&+"0"#%+&(&%)0"&=>&GH*08)$3I&%H").&H($8
'%(%"+E&/".+*$(0&+%(%)*$+&J)00&="&"61%>&K($8&$""8&(&H"01&+#.""$L&-$%)0&%H"&-+".&H( +&
0)+%"$"8&%*&@&%.(#M+N&1-00&."#"$%&+%(%)*$+&;.*6&-+".O+&9P?&H)+%*.>:
'"0"#%)$3&%H"+"&+%(.%+
%H"&+%()*$N&."Q-)."+

10(>&)#*$
'"0"#%)$3&%H"+"
*1"$&(&G;*08".I
K+H*-08&$*%&H(C"&(&
10(>&)#*$L
The story of the shark
Shark vs. my Kinect drawings?
!"#"$%&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
/*1-0(.&'%(%)*$+ 2(3&'%(%)*$+,* &/".+*$(0&'%(%)*$+
45(6"7&!(8)* 45(6"7&!(8)* 45(6"7&!(8)*
9(+%:;6&<)$"#%
9)=.(.>&!(8)* ?)@&!(8)* !"#*66"$8"8&!(8)*
/*1-0(.&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
A.%)+%&!(8)*
9(+%:;6&<)$"#%
9(+%:;6&<)$"#%
2(3&'%(%)*$+
9(+%:;6&<)$"#%
A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%&!(8)* A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%
A.%)+%
A.%)+%
)#*$ )#*$ )#*$
B=*@&<)$"#%&5(C)3(%)*$
'"0"#%)$3&+%(%)*$+
D*$%.*0+E&F+".&+"0"#%+&(&%)0"&=>&GH*08)$3I&%H").&H($8
'%(%"+E&/".+*$(0&+%(%)*$+&J)00&="&"61%>&K($8&$""8&(&H"01&+#.""$L&-$%)0&%H"&-+".&H( +&

0)+%"$"8&%*&@&%.(#M+N&1-00&."#"$%&+%(%)*$+&;.*6&-+".O+&9P?&H)+%*.>:
'"0"#%)$3&%H"+"&+%(.%+
%H"&+%()*$N&."Q-)."+
10(>&)#*$
'"0"#%)$3&%H"+"
*1"$&(&G;*08".I
K+H*-08&$*%&H(C"&(&
10(>&)#*$L
The story of the shark
Shark vs. my Kinect drawings?
!"#"$%&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
/*1-0(.&'%(%)*$+ 2(3&'%(%)*$+,* &/".+*$(0&'%(%)*$+
45(6"7&!(8)* 45(6"7&!(8)* 45(6"7&!(8)*
9(+%:;6&<)$"#%
9)=.(.>&!(8)* ?)@&!(8)* !"#*66"$8"8&!(8)*
/*1-0(.&'%(%)*$+
,* &/".+*$(0&'%(%)*$+
A.%)+%&!(8)*
9(+%:;6&<)$"#%
9(+%:;6&<)$"#%
2(3&'%(%)*$+
9(+%:;6&<)$"#%
A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%&!(8)* A.%)+%&!(8)* A.%)+%&!(8)*
A.%)+%
A.%)+%
A.%)+%
)#*$ )#*$ )#*$
B=*@&<)$"#%&5(C)3(%)*$

'"0"#%)$3&+%(%)*$+
D*$%.*0+E&F+".&+"0"#%+&(&%)0"&=>&GH*08)$3I&%H").&H($8
'%(%"+E&/".+*$(0&+%(%)*$+&J)00&="&"61%>&K($8&$""8&(&H"01&+#.""$L&-$%)0&%H"&-+".&H( +&
0)+%"$"8&%*&@&%.(#M+N&1-00&."#"$%&+%(%)*$+&;.*6&-+".O+&9P?&H)+%*.>:
'"0"#%)$3&%H"+"&+%(.%+
%H"&+%()*$N&."Q-)."+
10(>&)#*$
'"0"#%)$3&%H"+"
*1"$&(&G;*08".I
K+H*-08&$*%&H(C"&(&
10(>&)#*$L
The story of the shark
Shark vs. my Kinect drawings?
SHARK WINS. GAME OVER.
The story of the shark
Why does the shark win?
The story of the shark
Why does the shark win?
Why doesn’t the shark win?
It’s a fucking shark.
The story of the shark
Why does the shark win?
Why doesn’t the shark win?
It’s a fucking shark.
What’s our equivalent
of the 3/4 view?
Open question: