A place to cache linked articles (think custom and personal wayback machine)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 35KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang=fr>
  4. <!-- Has to be within the first 1024 bytes, hence before the <title>
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset=utf-8>
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Tout un écosystème émerge autour de la Fab City à Barcelone (archive) — David Larlet</title>
  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
  17. <link rel="manifest" href="/manifest.json">
  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">
  20. <meta name="apple-mobile-web-app-title" content="David Larlet">
  21. <meta name="application-name" content="David Larlet">
  22. <meta name="msapplication-TileColor" content="#da532c">
  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- That good ol' feed, subscribe :p. -->
  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">
  27. <meta name="robots" content="noindex, nofollow">
  28. <meta content="origin-when-cross-origin" name="referrer">
  29. <!-- Canonical URL for SEO purposes -->
  30. <link rel="canonical" href="http://www.makery.info/2015/03/13/tomas-diez-tout-un-ecosysteme-emerge-autour-de-la-fab-city-a-barcelone/">
  31. <style>
  32. /* http://meyerweb.com/eric/tools/css/reset/ */
  33. html, body, div, span,
  34. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  35. a, abbr, address, big, cite, code,
  36. del, dfn, em, img, ins,
  37. small, strike, strong, tt, var,
  38. dl, dt, dd, ol, ul, li,
  39. fieldset, form, label, legend,
  40. table, caption, tbody, tfoot, thead, tr, th, td,
  41. article, aside, canvas, details, embed,
  42. figure, figcaption, footer, header, hgroup,
  43. menu, nav, output, ruby, section, summary,
  44. time, mark, audio, video {
  45. margin: 0;
  46. padding: 0;
  47. border: 0;
  48. font-size: 100%;
  49. font: inherit;
  50. vertical-align: baseline;
  51. }
  52. /* HTML5 display-role reset for older browsers */
  53. article, aside, details, figcaption, figure,
  54. footer, header, hgroup, menu, nav, section { display: block; }
  55. body { line-height: 1; }
  56. blockquote, q { quotes: none; }
  57. blockquote:before, blockquote:after,
  58. q:before, q:after {
  59. content: '';
  60. content: none;
  61. }
  62. table {
  63. border-collapse: collapse;
  64. border-spacing: 0;
  65. }
  66. /* http://practicaltypography.com/equity.html */
  67. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  68. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  69. @font-face {
  70. font-family: 'EquityTextB';
  71. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  72. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  73. font-weight: 300;
  74. font-style: normal;
  75. font-display: swap;
  76. }
  77. @font-face {
  78. font-family: 'EquityTextB';
  79. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  80. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  81. font-weight: 300;
  82. font-style: italic;
  83. font-display: swap;
  84. }
  85. @font-face {
  86. font-family: 'EquityTextB';
  87. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  88. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  89. font-weight: 700;
  90. font-style: normal;
  91. font-display: swap;
  92. }
  93. @font-face {
  94. font-family: 'ConcourseT3';
  95. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  96. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  97. font-weight: 300;
  98. font-style: normal;
  99. font-display: swap;
  100. }
  101. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  102. body {
  103. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  104. font-family: "EquityTextB", Palatino, serif;
  105. background-color: #f0f0ea;
  106. color: #07486c;
  107. font-kerning: normal;
  108. -moz-osx-font-smoothing: grayscale;
  109. -webkit-font-smoothing: subpixel-antialiased;
  110. text-rendering: optimizeLegibility;
  111. font-variant-ligatures: common-ligatures contextual;
  112. font-feature-settings: "kern", "liga", "clig", "calt";
  113. }
  114. pre, code, kbd, samp, var, tt {
  115. font-family: 'TriplicateT4c', monospace;
  116. }
  117. em {
  118. font-style: italic;
  119. color: #323a45;
  120. }
  121. strong {
  122. font-weight: bold;
  123. color: black;
  124. }
  125. nav {
  126. background-color: #323a45;
  127. color: #f0f0ea;
  128. display: flex;
  129. justify-content: space-around;
  130. padding: 1rem .5rem;
  131. }
  132. nav:last-child {
  133. border-bottom: 1vh solid #2d7474;
  134. }
  135. nav a {
  136. color: #f0f0ea;
  137. }
  138. nav abbr {
  139. border-bottom: 1px dotted white;
  140. }
  141. h1 {
  142. border-top: 1vh solid #2d7474;
  143. border-bottom: .2vh dotted #2d7474;
  144. background-color: #e3e1e1;
  145. color: #323a45;
  146. text-align: center;
  147. padding: 5rem 0 4rem 0;
  148. width: 100%;
  149. font-family: 'ConcourseT3';
  150. display: flex;
  151. flex-direction: column;
  152. }
  153. h1.single {
  154. padding-bottom: 10rem;
  155. }
  156. h1 span {
  157. position: absolute;
  158. top: 1vh;
  159. left: 20%;
  160. line-height: 0;
  161. }
  162. h1 span a {
  163. line-height: 1.7;
  164. padding: 1rem 1.2rem .6rem 1.2rem;
  165. border-radius: 0 0 6% 6%;
  166. background: #2d7474;
  167. font-size: 1.3rem;
  168. color: white;
  169. text-decoration: none;
  170. }
  171. h2 {
  172. margin: 4rem 0 1rem;
  173. border-top: .2vh solid #2d7474;
  174. padding-top: 1vh;
  175. }
  176. h3 {
  177. text-align: center;
  178. margin: 3rem 0 .75em;
  179. }
  180. hr {
  181. height: .4rem;
  182. width: .4rem;
  183. border-radius: .4rem;
  184. background: #07486c;
  185. margin: 2.5rem auto;
  186. }
  187. time {
  188. display: bloc;
  189. margin-left: 0 !important;
  190. }
  191. ul, ol {
  192. margin: 2rem;
  193. }
  194. ul {
  195. list-style-type: square;
  196. }
  197. a {
  198. text-decoration-skip-ink: auto;
  199. text-decoration-thickness: 0.05em;
  200. text-underline-offset: 0.09em;
  201. }
  202. article {
  203. max-width: 50rem;
  204. display: flex;
  205. flex-direction: column;
  206. margin: 2rem auto;
  207. }
  208. article.single {
  209. border-top: .2vh dotted #2d7474;
  210. margin: -6rem auto 1rem auto;
  211. background: #f0f0ea;
  212. padding: 2rem;
  213. }
  214. article p:last-child {
  215. margin-bottom: 1rem;
  216. }
  217. p {
  218. padding: 0 .5rem;
  219. margin-left: 3rem;
  220. }
  221. p + p,
  222. figure + p {
  223. margin-top: 2rem;
  224. }
  225. blockquote {
  226. background-color: #e3e1e1;
  227. border-left: .5vw solid #2d7474;
  228. display: flex;
  229. flex-direction: column;
  230. align-items: center;
  231. padding: 1rem;
  232. margin: 1.5rem;
  233. }
  234. blockquote cite {
  235. font-style: italic;
  236. }
  237. blockquote p {
  238. margin-left: 0;
  239. }
  240. figure {
  241. border-top: .2vh solid #2d7474;
  242. background-color: #e3e1e1;
  243. text-align: center;
  244. padding: 1.5rem 0;
  245. margin: 1rem 0 0;
  246. font-size: 1.5rem;
  247. width: 100%;
  248. }
  249. figure img {
  250. max-width: 250px;
  251. max-height: 250px;
  252. border: .5vw solid #323a45;
  253. padding: 1px;
  254. }
  255. figcaption {
  256. padding: 1rem;
  257. line-height: 1.4;
  258. }
  259. aside {
  260. display: flex;
  261. flex-direction: column;
  262. background-color: #e3e1e1;
  263. padding: 1rem 0;
  264. border-bottom: .2vh solid #07486c;
  265. }
  266. aside p {
  267. max-width: 50rem;
  268. margin: 0 auto;
  269. }
  270. /* https://fvsch.com/code/css-locks/ */
  271. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  272. font-size: 1rem;
  273. line-height: calc( 1.5em + 0.2 * 1rem );
  274. }
  275. h1 {
  276. font-size: 1.9rem;
  277. line-height: calc( 1.2em + 0.2 * 1rem );
  278. }
  279. h2 {
  280. font-size: 1.6rem;
  281. line-height: calc( 1.3em + 0.2 * 1rem );
  282. }
  283. h3 {
  284. font-size: 1.35rem;
  285. line-height: calc( 1.4em + 0.2 * 1rem );
  286. }
  287. @media (min-width: 20em) {
  288. /* The (100vw - 20rem) / (50 - 20) part
  289. resolves to 0-1rem, depending on the
  290. viewport width (between 20em and 50em). */
  291. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  292. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  293. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  294. margin-left: 0;
  295. }
  296. h1 {
  297. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  298. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  299. }
  300. h2 {
  301. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  302. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  303. }
  304. h3 {
  305. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  306. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  307. }
  308. }
  309. @media (min-width: 50em) {
  310. /* The right part of the addition *must* be a
  311. rem value. In this example we *could* change
  312. the whole declaration to font-size:2.5rem,
  313. but if our baseline value was not expressed
  314. in rem we would have to use calc. */
  315. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  316. font-size: calc( 1rem + .6 * 1rem );
  317. line-height: 1.5em;
  318. }
  319. p, li, pre, details {
  320. margin-left: 3rem;
  321. }
  322. h1 {
  323. font-size: calc( 1.9rem + 1.5 * 1rem );
  324. line-height: 1.2em;
  325. }
  326. h2 {
  327. font-size: calc( 1.5rem + 1.5 * 1rem );
  328. line-height: 1.3em;
  329. }
  330. h3 {
  331. font-size: calc( 1.35rem + 1.5 * 1rem );
  332. line-height: 1.4em;
  333. }
  334. figure img {
  335. max-width: 500px;
  336. max-height: 500px;
  337. }
  338. }
  339. figure.unsquared {
  340. margin-bottom: 1.5rem;
  341. }
  342. figure.unsquared img {
  343. height: inherit;
  344. }
  345. @media print {
  346. body { font-size: 100%; }
  347. a:after { content: " (" attr(href) ")"; }
  348. a, a:link, a:visited, a:after {
  349. text-decoration: underline;
  350. text-shadow: none !important;
  351. background-image: none !important;
  352. background: white;
  353. color: black;
  354. }
  355. abbr[title] { border-bottom: 0; }
  356. abbr[title]:after { content: " (" attr(title) ")"; }
  357. img { page-break-inside: avoid; }
  358. @page { margin: 2cm .5cm; }
  359. h1, h2, h3 { page-break-after: avoid; }
  360. p3 { orphans: 3; widows: 3; }
  361. img {
  362. max-width: 250px !important;
  363. max-height: 250px !important;
  364. }
  365. nav, aside { display: none; }
  366. }
  367. ul.with_columns {
  368. column-count: 1;
  369. }
  370. @media (min-width: 20em) {
  371. ul.with_columns {
  372. column-count: 2;
  373. }
  374. }
  375. @media (min-width: 50em) {
  376. ul.with_columns {
  377. column-count: 3;
  378. }
  379. }
  380. ul.with_two_columns {
  381. column-count: 1;
  382. }
  383. @media (min-width: 20em) {
  384. ul.with_two_columns {
  385. column-count: 1;
  386. }
  387. }
  388. @media (min-width: 50em) {
  389. ul.with_two_columns {
  390. column-count: 2;
  391. }
  392. }
  393. .gallery {
  394. display: flex;
  395. flex-wrap: wrap;
  396. justify-content: space-around;
  397. }
  398. .gallery figure img {
  399. margin-left: 1rem;
  400. margin-right: 1rem;
  401. }
  402. .gallery figure figcaption {
  403. font-family: 'ConcourseT3'
  404. }
  405. footer {
  406. font-family: 'ConcourseT3';
  407. display: flex;
  408. flex-direction: column;
  409. border-top: 3px solid white;
  410. padding: 4rem 0;
  411. background-color: #07486c;
  412. color: white;
  413. }
  414. footer > * {
  415. max-width: 50rem;
  416. margin: 0 auto;
  417. }
  418. footer a {
  419. color: #f1c40f;
  420. }
  421. footer .avatar {
  422. width: 200px;
  423. height: 200px;
  424. border-radius: 50%;
  425. float: left;
  426. -webkit-shape-outside: circle();
  427. shape-outside: circle();
  428. margin-right: 2rem;
  429. padding: 2px 5px 5px 2px;
  430. background: white;
  431. border-left: 1px solid #f1c40f;
  432. border-top: 1px solid #f1c40f;
  433. border-right: 5px solid #f1c40f;
  434. border-bottom: 5px solid #f1c40f;
  435. }
  436. </style>
  437. <h1>
  438. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  439. Tout un écosystème émerge autour de la Fab City à Barcelone (archive)
  440. <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
  441. </h1>
  442. <section>
  443. <article>
  444. <h3><a href="http://www.makery.info/2015/03/13/tomas-diez-tout-un-ecosysteme-emerge-autour-de-la-fab-city-a-barcelone/">Source originale du contenu</a></h3>
  445. <header>
  446. <p>
  447. Publié le 13 mars 2015 par <strong><a href="http://www.makery.info/author/carine/"><span itemprop="author">Carine Claude</span></a></strong>
  448.  <a target="_blank" href="http://makery.info/?p=3668&amp;lang=en">(english)</a> </p>
  449. </header>
  450. <p class="chapo">Le concept de Fab City a son héraut. Tomás Diez, fondateur du Fablab Barcelona et organisateur de la FAB10, la dernière grande réunion internationale des labs en juillet 2014, n’en démord pas : «Quelque chose d’unique est en train de se cuisiner à Barcelone.»</p>
  451. <figure id="post-3736 media-3736" class="align-none"><img src="http://www.makery.info/wp-content/uploads/2015/03/Tomas-Diez-portrait1.jpg.pagespeed.ce.ek4IBxZSB_.jpg" alt=""/><figcaption>Tomas Diez à Barcelone en juillet 2014 lors de la FAB10 © Quentin Chevrier</figcaption></figure>
  452. <p>Tomás Diez, fondateur du <a href="http://www.fablabbcn.org/" target="_blank">Fablab Barcelona</a> et organisateur de la <a title="(Français) FAB10 : « Les fablabs ont un problème d’identité »" href="http://www.makery.info/2014/07/05/fab10-les-fablabs-ont-un-probleme-didentite/" target="_blank">FAB10</a>, la réunion des fablabs internationaux accueillie par la capitale catalane en juillet 2014, porte partout où il passe<a href="http://www.makery.info/2014/06/30/fab10-barcelone-capitale-des-fablabs/" target="_blank"> la bonne parole des Fab Cities</a>, concept conjuguant l’avenir des villes au mode DiY. En 2012 déjà, cet urbaniste rêvait d’implanter un fablab dans chaque quartier de Barcelone, idée plébiscitée par la municipalité et <a href="http://www.makery.info/2015/02/19/vers-une-fabcity-a-sao-paulo/" target="_blank">destinée à essaimer dans toutes les métropoles</a>. Fablabs privés et publics — les <a href="http://ateneusdefabricacio.barcelona.cat/en/fab-ateneus/" target="_blank">Ateneus de Fabricació</a> — cimentent l’ambition numérique de la ville, servant d’ateliers de proximité pour répondre aux besoins de fabrication digitale des habitants. Tomás Diez ne doute pas que la Fab City est une réalité économique au service du progrès social. Nous l’avons rencontré à l’occasion d’un passage éclair à Paris.</p>
  453. <p><strong>Quatre ans après son lancement, où en est le concept de Fab City ?</strong></p>
  454. <p>L’idée de bâtir une <a href="https://www.fab10.org/en/symposium" target="_blank">Fab City</a> a été lancée pendant <a href="http://cba.mit.edu/events/11.08.FAB7/" target="_blank">la Fab7 à Lima</a> en 2011. A cette époque, le gouvernement de Barcelone venait d’être élu et une partie de l’équipe nous avait suivis à Lima, dont <a href="https://www.youtube.com/watch?v=cAmn9gQhMVI" target="_blank">Toni Vives</a>, le député-maire de Barcelone. Avec eux, nous avons présenté le concept de la Fab City, c’est-à-dire une ville où les citoyens pourraient avoir accès à un nouvel ensemble d’infrastructures, dont des fablabs publics en lien avec des initiatives privées. Nous avions imaginé qu’il y aurait un fablab pour chacun des 10 districts de Barcelone. Même si certains ont pensé que nous étions fous — nous avions juste présenté une carte avec des points de localisation, rien d’autre —, la vérité est qu’aujourd’hui, quatre ou cinq fablabs publics et privés sont déjà opérationnels, d’autres sont d’ores et déjà en projet.</p>
  455. <p><strong>Pourquoi Barcelone mise-t-elle sur la Fab City ? Et que sont les fablab publics ?</strong></p>
  456. <p>Barcelone veut devenir la capitale du prototypage : c’est même une initiative officielle lancée par le conseil municipal la semaine dernière. L’écosystème qui est en train de se construire vient à la fois d’initiatives privées et publiques autour de l’utilisation de la fabrication numérique dans différents secteurs. C’est pourquoi le conseil municipal de Barcelone a soutenu la création des <a href="http://ateneusdefabricacio.barcelona.cat/en/fab-ateneus/" target="_blank">Ateneus de Fabricació</a>, des fablabs de service public qui ont leur place dans la stratégie politique des <a href="http://www.smartcityexpo.com/en/barcelona#" target="_blank">Smart Cities</a>. Aujourd’hui, disons qu’il y a les vrais fablabs comme le nôtre, des makerspaces et des fabcafés, mais aussi des labs de grosses entreprises comme HP, dont <a href="http://www.catalannewsagency.com/business/item/hp-to-set-up-its-world-centre-for-3d-printing-in-its-greater-barcelona-offices" target="_blank">la division Impression 3D a son siège mondial</a> à Barcelone.</p>
  457. <p><strong>Quand vous parlez d’initiatives privées, vous incluez donc les fablabs d’entreprises, pas uniquement les fablabs indépendants ?</strong></p>
  458. <p>Absolument. Les grandes entreprises aussi bien que les petites start-ups. Par exemple, une ou deux boutiques vendent des imprimantes 3D mais proposent aussi des services en libre accès où vous pouvez scanner et imprimer vos fichiers. Dans une ville touristique comme Barcelone, ça fait sens… Il y a donc tout un écosystème qui émerge autour du projet de la Fab City. C’est pourquoi nous sommes censés recevoir un soutien important de la part du gouvernement.</p>
  459. <p><strong>Pourquoi censés ? Le soutien attendu n’est pas venu ?</strong></p>
  460. <p>C’est assez bizarre en fait. Il est difficile de faire comprendre aux pouvoirs publics que nous ne voulons pas bureaucratiser les fablabs. Il ne s’agit pas d’intégrer les fablabs dans des structures gouvernementales, mais plutôt de les hacker. La ville de Barcelone fait ceci dit beaucoup d’efforts, entre autres avec le <a href="http://studiesabroad.com/programs/country/spain/city/barcelona/duration/27/program/436" target="_blank">STEM</a> (Science, Technology, Engineering and Maths), un concept d’enseignement en classe basé sur les nouvelles technologies (apprendre en faisant) dans le secondaire. Imaginez toutes ces initiatives venant du public, du privé, des entreprises, de l’éducation… Quelque chose d’unique est en train de se cuisiner à Barcelone.</p>
  461. <p><strong>Pour filer la métaphore culinaire, ne pensez-vous pas qu’une cuisine suppose un chef ? Que pouvez-vous dire sur la manière dont se coordonnent ces initiatives ?</strong></p>
  462. <p>C’est la partie la plus difficile. Conceptuellement, depuis <a href="https://www.fab10.org/en/home" target="_blank">FAB10 Barcelone</a>, disons que nous mettons au point la recette. Mais en pratique, la gouvernance est compliquée. Car chacun a sa propre interprétation des fablabs et les approches sont très diverses quant à l’usage de la fabrication numérique. Ce que nous pouvons faire, par exemple, c’est dire quelles initiatives en train de mijoter sont des fablabs et lesquelles n’en sont pas. Nous pouvons le décider à 100 %. Si une interprétation nous semble trop éloignée ou bizarre, on dira : « Non, ce n’est pas un fablab. »</p>
  463. <p><a href="http://www.fablabbcn.org/" target="_blank">Le fablab BCN </a>(pour Barcelone, ndrl) fait de la coordination avec la <a href="http://www.fabacademy.org/" target="_blank">Fab Academy</a> et travaille au développement de la plate-forme <a href="https://www.fablabs.io/" target="_blank">fablab.io</a>. Il ne s’agit pas de contrôler, mais de faire de la curation autour des valeurs et de l’essence des fablabs.</p>
  464. <figure id="post-3739 media-3739" class="align-none"><img src="http://www.makery.info/wp-content/uploads/2015/03/FabCity-Barcelona-projet-2014.jpg.pagespeed.ce.o3we0FVqV7.jpg" alt=""/><figcaption>A moyen terme, la Fab City de Barcelone s’appuiera sur un réseau de 10 fablabs (capture d’écran). © DR</figcaption></figure>
  465. <p><strong>Quand vous parlez d’interprétation, quelle grille utilisez-vous pour déterminer si une initiative peut être estampillée fablab ? Vous basez-vous seulement sur la <a href="http://www.fabfoundation.org/fab-labs/the-fab-charter/" target="_blank">charte de la Fabfoundation</a> ?</strong></p>
  466. <p>C’est un mélange. Quand vous montez un fablab, vous adhérez à la charte et à ses principes, vous avez une liste d’équipements et de matériaux qui sont comparables et qui donnent de la cohérence au réseau. Vous avez des événements auxquels vous pouvez participer comme les Fabconferences, celle de <a href="http://www.fab11.org/" target="_blank">Boston cette année</a>, puis celle de Shenzhen en Chine celle d’après.</p>
  467. <p>Je ne suis pas mandaté pour le dire ou le faire, mais à mon avis, chaque fablab qui ouvre a besoin d’être certifié et de faire partie de la <a href="http://www.fabfoundation.org/" target="_blank">Fabfoundation</a>. Pour éviter que Toyota achète des machines et décrète « nous sommes un fablab ». Les questions centrales sont, d’une part, la connaissance et l’utilisation des machines, et d’autre part, la connexion entre vous et les réseaux. Il s’agit de valeurs qui garantissent qu’un fablab ne se monte pas pour satisfaire un intérêt trop spécifique ou uniquement personnel, mais pour qu’il puisse profiter à l’ensemble de la communauté et du réseau.</p>
  468. <p><strong>En France, de nombreux fablabs ont pris une orientation très entrepreneuriale. D’autres ne sont pas forcément ouverts au grand public, en particulier ceux des groupes technico-industriels. Pour vous, un fablab ouvert à un petit nombre est-il encore un fablab ?</strong></p>
  469. <p>Pour être clair, accès au public et accès ouvert ne signifient pas forcément accès gratuits. Des personnes investissent pour acheter des machines, payer des loyers, des salaires, elles ont forcément besoin de générer des revenus. Si c’est d’un fablab public dont il s’agit, comme les Fabs Ateneus de Barcelone, il est possible de ne pas faire payer pour l’accès aux machines, achetées avec les impôts du contribuable, mais dans ce cas, vous faites payer les consommables, par exemple. Certains, comme Haakon (ndlr : <a href="http://www.dailymotion.com/video/xefgas_haakon-karlsen-jr-fab-labs-network_tech" target="_blank">Haakon Karlsen Jr</a>, figure « historique » du <a href="http://www.fablab.no/" target="_blank">FabLab MIT Norway</a>), militent pour le tout-gratuit. Alors bien sûr, en Norvège, vous avez un des PIB les plus élevés au monde. Et l’argent y est littéralement pompé du sous-sol. Là-bas, il y a peut-être moins de contraintes financières pour s’équiper et acheter des machines. Mais certaines initiatives privées, souscrivant à toutes les valeurs des fablabs, disent simplement : « J’ai besoin d’argent pour pouvoir survivre. » Cela devrait être compatible avec des initiatives entrepreneuriales.</p>
  470. <p><strong>D’où la question récurrente : quel est le meilleur<em> </em>modèle économique pour pérenniser un fablab ?</strong></p>
  471. <p>La réponse dépend pour beaucoup du contexte dans lequel est implanté le fablab. Les fablabs sont en orbite autour de trois valeurs principales illustrées par leur logo : le vert, le bleu et le rouge. Le vert est pour le modèle commercial et l’économie, le bleu, pour l’impact social et la durabilité et enfin le rouge pour la recherche et l’éducation. Les trois axes peuvent générer de l’argent, selon des voies différentes. Un fablab en tant que tel n’est pas une fin en soi.</p>
  472. <blockquote>
  473. <p>«Les fabalabs ne doivent pas être les nouvelles cathédrales de la technologie.» Tomas Diez</p></blockquote>
  474. <p>Autour d’eux, ils doivent générer des solutions, des projets impactants et des programmes éducatifs qui aident à les pérenniser. Le but ultime n’est pas la réussite des fablabs, mais la réussite des initiatives qu’ils propulsent. Sinon, ce serait ridicule. Je ne suis pas d’accord pour édifier une nouvelle religion. Je pense que le succès des fablabs sera atteint le jour où ils disparaîtront, car tout le monde aura eu accès à la fabrication.</p>
  475. <p>Aujourd’hui, une grande part de notre business est l’éducation et je pense que nous avons un long chemin, qui prendra entre 5 et 10 ans, mais à l’issue duquel elle deviendra sans doute notre moteur principal. La deuxième grande orientation du modèle économique sera l’innovation des produits et l’incubation d’entreprises, en tant qu’accélérateurs. Je pense que nous sommes encore dans une étape précoce. Pour le moment, nous évoluons toujours dans un club assez fermé, mais qui s’ouvre pour devenir une organisation influente dans les différentes communautés et dans les villes.</p>
  476. <figure id="post-3742 media-3742" class="align-none"><img src="http://www.makery.info/wp-content/uploads/2015/03/11133113386_6c3ca7e4bc_h-720x380.jpg.pagespeed.ce.MiEkOoFU0T.jpg" alt=""/><figcaption>Tomas Diez parcourt le monde pour défendre le concept de Fab City. © tedxbarcelona</figcaption></figure>
  477. <p><strong>Le réseau des fablabs s’intensifie en Amérique latine. De nouveaux modèles vont-ils en émerger ?</strong></p>
  478. <p>Je suis Vénézuélien et comme je viens moi-même d’Amérique latine, j’ai eu la tâche de coordonner l’organisation de la FAB7 à Lima, en coopération avec l’Espagne. A l’issue de Fab7, un réseau important s’est constitué, non seulement à Lima mais à travers tout le continent. Quand vous montez un fablab aux Pays-Bas, en France ou en Espagne, par exemple, il peut y avoir parfois une sorte d’autosatisfaction. Mais quand vous vivez dans un contexte où vous devez répondre à de vrais besoins, cela devient encore plus significatif. L’impact des fablabs en Afrique ou en <a title="Toward a Fabcity in São Paulo ?" href="http://www.makery.info/2015/02/19/vers-une-fabcity-a-sao-paulo/" target="_blank">Amérique latine</a> n’est évidemment pas le même qu’en Europe ou aux Etats-Unis.</p>
  479. <p>Il y a aussi une part de facteur culturel. En Europe, nous vivons dans des sociétés où on ne se préoccupe pas forcément de la manière dont on va résoudre un problème ou réparer telle ou telle chose, puisqu’on fait facilement appel à la consommation ou aux aides publiques. En Amérique latine, les aides de l’Etat sont faibles, les entreprises vous arnaquent et donc, vous ne pouvez résoudre vos problèmes qu’avec ce que vous avez sous la main. La différence d’approche est énorme. Depuis de nombreuses années, surtout avec le développement des micro-crédits, les gens construisent leur propres maisons dans les favelas, ils recyclent, ils inventent leur propre technologie. C’est un savoir-faire considérable, une manière de vivre le DiY qui est là depuis des décennies.</p>
  480. <p><strong>Dans un reportage récent à <a title="The maker ecosystem in São Paulo" href="http://www.makery.info/2014/10/14/lecosysteme-maker-a-sao-paulo/" target="_blank">São Paolo</a>, nous avons observé que les gens avaient, en effet, une approche très pragmatique du DiY. Ne pensez-vous pas que les fablabs risquent la rupture, entre une vision intellectualisante de la fabrication et une pratique très terre-à-terre en réponse à des besoins parfois élémentaires ?</strong></p>
  481. <p>Cette approche critique est nécessaire. En Amérique latine, clairement, on ne peut pas parler de « hobby ». Vous avez telles ou telles compétences DiY et vous les augmentez grâce aux technologies numériques. Quand vous implantez un fablab à Rio ou à Caracas, le gens viennent pour répondre à un besoin précis ou pour acquérir de nouvelles compétences, qu’ils vont souvent utiliser pour tout à fait autre chose. C’est un état d’esprit. Je peux être capable de construire un mur, mais une fois que je peux créer le design digital puis le fabriquer, rien ne m’empêche de construire le mur, mais aussi de faire une chaise et tout ce qui va dans la maison.</p>
  482. <p><strong>Qu’attendez vous de la FAB11, qui se tiendra à Boston en août prochain, après avoir organisé la FAB10 Barcelone ?</strong></p>
  483. <p><a href="http://www.makery.info/2014/07/06/fab10-barcelone-all-makers-unite/" target="_blank">L’aventure de FAB10</a> a créé un espace de liberté où les gens pouvaient entrer en relation avec un réseau. Notre succès a été de rassembler ces personnes qui avaient un intérêt commun, malgré des profils très différents : des geeks, des makers, des économistes, des représentants de la Banque mondiale, les élus du conseil municipal de Barcelone ont réussi à tisser beaucoup de synergies en une semaine.</p>
  484. <p>Aujourd’hui, des idées lancées <a href="http://www.makery.info/2014/07/11/fab10-bigger-better-stronger/" target="_blank">lors de FAB10</a> sont en projet. Comme l’incroyable <a href="http://amazon.fablat.org/en" target="_blank">fablab Amazon</a>, un fablab flottant <a href="https://vimeo.com/108812502" target="_blank">qui navigue sur le fleuve</a>. Avec FAB10, nous avons ouvert le réseau des fablabs sur le monde. Alors que les précédentes éditions de la Fabconference, beaucoup moins dynamiques, ressemblaient davantage à des symposiums. Ce que j’attends de <a href="http://www.fab11.org/" target="_blank">FAB11</a>… Disons qu’à Barcelone, nous avons fermé un cycle de 10 ans, une phase correspondant au développement et à la maturité des fablabs, qui commencent à affecter les villes, à travers le concept des Fab Cities. Il y avait quelque chose de magique à clore ce cycle, monter FAB10, lancer l’initiative de la Fab City Barcelone, une des villes les plus importantes en termes d’urbanisme et de création architecturale. FAB11 sera le point de démarrage d’un nouveau cycle, qui durera peut-être 90 ans si on veut raisonner sur un siècle. On revient à la maison, au MIT, là où tout a commencé, pour se ressourcer aux principes fondamentaux de la fabrication numérique et pour amener les fablabs vers une nouvelle étape technologique de leur évolution.</p>
  485. <p>La prochaine connexion se fera lors de FAB12 à Shenzhen : ce sera le moment d’aborder la question des principaux moyens de production. Et j’ai aussi ma petite idée sur le ville qui accueillera FAB13, mais je ne peux pas vous en dire plus pour le moment…</p>
  486. <p class="exergue"><a href="http://www.makery.info/tag/fab10/" target="_blank"><strong>Retrouvez ici tous nos reportages sur FAB10 Barcelona</strong></a></p>
  487. <p class="exergue"><a href="http://fab.cba.mit.edu/classes/MIT/863.08/people/Tomas/" target="_blank"><strong>Les projets de Tomas Diez</strong></a></p>
  488. </article>
  489. </section>
  490. <nav id="jumpto">
  491. <p>
  492. <a href="/david/blog/">Accueil du blog</a> |
  493. <a href="http://www.makery.info/2015/03/13/tomas-diez-tout-un-ecosysteme-emerge-autour-de-la-fab-city-a-barcelone/">Source originale</a> |
  494. <a href="/david/stream/2019/">Accueil du flux</a>
  495. </p>
  496. </nav>
  497. <footer>
  498. <div>
  499. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  500. <p>
  501. Bonjour/Hi!
  502. Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
  503. Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
  504. </p>
  505. <p>
  506. Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
  507. </p>
  508. <p>
  509. Voici quelques articles choisis :
  510. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  511. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  512. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  513. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  514. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  515. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  516. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  517. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  518. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  519. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  520. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  521. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  522. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  523. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  524. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  525. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  526. </p>
  527. <p>
  528. On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
  529. </p>
  530. <p>
  531. Je ne traque pas ta navigation mais mon
  532. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  533. conserve des logs d’accès.
  534. </p>
  535. </div>
  536. </footer>
  537. <script type="text/javascript">
  538. ;(_ => {
  539. const jumper = document.getElementById('jumper')
  540. jumper.addEventListener('click', e => {
  541. e.preventDefault()
  542. const anchor = e.target.getAttribute('href')
  543. const targetEl = document.getElementById(anchor.substring(1))
  544. targetEl.scrollIntoView({behavior: 'smooth'})
  545. })
  546. })()
  547. </script>