Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
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 33KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579
  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` element
  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,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>
  13. Étiquette #protopie
  14. — David Larlet</title>
  15. <meta name="description" content="Publications relatives au tag #protopie">
  16. <!-- That good ol' feed, subscribe :). -->
  17. <link rel="alternate"
  18. type="application/atom+xml"
  19. title="Feed"
  20. href="/david/log/">
  21. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  22. <link rel="apple-touch-icon"
  23. sizes="180x180"
  24. href="/static/david/icons2/apple-touch-icon.png">
  25. <link rel="icon"
  26. type="image/png"
  27. sizes="32x32"
  28. href="/static/david/icons2/favicon-32x32.png">
  29. <link rel="icon"
  30. type="image/png"
  31. sizes="16x16"
  32. href="/static/david/icons2/favicon-16x16.png">
  33. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  34. <link rel="mask-icon"
  35. href="/static/david/icons2/safari-pinned-tab.svg"
  36. color="#07486c">
  37. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  38. <meta name="msapplication-TileColor" content="#f7f7f7">
  39. <meta name="msapplication-config"
  40. content="/static/david/icons2/browserconfig.xml">
  41. <meta name="theme-color"
  42. content="#f7f7f7"
  43. media="(prefers-color-scheme: light)">
  44. <meta name="theme-color"
  45. content="#272727"
  46. media="(prefers-color-scheme: dark)">
  47. <!-- Is that even respected? Retrospectively? What a shAItshow…
  48. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  49. <meta name="robots" content="noai, noimageai">
  50. <!-- Documented, feel free to shoot an email. -->
  51. <link rel="stylesheet" href="/static/david/css/style_2024-01-28.css">
  52. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  53. <link rel="preload"
  54. href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
  55. as="font"
  56. type="font/woff2"
  57. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  58. crossorigin>
  59. <link rel="preload"
  60. href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
  61. as="font"
  62. type="font/woff2"
  63. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  64. crossorigin>
  65. <link rel="preload"
  66. href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
  67. as="font"
  68. type="font/woff2"
  69. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  70. crossorigin>
  71. <link rel="preload"
  72. href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
  73. as="font"
  74. type="font/woff2"
  75. media="(prefers-color-scheme: dark)"
  76. crossorigin>
  77. <link rel="preload"
  78. href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
  79. as="font"
  80. type="font/woff2"
  81. media="(prefers-color-scheme: dark)"
  82. crossorigin>
  83. <link rel="preload"
  84. href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
  85. as="font"
  86. type="font/woff2"
  87. media="(prefers-color-scheme: dark)"
  88. crossorigin>
  89. <script>
  90. function toggleTheme(themeName) {
  91. document.documentElement.classList.toggle(
  92. 'forced-dark',
  93. themeName === 'dark'
  94. )
  95. document.documentElement.classList.toggle(
  96. 'forced-light',
  97. themeName === 'light'
  98. )
  99. }
  100. const selectedTheme = localStorage.getItem('theme')
  101. if (selectedTheme !== 'undefined') {
  102. toggleTheme(selectedTheme)
  103. }
  104. </script>
  105. <style type="text/css">
  106. details[open] summary {
  107. display: none;
  108. }
  109. </style>
  110. <body data-instant-intensity="viewport-all">
  111. <article>
  112. <header>
  113. <hgroup>
  114. <h1>#protopie</h1>
  115. <p>Publications relatives à cette étiquette</p>
  116. </hgroup>
  117. </header>
  118. <nav>
  119. <p>
  120. <a href="/david/" title="Aller à l’accueil">
  121. Accueil</a>
  122. <a rel="tags"
  123. href="/david/2024/#tags"
  124. title="Liste de toutes les étiquettes">
  125. Étiquettes</a>
  126. <a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a>
  127. <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
  128. </p>
  129. </nav>
  130. <h2>
  131. <a href="/david/2024/02/02/" title="Lien permanent vers cet article">Valeurs</a> <time datetime="2024-02-02">2 février 2024</time>
  132. </h2>
  133. <blockquote>
  134. <p><em>Performatif</em>, c’est ce qu’on dit d’un verbe dont l’énonciation constitue simultanément l’action qu’il exprime. Par exemple <em>Je promets</em>, <em>Je m’excuse</em> ou <em>La séance est ouverte</em>&nbsp;: le dire, c’est le faire. Dans le champ de l’action, prendre le tournant du registre <em>performatif</em> revient à acter le caractère de plus en plus inopérant du plaidoyer et de l’action revendicative, face à des pouvoirs et lobbies désespérément hermétiques à la nécessité de changement. L’action performative n’a pas besoin de faire la une ni de se soucier des sirènes médiatiques&nbsp;: <mark>elle est sa propre fin.</mark> Sont performatives des actions qui ont un impact immédiat et direct sur le réel, qui ne visent pas à pousser une revendication ou à peser sur une autorité&nbsp;: dont l’effet est contenu dans leur propre réalisation. […]</p>
  135. <p>Pour toutes ces raisons, j’accorde beaucoup d’intérêt à l’émergence de mouvements autonomes, organiques et composites, qui ne confondent pas radicalité et radicalisme, polémique et action politique. Des collectifs qui n’opposent pas le cerveau et les mains, la lutte et la gentillesse, la théorie et la pratique. Qui, par leur nature indisciplinée, et affranchis des enjeux des élections, peuvent échapper aux carcans des institutions. Des réseaux qui ont appris à se satisfaire de la multiplicité des tactiques et des cultures politiques, à archipéliser les îlots qui tentent de s’organiser différemment, en dehors du système, et qui allient dans un même mouvement justice sociale, combat écologique et défense du&nbsp;vivant.</p>
  136. <p><cite><em>Alors nous irons trouver la beauté ailleurs</em>, Corinne Morel&nbsp;Darleux</cite></p>
  137. </blockquote>
  138. <p><em>Prise de notes brutes pendant une séance avec <a data-link-domain="scopyleft.fr" href="http://scopyleft.fr/">Scopyleft</a> accompagnée par <a data-link-domain="acumeo.fr" href="https://www.acumeo.fr/">Olivier Arnould</a>. Nous avions préalablement communiqué nos valeurs personnelles, les valeurs de la culture actuelle et les valeurs de la culture&nbsp;désirée.</em></p>
  139. <p>La culture c’est un système immunitaire, c’est ce qui est souhaité des membres pour garantir la stabilité du système. La culture dans son intention est positive, elle est là pour protéger le système. Le seul moyen de faire évoluer une culture de manière intentionnelle c’est par des actes rituels mais c’est un système qui a une grande inertie. Tout le reste est de la&nbsp;propagande.</p>
  140. <p>Il y a un lien de causalité entre valeurs choisies, croyances que l’on a et comportements que l’on&nbsp;adopte.</p>
  141. <figure>
  142. <a href="/static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png"
  143. title="Cliquer pour une version haute résolution">
  144. <img
  145. src="/static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png"
  146. width="2672" height="2000"
  147. srcset="/static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png 2672w, /static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png 660w, /static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png 990w, /static/david/2024/2024-02-02-les-sept-niveaux-de-conscience-de-r-barrett.png 1320w"
  148. sizes="min(100vw, calc(100vh * 2672 / 2000))"
  149. loading="lazy"
  150. decoding="async"
  151. alt="Le sablier des Sept niveaux de conscience définis par Richard Barrett.">
  152. </a>
  153. <figcaption>Le sablier des Sept niveaux de conscience définis par Richard&nbsp;Barrett.</figcaption>
  154. </figure>
  155. <p>On explore les <em>Sept niveaux de conscience</em> des CTT (<em>Cultural Transformation Tools</em>) de Richard Barrett. Les valeurs appartiennent à de grands domaines. Une organisation fonctionne bien lorsque l’ensemble des domaines sont couverts. Pas de domaine plus important qu’un autre, malgré la représentation en sablier (qui montre un point de pivot intéressant&nbsp;néanmoins)&nbsp;:</p>
  156. <ol>
  157. <li>Survie&nbsp;: les basiques de la pyramide de Maslow, si la boîte meurt ça ne sert plus à rien de parler&nbsp;culture.</li>
  158. <li>Relations&nbsp;: communication entre individus qui soit efficace (pas de notion d’équipe à ce&nbsp;stade)</li>
  159. <li>Estime de Soi&nbsp;: c’est un peu l’archétype masculin (croissance, performance, qualité, etc)</li>
  160. <li>Transformation&nbsp;: se questionner, changer ses&nbsp;habitudes</li>
  161. <li>Cohésion Interne&nbsp;: le collectif fonctionne bien, partage des valeurs et des engagements (faire équipe, potentiellement avec le&nbsp;client)</li>
  162. <li>Faire la Différence&nbsp;: avoir un impact significatif sur l’extérieur, qui déborde de&nbsp;l’organisation</li>
  163. <li>Service&nbsp;: responsabilité sociétale, vision à long terme d’avoir un impact positif sur la société et la&nbsp;planète</li>
  164. </ol>
  165. <p>On peut les&nbsp;grouper&nbsp;:</p>
  166. <ul>
  167. <li>1 + 2 + 3&nbsp;: socle d’oxygène positif pour pouvoir&nbsp;avancer</li>
  168. <li>4&nbsp;: se remettre en question pour pouvoir&nbsp;évoluer</li>
  169. <li>5 + 6 + 7&nbsp;: dimension collective de cette&nbsp;évolution</li>
  170. </ul>
  171. <p>Une valeur majoritaire se trouve à la fois dans les valeurs personnelles et les valeurs de la culture&nbsp;actuelle&nbsp;:</p>
  172. <ul>
  173. <li>écoute</li>
  174. </ul>
  175. <p>Trois valeurs majoritaires sont à la fois dans les valeurs de la culture actuelle et celles de la culture&nbsp;désirée&nbsp;:</p>
  176. <ul>
  177. <li>agilité</li>
  178. <li>attention, bienveillance, prendre&nbsp;soin</li>
  179. <li>coopération</li>
  180. </ul>
  181. <p>C’est un alignement déjà très élevé et il n’y a pas de valeurs qui freinent l’entreprise (baronnie, etc).</p>
  182. <p>Ce qui apparait dans les nouvelles valeurs majoritaires de la culture&nbsp;désirée&nbsp;:</p>
  183. <ul>
  184. <li>amélioration&nbsp;continue</li>
  185. <li>développement durable, pérennité</li>
  186. <li>initiative, prendre des&nbsp;initiatives</li>
  187. <li>responsabilité&nbsp;sociétale</li>
  188. <li>vision&nbsp;partagée</li>
  189. </ul>
  190. <p>Nous sommes globalement sur la même longueur d’onde. Il y a parfois des valeurs-antidotes qui apparaissent dans la culture désirée, ce qu’on voit peu dans nos&nbsp;résultats.</p>
  191. <p>Ce genre d’exercice n’est qu’un prétexte à enclencher des&nbsp;échanges&nbsp;:</p>
  192. <ul>
  193. <li>Il n’y a pas grand chose autour de 1 (Survie / solidité financière) et 3 (Estime de Soi / performance). Est-ce que c’est OK pour&nbsp;nous&#8239;?</li>
  194. <li>Quels comportements adopter pour avoir la sensation de répondre à ces valeurs&nbsp;désirées&#8239;?</li>
  195. </ul>
  196. <p>Prendre l’initiative c’est créer une perturbation dans le système par <em>une partie</em> du groupe, se démarquer. La vision partagée fait appel par contre au collectif. Il s’agit de construire un système ensemble qui autorise à faire des choses dans le cadre de cette vision partagée. Il serait pertinent d’éclairer la tensions entre initiatives locales et impact global (coucou <del>René Dubos</del>&nbsp;<a href="/david/stream/2015/11/22/">Jacques Ellul</a>). On a le véhicule, il faut choisir où il va maintenant grâce à un cadre collectivement&nbsp;consenti.</p>
  197. <p>Pour progresser, on pourrait travailler sur des prises de décisions concrètes, engageantes. Il faut accepter / souhaiter que ça va déstabiliser le système (immunitaire). Hop, retour à&nbsp;l’intro.</p>
  198. <p>Note&nbsp;: l’Holacracy est un bon business pour les consultant·es, la Sociocratie ouvre d’autres possibilités au sujet du consentement. Voir aussi <em><a data-link-domain="iapop.com" href="https://iapop.com/deep-democracy/">Deep Democracy</a> <a href="/david/cache/2024/1d60fc5548a6fe61da80a4e16892fa0c/" title="Copie locale au 2024-01-31">
  199. <svg xmlns="http://www.w3.org/2000/svg"
  200. width="20" height="20" viewBox="0 0 24 24"
  201. fill="none" stroke="currentColor"
  202. stroke-width="2" stroke-linecap="square" stroke-linejoin="round"
  203. ><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
  204. <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1">
  205. </path>
  206. </svg>
  207. <span class="sr-only">[archive]</span>
  208. </a></em> et <em>Inside The NO: Five Steps to Decisions That Last</em> par Myrna&nbsp;Lewis.</p>
  209. <blockquote>
  210. <p>Et puis il faudra parfois redescendre sur terre et revenir à soi pour se sentir fier de ses actes et de ses choix. Bien sûr, il ne s’agit pas de remplacer une injonction par une autre, et on a parfaitement le droit de trouver qu’il n’y a rien à sauver dans la médiocrité ambiante, d’envoyer au diable l’espoir, la joie et la résilience et, simplement, comme je l’ai lu quelque part, «&nbsp;d’en chier sans avoir à en faire une&nbsp;danse&nbsp;».</p>
  211. <p>Mais ça ne fait pas une vie. <mark>Nous avons besoin, chacune et chacun à sa manière, de ces confins où la disgrâce du monde ne peut plus nous engloutir.</mark> De lieux où se retirer en silence, d’espaces où il est possible de rêver plus loin, de terriers où s’inventer d’autres réalités, de livres qui évadent ou élèvent la pensée, et de poches bien profondes où enfoncer les mains. Autant d’<em>ailleurs</em> intimes ou collectifs, réels ou fictifs, de confins qui peuvent être proches comme lointains car il n’est pas nécessaire de se déplacer pour changer de perspective&nbsp;: c’est un bougé en&nbsp;soi.</p>
  212. <p><cite><em>Ibid.</em></cite></p>
  213. </blockquote>
  214. <a href="#hr-61" title="Lien vers cette section de la page"><hr id="hr-61" /></a>
  215. <blockquote>
  216. <p>Après 13&nbsp;éditions d’un événement qui a beaucoup (beaucoup) grandi, ​nous ressentons le besoin d’expérimenter quelque chose d’un peu ​différent en&nbsp;2024.</p>
  217. <p>Nous souhaitons donc vous proposer un festival éphémère à taille (un ​peu plus) humaine, un temps suspendu où imaginaire positif et ​pragmatisme se rejoignent pour façonner un futur soutenable. ​Quelles pratiques dans nos métiers, comment voulons nous ​entreprendre, travailler, communiquer, quelle industrie voulons nous ​pour&nbsp;demain&#8239;?</p>
  218. <p><cite><em><a data-link-domain="etdemain.co" href="https://etdemain.co/#note-d-intention">Et demain&#8239;? (note&nbsp;d’intention)</a></em></cite></p>
  219. </blockquote>
  220. <p>Des évolutions locales sont en cours ici et ailleurs, c’est&nbsp;stimulant.</p>
  221. <nav>
  222. <p>
  223. <a href="/david/2024/equipe/"
  224. title="Liste de tous les articles 2024 associés à cette étiquette"
  225. rel="tag">#équipe</a>
  226. <a href="/david/2024/processus/"
  227. title="Liste de tous les articles 2024 associés à cette étiquette"
  228. rel="tag">#processus</a>
  229. <a href="/david/2024/protopie/"
  230. title="Liste de tous les articles 2024 associés à cette étiquette"
  231. rel="tag">#protopie</a>
  232. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  233. </p>
  234. </nav>
  235. <h2>
  236. <a href="/david/2024/01/21/" title="Lien permanent vers cet article">Bois</a> <time datetime="2024-01-21">21 janvier 2024</time>
  237. </h2>
  238. <p>La dissonance cognitive du jour&nbsp;: faire un atelier de tour à bois et lire dans la foulée <em>La vie secrète des arbre</em> de Peter Wohlleben brillamment mise en version BD par Fred Bernard et Benjamin&nbsp;Flao.</p>
  239. <figure>
  240. <a href="/static/david/2024/2024-01-20-tour-a-bois.jpg"
  241. title="Cliquer pour une version haute résolution">
  242. <img
  243. src="/static/david/2024/2024-01-20-tour-a-bois.jpg"
  244. width="3024" height="4032"
  245. srcset="/static/david/2024/2024-01-20-tour-a-bois.jpg 3024w, /static/david/2024/2024-01-20-tour-a-bois_660x440.jpg 660w, /static/david/2024/2024-01-20-tour-a-bois_990x660.jpg 990w, /static/david/2024/2024-01-20-tour-a-bois_1320x880.jpg 1320w"
  246. sizes="min(100vw, calc(100vh * 3024 / 4032))"
  247. loading="lazy"
  248. decoding="async"
  249. alt="Une assiette, un bol et une cuillère en bois à côté du livre cité avec des plantes en fond.">
  250. </a>
  251. <figcaption>6 heures de travail non-stop pour faire cette assiette et ce&nbsp;bol.</figcaption>
  252. </figure>
  253. <blockquote>
  254. <p>Lorsque je marche en foret, je sens que je fais partie intégrante du vivant. Je suis, nous sommes naturellement, unis au minéral, aux bactéries, aux virus, aux champignons aux plantes, aux chenilles, aux papillons, à tous les&nbsp;animaux.</p>
  255. <p>Nous sommes tous reliés et <mark>ne faisons que passer sur cette mince pellicule de vie</mark> qui couvre miraculeusement la terre. Tout le vivant est constitue des mêmes atomes présents sur notre planète depuis sa&nbsp;création.</p>
  256. <p>Je porte en moi des particules qui ont constitue des arbres du crétacé, des légionnaires romains, des plants de tomates rapportés d’Amérique par les conquistadors… rien ne se crée, tout se transforme, dit-on. Rien n’est plus&nbsp;vrai.</p>
  257. </blockquote>
  258. <figure>
  259. <a href="/static/david/2024/2024-01-20-vie-secrete-arbres.jpg"
  260. title="Cliquer pour une version haute résolution">
  261. <img
  262. src="/static/david/2024/2024-01-20-vie-secrete-arbres.jpg"
  263. width="3024" height="4032"
  264. srcset="/static/david/2024/2024-01-20-vie-secrete-arbres.jpg 3024w, /static/david/2024/2024-01-20-vie-secrete-arbres_660x440.jpg 660w, /static/david/2024/2024-01-20-vie-secrete-arbres_990x660.jpg 990w, /static/david/2024/2024-01-20-vie-secrete-arbres_1320x880.jpg 1320w"
  265. sizes="min(100vw, calc(100vh * 3024 / 4032))"
  266. loading="lazy"
  267. decoding="async"
  268. alt="Extrait du livre «&nbsp;La vie secrète des arbres&nbsp;» dont est issue la citation ci-dessus.">
  269. </a>
  270. <figcaption>J’aime beaucoup des livres transformés en BD, je trouve que l’image leur donne une autre&nbsp;dimension.</figcaption>
  271. </figure>
  272. <p>D’autant plus motivé pour trouver un bout de forêt à préserver —&nbsp;des chasseurs, de l’exploitation, de la pollution, etc.&nbsp;— dans le coin. Un de mes objectifs&nbsp;2024.</p>
  273. <nav>
  274. <p>
  275. <a href="/david/2024/apprentissage/"
  276. title="Liste de tous les articles 2024 associés à cette étiquette"
  277. rel="tag">#apprentissage</a>
  278. <a href="/david/2024/foret/"
  279. title="Liste de tous les articles 2024 associés à cette étiquette"
  280. rel="tag">#forêt</a>
  281. <a href="/david/2024/protopie/"
  282. title="Liste de tous les articles 2024 associés à cette étiquette"
  283. rel="tag">#protopie</a>
  284. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  285. </p>
  286. </nav>
  287. <h2>
  288. <a href="/david/2024/01/14/" title="Lien permanent vers cet article">Fiction</a> <time datetime="2024-01-14">14 janvier 2024</time>
  289. </h2>
  290. <blockquote>
  291. <p>Ces <em>moments perspectivistes</em>, qu’ils soient activés par un voyage ou par une lecture, sont déroutants mais ils sont salutaires. Ils développent la capacité à comprendre d’autres points de vue que le sien ou, du moins, faute de comprendre, à toucher du doigt la multiplicité des rapports au monde et à accepter la relativité de nos perceptions. Le réel n’est pas un. Et on ne perd jamais en humanité à se mettre dans la peau de&nbsp;l’autre.</p>
  292. <p><mark>La fiction peut nous y aider, c’est le lieu par excellence de tous les possibles; saisissons-nous-en comme d’un terrain d’expérimentation.</mark> Tout n’a pas été écrit&nbsp;: tant que de l’inédit surgit, il reste de la place pour la création. Les mutations du monde nous obligent à repenser le fond comme la forme de nos récits. Il y a des sujets à traiter qui ne l’ont pas été par le passé, des questions qu’on ne s’était jamais posées, de nouveaux enjeux dont il faut s’emparer. Il y a des arcs littéraires à inventer qui ne suivent pas les schémas narratifs classiques et s’affranchissent du syndrome de la grande quête. On doit pouvoir brûler les étapes sans attendre le dénouement. On doit pouvoir brouiller les&nbsp;frontières.</p>
  293. <p><cite><em>Alors nous irons trouver la beauté ailleurs</em>, Corinne Morel&nbsp;Darleux</cite></p>
  294. </blockquote>
  295. <p><a href="/david/2024/01/13/" title="Wuwei">Suite</a> de mes lectures et de mes aspirations à écrire —&nbsp;et donc transmettre&nbsp;— différemment. Une autre forme de travail des idées consistant à décrire un à-venir enviable qu’il reste à construire, en commun, avec l’espoir que <q lang="fr">la fiction déplace la réalité</q>.</p>
  296. <p>De <a href="/david/2024/01/09/" title="Blessure">l’immobilisation</a> nait la&nbsp;créativité&#8239;?</p>
  297. <blockquote>
  298. <p>Je crois de plus en plus que nous devons nous entraîner à <em>habiter le trouble</em> comme l’a formulé Donna Haraway, c’est-à-dire à tenir «&nbsp;pour acquis que les modes d’ordre établis se sont effondrés ou sont en voie d’effondrement, et qu’il devient à la fois urgent et possible d’envisager autre chose&nbsp;». Vivre dans un monde en train de disparaître sans savoir ce qui va émerger n’est pas simple, mais <mark>il ne tient qu’à nous de nous ouvrir à d’autres géographies,</mark> d’autres cultures, à toucher aux confins civilisationnels pour imaginer «&nbsp;des façons plus florissantes, plus robustes, moins meurtrières de vivre les uns avec les autres&nbsp;», ailleurs, quand notre propre réalité nous fait&nbsp;défaut.</p>
  299. <p><cite><em>Ibid.</em></cite></p>
  300. </blockquote>
  301. <a href="#hr-30" title="Lien vers cette section de la page"><hr id="hr-30" /></a>
  302. <p>Je prends le temps de décliner le nouveau style pour les pages d’étiquettes 2024. Il va rester la page d’accueil, la plus difficile. Elle comporte actuellement&nbsp;270&nbsp;liens.</p>
  303. <p>Quelle éditorialisation proposer pour éviter la surcharge tout en facilitant l’exploration&#8239;? Offrir une boussole sans proposer de&nbsp;cap.</p>
  304. <blockquote lang="en">
  305. <p>When the right approach reveals itself, it feels obvious. <mark>But only in retrospect.</mark> <strong>Design is only obvious in retrospect.</strong> It takes iteration and discipline to get there. But when you do get there, it’s much easier to explain your design decisions to others. You know why the design is the right one and can frame your rationale in the context of the problem you are trying to&nbsp;solve.</p>
  306. <p><cite><em><a data-link-domain="lukew.com" href="https://lukew.com/ff/entry.asp?2036">Until the Right Design Emerges…</a> <a href="/david/cache/2024/84f8caf3e7f7b3de9e18281749c3687f/" title="Copie locale au 2024-01-13">
  307. <svg xmlns="http://www.w3.org/2000/svg"
  308. width="20" height="20" viewBox="0 0 24 24"
  309. fill="none" stroke="currentColor"
  310. stroke-width="2" stroke-linecap="square" stroke-linejoin="round"
  311. ><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
  312. <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1">
  313. </path>
  314. </svg>
  315. <span class="sr-only">[archive]</span>
  316. </a></em></cite></p>
  317. </blockquote>
  318. <p><a href="/david/2024/01/13/" title="Wuwei">Non</a>, pas <a data-link-domain="lukew.com" href="https://lukew.com/ff/entry.asp?2008">cette direction</a> <a href="/david/cache/2024/ea2cfc9aa425a6967d2cacd9f96ceb9e/" title="Copie locale au 2024-01-13">
  319. <svg xmlns="http://www.w3.org/2000/svg"
  320. width="20" height="20" viewBox="0 0 24 24"
  321. fill="none" stroke="currentColor"
  322. stroke-width="2" stroke-linecap="square" stroke-linejoin="round"
  323. ><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
  324. <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1">
  325. </path>
  326. </svg>
  327. <span class="sr-only">[archive]</span>
  328. </a> par&nbsp;contre.</p>
  329. <a href="#hr-31" title="Lien vers cette section de la page"><hr id="hr-31" /></a>
  330. <p>Découvertes culinaires du&nbsp;jour&nbsp;:</p>
  331. <ul>
  332. <li><a data-link-domain="cooked.wiki" href="https://cooked.wiki/">cooked.wiki</a> pour préfixer les recettes&nbsp;(merci <a data-link-domain="mastodon.tetaneutral.net" href="https://mastodon.tetaneutral.net/@newick/111749530608709450">@newick</a>)</li>
  333. <li><a data-link-domain="github.com" href="https://github.com/mealie-recipes/mealie">mealie</a> pour stocker les recettes (merci <a data-link-domain="mamot.fr" href="https://mamot.fr/@aspyrine">@aspyrine</a>)</li>
  334. </ul>
  335. <nav>
  336. <p>
  337. <a href="/david/2024/ecriture/"
  338. title="Liste de tous les articles 2024 associés à cette étiquette"
  339. rel="tag">#écriture</a>
  340. <a href="/david/2024/experience/"
  341. title="Liste de tous les articles 2024 associés à cette étiquette"
  342. rel="tag">#expérience</a>
  343. <a href="/david/2024/protopie/"
  344. title="Liste de tous les articles 2024 associés à cette étiquette"
  345. rel="tag">#protopie</a>
  346. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  347. </p>
  348. </nav>
  349. <h2>
  350. <a href="/david/2024/01/01/" title="Lien permanent vers cet article">Dryear(s)</a> <time datetime="2024-01-01">1 janvier 2024</time>
  351. </h2>
  352. <blockquote>
  353. <p>33&#8239;% de 44&nbsp;millions de consommateurs vont faire le Dry January<br />
  354. 22&#8239;% des consommateurs ont une conso excessive, c’est-à-dire 10&nbsp;verres/semaine max et plus de deux&nbsp;verres/jour.</p>
  355. <p>Les seniors sont aussi très touché·es.<br />
  356. <mark>L’alcool est une drogue.</mark>.
  357. On peut faire la fête sans alcool et&nbsp;s’éclater.</p>
  358. <p>Quand on arrête&nbsp;: bienfaits sur le foie, la peau, le coeur, etc…<br />
  359. Pb&nbsp;: mémoire, troubles cognitifs, responsable de cancer, pb sommeil, décompensation de maladie psy,…<br />
  360. 41000&nbsp;décès par an en&nbsp;France.</p>
  361. <p>Les cinq symptômes définissent un problème de&nbsp;dépendance&nbsp;:</p>
  362. <ul>
  363. <li>Perte de&nbsp;contrôle</li>
  364. <li>Usage&nbsp;compulsif</li>
  365. <li>Envie&nbsp;répressive</li>
  366. <li>Usage&nbsp;chronique</li>
  367. <li>Conséquences psychiques, physiques, sociales,…</li>
  368. </ul>
  369. <p>Bon Dry J. pour celleux qui le font&#8239;! Moi j’en&nbsp;suis&#8239;!</p>
  370. <p><cite><a data-link-domain="framapiaf.org" href="https://framapiaf.org/@Air/111681709094993435">@Air@framapiaf.org</a></cite></p>
  371. </blockquote>
  372. <p>Dans mon entourage, de plus en plus de personnes que j’estime ne boivent pas d’alcool, de plus en plus de personnes qui vieillissent en deviennent dépendantes. Je suis davantage attiré par la première option… et pas pour un seul&nbsp;mois.</p>
  373. <p>Je me sens prêt, on verra bien où cela me&nbsp;mène.</p>
  374. <a href="#hr-1" title="Lien vers cette section de la page"><hr id="hr-1" /></a>
  375. <p>Grosse envie de reprendre la CSS par ici en ce début d’année. Avec le dilemme de faire chuter cette motivation si je publie dès maintenant avec l’ancienne (qui restera effective sur les anciens articles). Je vais essayer de me&nbsp;retenir.</p>
  376. <nav>
  377. <p>
  378. <a href="/david/2024/addiction/"
  379. title="Liste de tous les articles 2024 associés à cette étiquette"
  380. rel="tag">#addiction</a>
  381. <a href="/david/2024/experience/"
  382. title="Liste de tous les articles 2024 associés à cette étiquette"
  383. rel="tag">#expérience</a>
  384. <a href="/david/2024/protopie/"
  385. title="Liste de tous les articles 2024 associés à cette étiquette"
  386. rel="tag">#protopie</a>
  387. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  388. </p>
  389. </nav>
  390. <form action="/david/recherche/" method="get">
  391. <fieldset>
  392. <legend>Recherche</legend>
  393. <label for="input-search">Termes de votre recherche :</label>
  394. <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
  395. <input type="submit" value="Chercher">
  396. <p id="indexation-infos">
  397. <small>
  398. Seuls les contenus de ces 8 dernières années sont indexés.
  399. </small>
  400. </p>
  401. </fieldset>
  402. </form>
  403. <aside>
  404. <theme-toggle></theme-toggle>
  405. </aside>
  406. </article>
  407. <hr>
  408. <footer>
  409. <p>
  410. <a href="/david/" title="Aller à l’accueil">Accueil</a>
  411. <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
  412. <a href="http://larlet.com"
  413. title="Go to my English profile"
  414. data-instant>Pro</a>
  415. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
  416. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
  417. </p>
  418. <template id="theme-selector">
  419. <form>
  420. <style type="text/css">
  421. fieldset div {
  422. text-align: center;
  423. }
  424. </style>
  425. <fieldset>
  426. <legend>Thème</legend>
  427. <div>
  428. <label>
  429. <input type="radio" value="auto" name="chosen-color-scheme" checked>
  430. Auto
  431. </label>
  432. <label>
  433. <input type="radio" value="dark" name="chosen-color-scheme">
  434. Foncé
  435. </label>
  436. <label>
  437. <input type="radio" value="light" name="chosen-color-scheme">
  438. Clair
  439. </label>
  440. </div>
  441. </fieldset>
  442. </form>
  443. </template>
  444. </footer>
  445. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  446. <script>
  447. class ThemeToggle extends HTMLElement {
  448. constructor() {
  449. super()
  450. const themeSelectorTemplate = document.querySelector('#theme-selector')
  451. const form = themeSelectorTemplate.content.firstElementChild
  452. this.attachShadow({ mode: 'open' })
  453. this.shadowRoot.appendChild(form.cloneNode(true))
  454. }
  455. connectedCallback() {
  456. const form = this.shadowRoot.querySelector('form')
  457. form.addEventListener('change', (e) => {
  458. const chosenColorScheme = e.target.value
  459. localStorage.setItem('theme', chosenColorScheme)
  460. toggleTheme(chosenColorScheme)
  461. })
  462. const selectedTheme = localStorage.getItem('theme')
  463. if (selectedTheme && selectedTheme !== 'undefined') {
  464. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  465. }
  466. }
  467. }
  468. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  469. window.addEventListener('load', () => {
  470. let colorsLayer = undefined
  471. let hasDarkRules = false
  472. for (const styleSheet of Array.from(document.styleSheets)) {
  473. let mediaRules = []
  474. for (const layerRule of styleSheet.cssRules) {
  475. if (!(layerRule instanceof CSSLayerBlockRule)) {
  476. continue
  477. }
  478. if (layerRule.name === 'colors') {
  479. colorsLayer = layerRule
  480. }
  481. for (const cssRule of layerRule.cssRules) {
  482. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  483. continue
  484. }
  485. // WARNING: Safari does not have/supports `conditionText`.
  486. if (cssRule.conditionText) {
  487. if (cssRule.conditionText !== prefersColorSchemeDark) {
  488. continue
  489. }
  490. } else {
  491. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  492. continue
  493. }
  494. }
  495. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  496. }
  497. }
  498. // WARNING: do not try to insert a Rule to a styleSheet you are
  499. // currently iterating on, otherwise the browser will be stuck
  500. // in a infinite loop…
  501. for (const mediaRule of mediaRules) {
  502. // Safari requires the `0` second parameter (even if default).
  503. colorsLayer.insertRule(mediaRule.cssText, 0)
  504. hasDarkRules = true
  505. }
  506. }
  507. if (hasDarkRules) {
  508. if ('customElements' in window && !customElements.get('theme-toggle')) {
  509. customElements.define('theme-toggle', ThemeToggle)
  510. }
  511. }
  512. })
  513. </script>
  514. </body>
  515. </html>