Chapter 1! 😃

This commit is contained in:
azarz 2018-10-29 15:35:06 +01:00
parent 48182da5d0
commit 7b6adcef54
1 changed files with 127 additions and 123 deletions

250
fr.html
View File

@ -177,7 +177,7 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=500 h=350>
<pic src="pics/intro0.png" sx=400 sy=500></pic>
<words x=95 y=30 w=340 no-bg style="font-size:20px">
<words x=95 y=30 w=340 no-bg style="font-size:20px; padding-top:0">
Et si je disais qu'il y a une manière d'apprendre
basée sur des preuves <i>et</i> amusante ?
</words>
@ -308,8 +308,8 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</words>
<words x=30 y=320 w=480 h=90 style="font-size:20px">
Il <i>n'y a pas</i> de "plutôt".
les sciences cognitives montrent que
tu <i>as besoin</i> de mémorisation pour la créativité et la pensée critique.
les sciences cognitives montrent qu'on
<i>a besoin</i> de mémorisation pour la créativité et la pensée critique.
(Imagine écrire une dissertation sans connaître aucun mot !)
</words>
<words x=187 y=138 w=150 no-bg class="comic_text" style="font-size:40px">
@ -394,46 +394,46 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<words x=60 y=10 w=250>
<b>LA COURBE DE L'OUBLI</b>
</words>
<words x=10 y=310 w=350>
He found that you forget most of what you learn in the first 24 hours,
then if you dont practice recall your remaining memories decay exponentially.*
<words x=10 y=310 w=350 style="font-size:22px">
Il découvrit que l'on oublie la plupart de ce qu'on apprend dans les premières 24 heures,
puis, en l'absence de pratique et de rappel les souvenirs restants se déteriorent exponentiellement.*
</words>
</panel>
<panel w=500 h=53 style="margin-top:-5px">
<words w=500 x=-15 y=-10 no-bg style="width: 500px; font-size:0.8em; text-align: right; color:#999; line-height: 1.1em;">
* technically the curve isn't <i>exactly</i>
* techniquement, la courbe n'est pas <i>tout à fait</i>
<br>
exponential, but, eh, close enough.
exponentielle, mais bon, suffisament proche.
</words>
</panel>
<panel w=500 h=450>
<pic src="pics/sci0.png" sx=900 sy=0></pic>
<words x=10 y=10 w=450 h=90>
Philosophers have debated about memory for millennia,
but Ebbinghaus was the first to do actual <i>experiments.</i>
(which have been replicated)
<words x=10 y=10 w=450 h=90 style="font-size:22px">
Les phliosophes avaient débattu sur la mémoire depuis des millénaires,
mais Ebbinghaus fut le premier à faire de véritables <i>expériences.</i>
(qui ont été répliquées)
</words>
<words x=193 y=169 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35)">
plz...
<words x=193 y=169 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35); font-size:22px">
svp...
</words>
<words x=278 y=195 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35)">
kill...
<words x=278 y=195 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35); font-size:22px">
tuez...
</words>
<words x=348 y=234 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35)">
me...
<words x=348 y=234 w=70 no-bg class="comic_text" style="color:rgba(0,0,0,0.35); font-size:22px">
moi...
</words>
<words x=20 y=350 w=440 h=60>
For that reason, Hermann Ebbinghaus is known as
the pioneer of the science of memory.
<words x=20 y=350 w=440 h=60 style="font-size:22px">
Pour cette raison, Hermann Ebbinghaus est connu comme
le pionier des sciences de la mémoire.
</words>
</panel>
<panel w=600 h=80>
<words w=600 x=-15 no-bg>
Heres a playable simulation of the Forgetting Curve.
<b>Change the rate of memory decay. What happens to the curve?</b>
Voici une simulation interactive de la Courbe de l'Oubli.
<b>Change le taux de déterioration de mémoire. Qu'arrive-t-il à la courbe ?</b>
</words>
</panel>
@ -443,29 +443,29 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=600 h=90>
<words w=600 x=-15 no-bg>
As you can see, the less the decay, the flatter the curve
that is, the longer the memory lasts.
Comme tu peux le voir, moins il y a de déterioration, plus la courbe est plate
c'est-à-dire, plus le souvenir dure.
</words>
</panel>
<panel w=400 h=400>
<pic src="pics/sci0.png" sx=0 sy=500></pic>
<words x=10 y=10 w=300>
How fast a persons memory decays depends on the person and the memory...
La vitesse de déterioration du souvenir dépend de la personne et du souvenir...
</words>
<words x=0 y=145 w=330 no-bg class="comic_text smaller">
hi! sorry, what's your name again?
hey ! désolé, c'est quoi ton nom déjà ?
</words>
<words x=177 y=186 w=180 no-bg class="comic_text smaller">
haha. it's susan.
haha. c'est susan.
</words>
</panel>
<panel w=400 h=400>
<pic src="pics/sci0.png" sx=400 sy=500></pic>
<words x=10 y=10 w=330>
But in general, a memorys “rate of decay” slows down each time you <b>actively recall</b> it.
(versus passively re-reading it)
Mais en général, le "taux de déterioration" d'un souvenir ralentit à chaque fois que tu t'en <b>rappelle activement</b>.
(par rapport à le relire passivement)
</words>
<words x=27 y=198 w=120 no-bg class="comic_text smaller">
susan. susan. susan. susan. susan.
@ -475,29 +475,29 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=400 h=400>
<pic src="pics/sci0.png" sx=800 sy=500></pic>
<words x=10 y=10 w=300>
(although, when you stop practicing, it still decays.)
(cependant, quand tu arrêtes de t'entraîner, il se déteriore toujours.)
</words>
<words x=41 y=121 w=150 no-bg class="comic_text smaller">
okay bye sarah!
ok à plus sarah !
</words>
<words x=191 y=148 w=100 no-bg class="comic_text smaller">
susan.
</words>
<words x=59 y=174 w=150 no-bg class="comic_text smaller">
bye sandy!
ciao sandy !
</words>
<words x=193 y=203 w=100 no-bg class="comic_text smaller">
SUSAN.
</words>
</panel>
<panel w=600 h=120>
<words w=600 x=-15 no-bg>
Heres the simulation again, with a single active recall session.
<panel w=600 h=130>
<words w=600 x=-15 no-bg style="font-size:22px">
Voici une seconde fois la simulation, avec une seul session de rappel active.
<br>
(grey line: what memory would've been <i>without</i> the recall)
(ligne grise : ce que la mémoire aurait été <i>sans</i> le rappel)
<br>
<b>Change the recall timing to see how it affects the curve:</b>
<b>Change le timing de rappel pour voir comment ça affecte la courbe :</b>
</words>
</panel>
@ -505,78 +505,78 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<sim x=0 y=0 w=600 h=400 src="sims/ebbinghaus/?mode=1"></sim>
</panel>
<panel w=600 h=90>
<words w=600 x=-15 no-bg>
A single recall boosts memory for a bit... but in the long run,
due to exponential decay of memory, a single recall changes nothing.
<panel w=600 h=100>
<words w=600 x=-15 no-bg style="font-size:22px">
Un unique rappel booste un peu la mémoire... mais à long terme,
du fait de la déterioration exponentielle de la mémoire, un unique rappel ne change rien.
</words>
</panel>
<panel w=450 h=400>
<pic src="pics/sci1.png" sx=0 sy=0></pic>
<words x=10 y=10 w=390>
Is there a better way to learn?
There is! The trick to remembering...
Y a-t-il une meilleure manière d'apprendre ?
Et oui ! L'astuce pour se souvenir...
</words>
<words x=210 y=330 w=200>
...<i>is to almost forget.</i>
...<i>c'est de presque oublier.</i>
</words>
</panel>
<panel w=500 h=300>
<pic src="pics/sci1.png" sx=450 sy=0></pic>
<words x=250 y=20 w=200>
To understand this, think about training your muscles.
Youll gain nothing with a weight thats too easy...
Pour comprendre cela, pense à l'entraînement des muscles.
On ne gagne rien avec un poids trop facile...
</words>
</panel>
<panel w=500 h=300>
<pic src="pics/sci1.png" sx=450 sy=300></pic>
<words x=250 y=20 w=200>
...nor one thats too hard.
...ni avec un poids trop dur.
</words>
</panel>
<panel w=350 h=350>
<pic src="pics/sci1.png" sx=950 sy=0></pic>
<words x=10 y=10 w=300>
The sames true of training your brain.
You need <b>desirable difficulty</b>: the sweet spot of just-hard-enough.
C'est pareil pour l'entraînement du cerveau.
Tu as besoin d'une <b>difficulté désirable</b> : la zone idéale de pile-assez-dur.
</words>
<words x=55 y=187 w=100 no-bg class="comic_text smaller" style="text-align:left">
comfort
confort
</words>
<words x=55 y=282 w=100 no-bg class="comic_text smaller" style="text-align:left">
discomfort
inconfort
</words>
<words x=176 y=186 w=120 no-bg class="comic_text smaller">
too easy
trop facile
</words>
<words x=179 y=229 w=120 no-bg class="comic_text" style="color:#000">
just right
pile bien
</words>
<words x=176 y=280 w=120 no-bg class="comic_text smaller">
too hard
trop dur
</words>
</panel>
<panel w=450 h=400>
<pic src="pics/sci1.png" sx=0 sy=400></pic>
<words x=10 y=10 w=360>
Therefore: to best learn something, you need to recall it...
De fait : pour mieux se souvenir de quelque chose, tu dois te le rappeler...
</words>
<words x=60 y=330 w=350>
...<i>just as youre about to forget it.</i>
...<i>pile quand tu es sur le point de l'oublier.</i>
</words>
</panel>
<panel w=600 h=120>
<words w=600 x=-15 no-bg>
Same simulation as before, but now it shows the
<span style="background:#ffe866">sweet spot</span>
where youve forgotten <i>just a little bit.</i>
<b>Put the recall in the <i>middle</i> of the sweet spot. What happens?</b>
Même simulation qu'avant, mais maintenant elle montre la
<span style="background:#ffe866">zone idéale</span>
où on a oublié <i>juste un petit peu.</i>
<b>Mets un rappel au <i>milieu</i> de la zone idéale. Que se passe-t-il ?</b>
</words>
</panel>
@ -585,23 +585,23 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</panel>
<panel w=600 h=90>
<words w=600 x=-15 no-bg>
See? If you time a recall just right,
you can slow down the decay by a bit!
Now, what about <i>multiple</i> recalls?
<words w=600 x=-15 no-bg style="font-size:22px">
Tu vois ? Si te te rappelles au bon moment,
tu peux un peu ralentir la déterioration !
Maintenant, qu'arrive-t-il avec des rappels <i>multiples</i> ?
</words>
</panel>
<panel w=500 h=450>
<pic src="pics/sci2.png" sx=0 sy=0></pic>
<words x=10 y=10 w=430>
Lets say youre
<span class="strikeout">lazy</span>
time-efficient, so youre only doing 4 recall sessions.
Disons que tu es
<span class="strikeout">paresseu.x.se</span>
efficace, donc tu ne fais que 4 sessions de rappel.
</words>
<words x=30 y=350 w=430>
Question:
<i>whats the best way to spread out your recalls?</i>
<i>quelle est la meilleure manière d'espacer les rappels ?</i>
</words>
<words x=82 y=198 w=120 no-bg class="comic_text" style="transform: rotate(-16deg);">
susan
@ -611,35 +611,35 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=500 h=350>
<pic src="pics/sci2.png" sx=500 sy=0></pic>
<words x=10 y=10 w=190>
Should you have evenly spaced gaps?
Gaps of increasing length?
Gaps of decreasing length?
Or make it unpredictable, to keep you on your toes?
Devrait-on faire des pauses uniformes ?
Des pauses de longueur croissante ?
Des pauses de longueur décroissante ?
Ou rendre ça imprévisible, pour rester en alerte ?
</words>
<words x=259 y=16 w=100 no-bg class="comic_text smaller" style="text-align:left; color:#000">
= recall
= rappel
</words>
<words x=295 y=16 w=100 no-bg class="comic_text smaller" style="text-align:right; color:#000">
time
temps
</words>
<words x=245 y=61 w=200 no-bg class="comic_text smaller" style="text-align:left; color:#000">
even gaps:
pauses uniformes :
</words>
<words x=245 y=126 w=200 no-bg class="comic_text smaller" style="text-align:left; color:#000">
increasing gaps:
pauses croissantes :
</words>
<words x=245 y=198 w=200 no-bg class="comic_text smaller" style="text-align:left; color:#000">
decreasing gaps:
pauses décroissantes :
</words>
<words x=245 y=259 w=200 no-bg class="comic_text smaller" style="text-align:left; color:#000">
random gaps:
pauses aléatoires :
</words>
</panel>
<panel w=400 h=90>
<words h=90>
<b>Give it your best guess</b>,
then when youre ready, <b>flip the card over &darr;</b>
<b>Essaie de deviner</b>,
puis, quand tu est prêt.e, <b>retourne la carte &darr;</b>
</words>
</panel>
@ -649,11 +649,11 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel fadeInOn="flip_guessgap" w=600 h=120>
<words w=600 x=-15 y=0 no-bg>
Which is very counter-intuitive!
You can prove to yourself this is true, by playing with the sim below.
Ce qui est très contre-intuitif !
Tu peux te prouver que c'est vrai en jouant avec la simulation ci-dessous.
<b>
Get all recalls into the <i>middle</i> of the <span style="background:#ffe866">sweet spot</span>.
What spacing do you get?
Mets tous les rappels au <i>milieu</i> de la <span style="background:#ffe866">zone idéale</span>.
Quel espacement obtient-on ?
</b>
</words>
</panel>
@ -662,13 +662,13 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<sim x=0 y=0 w=600 h=520 src="sims/ebbinghaus/?mode=3"></sim>
</panel>
<panel w=600 h=120>
<words w=600 x=-15 no-bg>
(To prove this isn't a fluke,
heres a sim where you can change
the initial memory decay &amp; sweet spot.
Note how, in all but the extreme cases,
the best schedule is still “increasing gaps”!)
<panel w=600 h=130>
<words w=600 x=-15 no-bg style="font-size:22px">
(Pour montrer que ce n'est pas un hasard,
voici une simulation où l'on peut changer
la déterioration initiale de la mémoire et la zone idéale.
Note que, dans tous les cas sauf extrêmes,
le meilleur planning est toujours "pauses croissantes" !)
</words>
</panel>
@ -679,36 +679,36 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=350 h=500>
<pic src="pics/sci2.png" sx=0 sy=450></pic>
<words x=10 y=10 w=300>
Why <i>must</i> the gaps increase?
Because: each time you do a recall at the sweet spot of forgetting,
the memorys decay slows down...
Pourquoi est-ce que les pauses <i>doivent</i> augmenter ?
Parce qu'à chaque fois que tu te rappelles dans la zone idéale de l'oubli,
la déterioration de la mémoire ralentit...
</words>
<words x=25 y=187 w=50 no-bg class="comic_text smaller" style="text-align:left">
it's
c'est
</words>
<words x=16 y=177 w=300 no-bg class="comic_text" style="font-size:100px; transform: rotate(-5deg);">
SUSAN!
</words>
<words x=218 y=257 w=120 no-bg class="comic_text smaller" style="text-align:right">
the fu
oh put
<!-- TRANSLATOR NOTE: don't complete the swearing in your translation.
make it cut off at the edge of the panel. It's... funnier that way? -->
</words>
<words x=10 y=400 w=300>
...meaning itll take <i>longer</i>
to hit the sweet spot next time!
<words x=10 y=400 w=300 style="font-size:22px">
...ce qui veut dire que ça prendra <i>plus de temps</i>
pour atteindre la zone idéale ensuite !
</words>
</panel>
<panel w=500 h=500>
<pic src="pics/sci2.png" sx=350 sy=450></pic>
<words x=10 y=10 w=400>
But you know whats sweeter?
This also means if you time your recalls just right...
Mais tu sais ce qui est mieux ?
Ça veut aussi dire que si tu prévois tes rappels juste bien...
</words>
<words x=60 y=400 w=400>
...you can easily keep <i>any number</i> of things in your long-term memory,
<i>FOREVER.</i>
<words x=60 y=400 w=400 style="font-size:22px; padding-top:0"">
...tu peux facilement garder <i>n'importe quelle quantité</i> de choses dans ta mémoire à long terme,
<i>POUR TOUJOURS.</i>
</words>
</panel>
@ -718,8 +718,8 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=600 h=90>
<words w=600 x=-15 no-bg>
And speaking of doing active recall in order to learn,
let's do some active recall on what we just learnt:
En parlant de rappels actifs pour pouvoir apprendre,
faisons quelques rappels actifs sur ce que l'on vient d'apprendre :
</words>
</panel>
@ -729,24 +729,28 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<panel w=400 h=400>
<pic src="pics/sci2.png" sx=0 sy=950></pic>
<words x=50 y=20 w=300 bg=none>
Well that's nice,
but actually <i>finding</i> a good Spaced Repetition schedule must be hard, right?
<words x=50 y=20 w=300 bg=none style="font-size:22px; padding-top:0">
Bon, c'est cool,
mais vraiment <i>trouver</i> un bon planning de Répétition Espacée doit être dur, <br />non ?
</words>
</panel>
<panel w=400 h=400>
<pic src="pics/sci2.png" sx=400 sy=950></pic>
<words x=50 y=30 w=300 bg=none>
<i>Au contraire!</i>
Its actually so simple, you can even create your own automatic scheduler...
<words x=50 y=30 w=300 bg=none style="font-size:22px">
<i>Au contraire* !</i>
C'est en fait si simple que tu peux même créer ton propre plannificateur automatique...
</words>
</panel>
<panel w=500 h=53 style="margin-top:-5px">
<words w=500 x=-15 y=-10 no-bg style="width: 500px; font-size:0.8em; text-align: right; color:#999; line-height: 1.1em;">
* en français dans le texte
</words>
</panel>
<panel w=400 h=400>
<pic src="pics/sci2.png" sx=800 sy=950></pic>
<words x=30 y=30 w=200 bg=none>
...using a <i>shoebox.</i>
<words x=30 y=30 w=200 bg=none style="font-size:22px; padding-top:0">
...en utilisant une <i>boîte à chaussures.</i>
</words>
</panel>
@ -2073,25 +2077,25 @@ WE'VE STILL GOT THE INTERFACE LABELS & FLASHCARDS TO TRANSLATE
<!-- Ebbinghaus Simulation -->
<span id="ebbinghaus_y_axis">
strength of memory &rarr;
vivacité du souvenir &rarr;
</span>
<span id="ebbinghaus_x_axis">
time &rarr;
temps &rarr;
</span>
<span id="ebbinghaus_decay">
decay:
déterioration :
</span>
<span id="ebbinghaus_forgetting">
sweet spot:
zone idéale :
</span>
<span id="ebbinghaus_recall">
timing of recall:
timing du rappel :
</span>
<span id="ebbinghaus_recalls">
timing of recalls:
timing des rappels :
</span>
<span id="ebbinghaus_auto">
auto-optimize!
oprimisation auto !
</span>
<!-- Leitner Calendar -->