add thumbnail to readme
This commit is contained in:
parent
6ed9ca9a47
commit
9c40f20a3a
|
@ -1,4 +1,4 @@
|
||||||
!["thumbnail"]()
|
!["Some Thumbnail Image"](https://ncase.me/remember/sharing/thumbnail.png)
|
||||||
|
|
||||||
**[How To Remember Anything Forever-ish](https://ncase.me/remember/)** is dedicated to the public domain,
|
**[How To Remember Anything Forever-ish](https://ncase.me/remember/)** is dedicated to the public domain,
|
||||||
and was made possible thanks to [my Patreon supporters](https://www.patreon.com/ncase)! Love y'all~
|
and was made possible thanks to [my Patreon supporters](https://www.patreon.com/ncase)! Love y'all~
|
||||||
|
|
|
@ -1950,10 +1950,10 @@ Remember, if your translated word is too big, you can modify the CSS! (especiall
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
👀 Thank you to all my playtesters for making this project not suck:
|
👀 Thank you to all my playtesters for making this project not suck:
|
||||||
<span style="font-size: 18px; line-height: 0px; color: #999;">
|
<span style="font-size: 19px; line-height: 0px; color: #999;">
|
||||||
Aatish Bhatia, Adam Filinovich, Aimee Jarboe, Alex Jaffe, Amit Patel, Andy Matuschak, B Cavello, Chris Walker, Frank Lantz, Gal Green, Glen Chiacchieri, Hamish Todd, Henry Reich, Jacque Goupil, James Lytle,
|
Aatish Bhatia, Adam Filinovich, Aimee Jarboe, Alex Jaffe, Amit Patel, Andy Matuschak, B Cavello, Chris Walker, Frank Lantz, Gal Green, Glen Chiacchieri, Hamish Todd, Henry Reich, Jacque Goupil, James Lytle,
|
||||||
Jez Swanson, Josh Comeau, Kayle Sawyer, Levi Robertson, Marcelo Gallardo, Martyna Wasiluk, Michael Nielsen, Mikayla Hutchinson, Mike Gifford, Monica Srivastava, Owen Landgren,
|
Jez Swanson, Josh Comeau, Kayle Sawyer, Levi Robertson, Marcelo Gallardo, Martyna Wasiluk, Michael Nielsen, Mikayla Hutchinson, Mike Gifford, Monica Srivastava, Owen Landgren,
|
||||||
Paul Butler, Paul Simeon, Philipp Wacker, Pontus Granström, Rowan, Sebastian Morr, SpacieCat, Tim & Alexandra Swast, Tom Hermans, Toph Tucker, Will Harris-Braun, Zeno Rogue
|
Paul Butler, Paul Simeon, Philipp Wacker, Pontus Granström, Rowan, Sebastian Morr, SpacieCat, Tanya Short, Tim & Alexandra Swast, Tom Hermans, Toph Tucker, Will Harris-Braun, Zeno Rogue
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 1.1 MiB |
805
promo.html
805
promo.html
|
@ -1,805 +0,0 @@
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
|
|
||||||
_______ ___ ____________ ___ _______ ____________________________ _ __
|
|
||||||
/ __/ _ \/ _ |/ ___/ __/ _ \ / _ \/ __/ _ \/ __/_ __/ _/_ __/ _/ __ \/ |/ /
|
|
||||||
_\ \/ ___/ __ / /__/ _// // / / , _/ _// ___/ _/ / / _/ / / / _/ // /_/ / /
|
|
||||||
/___/_/ /_/ |_\___/___/____/ /_/|_/___/_/ /___/ /_/ /___/ /_/ /___/\____/_/|_/
|
|
||||||
|
|
||||||
THIS PAGE WAS TO MAKE THE PROMOTIONAL VIDEO TRAILER.
|
|
||||||
|
|
||||||
PLZ IGNORE.
|
|
||||||
|
|
||||||
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en"> <!-- TRANSLATOR NOTE: Remember your 2-letter code? Replace "en" with that! -->
|
|
||||||
<head>
|
|
||||||
|
|
||||||
<!-- Meta Stuff -->
|
|
||||||
<title>How To Remember Anything Forever-ish</title>
|
|
||||||
<!-- TRANSLATOR NOTE: Translate the "content" attribute -->
|
|
||||||
<meta name="description" content="an interactive comic on the science of memory"/>
|
|
||||||
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
|
|
||||||
<meta content="utf-8" http-equiv="encoding">
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<link rel="icon" type="image/png" href="favicon.png">
|
|
||||||
|
|
||||||
<!-- Styles -->
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/comic.css"/>
|
|
||||||
<meta name="viewport" content="width=600">
|
|
||||||
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<div class="comic">
|
|
||||||
|
|
||||||
<panel w=600 h=400 bg="#e0e0e0">
|
|
||||||
<sim x=0 y=0 w=600 h=400 src="sims/multicard/?cards=promo_a,promo_b,promo_c"></sim>
|
|
||||||
</panel>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a name="0"></a>
|
|
||||||
<div class="divider divider_title">
|
|
||||||
<iframe class="splash" gotosrc="sims/splash/" scrolling="no"></iframe>
|
|
||||||
<div id="divider_container">
|
|
||||||
<div id="chapter_name">
|
|
||||||
<div>
|
|
||||||
HOW TO REMEMBER ANYTHING FOREVER-ISH
|
|
||||||
</div>
|
|
||||||
<!-- TRANSLATOR NOTE: add a hint of silliness at the end, like "ish" or "sorta" -->
|
|
||||||
</div>
|
|
||||||
<div style="text-align:right;">
|
|
||||||
by nicky case · oct 2018
|
|
||||||
<br>
|
|
||||||
<span id="translation_credits"></span>
|
|
||||||
<!-- TRANSLATOR NOTE: when you update translations.txt, your name will appear here! -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<br><br><br><br>
|
|
||||||
<br><br><br><br>
|
|
||||||
|
|
||||||
<div class="comic">
|
|
||||||
|
|
||||||
<div id="language_options"></div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- LABELS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<div id="labels">
|
|
||||||
|
|
||||||
|
|
||||||
<span id="flashcard_promo_a_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=0 sy=0></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_promo_a_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=400 sy=0></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_promo_b_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=0 sy=240></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_promo_b_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=400 sy=240></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_promo_c_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=0 sy=480></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_promo_c_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_promo.png" sx=400 sy=480></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em"></div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Chapter Links -->
|
|
||||||
<span id="label_chapter_links">
|
|
||||||
<a href="#0">Intro</a>
|
|
||||||
·
|
|
||||||
<a href="#1">The Science</a>
|
|
||||||
·
|
|
||||||
<a href="#2">The Art</a>
|
|
||||||
·
|
|
||||||
<a href="#3">Get Started!</a>
|
|
||||||
·
|
|
||||||
<a href="#bye">Credits</a>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Multi Card Labels -->
|
|
||||||
<span id="multicard_q">
|
|
||||||
try to recall ↑
|
|
||||||
then flip ↻
|
|
||||||
</span>
|
|
||||||
<span id="multicard_cards_left">
|
|
||||||
(cards left: [N])
|
|
||||||
</span>
|
|
||||||
<span id="multicard_a">
|
|
||||||
did you remember this?
|
|
||||||
</span>
|
|
||||||
<span id="multicard_no">
|
|
||||||
nah, try again
|
|
||||||
</span>
|
|
||||||
<span id="multicard_yes">
|
|
||||||
yup, onwards!
|
|
||||||
</span>
|
|
||||||
<span id="multicard_done">
|
|
||||||
done for now! keep scrolling
|
|
||||||
<br>
|
|
||||||
↓
|
|
||||||
</span>
|
|
||||||
<span id="multicard_done_2">
|
|
||||||
that's all, folks!
|
|
||||||
<br>
|
|
||||||
↓
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Ebbinghaus Simulation -->
|
|
||||||
<span id="ebbinghaus_y_axis">
|
|
||||||
strength of memory →
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_x_axis">
|
|
||||||
time →
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_decay">
|
|
||||||
decay:
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_forgetting">
|
|
||||||
sweet spot:
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_recall">
|
|
||||||
timing of recall:
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_recalls">
|
|
||||||
timing of recalls:
|
|
||||||
</span>
|
|
||||||
<span id="ebbinghaus_auto">
|
|
||||||
auto-optimize!
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Leitner Calendar -->
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
The exact three characters [N] is how the code knows where to put the number.
|
|
||||||
When you translate, make sure the [N] is there if it was there in the original.
|
|
||||||
-->
|
|
||||||
<span id="calendar_day">
|
|
||||||
On Day [N]...
|
|
||||||
</span>
|
|
||||||
<span id="calendar_review">
|
|
||||||
review Levels [N] (<i>in that order</i>)
|
|
||||||
</span>
|
|
||||||
<span id="calendar_loop">
|
|
||||||
(and then loop back to Day 1!)
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Leitner Box simulation -->
|
|
||||||
<span id="leitner_day">
|
|
||||||
Day [N]
|
|
||||||
</span>
|
|
||||||
<span id="leitner_step_to_review">
|
|
||||||
to review: Level
|
|
||||||
</span>
|
|
||||||
<span id="leitner_step_reviewing">
|
|
||||||
review Level [N]
|
|
||||||
</span>
|
|
||||||
<span id="leitner_step_new">
|
|
||||||
add [N] new cards
|
|
||||||
</span>
|
|
||||||
<span id="leitner_step_stats">
|
|
||||||
total: [N] cards!
|
|
||||||
</span>
|
|
||||||
<span id="leitner_step_stats_2">
|
|
||||||
([N] retired)
|
|
||||||
</span>
|
|
||||||
<span id="leitner_button_next_step">
|
|
||||||
next step
|
|
||||||
</span>
|
|
||||||
<span id="leitner_button_next_day">
|
|
||||||
next day
|
|
||||||
</span>
|
|
||||||
<span id="leitner_button_next_week">
|
|
||||||
next week
|
|
||||||
</span>
|
|
||||||
<span id="leitner_button_next_month">
|
|
||||||
next month
|
|
||||||
</span>
|
|
||||||
<span id="leitner_slider_new">
|
|
||||||
[N] new cards a day
|
|
||||||
</span>
|
|
||||||
<span id="leitner_slider_wrong">
|
|
||||||
recall [N]% of cards <i>wrong</i>
|
|
||||||
</span>
|
|
||||||
<span id="leitner_reset">
|
|
||||||
RESET
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Typing Cards -->
|
|
||||||
<span id="type_question">
|
|
||||||
Q:
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE: "Q" short for Question.
|
|
||||||
Dunno if other languages have similar one-letter abbreviations.
|
|
||||||
If not, just type the full translated word for "Question"
|
|
||||||
-->
|
|
||||||
</span>
|
|
||||||
<span id="type_placeholder">
|
|
||||||
type your answer here
|
|
||||||
</span>
|
|
||||||
<span id="type_suggestions">
|
|
||||||
or pick one of these suggestions:
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Suggestions -->
|
|
||||||
<span id="you_what_suggestions">
|
|
||||||
<li>Anything interesting!</li>
|
|
||||||
<li>A language</li>
|
|
||||||
<li>Music</li>
|
|
||||||
<li>Coding</li>
|
|
||||||
<li>Personal</li>
|
|
||||||
<li>(other)</li>
|
|
||||||
</span>
|
|
||||||
<span id="you_why_suggestions">
|
|
||||||
<li>For people I love</li>
|
|
||||||
<li>For my own sake</li>
|
|
||||||
<li>For curiosity's sake</li>
|
|
||||||
<li>(other)</li>
|
|
||||||
</span>
|
|
||||||
<span id="you_how_suggestions">
|
|
||||||
<li>Leitner Box</li>
|
|
||||||
<li>Anki</li>
|
|
||||||
<li>TinyCards</li>
|
|
||||||
<li>(other)</li>
|
|
||||||
</span>
|
|
||||||
<span id="you_when_suggestions">
|
|
||||||
<li>In the morning</li>
|
|
||||||
<li>On my commute</li>
|
|
||||||
<li>In the evening</li>
|
|
||||||
<li>(other)</li>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Gifts -->
|
|
||||||
<span id="gift_wallpaper_what">
|
|
||||||
WHAT:
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_why">
|
|
||||||
WHY:
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_do_1">
|
|
||||||
DO
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_do_2">
|
|
||||||
ME!
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_filename">
|
|
||||||
wallpaper
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_desktop">
|
|
||||||
a wallpaper for your desktop,
|
|
||||||
</span>
|
|
||||||
<span id="gift_wallpaper_phone">
|
|
||||||
a lock-screen wallpaper for your phone,
|
|
||||||
</span>
|
|
||||||
<span id="gift_app_leitner">
|
|
||||||
a video, by my dear friend Chris Walker, on how to craft your very own Leitner Box!
|
|
||||||
<br><br>
|
|
||||||
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/uvF1XuseZFE?rel=0"
|
|
||||||
frameborder="0" allow="autoplay; encrypted-media" allowfullscreen
|
|
||||||
style="display:block; margin:0 auto"></iframe>
|
|
||||||
<br>
|
|
||||||
(And here's a similar tutorial, in IKEA form:)
|
|
||||||
<br><br>
|
|
||||||
<a target="_blank" href="./pdf/leitner.pdf" style="display: block; text-align: center;">
|
|
||||||
<img src="./pdf/thumbnail.png" width="450"/><br>click to download PDF</a>
|
|
||||||
</span>
|
|
||||||
<span id="gift_app_anki">
|
|
||||||
a link to
|
|
||||||
<a target="_blank" href="https://apps.ankiweb.net/">download Anki!</a>
|
|
||||||
And here's a video tutorial on how to use it:
|
|
||||||
<br><br>
|
|
||||||
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/sQkdB3cJwn0?start=180&rel=0"
|
|
||||||
frameborder="0" allow="autoplay; encrypted-media" allowfullscreen
|
|
||||||
style="display:block; margin:0 auto"></iframe>
|
|
||||||
</span>
|
|
||||||
<span id="gift_app_tiny">
|
|
||||||
a link to
|
|
||||||
<a target="_blank" href="https://tinycards.duolingo.com/">
|
|
||||||
TinyCards!</a>
|
|
||||||
(i recommend checking out their
|
|
||||||
<a target="_blank" href="https://tinycards.duolingo.com/users/TinyGeo">
|
|
||||||
geography decks</a>)
|
|
||||||
</span>
|
|
||||||
<span id="gift_app_other">
|
|
||||||
links to tutorials on crafting a Leitner Box
|
|
||||||
<a target="_blank" href="https://www.youtube.com/watch?v=uvF1XuseZFE">
|
|
||||||
[video]</a>
|
|
||||||
<a target="_blank" href="./pdf/leitner.pdf">
|
|
||||||
[pdf]</a>,
|
|
||||||
<a target="_blank" href="https://apps.ankiweb.net/">
|
|
||||||
the Anki app</a>,
|
|
||||||
and
|
|
||||||
<a target="_blank" href="https://tinycards.duolingo.com/">
|
|
||||||
TinyCards</a>!
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- Downloading Cards -->
|
|
||||||
<span id="download_all">
|
|
||||||
DOWNLOAD ALL CARDS
|
|
||||||
</span>
|
|
||||||
<span id="download_all_downloading">
|
|
||||||
DOWNLOADING...
|
|
||||||
</span>
|
|
||||||
<span id="download_all_done">
|
|
||||||
DONE! Check your Downloads folder.
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
|
|
||||||
One more section to go!
|
|
||||||
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- FLASHCARDS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
The CSS for the flashcards is really touchy, so DO NOT MODIFY THE CSS.
|
|
||||||
That means, try as much as possible to make your text shorter or the same length as the original text.
|
|
||||||
Good luck!
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
<!-- INTRO - - - - - - - - -->
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<span id="flashcard_spaced_rep_front">
|
|
||||||
<div class="fcard_center" style="height:2.5em">
|
|
||||||
and the name of this game is...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_spaced_rep_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_intro.png" sx=0 sy=0></div>
|
|
||||||
<div class="fcard_center" style="color:white; font-size:74px; height:1.6em; line-height:0.8em;">
|
|
||||||
SPACED REPETITION
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_a_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em">
|
|
||||||
Spaced Repetition = <span class="underline">____</span> + <span class="underline">____</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_a_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_intro.png" sx=0 sy=240></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.5em">
|
|
||||||
testing + time
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_b_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:4.5em">
|
|
||||||
3 common but ineffective learning/teaching practices are...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_b_back">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:2.2em">
|
|
||||||
...lectures, cramming, and re-reading
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_c_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:4.4em">
|
|
||||||
In Greek Mythology,
|
|
||||||
the goddess of <span class="underline">____</span>
|
|
||||||
was the mother of the goddesses of
|
|
||||||
<span class="underline">________</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_intro_c_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_intro.png" sx=400 sy=0></div>
|
|
||||||
<div id="fc_words" style="position: absolute; width:250px; top:50px; left:140px; line-height:1.1em;">
|
|
||||||
Memory is the mother of Inspiration
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
<!-- CHAPTER 1: The Science -->
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<span id="flashcard_guessgap_front">
|
|
||||||
<div class="fcard_center" style="height:2.5em">
|
|
||||||
the best way to space out your recalls is...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_guessgap_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards0.png" sx=0 sy=0></div>
|
|
||||||
<div class="fcard_center" style="height:2.5em">
|
|
||||||
...with <i>increasing</i> gaps!
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_a_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:3.5em">
|
|
||||||
The pioneer of the experimental science of memory was...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_a_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards0.png" sx=400 sy=0></div>
|
|
||||||
<div id="fc_words" style="position: absolute; width: 250px; top: 60px; left:150px; line-height: 1.1em;">
|
|
||||||
Hermann Ebbinghaus
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_b_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:3.4em">
|
|
||||||
The Forgetting Curve (<i>without</i> any recalls) looks like...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_b_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards0.png" sx=0 sy=240></div>
|
|
||||||
<div id="fc_words" style="position: absolute; width: 280px; top: 70px; right: 20px; font-size:20px; line-height: 1.1em;">
|
|
||||||
(note: it decays quickly, then slowly - "exponential decay")
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_c_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:3.4em">
|
|
||||||
The Forgetting Curve (<i>with</i> well-spaced recalls) looks like...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_sci_c_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards0.png" sx=400 sy=240></div>
|
|
||||||
<div id="fc_words" style="position: absolute; width: 360px; top: 120px; left: 20px; font-size:20px; line-height: 1.1em;">
|
|
||||||
(note: the gaps between recalls <i>increase</i> in length)
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
<!-- Chapter 2: The Art - - -->
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<span id="flashcard_leit_a_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:4.5em">
|
|
||||||
In the Leitner Box, we <span class="underline">______</span>
|
|
||||||
the gap (# of days between reviews) for each Level
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_a_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=720 style="left:-5px"></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:110px">
|
|
||||||
double the gap
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_b_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:4.5em">
|
|
||||||
The Leitner Box game:
|
|
||||||
<br>
|
|
||||||
when you get a card <i>right</i>, you move it <span class="underline">______</span> .
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_b_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=480></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:170px">
|
|
||||||
up one Level
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_c_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:4.5em">
|
|
||||||
The Leitner Box game:
|
|
||||||
<br>
|
|
||||||
when you get a card <i>wrong</i>, you move it <span class="underline">______</span> .
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_c_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=480></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="height:180px">
|
|
||||||
back to Level 1!
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_d_front">
|
|
||||||
<div id="fc_words" class="fcard_center" style="font-size:30px; height:170px;">
|
|
||||||
According to some random comic-game on the internet,
|
|
||||||
my Spaced Repetition flashcards should be
|
|
||||||
<span class="underline">______</span> ,
|
|
||||||
<span class="underline">______</span> , and
|
|
||||||
<span class="underline">______</span> .
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_leit_d_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=720></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="color:#fff; height:200px; height: 180px; font-size: 30px;">
|
|
||||||
small, connected & meaningful
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
<span id="flashcard_mitochondria_all_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=960></div>
|
|
||||||
<div class="fcard_center" style="height:160px;">
|
|
||||||
What's this?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_all_back">
|
|
||||||
<div class="fcard_center" style="height:220px; font-size:20px;">
|
|
||||||
This organelle is called "mitochondria".
|
|
||||||
Mitochondria is the powerhouse of the cell.
|
|
||||||
They're found in almost all eukaryotic (nucleus-having) organisms.
|
|
||||||
The most widely-accepted hypothesis for the origin of mitochondria is Endosymbiotic Theory:
|
|
||||||
around ~1.5 billion years ago, a prokaryotic (nucleus-lacking) cell that was "eaten" by another cell,
|
|
||||||
somehow survived, and has continued to live inside them ever since.
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_1_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=960></div>
|
|
||||||
<div class="fcard_center" style="height:160px;">
|
|
||||||
What's this?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_1_back">
|
|
||||||
<div class="fcard_center" style="height:1.5em;">
|
|
||||||
Mitochondria
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_2_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=960></div>
|
|
||||||
<div class="fcard_center" style="height:180px">
|
|
||||||
Mitochondria is the <span class="underline">_______</span> of the cell
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_2_back">
|
|
||||||
<div class="fcard_center" style="height:150px">
|
|
||||||
powerhouse
|
|
||||||
<span class="bonus_note">
|
|
||||||
// bonus note: seriously though, we'd all be dead without 'em.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_3_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=960 style="top:45px"></div>
|
|
||||||
<div class="fcard_center" style="height:180px;">
|
|
||||||
Mitochondria is found in almost all <span class="underline">____</span> organisms.
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_3_back">
|
|
||||||
<div class="fcard_center" style="height:1.5em">
|
|
||||||
eukaryotic
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_4_front">
|
|
||||||
<div class="fcard_center" style="height:2.5em">
|
|
||||||
Eukaryotes are cells that...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_4_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=1200></div>
|
|
||||||
<div class="fcard_center" style="width: 200px; left: 170px; top: 20px;">
|
|
||||||
have a nucleus
|
|
||||||
<span class="bonus_note">
|
|
||||||
// bonus note: "eu"=good, "karyon"=kernel
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_5_front">
|
|
||||||
<div class="fcard_center" style="height:2.5em">
|
|
||||||
Prokaryotes are cells that...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_5_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=1200></div>
|
|
||||||
<div class="fcard_center" style="width: 200px; left: 170px; top: 20px;">
|
|
||||||
DON'T have a nucleus
|
|
||||||
<span class="bonus_note">
|
|
||||||
// bonus note: "pro"=before, "karyon"=kernel
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_6_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=960 style="top:10px"></div>
|
|
||||||
<div class="fcard_center" style="height:200px; font-size:35px">
|
|
||||||
The most widely-accepted hypothesis for the origin of mitochondria is...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_6_back">
|
|
||||||
<div class="fcard_center" style="height:120px">
|
|
||||||
Endosymbiotic Theory
|
|
||||||
<span class="bonus_note">
|
|
||||||
// bonus note: "endo"=inner, "sym"=together, "bio"=living
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_7_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=960 style="top:40px"></div>
|
|
||||||
<div class="fcard_center" style="font-size: 35px; height: 220px;">
|
|
||||||
According to Endosymbiotic Theory, mitochondria arose around
|
|
||||||
<span class="underline">____</span> years ago
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_7_back">
|
|
||||||
<div class="fcard_center" style="height:1.5em">
|
|
||||||
~1.5 billion years ago
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_8_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=960 style="top:40px"></div>
|
|
||||||
<div class="fcard_center" style="font-size: 37px; height: 220px;">
|
|
||||||
According to Endosymbiotic Theory, mitochondria first arose when...
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_mitochondria_8_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=1440></div>
|
|
||||||
<div class="fcard_center" style="height:230px">
|
|
||||||
when a prokaryote was eaten by another cell
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
<span id="flashcard_cat_front">
|
|
||||||
<div class="fcard_center" style="height:100px">
|
|
||||||
<div style="font-size:120px; height:75px;">
|
|
||||||
cat
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
If your language is NOT French, then change this to "cat" in YOUR language
|
|
||||||
-->
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
(english)
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
If your language is NOT French, then change this to YOUR language
|
|
||||||
-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_cat_back">
|
|
||||||
<div class="fcard_center" style="height:100px">
|
|
||||||
<!--
|
|
||||||
TRANSLATOR NOTE: DO NOT TRANSLATE. Leave as French!
|
|
||||||
-->
|
|
||||||
<div style="font-size:120px; height:75px;">
|
|
||||||
chat
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
(french)
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_cat2_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=0></div>
|
|
||||||
<div class="fcard_center"></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_cat2_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=0></div>
|
|
||||||
<div class="fcard_center">
|
|
||||||
<audio controls id="HACK_audio" style="position: absolute; top: 115px; left: 30px; transform: scale(0.5);">
|
|
||||||
<source gotosrc="../../audio/chat.mp3" type="audio/mpeg">
|
|
||||||
</audio>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<span id="flashcard_learndo_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=0 sy=240></div>
|
|
||||||
<div class="fcard_center" style="height:195px; font-size:33px;">
|
|
||||||
then back to doing... ↻
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_learndo_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=240></div>
|
|
||||||
<div class="fcard_center" style="height:195px; font-size:33px;">
|
|
||||||
then back to learning... ↻
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
<!-- Chapter 3: Get Started -->
|
|
||||||
<!-- - - - - - - - - - - - -->
|
|
||||||
|
|
||||||
<span id="flashcard_you_what_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=0 sy=0></div>
|
|
||||||
<div id="fc_words" style="line-height: 1.1em; position: absolute; width: 190px; margin: 0; top: 50px; left: 180px;">
|
|
||||||
WHAT do you want to learn?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_what_back">
|
|
||||||
<div id="fc_words" class="fcard_center" editable="you_what" style="height:1.2em">
|
|
||||||
Anything interesting!
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_why_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=400 sy=0></div>
|
|
||||||
<div id="fc_words" style="line-height: 1.1em; position: absolute; width: 190px; margin: 0; top: 50px; left: 180px;">
|
|
||||||
WHY do you want to learn?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_why_back">
|
|
||||||
<div id="fc_words" class="fcard_center" editable="you_why" style="height:1.2em">
|
|
||||||
For curiosity's sake
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_how_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=0 sy=240></div>
|
|
||||||
<div id="fc_words" style="line-height: 1.1em; position: absolute; width: 190px; margin: 0; top:31px; left: 180px;">
|
|
||||||
HOW do you want to do Spaced Repetition?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_how_back">
|
|
||||||
<div id="fc_words" class="fcard_center" editable="you_how" style="height:1.2em">
|
|
||||||
Leitner Box
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_when_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=400 sy=240></div>
|
|
||||||
<div id="fc_words" style="line-height: 1.1em; position: absolute; width: 190px; margin: 0; top:31px; left: 180px;">
|
|
||||||
WHEN do you want to do Spaced Repetition?
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_you_when_back">
|
|
||||||
<div id="fc_words" class="fcard_center" editable="you_when" style="height:1.2em">
|
|
||||||
In the evening
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<span id="flashcard_the_end_front">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=0 sy=480></div>
|
|
||||||
</span>
|
|
||||||
<span id="flashcard_the_end_back">
|
|
||||||
<div class="fcard_bg" src="pics/fcards_ch3.png" sx=400 sy=480></div>
|
|
||||||
<div id="fc_words" class="fcard_center" style="top:30px; font-size:50px;">
|
|
||||||
THE END
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--
|
|
||||||
|
|
||||||
TRANSLATOR NOTE:
|
|
||||||
|
|
||||||
Congrats! NOW you've translated everything!
|
|
||||||
|
|
||||||
Again, from the deepest part of my heart, I want to sincerely thank you
|
|
||||||
for helping spread this page to more people, in more languages.
|
|
||||||
|
|
||||||
Oh wait, just one more thing: go to translations.txt,
|
|
||||||
and add your translation there so this project "knows" your page exists.
|
|
||||||
|
|
||||||
And once that's done, send a Pull Request, and your translation will go live!
|
|
||||||
|
|
||||||
THANK YOU! <3
|
|
||||||
~ Nicky Case
|
|
||||||
|
|
||||||
-->
|
|
||||||
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|
||||||
<script src="js/howler.core.min.js"></script>
|
|
||||||
<script src="js/minpubsub.src.js"></script>
|
|
||||||
<script src="js/comic.js"></script>
|
|
Loading…
Reference in New Issue