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 28KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530
  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>Courage Before Hope: A Proposal to Weave Emotional and Economic Microsolidarity (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="https://medium.com/enspiral-tales/courage-before-hope-a-proposal-to-weave-emotional-and-economic-microsolidarity-87bc81372a09">
  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. Courage Before Hope: A Proposal to Weave Emotional and Economic Microsolidarity (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="https://medium.com/enspiral-tales/courage-before-hope-a-proposal-to-weave-emotional-and-economic-microsolidarity-87bc81372a09">Source originale du contenu</a></h3>
  445. <div class="section-inner sectionLayout--insetColumn"><p name="4c65" id="4c65" class="graf graf--p graf-after--figure">I’ve spent most of the past 2 years travelling with my partner Nati, trying to discover what is the most strategic &amp; wise action to take in a world that seems to be accelerating towards collapse. After an enormous amount of consideration, I have a strategy that feels good enough to engage my will and commitment. This document is a statement of intention. All going well, it’s where I want to invest my productive energy for the next 7 years or so.</p><p name="ae36" id="ae36" class="graf graf--p graf-after--p">I’m developing this plan in three phases:</p><ul class="postList"><li name="d3ee" id="d3ee" class="graf graf--li graf-after--p">Phase 1 is a lot of conversation and contemplation.</li><li name="086c" id="086c" class="graf graf--li graf-after--li">Phase 2 is this writing and re-writing process. Writing in public forces me to fill in the gaps in the argument, and to make my assumptions explicit.</li><li name="64a8" id="64a8" class="graf graf--li graf-after--li">Phase 3 is where you come in as a reader and collaborator. If you feel struck by this proposal, I’d love for you to improve my thinking with your feedback. The best possible response will be for other people to run related experiments in parallel.</li></ul><p name="455c" id="455c" class="graf graf--p graf-after--li">The proposal is very simple. But this is, I hope, the simplicity on <a href="http://www.jonkolko.com/writingSimplicityComplexity.php" data-href="http://www.jonkolko.com/writingSimplicityComplexity.php" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">the far side of complexity</a>. The design elements come from 7 years of thinking &amp; doing in the <a href="http://loomio.coop" data-href="http://loomio.coop" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Loomio Cooperative</a> and <a href="http://whatis.enspiral.com" data-href="http://whatis.enspiral.com" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Enspiral Network</a>.</p><p name="afe8" id="afe8" class="graf graf--p graf-after--p">I intend to start a new community as a sibling or cousin of Enspiral: about 30 to 200 <strong class="markup--strong markup--p-strong">people supporting each other to do more meaningful work</strong>. Our method will focus on getting people into “crews”, small groups of 3–8 people that start with emotional intimacy and get to economic intimacy. There’s a sequence from psychological safety to shared ownership of productive assets. The larger community functions mostly as a dating pool for people to find their crew-mates. The crews support the personal development of their members while doing useful things like providing housing, establishing circular-economy startups, growing food, making revolutionary art, or whatever activity seems meaningful to their members.</p><p name="efc7" id="efc7" class="graf graf--p graf-after--p">That’s the short version: form small groups, share feelings, then share money. In the following few thousand words I spell out the long version. I think modular and open source strategy is much more valuable than charismatic leadership, so I’m documenting my strategy as thoroughly and accessibly as I can. Because it is open source, you can copy it, modify it, and help me to spot bugs.</p><p name="8a67" id="8a67" class="graf graf--p graf-after--p">This article is long, so let’s start with a map:</p><ol class="postList"><li name="cb62" id="cb62" class="graf graf--li graf-after--p">Part 1. I start by briefly setting context, giving a name to the metacrisis I believe is threatening society as we know it.</li><li name="e924" id="e924" class="graf graf--li graf-after--li"><a href="https://medium.com/p/7c6e7ce63eda" data-href="https://medium.com/p/7c6e7ce63eda" class="markup--anchor markup--li-anchor" target="_blank">Part 2</a>. Then there’s a chunky piece of theory to explain how I think about groups, and groups of groups.</li><li name="f37d" id="f37d" class="graf graf--li graf-after--li"><a href="https://medium.com/p/4109e702a07d" data-href="https://medium.com/p/4109e702a07d" class="markup--anchor markup--li-anchor" target="_blank">Part 3</a>. With that background established, I can spell out my “microsolidarity” proposal in more detail.</li><li name="849a" id="849a" class="graf graf--li graf-after--li"><a href="https://medium.com/p/a947d881f4b8" data-href="https://medium.com/p/a947d881f4b8" class="markup--anchor markup--li-anchor" target="_blank">Part 4</a>. Then we get to the counter-intuitive part. I’m intentionally contradicting a lot of received wisdom from progressive and radical politics, so I want to do that explicitly, in the hopes that we can learn from each other.</li></ol><p name="005c" id="005c" class="graf graf--p graf-after--li graf--trailing">Okay, let’s go!</p></div>
  446. <p></div></section><section name="d5a5" class="section section--body"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><h3 name="fb9d" id="fb9d" class="graf graf--h3 graf--leading">Part 1. Collapse</h3><p name="f426" id="f426" class="graf graf--p graf-after--h3">I won’t spend a lot of time on this point because it is a downer, but it deserves a mention: we are well into a major collapse of our biological life support systems. Oops!</p>
  447. <p name="c9e0" id="c9e0" class="graf graf--p graf-after--p">Just one data point: the population of wild animals on Earth has halved in my lifetime (<a href="https://www.theguardian.com/environment/2018/oct/30/humanity-wiped-out-animals-since-1970-major-report-finds" data-href="https://www.theguardian.com/environment/2018/oct/30/humanity-wiped-out-animals-since-1970-major-report-finds" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">source</a>). This is not new information, but we are mostly in denial. <a href="https://rebellion.earth" data-href="https://rebellion.earth" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Extinction Rebellion</a>, a new climate action movement from the UK, remind us that we’ve known this <a href="https://www.theguardian.com/environment/2006/mar/21/conservationandendangeredspecies.internationalnews" data-href="https://www.theguardian.com/environment/2006/mar/21/conservationandendangeredspecies.internationalnews" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">at least since 2006</a> when the United Nations (UN) warned us that “humans have provoked the worst spate of extinctions since the dinosaurs were wiped out 65 million years ago”. Yet our response is still piecemeal, uncoordinated and counter-productive.</p><p name="8d8a" id="8d8a" class="graf graf--p graf-after--p">While the biological substrate for life is disintegrating, so is our social fabric. Democratic populations are electing dictators and buffoons. Fascism is resurgent. Our ability to make meaning is dissolving. Across the political spectrum, people respond to this existential dread by retreating into anxious certainties. Political conversations feel brittle and explosive, one wrong word can trigger an artillery of shaming tactics to shut down the heresy.</p><p name="3197" id="3197" class="graf graf--p graf-after--p">This is how I set the design criteria: assuming we are in a major collapse, what is an appropriate action to take? How do we repair our damaged biological and social ecosystems? How do we plan for a future with much less peace, much less food, much less stable governance? What kind of action plan is fit for purpose in the last decade of the Anthropocene?</p><p name="3247" id="3247" class="graf graf--p graf-after--p"><em class="markup--em markup--p-em">See, I told you this section would be a downer. But I promise from this point on it’s all optimistic and constructive. </em>👍</p><h3 name="5964" id="5964" class="graf graf--h3 graf-after--p">Design criteria for action amid collapse</h3><p name="2b4c" id="2b4c" class="graf graf--p graf-after--h3">First criterion: <strong class="markup--strong markup--p-strong">we need enormous courage to persist without a guarantee of a positive outcome.</strong> Because I’m plugged into a renewable source of courage, I am a very hopeful optimistic confident person. <em class="markup--em markup--p-em">So where does courage come from?</em></p><p name="99cc" id="99cc" class="graf graf--p graf-after--p">Second criterion: <strong class="markup--strong markup--p-strong">we need resilient methods for <em class="markup--em markup--p-em">making meaning</em> in the midst of chaos</strong>. The shortcomings of the old institutional media and the new networked media are collaborating to produce a freak wave of collective insanity. The popular votes for Brexit, Trump, Boaty McBoatface and Bolsonaro all illustrate the magnificent failures of our sense-making apparatus.</p><p name="edd7" id="edd7" class="graf graf--p graf-after--p">Third criterion: <strong class="markup--strong markup--p-strong">people with life-supporting values need to grow our power to influence the distribution of resources.</strong> Just 100 individual CEO’s are responsible for 70% of the world’s greenhouse gas emissions (<a href="https://www.theguardian.com/sustainable-business/2017/jul/10/100-fossil-fuel-companies-investors-responsible-71-global-emissions-cdp-study-climate-change" data-href="https://www.theguardian.com/sustainable-business/2017/jul/10/100-fossil-fuel-companies-investors-responsible-71-global-emissions-cdp-study-climate-change" class="markup--anchor markup--p-anchor" rel="noopener nofollow" target="_blank">source</a>). The oligarchs are killing us. We need to get our hands on power of that magnitude, but it needs to be much more widely distributed and much more accountable.</p><p name="2d4f" id="2d4f" class="graf graf--p graf-after--p">So my humble proposal needs to produce limitless courage, make meaning from chaos, and grow enough power to counterbalance the suicidal oligarchs currently in charge. No big deal 😅</p><p name="d75b" id="d75b" class="graf graf--p graf-after--p">Finally, I believe that the core of this bio/socio/psycho/spiritual collapse is a metacrisis of <strong class="markup--strong markup--p-strong">relationship</strong>, it’s about <em class="markup--em markup--p-em">how I relate to</em> the different parts of myself, to other people, and to all the other creatures, life, spirit, etc on this planet. If that’s true, then <strong class="markup--strong markup--p-strong">my response must be relational first</strong>. This article is written in the first person singular: it’s all I, I, I. That’s a stylistic choice for creative freedom. However, that language obscures the reality that all of this action is conducted in the first person <em class="markup--em markup--p-em">plural</em>: there is always a “we” acting together, me and others.</p><p name="1173" id="1173" class="graf graf--p graf-after--p graf--trailing">So that brings us to my theory of groups, which you can read in <a href="https://medium.com/p/7c6e7ce63eda" data-href="https://medium.com/p/7c6e7ce63eda" class="markup--anchor markup--p-anchor" target="_blank">Microsolidarity Part 2: a Theory of Groups and Groups of Groups</a>.</p></div></div></p>
  448. </article>
  449. </section>
  450. <nav id="jumpto">
  451. <p>
  452. <a href="/david/blog/">Accueil du blog</a> |
  453. <a href="https://medium.com/enspiral-tales/courage-before-hope-a-proposal-to-weave-emotional-and-economic-microsolidarity-87bc81372a09">Source originale</a> |
  454. <a href="/david/stream/2019/">Accueil du flux</a>
  455. </p>
  456. </nav>
  457. <footer>
  458. <div>
  459. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  460. <p>
  461. Bonjour/Hi!
  462. 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>
  463. 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>).
  464. </p>
  465. <p>
  466. 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>.
  467. </p>
  468. <p>
  469. Voici quelques articles choisis :
  470. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  471. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  472. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  473. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  474. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  475. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  476. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  477. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  478. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  479. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  480. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  481. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  482. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  483. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  484. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  485. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  486. </p>
  487. <p>
  488. 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>.
  489. </p>
  490. <p>
  491. Je ne traque pas ta navigation mais mon
  492. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  493. conserve des logs d’accès.
  494. </p>
  495. </div>
  496. </footer>
  497. <script type="text/javascript">
  498. ;(_ => {
  499. const jumper = document.getElementById('jumper')
  500. jumper.addEventListener('click', e => {
  501. e.preventDefault()
  502. const anchor = e.target.getAttribute('href')
  503. const targetEl = document.getElementById(anchor.substring(1))
  504. targetEl.scrollIntoView({behavior: 'smooth'})
  505. })
  506. })()
  507. </script>