Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The Future of the Web: and how to prepare for it today.

petewsmart
September 16, 2014
Technology
17
3.2k

The Future of the Web: and how to prepare for it today.

Talk given at Smashing Conference, Freiburg 2014

petewsmart

September 16, 2014
Tweet

More Decks by petewsmart

See All by petewsmart
Future of the Web: Emotional Intelligence
petewsmart
0
300
The Future of the Web - and how to prepare for it today
petewsmart
3
1k
You Live and Die by Your Ideas
petewsmart
2
290
Microsoft
petewsmart
0
140
Design thinking: 50 Problems 50 Days - Agri Meets Design 2014
petewsmart
5
1.3k
Design thinking: Design for Policy - Agri Meets Design 2014
petewsmart
2
160
Awwwards Conference: 50 Problems in 50 Days
petewsmart
0
190

Other Decks in Technology

See All in Technology
可読性を高めるためのコードレビューテクニック
sbtechnight
PRO
0
470
LINE Blockchain Developers APIではじめるWeb3
sbtechnight
PRO
0
380
AWS Engineer Meetsup 2023 登壇資料
takakuni
0
2.5k
Managing Test Data
eliasnogueira
0
110
竹芝地区のデジタルツイン開発と3D人流シミュレーション開発
sbtechnight
PRO
0
360
自動運転レベル4解禁にあたり求められる遠隔監視技術
sbtechnight
PRO
0
550
大規模レガシーテストを 倒すための CI基盤の作り方 / #CICD2023
udzura
4
1.4k
権威DNSサービスへのDDoSと
ハイパフォーマンスなベンチマーカ / DNS Pseudo random subdomain attack and High performance Benchmarker
kazeburo
3
890
ローコードで実現するDevOps ～継続的テスト編～
odasho
1
120
What's Data Lake ? Azure Data Lake best practice
ryomaru0825
4
1.6k
SNS投稿を使ってクラウド障害を検知してみた
sbtechnight
PRO
0
410
Invitation to K8s-Docs ja
nasa9084
0
130

Featured

See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
500
130k
Reflections from 52 weeks, 52 projects
jeffersonlam
339
18k
Creatively Recalculating Your Daily Design Routine
revolveconf
207
11k
Navigating Team Friction
lara
177
12k
Git: the NoSQL Database
bkeepers
PRO
419
60k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
6
910
A Philosophy of Restraint
colly
193
15k
Atom: Resistance is Futile
akmur
256
24k
Support Driven Design
roundedbygravity
88
8.9k
StorybookのUI Testing Handbookを読んだ
zakiyama
8
3.4k
Side Projects
sachag
451
38k
Bash Introduction
62gerente
602
210k

Transcript

  1. The Future of the Web?
    and how to prepare for it now
    @petewsmart
    Smashing Conference ,Freiburg

    View Slide

  2. compaq with mouse
    @petewsmart
    @petewsmart

    View Slide

  3. View Slide

  4. Credit: PSD Graphics

    View Slide

  5. View Slide

  6. View Slide

  7. Science Tech
    Design
    @petewsmart

    View Slide

  8. View Slide

  9. View Slide

  10. View Slide

  11. @petewsmart

    View Slide

  12. “Any sufficiently advanced technology is
    indistinguishable from magic.”
    Arthur C. Clarke
    @petewsmart

    View Slide

  13. View Slide

  14. @petewsmart

    View Slide

  15. View Slide

  16. Credit: Opera, Blog CDN

    View Slide

  17. View Slide

  18. @petewsmart

    View Slide

  19. What is magical
    for us today?
    @petewsmart

    View Slide

  20. “We're still in the first minutes of the
    first day of the Internet revolution.”
    – Scott Cook, Founder of Intuit
    @petewsmart

    View Slide

  21. The next 8500 days
    on the Web?
    @petewsmart

    View Slide

  22. @petewsmart

    View Slide

  23. View Slide

  24. View Slide

  25. View Slide

  26. View Slide

  27. 50 Problems
    in 50 Days
    A 2517 mile design
    adventure to try and solve
    50 Problems in 50 Days
    25+ Awards
    @petewsmart

    View Slide

  28. ViziCities
    First ever OpenSource
    SimCIty for real life
    @petewsmart

    View Slide

  29. 300,000 unique visits in 4
    weeks. Global exposure.
    Rethinking
    the airline
    boarding pass
    Innovation within existing constraints
    after 80hrs+ on 14 flights in 2 months,
    @petewsmart

    View Slide

  30. @petewsmart

    View Slide

  31. @petewsmart
    @petewsmart

    View Slide

  32. View Slide

  33. Credit: Fernando Barbella

    View Slide

  34. Credit: Fernando Barbella

    View Slide

  35. The next 8500 days
    on the Web?
    @petewsmart

    View Slide

  36. The Future of the Web
    @petewsmart

    View Slide

  37. The Future of the Web is
    Tangible
    @petewsmart

    View Slide

  38. @petewsmart

    View Slide

  39. Credit: Live Knowledge World
    @petewsmart

    View Slide

  40. Credit: M.C. Escher

    View Slide

  41. Credit: Aaron Groffman
    @petewsmart

    View Slide

  42. This is Haptics
    @petewsmart

    View Slide

  43. View Slide

  44. View Slide

  45. Electrostatic
    Manipulation
    @petewsmart

    View Slide

  46. Credit: Disney Research

    View Slide

  47. Credit: Disney Research

    View Slide

  48. View Slide

  49. @petewsmart

    View Slide

  50. How does this
    change the web?
    @petewsmart

    View Slide

  51. Shopping
    @petewsmart

    View Slide

  52. @petewsmart

    View Slide

  53. Shopping
    @petewsmart

    View Slide

  54. Lakoff and Johnson (1980)
    Varela,Thompson and Rosch (1991)
    Clark (1997)
    Key texts:
    Embodied Cognition
    @petewsmart

    View Slide

  55. @petewsmart

    View Slide

  56. “Cogito ergo sum”
    (I think therefore, I am)
    - Rene Descartes
    @petewsmart

    View Slide

  57. “Ago ergo cojito”
    @petewsmart

    View Slide

  58. “Ago ergo cojito”
    (I act therefore, I think)
    - University of Wisconsin, Laboratory of Embodied Cognition
    @petewsmart

    View Slide

  59. Education
    @petewsmart

    View Slide

  60. Credit: John Flinchbaugh
    @petewsmart

    View Slide

  61. Usability
    @petewsmart

    View Slide

  62. Key reading
    Emotive touch
    • Kleinke (1977).
    • Crusco & Wetzel (1984).
    • Vaidis and Halimi-Falkowicz (2008)
    • University of Berkley, California (2013)
    @petewsmart

    View Slide

  63. Credit: Aaron Gilson
    DePauw University, Indiana
    Research:
    @petewsmart

    View Slide

  64. The Future of the Web is
    Tangible
    @petewsmart

    View Slide

  65. View Slide

  66. The Future of the Web is
    Adaptive
    @petewsmart

    View Slide

  67. @petewsmart

    View Slide

  68. @petewsmart

    View Slide

  69. @petewsmart

    View Slide

  70. Credit: mrwallpaper.com
    @petewsmart

    View Slide

  71. View Slide

  72. Internet of
    Everything
    @petewsmart

    View Slide

  73. View Slide

  74. “so so so so so
    so so so
    awesum"
    The Internet Fridge!!!!!

    View Slide

  75. @petewsmart

    View Slide

  76. View Slide

  77. “Connecting products to the Web will be
    the 21st century electrification”
    Matt Webb, CEO of BERG Cloud
    @petewsmart

    View Slide

  78. View Slide

  79. View Slide

  80. Phillips bulbs

    View Slide

  81. Train / blowing hair video repeat

    View Slide

  82. View Slide

  83. View Slide

  84. An Adaptive Web
    @petewsmart

    View Slide

  85. Security
    @petewsmart

    View Slide

  86. iAMsma5hed
    [email protected]
    Password
    Email
    @petewsmart

    View Slide

  87. @petewsmart

    View Slide

  88. @petewsmart

    View Slide

  89. Credit: Wired
    @petewsmart

    View Slide

  90. Credit: Wired
    @petewsmart

    View Slide

  91. Credit: Hello Tree
    @petewsmart

    View Slide

  92. @petewsmart

    View Slide

  93. View Slide

  94. Advertising
    @petewsmart

    View Slide

  95. Credit: Odity Central

    View Slide

  96. @petewsmart

    View Slide

  97. Credit: http://www.scribd.com/doc/212976184/Th

    View Slide

  98. Avatars
    @petewsmart

    View Slide

  99. @petewsmart

    View Slide

  100. @petewsmart

    View Slide

  101. Credit: http://natemichals.com/wp-content/upload
    @petewsmart

    View Slide

  102. @petewsmart

    View Slide

  103. Ready to buy?
    Card: **** **** **** 6006
    @petewsmart

    View Slide

  104. @petewsmart

    View Slide

  105. @petewsmart

    View Slide

  106. @petewsmart

    View Slide

  107. @petewsmart

    View Slide

  108. The Future of the Web is
    Adaptive
    @petewsmart

    View Slide

  109. View Slide

  110. The Future of the Web is
    Invisible
    @petewsmart

    View Slide

  111. View Slide

  112. View Slide

  113. View Slide

  114. @petewsmart

    View Slide

  115. @petewsmart

    View Slide

  116. “Technology must be like oxygen:
    ubiquitous, necessary, and invisible.”
    Chris Lehmann
    @petewsmart

    View Slide

  117. 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1
    1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0
    0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 0 0 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0
    1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0
    1 0 1 0 0 1 0 1 1 1 0 1 0 0 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1
    1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1
    0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1
    1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1
    0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1
    0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0
    0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 1 0 0
    1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0
    1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0
    1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 0 0 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1
    1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 0 1 0 0 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0
    1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1
    1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1
    1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1
    0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 0 1 0 1 0 1 0 1 1 0 1 0 1 0 1 0 0 1 1
    1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0
    1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0
    1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 0 0 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1
    1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 0 1 0 0 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1 1 1 0
    1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1 1
    1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 1 0 0 1 0 0 1 1 1 0 1 0 1 1 1 0 0 1 0 1 0 1 1
    1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 1 0 0 1 0 1 0 1 0 0 1 0 1 1 1 1 1 1 0 1 0 1 1 1 0 0 1 0 1
    0 1 1 1 1 1 0 1 1 0 0 0 1 0 1 0 0 1 0 1 1 1 1 0 1 0 0 1 0 0 1 0 1 0 0 0 0 1 0 1 0 1 0 1 0 1 0 1 1 0 1 0 1 0 1 0 0 1 1

    View Slide

  118. @petewsmart

    View Slide

  119. Ambient Interfaces
    @petewsmart

    View Slide

  120. View Slide

  121. @petewsmart

    View Slide

  122. View Slide

  123. Ambient Interfaces
    @petewsmart

    View Slide

  124. How should these interfaces be designed?
    @petewsmart

    View Slide

  125. How should these interfaces be designed?
    @petewsmart

    View Slide

  126. @petewsmart

    View Slide

  127. View Slide

  128. "Technology is, in the broadest sense,
    mind or intelligence or purpose
    blending with nature."
    Paul Davies, SETI
    @petewsmart

    View Slide

  129. The Future of the Web is
    Invisible
    @petewsmart

    View Slide

  130. @petewsmart
    The next 8500 days
    on the Web

    View Slide

  131. Thanks for listening
    @petewsmart
    The Futue of the Web?
    and how to prepare for it now

    View Slide

  132. Designing the future?
    The Futue of the Web?
    and how to prepare for it now
    @petewsmart

    View Slide

  133. The distinction between
    digital and natural
    will become meaningless.
    @petewsmart

    View Slide

  134. Goodbye Web industry
    @petewsmart

    View Slide

  135. Envelopes

    View Slide

  136. View Slide