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

4 yıl önce
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>Ralentir pour apprendre (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://cursus.edu/articles/43345/ralentir-pour-apprendre">
  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. Ralentir pour apprendre (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://cursus.edu/articles/43345/ralentir-pour-apprendre">Source originale du contenu</a></h3>
  445. <h3>Le prendre, le temps</h3>
  446. <p>Nous disposons de puissance de calcul sans pareil mais à quoi cela sert-il d'aller vite? Rosa Harmunt nous parle d’une <a href="https://next.liberation.fr/livres/2018/09/12/hartmut-rosa-fait-vibrer-la-corde-sensible_1678256">accélération</a> dans notre rapport au temps et des maux que celle-ci engendre. Pourquoi est il si difficile de ralentir ? Pourquoi est-il si difficile d'être présent à soi? Comment ralentir pour être plus attentif, pour reprendre le cours de sa vie? Comment accélérer le ralentissement ? Qu'est-ce que la lenteur nous apporte dont la vitesse nous prive ? En quoi mon rythme affecte-t'il mon écosystème d'apprentissage ? Quels rapports au temps dans les pratiques d'intelligence collective ?</p>
  447. <p>Voici quelques-unes des questions essentielles que <a href="https://www.artofhosting.org/fr/">Art of Hosting </a> se pose.</p>
  448. <h3>Le stigmate de la lenteur</h3>
  449. <p>Affirmer de quelqu'un qu'il est lent est une façon de lui dire qu'il est malhabile, voire peu intelligent. Alors qu'un esprit vif et pétillant est le trait d'une personnalité qui en impose. Lent à se préparer, lent à exécuter une tâche, lent à rendre ses devoirs, toutes ces situations renvoient au manque de volonté ou de capacités. La lenteur est synonyme de mollesse, d'indécision et in fine de faiblesse.</p>
  450. <p>Alors que la lenteur est péjorative, le management lent (<a href="https://www.cairn.info/revue-l-expansion-management-review-2011-2-page-42.htm">slow management</a>) se développe. N'en déplaise aux adeptes de la 5G ou des sprinteurs de la vie qui goûtent à peine le paysage, le ralentissement pourrait bien disposer d'atouts dans un monde qui file déjà à <a href="https://www.futura-sciences.com/sciences/questions-reponses/astronomie-vitesse-deplace-terre-espace-8624/">720 000 kilomètres/heure dans la voie lactée</a>.</p>
  451. <h3>Bénéfices du ralentissement</h3>
  452. <p>Enclencher en parallèle un nombre d'applications et décider à toute vitesse d'un nombre élevé de dossiers créerait des montées d'adrénaline chez les décideurs. Les apprenants sautant d’une ressource à l'autre aurait la sensation d'une besace bien remplie. Cette sensation est corporelle. La lenteur et la vitesse se traduisent par une manifestation chimique dans nos cerveaux. Un rythme rapide satisfait ceux qui ont besoin de sensations fortes pour se sentir vivant. Un cocktail d'hormones puissantes les grise. Les jeux vidéos addictifs, certains jeux sérieux jouent de cette propriété cérébrale.</p>
  453. <p>Pourtant les temps calmes ont une incidence sur le cerveau et la mémoire. Le moine Mathieu Ricard nous incite à la méditation pour mieux poser des actes et décider en conscience. Se poser, respirer, prendre conscience de son monde intérieur aiderait à se connecter à un ensemble d'informations indicibles par les sens usuels. Les ondes cérébrales en flux réguliers et ralentis nous feraient même connaître une situation de bien être hors du temps. Les pilotes d'avion, pour faire face au stress en situation critique, apprennent à ralentir le rythme de prise de décision pour trouver la solution juste en cas de danger.</p>
  454. <p>L'éloge de la lenteur c'est de se reconnecter avec soi-même et avec les autres pour mieux prendre en compte l'épanouissement des émotions. Ralentir permet aussi de prendre soin de soi et de s'ouvrir à des perceptions auxquelles on ne prête pas attention, tellement notre esprit est occupé par une multitude de distractions, de surgissement et de sollicitations.</p>
  455. <p>Le ralentissement autorise le silence, le recueillement. La lenteur permet d'honorer la beauté. Imaginez-vous un instant que vous traversiez un jardin. Placer son nez dans une fleur pour en sentir le parfum nécessite de s'arrêter de se pencher, de respirer. Cette célébration de la vie se passe avec de la lenteur. Elle permet de capter les détails. Goûter la vie est un viatique pour en saisir le sens.</p>
  456. <h3>Les ressentis divergent</h3>
  457. <p>Les référentiels individuels de rapport au temps sont très différents. En matière d'apprentissage les repères usuels sont chamboulés. Un léger retard pour l'un équivaut à une effroyable gougeaterie pour l'autre. Avec internet l'impatience grandit, puisqu'en théorie la réponse pourrait presque être instantané. L'apprenant est-il assez patient pour attendre la réponse d'un professeur ? Qu'à cela ne tienne un algorithme y pourvoira. Il fournira son lot de réponses standards.</p>
  458. <p>Les temps sociaux dépendent aussi de notre éducation. Accorder les rythmes de tout un groupe d'apprenants est -il facile quand chacun se connecte comme il l'entend ? D'ailleurs chacun dispose de son horloge interne. Les biorythmes créent des hiatus sur l'écoulement du flux temporel. Penser que tout un groupe va être enchanté unanimement de danser le rock à jeun en guise de réveil-matin ou d'inclusion collective renvoie à un manque de prise en compte des singularités. Et que dire des rendez-vous à des horaires décalés sur les plateformes au prétexte que c'est possible ou soit disant pratique ? Pratique pour qui ?</p>
  459. <p>Plus encore, la situation différente de ressenti lié au contexte change la perception. La lenteur vécue à la campagne et à la ville n’a pas les mêmes références. Deux minutes d'attente c'est trop patienter pour obtenir un handburger dans un fast-food, mais une heure de pluie c'est trop peu pour renflouer une marre ou un ruisseau asséché à la campagne. Et partout plus de 3 secondes avant d'accéder à son dossier en ligne et voilà que l'on se met à râler.</p>
  460. <p>Les âges de la vie nous font ressentir l'urgence de vivre et d'aimer avec une pression diffuse ou avec une plus grande acuité. Les cordes du temps nous font vivre des vibrations différentes. Nous partageons le même espace mais nos représentations et nos trajectoires diffèrent tellement que parfois nous peinons à nous rencontrer. Apprendre est un art d'ajustement celui de rencontrer la bonne activité au bon moment, rien à voir avec un programme linéaire pensé en dehors de la situation singulière de l'apprenant.</p>
  461. <h3>Bénéfices de la lenteur</h3>
  462. <p>La lenteur offre des plages de vide pour accueillir de nouvelles pensées, de nouvelles personnes, de nouvelles activités. Donner du temps au temps autorise l'émergence de solutions jusqu'alors inimaginables. C'est la croyance dans le temps long pour résoudre des problèmes.</p>
  463. <p>Que savaient les bâtisseurs de cathédrales des méthodes qui seraient mises au point 100 à 120 ans plus tard après le début de leur construction ? Pourtant les techniques progressent et les solutions surgissent. La croyance des temps lents et des solutions qui naissent au détour d'une multitude d'événements nous laisse comprendre que le temps aide à trier les meilleures options. Le discernement prend du temps. La vitesse de la confiance est celle des projets pas forcément celle de la puissance de calcul.</p>
  464. <p>Savez-vous que votre esprit pense à 500 mots par minute alors que votre débit de paroles oscille environ à 140 mots par minute. Ce différentiel de temps ampute notre capacité d'écoute en profondeur, car l'autre n'a pas fini sa phrase que nous en avons déjà deviné la portée. Et que dire quand les algorithmes accélèrent encore le brassage des données ? Se ralentir c'est s'obliger à s'écouter. Écouter est le début de l'apprentissage.</p>
  465. <h3>Le temps nécessaire</h3>
  466. <p>Lenteur et vitesse sont affaire de rythme. Le rythme mécanique versus rythme de la nature, le rythme de la décision versus celui de la mise en œuvre, le rythme de la parole versus celui de la pensée. Il existe des rythmes et des agendas invisibles qu’il convient de redécouvrir, même quand l'injonction est de s'adapter toujours plus vite.</p>
  467. <p>La lenteur permet d'honorer la beauté, de laisser advenir des solutions mieux mûries, de prendre en compte plus d'alternatives. Mais un seul ne décide pas du temps qui passe. Il s'agit d'apprendre à s'accorder. Il y a plutôt une alternance de lenteur et de vitesse qui nous traverse.</p>
  468. <p>En formation et en éducation lorsque l'activité pédagogique est bien menée on ne voit pas le temps passer. Un flux s'écoule qui nous garde engagé dans l'apprentissage. C'est la théorie du flow de  <a href="https://fr.wikipedia.org/wiki/Mih%C3%A1ly_Cs%C3%ADkszentmih%C3%A1lyi">Mihály Csíkszentmihályi</a>. Essayer d’articuler à la perfection des activités pédagogiques revient à susciter ce flux.</p>
  469. <p><strong>Sources</strong></p>
  470. <p>L Roche - Le slow management antidote du stress<br/>
  471. <a href="https://www.cairn.info/revue-l-expansion-management-review-2011-2-page-42.htm">https://www.cairn.info/revue-l-expansion-management-review-2011-2-page-42.htm</a></p>
  472. <p>Rosa, H. (2010). Accélération. Une critique sociale du temps. Lectures, Les livres.<br/>
  473. <a href="https://www.decitre.fr/livres/acceleration-9782707154828.html#ae85">https://www.decitre.fr/livres/acceleration-9782707154828.html</a></p>
  474. <p>Ricard, M. (2011). L'art de la Méditation. NiL.<br/>
  475. <a href="https://www.decitre.fr/livres/l-art-de-la-meditation-9782841119820.html#ae85">https://www.decitre.fr/livres/l-art-de-la-meditation-9782841119820.html</a></p>
  476. <p>Duby, G. (1976). Le temps des cathédrales: l'art et la société, 980-1420 (Vol. 26). Editions Gallimard.<br/>
  477. <a href="https://www.decitre.fr/livres/le-temps-des-cathedrales-9782070292868.html#ae85">https://www.decitre.fr/livres/le-temps-des-cathedrales-9782070292868.html</a></p>
  478. <p>Hall, E. T., &amp; Hacker, A. L. (1984). La danse de la vie: temps culturel, temps vécu. Éd. du Seuil.<br/>
  479. <a href="https://www.decitre.fr/livres/la-danse-de-la-vie-9782020164801.html#ae85">https://www.decitre.fr/livres/la-danse-de-la-vie-9782020164801.html</a></p>
  480. <p>Art of Hosting <a href="https://www.artofhosting.org/fr/">https://www.artofhosting.org/fr/</a></p>
  481. <p>Wikipédia Mihály Csíkszentmihályi <a href="https://fr.wikipedia.org/wiki/Mih%C3%A1ly_Cs%C3%ADkszentmih%C3%A1lyi">https://fr.wikipedia.org/wiki/Mih%C3%A1ly_Cs%C3%ADkszentmih%C3%A1lyi</a></p>
  482. <p>Flow <a href="https://fr.wikipedia.org/wiki/Flow_(psychologie)">https://fr.wikipedia.org/wiki/Flow_(psychologie)</a> </p>
  483. <p>Csikszentmihalyi, M. (2013). Flow: The psychology of optimal expéreince. Random House.<br/>
  484. <a href="https://www.decitre.fr/livres/flow-9780061339202.html#ae85">https://www.decitre.fr/livres/flow-9780061339202.html</a></p>
  485. <p>Quick, K., &amp; Sandfort, J. (2014). Learning to facilitate deliberation: practicing the art of hosting. Critical Policy Studies, 8(3), 300-322.</p>
  486. <p>Libération - Harmut Rosa fait vibrer la corde sensible  <a href="https://next.liberation.fr/livres/2018/09/12/hartmut-rosa-fait-vibrer-la-corde-sensible_1678256">https://next.liberation.fr/livres/2018/09/12/hartmut-rosa-fait-vibrer-la-corde-sensible_1678256</a></p>
  487. <p>Futura science À quelle vitesse se déplace la Terre dans l’espace ?  <br/>
  488. <a href="https://www.futura-sciences.com/sciences/questions-reponses/astronomie-vitesse-deplace-terre-espace-8624/">https://www.futura-sciences.com/sciences/questions-reponses/astronomie-vitesse-deplace-terre-espace-8624/</a>  </p>
  489. </article>
  490. </section>
  491. <nav id="jumpto">
  492. <p>
  493. <a href="/david/blog/">Accueil du blog</a> |
  494. <a href="https://cursus.edu/articles/43345/ralentir-pour-apprendre">Source originale</a> |
  495. <a href="/david/stream/2019/">Accueil du flux</a>
  496. </p>
  497. </nav>
  498. <footer>
  499. <div>
  500. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  501. <p>
  502. Bonjour/Hi!
  503. 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>
  504. 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>).
  505. </p>
  506. <p>
  507. 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>.
  508. </p>
  509. <p>
  510. Voici quelques articles choisis :
  511. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  512. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  513. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  514. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  515. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  516. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  517. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  518. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  519. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  520. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  521. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  522. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  523. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  524. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  525. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  526. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  527. </p>
  528. <p>
  529. 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>.
  530. </p>
  531. <p>
  532. Je ne traque pas ta navigation mais mon
  533. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  534. conserve des logs d’accès.
  535. </p>
  536. </div>
  537. </footer>
  538. <script type="text/javascript">
  539. ;(_ => {
  540. const jumper = document.getElementById('jumper')
  541. jumper.addEventListener('click', e => {
  542. e.preventDefault()
  543. const anchor = e.target.getAttribute('href')
  544. const targetEl = document.getElementById(anchor.substring(1))
  545. targetEl.scrollIntoView({behavior: 'smooth'})
  546. })
  547. })()
  548. </script>