How Video Works?

Slides of a presentation I gave at Yipit office based on https://www.slideshare.net/leandro_moreira/how-video-codec-work/leandro_moreira/how-video-codec-work?trk=v-feed

Transcript

1. How Video Works?
 Flavio Ribeiro, 2017
2. Flavio Ribeiro
3. Flavio Ribeiro
4. Flavio Ribeiro { , } / flavioribeiro http://flavioribeiro.com
7. Leandro Moreira / leandromoreira
8. Leandro Moreira / leandromoreira
9. Leandro Moreira / leandromoreira
10. what is video?
11. video is a composition of images called frames
12. video is a composition of images called frames
13. what is a frame?
14. Composition of Pixels composition 
 of pixels
15. but, what
 is a pixel?
17. this is a black pixel!
18. this is a black pixel!
19. this is a black pixel! white pixel here
20. how pixels are represented?
21. how pixels are represented? BITS
22. how pixels are represented? 1 bit (1 or 0)
23. how pixels are represented? 1 bit (1 or 0) 2 bits (11, 10, 01 or 00)
24. how pixels are represented? 1 bit (1 or 0) 2 bits (11, 10, 01 or 00) 8 bits (you got that, right?)
25. colors
26. colors
28. pixels in displays TV CRT PC CRT LCD
29. pixels in displays TV CRT PC CRT LCD
30. let’s do math
31. grayscale image width height 4 x 4 x 8 bits = 128 bits = 16 Bytes
32. width height colored image
33. width height color colored image
34. colored image 3 x 4 x 4 x 8 bits = 384 bits = 48 Bytes
35. 3 x 1920 x 1080 x 8 bits = 49,766,400 bits ≈ 6.2 MB
36. do you remember that…
37. video is a composition of images called frames do you remember that…
38. our eyes can detect motion at 24 frames per second
41. 3 x 1920 x 1080 x 8 bits x 24 frames ≈ 149 MB
42. 3 x 1920 x 1080 x 8 bits x 24 frames x 60 minutes ≈ .5 TB
43. It would take… 04 days and 15 hours to download it in a 10 Mbps connection 11 hours to download it in a 100 Mbps connection
44. what can be done?
46. exploit our vision
47. exploit our vision reduce redundancy in space
48. exploit our vision reduce redundancy in space reduce redundancy
 over time
49. exploit our vision
51. the eye contains about 120M rod cells and 6M cone cells.
52. we’re better noticing traces than colors
53. we’re better noticing traces than colors
54. an alternative to RGB
55. an alternative to RGB
56. Y (luma) U (chroma blue) V (chroma red) an alternative to RGB
57. Y (luma) U (chroma blue) V (chroma red) an alternative to RGB
59. 12 bits per pixel 24 bits per pixel
60. reduce redundancy in space
61. lots of similarities
62. lots of similarities
65. repeat x times repeat y times
67. patterns / vectors
68. correlations in time
69. correlations in time
70. 00:22 00:23
71. 00:22 00:23
72. 00:22 00:23
73. 00:22 00:23
74. frame 0 frame 1 frame 2 frame 3 103 kb 103 kb 103 kb 103 kb
75. #qacodec FRAME DIFFERENCE 103 kb 103 kb
76. #qacodec FRAME DIFFERENCE COST 4 kb
77. frame 0 frame 1 diff + reference 4 kb 103 kb
78. exploit our vision reduce redundancy reduce redundancy
 over time we just described how a codec works
79. exploit our vision reduce redundancy reduce redundancy
 over time codec
80. exploit our vision reduce redundancy reduce redundancy
 over time is the short for COmpressor / DECompressor
81. beyond codecs
82. containers
84. this is a container
85. this is a container video here
86. this is a container video here
87. this is a container video here audio here
88. this is a container video here audio here
89. this is a container video here audio here stuff
90. MP4 H.264 MP3 Subtitles, metadata, etc
91. WebM VP8 Vorbis Subtitles, metadata, etc
92. bitrate
93. bitrate
94. bitrate: amount of bits used to represent a given media
95. bitrate: amount of bits used to represent a given media
96. bitrate: amount of bits used to represent a given media
97. bitrate: amount of bits used to represent a given media
98. deliver
 video on internet
99. progressive download
100. adaptive http streaming
103. recap
104. recap
106. video
107. video images (frames)
108. video images (frames) pixels
109. video images (frames) pixels bits
110. video images (frames) pixels colors bits
111. video images (frames) pixels colors RGB bits
112. video images (frames) pixels colors RGB 24 frames bits
113. video images (frames) pixels colors RGB 24 frames bits lots of information
114. video images (frames) pixels colors RGB 24 frames bits lots of information compression
115. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye
116. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy
117. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time
118. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time codec
119. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time codec codec != container
120. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time codec codec != container bitrate
121. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time codec codec != container bitrate progressive download
122. video images (frames) pixels colors RGB 24 frames bits lots of information compression exploit the eye reduce redundancy correlations in time codec codec != container bitrate progressive download adaptive bitrate
123. thanks! { , } / flavioribeiro http://flavioribeiro.com
124. thanks! { , } / flavioribeiro http://flavioribeiro.com