index.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
  1. <!doctype html>
  2. <html lang="it">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>The Fediverse</title>
  6. <meta name="description" content="A short description of Fediverse Galaxy for potential-users">
  7. <meta name="author" content="freebird">
  8. <meta name="apple-mobile-web-app-capable" content="yes">
  9. <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  10. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  11. <link rel="stylesheet" href="css/reveal.css">
  12. <link rel="stylesheet" href="css/theme/moon_freebird.css" id="theme">
  13. <link rel="stylesheet" href="plugin/title-footer/title-footer.css">
  14. <!-- Theme used for syntax highlighting of code -->
  15. <link rel="stylesheet" href="lib/css/zenburn.css">
  16. <!-- Printing and PDF exports -->
  17. <script>
  18. var link = document.createElement( 'link' );
  19. link.rel = 'stylesheet';
  20. link.type = 'text/css';
  21. link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
  22. document.getElementsByTagName( 'head' )[0].appendChild( link );
  23. </script>
  24. <!--[if lt IE 9]>
  25. <script src="lib/js/html5shiv.js"></script>
  26. <![endif]-->
  27. </head>
  28. <body>
  29. <div class="reveal">
  30. <!-- Any section element inside of this container is displayed as a slide -->
  31. <div class="slides">
  32. <!-- SLIDES BLOCK START -->
  33. <!--Slide intro con sc elta tipo transizione-->
  34. <section id="transitions">
  35. </br>
  36. </br>
  37. <img width="250" height="250" data-src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Fediverse_logo_proposal.svg/220px-Fediverse_logo_proposal.svg.png" alt="Fediverse proposal logo" style="background:none; border:none; box-shadow:none;">
  38. <h1></h1>
  39. </br>
  40. </br>
  41. </br>
  42. </br>
  43. <p>
  44. <xxsmall>choose transition mode:</xxsmall>
  45. <xxsmall>
  46. <a href="?transition=none#/transitions">None</a> //
  47. <a href="?transition=fade#/transitions">Fade</a> //
  48. <a href="?transition=slide#/transitions">Slide</a> //
  49. <a href="?transition=convex#/transitions">Convex</a> //
  50. <a href="?transition=concave#/transitions">Concave</a> //
  51. <a href="?transition=zoom#/transitions">Zoom</a>
  52. </xxsmall>
  53. </section>
  54. <!--Slide-->
  55. <section data-background-video="https://player.vimeo.com/external/295718433.sd.mp4?s=56ea364b6d851c728bb8b0276e4e2c3165b1efc6&profile_id=164" data-background-color="#000000" data-background-video-loop="true">
  56. <h2>Welcome To</h2>
  57. <h1>The Fediverse</h1>
  58. <!-- a video alternative for the welcome slide: https://player.vimeo.com/external/226635303.sd.mp4?s=7cd8567b0ab8593cf3249fbced6564876c206165&profile_id=164-->
  59. </section>
  60. <!--Slide-->
  61. <section>
  62. <h1>Il Fediverso</h1>
  63. <small><span style="color:red">Fediverso</span> (neologismo sincratico o portmanteau) da: <span style="color:red">Fed</span>erabile e Un<span style="color:red">iverso</span></small>
  64. <h3>Cosa, Come, Quando, ma soprattutto ... perchè</h3>
  65. <p>
  66. <img width="250" height="250" data-src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Fediverse_logo_proposal.svg/220px-Fediverse_logo_proposal.svg.png" style="background:none; border:none; box-shadow:none;">
  67. </section>
  68. <!--Slide VERT-BLOCK-1-START-->
  69. <section>
  70. <section>
  71. <h3>Cominciamo dal perchè</h3>
  72. <img data-src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/AE6Da1UkxEeKFp0G8wjn6cPofyr5uXtxIhAoONsB.png" style="background:none; border:none; box-shadow:none;">
  73. <aside class="notes">scandalo Cambridge Analytica facebook e trump, caso Mainstream Network e facebook referendum brexit, profilazione a scopo commerciale e di controllo sociale, notizia dell'enorme trasferimento di denaro di Google in paradiso fiscale</aside>
  74. </section>
  75. <section id="fragments">
  76. <h2>Prima di tutto ...</h2>
  77. <h2>una scelta politica</h2>
  78. </section>
  79. <!--Slide-->
  80. <!--Table START-->
  81. <style>
  82. table, th, td {
  83. border: 1px solid black;
  84. border-collapse: collapse;
  85. }
  86. th, td {
  87. padding: 5px;
  88. text-align: center;
  89. }
  90. </style>
  91. <section>
  92. <table style="width:100%">
  93. <tr>
  94. <th>...</th>
  95. <th><xsmall><img src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/UPrQVMoU5coy1SuyNOTB2i1h3tih74GM4Fz5DBBZ.png" style="background:none; border:none; box-shadow:none;"style="width:5%"></xsmall></th>
  96. <th><xsmall><img src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/77OSRl9N8NSDHmNfCVm2hKtzK6ohCCQVJwsKNfIO.png" style="background:none; border:none; box-shadow:none;"style="width:5%"></xsmall></th>
  97. </tr>
  98. <tr>
  99. <td><small>Raccolta dati Utenti</small></td>
  100. <td><small>spesso vengono richieste molte informazioni (nome, cognome, telefono, altra mail, ecc...)</small></td>
  101. <td><small>vengono richieste solo le informazioni minime necessarie (indirizzo mail ed una password)</small></td>
  102. </tr>
  103. <tr>
  104. <td><small>Privacy</small></td>
  105. <td><small>normalmente tracciano gli ip di tutti i dispositivi da cui ci si connette</small></td>
  106. <td><small>molto spesso questi servizi non tracciano gli IP relativi alle connessioni</small></td>
  107. </tr>
  108. <tr>
  109. <td><small> </small></td>
  110. <td><small>il livello di privacy che avremo è limitato da chi gestisce il servizio</small></td>
  111. <td><small>siamo noi a scegliere il livello di privacy che preferiamo</small></td>
  112. </tr>
  113. <tr>
  114. <td><small>Profilazione</small></td>
  115. <td><small>spesso attuata per scopi commerciali ed a volte anche per controllo sociale</small></td>
  116. <td><small>i social open source nascono principalmente per combattere questi meccanismi</small><xsmall></td>
  117. </tr>
  118. </table>
  119. <br>
  120. </section>
  121. <!--Slide-->
  122. <section>
  123. <h3>e ancora...</h3>
  124. <table style="width:100%">
  125. <tr>
  126. <th>...</th>
  127. <th><xsmall><img src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/UPrQVMoU5coy1SuyNOTB2i1h3tih74GM4Fz5DBBZ.png" style="background:none; border:none; box-shadow:none;"style="width:5%"></xsmall></th>
  128. <th><xsmall><img src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/77OSRl9N8NSDHmNfCVm2hKtzK6ohCCQVJwsKNfIO.png" style="background:none; border:none; box-shadow:none;"style="width:5%"></xsmall></th>
  129. </tr>
  130. <tr>
  131. <td><small>Gestione</small></td>
  132. <td><small>gestione demandata a colossi tecnologici e finanziari</small></td>
  133. <td><small>possibilità di partecipazione diretta alla gestione del nodo</small></td>
  134. </tr>
  135. <tr>
  136. <td><small>Filosofia</small></td>
  137. <td><small>utilizzo di codice "chiuso" di cui non conosciamo tutte le funzioni</small></td>
  138. <td><small>utilizzo di codice "aperto" <a href="https://github.com/tootsuite/mastodon" target="_blank">open source,</a> controllabile e modificabile</small></td>
  139. </tr>
  140. <tr>
  141. <td><small>Controllo</small></td>
  142. <td><small>lasciare il controllo in mano alle multinazionali</small></td>
  143. <td><small>riprendersi il controllo di quste tecnologie</small></td>
  144. </tr>
  145. <tr>
  146. <td><small>In & Out</small></td>
  147. <td><small>se crei un account, tu (forse) ne puoi uscire ma i tui dati restano</small></td>
  148. <td><small>quando decidi di andartene puoi cancellare tutti i tuoi dati</small></td>
  149. </tr>
  150. </table>
  151. </section>
  152. </section>
  153. <!--Table END-->
  154. <!--Slide-->
  155. <!--Slide VERT-BLOCK-1-STOP-->
  156. <!--Slide VERT-BLOCK-2-START-->
  157. <section>
  158. <section>
  159. <h3>passiamo al cosa</h3>
  160. <p>
  161. <img data-src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/VX1MO3EzfIdFbXBifPhEGG1Y5zyCbaN3hRnD3Scx.png" style="background:none; border:none; box-shadow:none;">
  162. </section>
  163. <!--Slide-->
  164. <section id="fragments">
  165. <h3>intanto ... dimentichiamo i social monolitici</h3>
  166. <xxsmall>tipo: facebook // twitter // whatsapp // messenger // skype // youtube // instagram </xxsmall>
  167. <p class="fragment fade-left">1 - non ci si iscrive ad un social ma ad un nodo</p>
  168. <p class="fragment fade-left">2 - le decisioni vengono prese a livello di nodo in accordo con gli utenti</p>
  169. <p class="fragment fade-right">3 - si può scegliere la piattaforma di accesso preferita</p>
  170. <p class="fragment fade-left">4 - si può entrare in contatto con tutto il fediverso (altri utenti, altri nodi, altre piattaforme)</p>
  171. <p class="fragment fade-right"><span style="color:red">... insomma, si fa un po' come "#" ci pare</span> ;-)</p>
  172. </section>
  173. <!--Slide-->
  174. <section>
  175. <img data-src=https://media.giphy.com/media/l0IypeKl9NJhPFMrK/giphy.gif> <img data-src=https://media.giphy.com/media/xUPGcng62PSdZOe0vK/giphy.gif>
  176. <p>
  177. <h3>no, dai! non fate così</h3>
  178. <h4>vediamo di capire un po' meglio come funziona</h4>
  179. </section>
  180. <!--Slide-->
  181. <section><img data-src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/p2tyGTxty6d1yAyiwokQhKZ5h2sUlwGWtPxn6AmG.png" style="background:none; border:none; box-shadow:none;" alt="Fediverse Rel. Sketch"></section>
  182. <!--Slide-->
  183. <section><img data-src="https://pixelfed.social/storage/m/db270e597dad64f8e1f854da225e8f19a785fc75/7e98f96f186078c2c32dc0de5d98b201fb63802c/fjVWJxsFjZ23trDSLUIXhFwXkWk4FSGrAgSL0B9O.png" style="background:none; border:none; box-shadow:none;" alt="Fediverse Rel. Sketch"></section>
  184. <!--Slide-->
  185. <section>
  186. <img width="100" height="100" data-src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Fediverse_logo_proposal.svg/220px-Fediverse_logo_proposal.svg.png" alt="Fediverse proposal logo" style="background:none; border:none; box-shadow:none;"><br>
  187. una rappresentazione grafica interattiva <a href="https://kumu.io/wakest/fediverse#known-network" target="_blank">kumo.io</a>
  188. <br>
  189. i progetti attuali <a href="https://the-federation.info" target="_blank">the-federation.info</a>
  190. <br>
  191. le alternative attuali <a href="https://switching.social/" target="_blank">switching.social</a>
  192. </section>
  193. </section>
  194. <!--Slide VERT-BLOCK-2-STOP-->
  195. <section>
  196. <h1>ma ... come e ... quando?</h1>
  197. </section>
  198. <!--Slide-->
  199. <section>
  200. <h2>come, ve lo spieghiamo tra un minuto</h2>
  201. </section>
  202. <!--Slide-->
  203. <section>
  204. <section>
  205. <h2>quando?</h2>
  206. <img data-src=https://media.giphy.com/media/ypO01RIuQ3tHW/giphy.gif> <img data-src=https://media.giphy.com/media/CpgNjk2E54p7W/giphy.gif> <img data-src=https://media.giphy.com/media/wCiFka9RsSW9W/giphy.gif>
  207. <aside class="notes">Shia LaBeouf</aside>
  208. <!--Slide-->
  209. </section>
  210. <!--Slide-->
  211. <section>
  212. <h2>make the <span style="color:red">right</span> thing!</h2>
  213. <img data-src=https://media.giphy.com/media/BcJnd46gtsmOs/giphy.gif width="150%">
  214. </section>
  215. <!--Slide-->
  216. <section>
  217. <h1>join the social-media
  218. <p>
  219. <span style="color:red">Revolution</span></h1>
  220. </section>
  221. </section>
  222. <!--Slide-->
  223. <section>
  224. <h3>Pensierino della sera ...</h3>
  225. <p><a href="https://www.reddit.com/r/IAmA/comments/36ru89/just_days_left_to_kill_mass_surveillance_under/crglgh2/" rel="external">Edward Snowden</a>:</p>
  226. <blockquote>
  227. "Arguing that you don't care about the right to privacy because you have nothing to hide is no different than saying you don't care about free speech because you have nothing to say."
  228. </blockquote>
  229. <p><small>trad: <i><span style="color:orange">"Affermare che non si è interessati al diritto alla privacy perché non si ha nulla da nascondere è come dire che non si è interessati alla libertà di parola perché non si ha nulla da dire."</span></i></small></p>
  230. <p><xsmall>clicca <a href="#">qui</a> per tornare all'inizio</xsmall></p>
  231. <xsmall>created with reveal.js - <a href="https://revealjs.com">https://revealjs.com</a> - thanks to hakimel</xsmall>
  232. </section>
  233. <!-- SLIDES BLOCK END -->
  234. </div>
  235. </div>
  236. <script src="lib/js/head.min.js"></script>
  237. <script src="js/reveal.js"></script>
  238. <script>
  239. // More info https://github.com/hakimel/reveal.js#configuration
  240. Reveal.initialize({
  241. controls: true,
  242. progress: true,
  243. history: true,
  244. center: true,
  245. transition: 'slide', // none/fade/slide/convex/concave/zoom
  246. // More info https://github.com/hakimel/reveal.js#dependencies
  247. dependencies: [
  248. { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
  249. { src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
  250. { src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
  251. { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
  252. { src: 'plugin/search/search.js', async: true },
  253. { src: 'plugin/zoom-js/zoom.js', async: true },
  254. { src: 'plugin/notes/notes.js', async: true },
  255. { src: 'plugin/title-footer/title-footer.js', async: true, callback: function() { title_footer.initialize('Welcome to the Fediverse'); } }
  256. ]
  257. });
  258. </script>
  259. </body>
  260. </html>