Presented Jan. 24, 2013, in Chicago, at the first UX Thursday event sponsored by User Interface Engineering.

1. The Touchable Desktop
When Responsive Won’t Fly
Will Hacker UX Thursday
UX Architect, Cars.com Chicago
@willhacker Jan. 24, 2013

2. The Touchable Desktop
Apple

3. Cars.com

4. Flickr Photo: EU Design Studio, 2012

5. When Responsive
Won’t Fly

6. Content Is
Navigation

7. Target

8. Chevrolet

9. Chevrolet

10. Cars.com

11. Cars.com

12. Cars.com

13. Cars.com

14. Source: http://lukew.com/touch

15. Tap Targets
and
Whitespace

16. Flickr Photo: Lance Peterson, 2011

17. Mint.com

18. Mint.com

19. Fitbit

20. Smart

21. Smart

22. Google

23. Cars.com

24. Cars.com

25. Cars.com

26. Hover States

27. Fitbit

28. Reduce
Form Friction

29. Macy’s

30. Amazon

31. <form>
<input
type=“email”
autocapitalize=“off”
autocomplete=“off”
/>
</form>

32. Discover

33. Discover

34. <form>
<input type=“number” />
</form>

35. Cars.com

37. Forms : Styles
.text-input { .text-input {
margin:0; margin:0 0 10px;
} width:200px;
height:25px;
.button{ }
...
height:25px; .button {
} ...
height:30px;
}
.text-input:focus {
background-color:#ffffe0;
}

38. Cars.com

39. UX
Takeaways

40. • Content Is Navigation
• Tap Targets and Spacing
• No Hover on Tablets
• Reduce Form Friction

41. The Touchable Desktop
Flickr Photo: Fahad Khan Photography, 2012

42. Thank You
Will Hacker
willhacker.net
@willhacker