comic panel positions heck yes

ch2.html

@@ -20,7 +20,7 @@
 <!-- Part 1.1: Leitner Calendar -->
 
 <panel w=500 h=450>
-<pic></pic> <!-- hey susan, TRAINERS -->
+<pic src="pics/leit0.png" sx=0 sy=0></pic> <!-- hey susan, TRAINERS -->
 <words x=10 y=10 w=430 h=60>
 	You don't <i>have</i> to use a shoebox for Spaced Repetition,
 	but it's funnier if you do.
@@ -32,7 +32,7 @@
 </panel>
 
 <panel w=500 h=400>
-<pic></pic> <!-- poker: me vs brain -->
+<pic src="pics/leit0.png" sx=500 sy=0></pic> <!-- poker: me vs brain -->
 <words x=10 y=10 w=430 h=60>
 	This method is called The Leitner System.
 	It's like a card game you play against yourself!
@@ -77,7 +77,7 @@
 </panel>
 
 <panel w=500 h=400>
-<pic></pic> <!-- joyful baby card... and grisly card -->
+<pic src="pics/leit0.png" sx=0 sy=450></pic> <!-- joyful baby card... and grisly card -->
 <words x=10 y=10 w=430 h=60>
 	The rules are simple.
 	First, all new cards start at Level 1.
@@ -88,7 +88,7 @@
 </panel>
 
 <panel w=500 h=430>
-<pic></pic> <!-- valhalla -->
+<pic src="pics/leit0.png" sx=500 sy=450></pic> <!-- valhalla -->
 <words x=10 y=10 w=430 h=90>
 	When you review the cards in a Level, first, shuffle them.
 	Then, try to recall them.
@@ -101,7 +101,7 @@
 </panel>
 
 <panel w=500 h=400>
-<pic></pic> <!-- HIGH STAKES -->
+<pic src="pics/leit0.png" sx=0 sy=900></pic> <!-- HIGH STAKES -->
 <words x=10 y=10 w=430 h=60>
 	But each card you get wrong... goes
 	<i>all the way back down to Level 1.</i>
@@ -113,7 +113,7 @@
 </panel>
 
 <panel w=500 h=400>
-<pic></pic> <!-- baby + REMEMBER ME?! -->
+<pic src="pics/leit0.png" sx=500 sy=900></pic> <!-- baby + REMEMBER ME?! -->
 <words x=10 y=10 w=430 h=60>
 	Each day, you review Level 1 at the end.
 	You'll see your new cards + the cards you forgot.
@@ -148,7 +148,7 @@
 </panel>
 
 <panel w=500 h=400>
-<pic></pic> <!-- snowball -->
+<pic src="pics/leit1.png" sx=0 sy=0></pic> <!-- snowball -->
 <words x=10 y=10 w=430 h=60>
 	However, habits are hard. If you start big, you won't get the ball rolling...
 </words>
@@ -159,7 +159,7 @@
 </panel>
 
 <panel w=500 h=690>
-<pic></pic> <!-- katamari damacy -->
+<pic src="pics/leit1.png" sx=0 sy=400></pic> <!-- katamari damacy -->
 <words x=10 y=10 w=430 h=60>
 	That's why I recommend <i>starting</i> with 5 new cards a day.
 </words>
@@ -211,7 +211,7 @@
 </panel>
 
 <panel w=500 h=450>
-<pic></pic> <!-- Library, humor -->
+<pic src="pics/leit1.png" sx=500 sy=0></pic> <!-- Library, humor -->
 <words x=10 y=10 w=430 h=60>
 	Spaced Repetition will fail if your cards feel
 	bloated, disconnected, or meaningless.
@@ -223,7 +223,7 @@
 </panel>
 
 <panel w=500 h=450>
-<pic></pic> <!-- ANGRY FACE -->
+<pic src="pics/leit1.png" sx=500 sy=450></pic> <!-- Jigsaw ANGRY FACE -->
 <words x=10 y=10 w=430 h=90>
 	Memory is more like a jigsaw puzzle, full of tiny pieces joined together.
 	(This is also how neurons work: lots of tiny, connected things)
@@ -232,8 +232,9 @@
 	It's not about <i>collection</i>, it's about <i>connection</i>.
 </words>
 </panel>
+
 <panel w=500 h=400>
-<pic></pic>
+<pic src="pics/leit1.png" sx=500 sy=900></pic>
 <words x=10 y=10 w=410 h=60>
 	So, to get the most out of Spaced Repetition,
 	you must make your cards...
@@ -243,8 +244,9 @@
 
 <!-- Part 2.2: Small -->
 
-<panel w=600 h=100 bg="#000">
-<words x=10 y=10 w=400>
+<panel w=600 h=150>
+<pic src="pics/leit2.png" sx=0 sy=0></pic>
+<words x=10 y=10 w=200>
 	<b>SMALL</b>
 </words>
 </panel>
@@ -261,7 +263,7 @@
 </panel>
 
 <panel w=450 h=350>
-<pic></pic>
+<pic src="pics/leit2.png" sx=0 sy=450></pic>
 <words x=10 y=10 w=400 h=30>
 	It's too big. Too much information.
 </words>
@@ -285,8 +287,9 @@
 
 <!-- Part 2.3: Connected -->
 
-<panel w=600 h=100 bg="#000">
-<words x=10 y=10 w=400>
+<panel w=600 h=150>
+<pic src="pics/leit2.png" sx=0 sy=150></pic>
+<words x=10 y=10 w=200>
 	<b>CONNECTED</b>
 </words>
 </panel>
@@ -305,7 +308,7 @@
 
 
 <panel w=450 h=400>
-<pic></pic>
+<pic src="pics/leit2.png" sx=0 sy=800></pic>
 <words x=10 y=10 w=400 h=60>
 	But you know what would make it stick in memory better?
 </words>
@@ -322,7 +325,7 @@
 </panel>
 
 <panel w=600 h=300>
-<pic></pic>
+<pic src="pics/leit2.png" sx=600 sy=0></pic>
 <words x=10 y=10 w=200>
 	The front now has a drawing of a cat (image)
 	with a fill-in-the-blank French sentence (context: grammar)
@@ -331,7 +334,7 @@
 </panel>
 
 <panel w=600 h=300>
-<pic></pic>
+<pic src="pics/leit2.png" sx=600 sy=300></pic>
 <words x=10 y=10 w=200>
 	The back now has a symbol of the noun's gender (image),
 	its pronunciation (sound*),
@@ -353,14 +356,15 @@
 
 <!-- Part 2.4: Meaningful -->
 
-<panel w=600 h=100 bg="#000">
-<words x=10 y=10 w=400>
+<panel w=600 h=150>
+<pic src="pics/leit2.png" sx=0 sy=300></pic>
+<words x=10 y=10 w=200>
 	<b>MEANINGFUL</b>
 </words>
 </panel>
 
 <panel w=500 h=350>
-<pic></pic> <!-- examples: programming, ukulele, french -->
+<pic src="pics/leit2.png" sx=450 sy=600></pic> <!-- examples: programming, ukulele, french -->
 <words x=10 y=10 w=450 h=60>
 	Personally, here's how I've learnt best:
 	First, I try to <b>do</b> something.
@@ -368,7 +372,7 @@
 </panel>
 
 <panel w=500 h=350>
-<pic></pic> <!-- examples: programming, ukulele, french -->
+<pic src="pics/leit2.png" sx=950 sy=600></pic> <!-- examples: programming, ukulele, french -->
 <words x=10 y=10 w=450 h=60>
 	Inevitably, I'll get stuck.
 	In that moment, I'll look up what I need,
@@ -402,7 +406,7 @@
 </panel>
 
 <panel w=450 h=400>
-<pic></pic> <!-- connected to HEART -->
+<pic src="pics/leit2.png" sx=450 sy=950></pic> <!-- connected to HEART -->
 <words x=10 y=10 w=400 h=60>
 	That, I believe, is the best way to keep yourself motivated while learning:
 </words>
@@ -429,7 +433,7 @@
 <!-- Part 2.5: Outro -->
 
 <panel w=500 h=450>
-<pic></pic> <!-- show three rules -->
+<pic src="pics/leit3.png" sx=0 sy=0></pic> <!-- show three rules -->
 <words x=10 y=10 w=370 h=30>
 	These three rules for making cards...
 </words>
@@ -442,7 +446,7 @@
 </panel>
 
 <panel w=400 h=400>
-<pic></pic> <!-- me, talking -->
+<pic src="pics/leit3.png" sx=0 sy=450></pic> <!-- me, talking -->
 <words x=10 y=10 w=300 no-bg>
 	This way, you can connect facts to things <i>you</i> know,
 	to images and sounds <i>you</i> like,
@@ -451,7 +455,7 @@
 </panel>
 
 <panel w=400 h=400>
-<pic></pic>
+<pic src="pics/leit3.png" sx=400 sy=450></pic>
 <words x=10 y=10 w=300 no-bg>
 	That's why, in the <i>final</i> part of this interactive comic,
 	you're going to make your own cards!
@@ -462,7 +466,7 @@
 </panel>
 
 <panel w=400 h=400>
-<pic></pic> <!-- goofy pic -->
+<pic src="pics/leit3.png" sx=800 sy=450></pic> <!-- goofy pic -->
 <words x=130 y=10 w=230 fontsize=150 no-bg>
 	YOU
 </words>