index: add example slides

Signed-off-by: Sean Cross <sean@xobs.io>

index.html

@@ -89,7 +89,7 @@
 				<h2>Plastic is Forever</h2>
 				<img src="img/tomu-fomu-case-superwide.jpg">
 				<p>
-					Fomu (with case): an FPGA in your USB port.  Crowdfunding now!  One week to go. <a href="https://t.xobs.io/fomu">t.xobs.io/fomu</a>
+					Fomu (with case): an FPGA in your USB port. Crowdfunding now! One week to go. <a href="https://t.xobs.io/fomu">t.xobs.io/fomu</a>
 				</p>
 			</section>
 			<section data-background-image="css/theme/lca2019-title-bg-transparent.svg">
@@ -783,22 +783,52 @@
 						tool was built.
 					</aside>
 				</section>
-				<section>
+				<section data-transition="slide-in fade-out">
 					<h3>Clothes peg</h3>
 					<img data-src="img/clothespeg-side.jpg" alt="A clothes peg (side view)">
 					<aside class="notes">
-						This is a clothes peg from my house. It's very cheap. You can clearly see parting lines along the side here.
+						This is a clothes peg from my house. It's very cheap.
 					</aside>
 				</section>
-				<section>
+				<section data-transition="fade-in slide-out">
+					<h3>Clothes peg</h3>
+					<img data-src="img/clothespeg-side-arrows.jpg" alt="A clothes peg (side view)">
+					<aside class="notes">
+						You can clearly see parting lines along the side here.
+					</aside>
+				</section>
+				<section data-transition="slide-in fade-out">
 					<h3>Clothes peg</h3>
 					<img data-src="img/clothespeg-inside.jpg" alt="A clothes peg (inside view)">
 					<aside class="notes">
-						The texture is effectively free, because this piece is entirely flat. There aren't any fancy tool options here --
-						no lifters or sliders or anything complicated. You can see the ejector pin marks on the inside, and there are two
-						of them. You can also tell where the gate was, because there's a little bit of material left over. The plastic
-						also has a very rough surface, indicating they probably aren't cleaning the tool very often. One clever piece is
-						that both halves of the clothes peg are identical.
+						If we open it up, we can see some of the magic on the inside. One clever feature is that both halves of the
+						clothes peg are identical, which means they don't have to match up pairs when manufacturing.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Clothes peg</h3>
+					<img data-src="img/clothespeg-inside-gate.jpg" alt="A clothes peg (inside view)">
+					<aside class="notes">
+						This is a bit of flashing left from the gate. This is where plastic flowed in when it was still molten. Because
+						this is a cheap piece, they didn't care too much about hiding it.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Clothes peg</h3>
+					<img data-src="img/clothespeg-inside-ejectors.jpg" alt="A clothes peg (inside view)">
+					<aside class="notes">
+						These are the ejector pin markings. This is where those steel pegs pushed this piece out of the mold. The bottom
+						ejectors are thicker because this also serves to reinfrce the metal wire that puts a lot of force on this area.
+					</aside>
+				</section>
+				<section data-transition="fade-in slide-out">
+					<h3>Clothes peg</h3>
+					<img data-src="img/clothespeg-inside-wtf.jpg" alt="A clothes peg (inside view)">
+					<aside class="notes">
+						The pattern down here is effectively free, because this piece is entirely flat. There aren't any fancy tool
+						options here -- no lifters or sliders or anything complicated. The plastic also has a very rough surface,
+						indicating they probably aren't cleaning the tool very often. I'm not sure what's going on here, or why this
+						looks different between the two pieces. Maybe this was modified by an amateur.
 					</aside>
 				</section>
 				<section>
@@ -807,30 +837,81 @@
 					<aside class="notes">
 					</aside>
 				</section>
-				<section>
+				<section data-transition="slide-in fade-out">
 					<h3>Aircon Remote (Back)</h3>
 					<img data-src="img/examples-aircon-back.jpg" alt="Back of the aircon remote">
 					<aside class="notes">
-						This is a very important tool in Singapore. It's the air conditioning remote. They've added some text on the
-						backside here. Curiously, there's something that seems to violate our "no overhangs" policy. And indeed it does.
+						This is a very important tool in Singapore. It's the air conditioning remote.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Aircon Remote (Back)</h3>
+					<img data-src="img/examples-aircon-back-gate.jpg" alt="Back of the aircon remote">
+					<aside class="notes">
+						This is the gate. You'll see this pattern a lot now. Again, this is where plastic flowed in from the machine, and
+						was clipped off when it was delivered to the manufacturer.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Aircon Remote (Back)</h3>
+					<img data-src="img/examples-aircon-back-text.jpg" alt="Back of the aircon remote">
+					<aside class="notes">
+						They've added some text on the
+						backside here. This text could be a swappable plate, which means they could take this piece of metal out of the
+						core and replace it with another. That would allow them to localize it easily. Also, it's sunken in, which means
+						it's easier to make typo corrections, because all you have to do is file down the tool and try again.
+					</aside>
+				</section>
+				<section data-transition="fade-in slide-out">
+					<h3>Aircon Remote (Back)</h3>
+					<img data-src="img/examples-aircon-back-slider.jpg" alt="Back of the aircon remote">
+					<aside class="notes">
+						Curiously, there's something that seems to violate our "no overhangs" policy. And indeed it does.
 						How do they do that? They use something called a "slider". Basically, a piece that starts out in one position
 						when the plastic flows, and then slides out of the way to let the piece eject. Sliders add a lot of cost, because
 						they quickly complicate the steel tool. You can have multi-stage sliders to get all sorts of complicated
 						features, but it can get very expensive very quickly.
 					</aside>
 				</section>
-				<section>
+				<section data-transition="slide-in fade-out">
 					<h3>Aircon Remote (Front Cover)</h3>
 					<img data-src="img/examples-aircon-cover.jpg" alt="Cover from aircon remote front">
 					<aside class="notes">
-						Here's the inside of the front cover. It can slide up and down, which means it has a lip on the side. They used a
-						slider here, too. In fact, the slider left small marks here. This particular piece is great because you can see
-						the ejector pin marks, the gate mark, and the slider marks. They were also kind enough to indicate that this came
+						Here's the inside of the front cover. It can slide up and down, which means it has a lip on the side.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Aircon Remote (Front Cover)</h3>
+					<img data-src="img/examples-aircon-cover-ejector.jpg" alt="Cover from aircon remote front">
+					<aside class="notes">
+						Here are the ejector pin markings again. This piece has three ejectors.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Aircon Remote (Front Cover)</h3>
+					<img data-src="img/examples-aircon-cover-gate.jpg" alt="Cover from aircon remote front">
+					<aside class="notes">
+						And here's the gate.
+					</aside>
+				</section>
+				<section data-transition="fade">
+					<h3>Aircon Remote (Front Cover)</h3>
+					<img data-src="img/examples-aircon-cover-text.jpg" alt="Cover from aircon remote front">
+					<aside class="notes">
+						They were also kind enough to indicate that this came
 						from the second cavity in the mold. They could probably hide some of these marks if they put more effort into it,
 						but it's really very little payoff. Most people won't notice, and it doesn't impact the functionality of the
 						product.
 					</aside>
 				</section>
+				<section data-transition="fade-in slide-out">
+					<h3>Aircon Remote (Front Cover)</h3>
+					<img data-src="img/examples-aircon-cover-lifter.jpg" alt="Cover from aircon remote front">
+					<aside class="notes">
+						They used a
+						slider here, too. In fact, the slider left small marks here.
+					</aside>
+				</section>
 				<section>
 					<h3>Wine bottle opener</h3>
 					<img data-src="img/wine-bottle-overview.jpg" alt="Wine bottle bottle opener">