1. RESPONSIVE DESIGN IS DEAD,
LONG LIVE RESPONSIVE DESIGN
OCTOBER 26, 2012
1

2. RESPONSIVE WEB DESIGN
2

3. HONORED TO BE HERE
TODD YUZWA JAY KARR
• A Creative Director at Resource • A Technology Director at
• Working in digital for 17 years. Resource
(No, I didn’t invent the web) • Passionate user advocate in
• Love RWD. But not blinded by technology, for as long as I’ve
that love. been a user
• Passionate technology advocate
in user experiences, for as long
as I’ve been a technologist
3

4. RESOURCE
EST. 1981
• Offices
– Columbus
– San Francisco
– Chicago
– Cincinnati
• 400+ Associates
• Women owned & operated
• Independent
4

5. A CASE FOR CHANGE
NEW CONSUMER BEHAVIORS
of US mobile web users of users expect the mobile
only access the web from experience to be better than
their mobile devices or equivalent to using a
laptop or desktop computer
of moms with tablets said of moms surveyed said they
they now use their PC fewer have made a purchase
than two hours per week, using their tablet within
yet log more than ten hours the last month
per week on their tablets
Sources: AdMob, US Labor Department, Nielsen, Knowledge Network, CNN, IBM 5

6. RESPONSIVE AT RESOURCE
COMPLETED RWD PROJECTS
6

7. RESPONSIVE EXAMPLES
LITTLE BLACK DRESS
7

8. RESPONSIVE EXAMPLES
PURINA CAT CHOW
8

9. RESPONSIVE WEB DESIGN
THIS IS GREAT!
• Provides a great experience to the greatest number of consumers and
devices – in a word, reach
• Maximizes investments in infrastructure and technology
• Delivers ROI with efficiency in maintenance with lower total cost of
ownership
• Provides a future-friendly approach for web-connected devices
• SEO benefit of consolidated link equity for search and social
• Unified tracking and analytics for holistic view of engagement,
conversation and optimization opportunities
9

10. RESPONSIVE WEB DESIGN
All of this is
very good
http://www.flickr.com/photos/sarahreido/3120877348 10

11. RESPONSIVE WEB DESIGN
…or is it?
http://www.flickr.com/photos/sarahreido/3120877348 11

12. RESPONSIVE WEB DESIGN
THIS IS GREAT?
But it’s just resolution independent…
• The experience is built around pixel width resolution
• We assume resolution tells us device
• We assume device gives us context
12

13. “Mind reading is no way to base
fundamental content decisions”
MARK KIRBY, THE MOBILE CONTEXT
13

14. What if Starbucks ran their
business this way?
Delivering same ubiquity
to everybody.
14

15. It might look a bit like this.
15

16. Everybody gets the same thing.
Just in different sizes.
16

17. How very responsive.
17

18. But not all that special.
…or personal.
18

19. It’s the back of the cup
that matters.
19

20. 20

21. Acknowledging that there is a
unique person on the other side.
21

22. It’s the personal
experience that matters.
22

23. This is where RWD
can get it’s soul back.
23

24. RESPONSIVE WEB DESIGN
24

25. TECHNOLOGY APPLICATION
• HTML
FRONT-END • CSS
• JavaScript
BACK-END
Content Management Commerce / Social Commerce Native Apps / Messaging
25

26. CONSUMER FIRST
WHERE WE’RE HEADED NEXT
26

27. RESPONSIVE AT RESOURCE
WHERE WE’RE HEADED NEXT
27

28. EXPERIENCE DESIGN
(personalization beyond scaling)
28

29. EXPERIENCE DESIGN
PERSONALIZATION BEYOND SCALING
Let’s create a hypothetical
example to illustrate this.
29

30. EXPERIENCE DESIGN
PERSONALIZATION BEYOND SCALING
This is great if you’re on a desktop. At home.
30

31. But what if you’re not?
31

32. This has no chance.
32

33. • Location based messaging
– Weather conditions
– Relationship to retail locations
– Regionalized Tweet Data
Some things • Historical based messaging
they expect: – Past purchases
– Past product views
– Past Interests
• Social based messaging
– Demographic data
– Social Graph data
33

34. What if you’re on
the beach. In Hawaii.
On your phone.
34

35. Or if you’re a
skate girl who hates
the ocean?
35

36. And by the way, you do
know I’m on the new
iPhone 5, right?
Right?
36

37. Responsive Design
is dead without this
personalized approach.
37

38. Responsive Design
must be driven by personalized
experience to matter.
38

39. RESPONSIVE EXPERIENCE
HOW WE DO IT
Responsive Design demands new ways of working together with our
stakeholders, partners and internal teams.
– Requires real-time collaboration to continually balance content, design
and functional perspectives
• Individuals and interactions over processes and tools
– All visual communication done through working code
• Working software over comprehensive documentation
– Requires input, trust and partnership
• Customer collaboration over contract negotiation
– Scale challenge: too many moving parts to manage with traditional
deliverables
• Responding to change over following a plan
39

40. RESPONSIVE EXPERIENCE
PERSONAL
Optimize
Adapt
Support
GENERAL
40

41. RESPONSIVE EXPERIENCE
OUR RESPONSIBILITIES
Forget resolution, devices, or platforms. It’s about people.
• Even before design, we need a consumer-focused strategy
– What do we think matters? How do we determine what actually matters?
– How can we empower them rather than make choices for them?
• Define your priorities and make tough decisions
– Breakpoints and mediaqueries are the easy part
• We know more every step of the way. Do something about it.
– Optimize the experience.
41

42. Web is a service, not a product.
Let’s do it better tomorrow
than we did today.
Jay Karr gkarr@resource.com
Todd Yuzwa tyuzwa@resource.com
42