The document discusses the history and basics of USB technology. It provides details on USB connectors, transfer types (control, interrupt, isochronous), and descriptors used to communicate with USB devices. It then demonstrates how the WebUSB API can be used to create interactive demos connecting to Arduino boards, Android devices, smart home equipment, and building a public library system using RFID cards, a barcode scanner and receipt printer through the browser without additional drivers or software. WebUSB allows writing custom device drivers that work across browsers and operating systems for plug-and-play hardware interaction and developing interactive hardware prototypes more easily.

1. The
Universal
Serial
Web

2. <Me/>

3. I´ve Been Tinkering With Hardware Since 2011…

4. Universal
Hardware
Interface:
Usb

5. Usb Basics 💻

6. History
1994
Usb
Development
Started

7. History
1994
1995
Usb
Development
Started
Usb Became
Available To
The Public

8. History
1994
1995
1998
Usb
Development
Started
Usb Became
Available To
The Public
Apple Made
Usb Popular
With The
Imac G3

9. History
1994
1995
1998
2000
Usb
Development
Started
Usb Became
Available To
The Public
Apple Made
Usb Popular
With The
Imac G3
Usb 2.0 Was
Released, As
Well As The
1St Usb
Flash Drive

10. History
1994
1995
1998
2000
2008
Usb
Development
Started
Usb Became
Available To
The Public
Apple Made
Usb Popular
With The
Imac G3
Usb 2.0 Was
Released, As
Well As The
1St Usb
Flash Drive
Usb 3.0 Was
Released
(Super
Speed)

11. Connector
Layout

12. Connector
LayoutD- Vbus
GndD+
Vbus - Power 5V
Gnd - Ground
D+ - Data
D- - Data

13. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

14. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

15. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

16. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

17. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

18. The Usb Way™
OH, IS THAT SUPPORTED ON MY OS?
INSTALL A NATIVE APPLICATION
SEARCH THE INTERNET FOR A DRIVER
SCARY OS POPUP TURNS UP
CODE STICKS AROUND FOREVER
MALFUNCTION KILLS EXISTING SETUP

19. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

20. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

21. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

22. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

23. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

24. A Nicer Usb Way™
NOTIFICATION APPEARS
PLUG IN
BUY A DEVICE
CLICK ON IT
FUN!
OPENS WEBSITE

25. Web Usb 💖

26. Webusb
Facts
Only Available Via Https
* For Security Reasons, Like Done With All New
Platform Features *
No „Native Code“ Needed
* No Need To Install Any Drivers Or Other 3Rd Party
Software*
Real Plug & Play
* Plug In Device, Click Link, Use It*

27. Code, Now,
Please… 👾

28. Device Descriptor

29. Device Descriptor

30. Device Descriptor

31. Device Descriptor
Config Descriptor Config Descriptor

32. Device Descriptor
Config Descriptor
Interface Descriptor Interface Descriptor

33. Device Descriptor
Config Descriptor
Interface Descriptor
Endpoint Descriptor Endpoint Descriptor

34. Device Descriptor
Config Descriptor
Interface Descriptor
Endpoint Descriptor Endpoint Descriptor

35. ControlInterrupt Transfer Isochronous
Out In
* Interrupt transfers are typically non-periodic, small, device "initiated" communication That requirE A SpecIFIC latency *

36. ControlInterrupt Transfer Isochronous
Out In
* Interrupt transfers are typically non-periodic, small, device "initiated" communication That requirE A SpecIFIC latency *

37. ControlInterrupt Transfer Isochronous
Out In
* Interrupt transfers are typically non-periodic, small, device "initiated" communication That requirE A SpecIFIC latency *

38. ControlInterrupt Transfer Isochronous
Out In
* Interrupt transfers are typically non-periodic, small, device "initiated" communication That requirE A SpecIFIC latency *

39. Interrupt Control Transfer Isochronous
Out In
* Control transfers are especially nice for small configuration commands as they get bus priority and have a well defined structure *

40. Interrupt Control Transfer Isochronous
Out In
* Control transfers are especially nice for small configuration commands as they get bus priority and have a well defined structure *

41. Interrupt Isochronous TransferControl
Out In
* ISOCHRONOUS transfers are RARELY USED, Mostly for AUDIO AND VIDEO DEVICES that sent a persistent STREAM OF DATA *

42. Now Pray To
The Demo
Gods 🤞

43. Demos
Create An Interactive Arduino
Playground

46. Demo

47. Node
-> Browser

48. Node
-> Browser

49. Serialport
Communication

50. Which?

51. Who?

52. What?

53. What? Pt.2

54. Whom Again?

55. Node
-> Browser

56. Demos
Connect To An Android Device & Download
Some Data
Create An Interactive Arduino
Playground

57. Demo

59. Send Adb
Commands

61. Easy Adb

62. Security ⚠

63. 01. 02.
03.
04.
Security
03. No Cam/Microphone/Storage
04. Kill Switch
01. Only Via User Gesture
02.User Has To Grant Permission
🖱 📹
🖖 🆘

64. Demos
Connect To An Android Device & Download
Some Data
Create An Interactive Arduino
Playground
Control Smart Home Devices Using The
Browser As The Runtime

67. Demo

68. Enocean Code

69. Data
Polling

70. Demos
Connect To An Android Device & Download
Some Data
Create An Interactive Arduino
Playground
Control Smart Home Devices Using The
Browser As The Runtime
Create A Public Library Using:
Rfid Cards, A Barcode Scanner & A Receipt Printer

72. Demo

73. Printer Code

74. Hid ⌨

75. Hid Code

76. Hid Code Reality

77. That Worked
Well 😅

78. Chrome://Device-Log/

79. Chrome://Usb-Internals/

80. 😞
😞
😞
🤓

82. Take Aways 👜

83. Webusb Lets Us Write Our Own
Drivers For Devices

84. We Can Build Plug & Play
Systems:
Like A Checkout System For
Shops

85. It Makes It Easy To Start
Tinkering With Hardware
(Think Schools), No Hard Setup
Steps For Beginners

86. We Can Write Drivers That
Work In The Browser & In
Backend Systems

87. We´re Improving The Lives Of
The End-User

88. We Can Have Lots Of Fun 🍾
And Built Shitty Robots 🤖

89. Thank
You!
https://asciidisco.com / E-mail: public@asciidisco.com / Twitter: @asciidisco / Sebastian Golasch 2018