Talking about "Representing ..." paper, structural design in relation to usability

1. @davidpetersimon
Representing Information Across Channels

5. IMG Source: http://is.gd/4OUw1e

6. PURE INFORMATION
REPRESENTATION

7. STRUCTURED
PRESENTATION

8. IMG Source: http://is.gd/fg5IGb

9. IMG Source: http://is.gd/5z13dK

10. !original no dithering dithering
IMG Source: http://is.gd/XFOoKn

11. IMG Source: http://is.gd/GcNg8m

12. IMG Source: http://is.gd/NFlXBL

14. IMG Source: http://is.gd/ujDmPr

16. IMG Source: http://is.gd/CHbnRB
WE MUST ADOPT AN
AGILE, MOBILE FIRST
APPROACH FOR
OUR NEXT
MVP.

17. IMG Source: http://is.gd/qUjSAs

18. IMG Source: http://is.gd/vwz5z1

19. IMG Source: http://is.gd/Ki8HdB

20. “[We need] to develop thoughtful design
systems, rather than creating simple
collections of web pages.”
- @brad_frost
Quote Source: http://is.gd/fQUU9h

23. IMG Source: http://is.gd/oWMn34

24. IMG Source: http://is.gd/crKvwi

25. Form is not
independent.
IMG Source: http://is.gd/UOe2QO

26. What defines a “page” nowadays?
!
IMG Source: http://is.gd/lBhdmb

27. IMG Source: http://is.gd/rj6QEE

28. Location: Twitter app
Connectivity: 3G
Location: Chrome browser
Connectivity: Wi-Fi
Location: Pocket app
Connectivity: Offline
IMG Source: http://is.gd/POnUr0

29. Instead of grids or textures, what is critical
is the way the information is organized
in a form that can be recognizable on any
device, so as to add value to the user
whatever entry point they may consume the
content in.
It is about the fluidity of form and strength
of device relationships, not page display.

30. !
IMG Source: http://is.gd/lBhdmb

31. “STRUCTURE FIRST”
- @markboulton
IMG Source: http://is.gd/a3C6Gl

33. Create Once, Publish Everywhere.

34. !
IMG Source: http://is.gd/FEQhfF
Create Once, Publish Everywhere.

35. !
Create Once, Publish Everywhere.

36. !
Create Once, Publish Everywhere.

37. IMG Source: http://is.gd/V5Sd2P

39. 39
“And so paradoxically, having more structure
… is going to mean that we’re going to have
more flexibility in the future to get that
content onto places and platforms and
devices that we didn’t even know would exist
when we decided to do this ten years ago.”
- @karenmcgrane
IMG Source: http://is.gd/zHCtXL

41. IMG Source: http://is.gd/dbqb5d

42. IMG Source: http://is.gd/qPVQ6s

43. meta title
meta description
thumbnail

44. IMG Source: http://is.gd/YrRBw4

46. !
IMG Source: http://is.gd/lyzlHo

47. Source:
“You only appreciate the IA through
exposure to the complex cross-
channel nature of the service.”
- @resmini
IMG Source: http://is.gd/0hWAPo

49. IMG Source: http://is.gd/NvhjBc

50. Mobile?
IMG Source: http://is.gd/BLoZX5

51. Mobile?Mobile?
IMG Source: http://is.gd/IYTENt

52. Mobile?
IMG Source: http://is.gd/dovJUG

53. IMG Source: http://is.gd/eYhaDY

54. Responsive?
Mobile?

55. Responsive?
Mobile?
structured

56. Responsive?
Mobile? usable
structured

57. Talk with me on Twitter: @davidpetersimon
Thanks to the organizers @we_are_Nomensa.