Permalink
Browse files

Instructions for Lesson 8

  • Loading branch information...
1 parent 747becf commit 86d9f35fda0aed1880e558ca1a9d2e62ed3cb72d @aharnly-amplify aharnly-amplify committed Sep 24, 2013
Showing with 72 additions and 59 deletions.
  1. +72 −59 index.html
View
@@ -1,59 +1,72 @@
-<html>
- <head>
- <title>Computer Science</title>
- <style type="text/css">
- body {
- background-color: #1B3E59;
- }
- h2 {
- color: #AB7300;
- }
- body {
- color: #494A4A;
- }
- a, a:hover, a:visited {
- color: #0000ee;
- }
- .section {
- padding: 1em;
- background-color: #E1DFE3;
- width: 30em;
- margin-left: auto;
- margin-right: auto;
- margin-bottom: 1em;
- }
- </style>
- </head>
- <body>
- <div class="section">
- <h2>Do Now</h2>
- <p><a href="https://docs.google.com/forms/d/1UJn8-g66nC4_sRopdXkynwYaK25_NiP9z4GO2o3o5S8/viewform">Do Now</a></p>
- </div>
- <div class="section">
- <h2>Snap Setup</h2>
- <p>Remember, your Snap! username is: ywls-{firstname}{lastinitial}. For example, Alicia Smith would be ywls-alicias.</p>
- <p>Your password is 'teals2013'.</p>
- <p>Before doing anything else, try logging in and saving a project.</p>
- <p><a target="snap" href="http://snap.berkeley.edu/run">Start Snap!</a></p>
- </div>
- <div class="section">
- <h2>Variables</h2>
- <p>Create a variable for the size of the square.</p>
- <p>Have the sprite ask you for a size, then set the variable with the answer.</p>
- <p>Use the variable to draw the square.</p>
- <p>Blocks you will want to use:</p>
- <div><img src="http://i.imgur.com/VBweQDA.png" width="200"></div>
- <div><img src="http://i.imgur.com/nscrwsd.png" width="200"></div>
- <h2>Variables with Operations</h2>
- <p>Have the sprite ask you for a size, then draw a square *twice* that size.</p>
- <p>Blocks you will want to use:</p>
- <div><img src="http://i.imgur.com/K9fQr5V.png" width="100"></div>
- </div>
- <div class="section">
- <h2>Loops</h2>
- <p>Use a loop to draw a square.</p>
- <p>Blocks you will want to use:</p>
- <div><img src="http://i.imgur.com/9rR6wK9.png" width="100"></div>
- </div>
- </body>
-</html>
+
+<html><head>
+ <title>Computer Science</title>
+ <style type="text/css">
+ body {
+ background-color: #1B3E59;
+ }
+ h2 {
+ color: #AB7300;
+ }
+ body {
+ color: #494A4A;
+ }
+ a, a:hover, a:visited {
+ color: #0000ee;
+ }
+ .section {
+ padding: 1em;
+ background-color: #E1DFE3;
+ width: 30em;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 1em;
+ }
+ .screenshot {
+ width: 400px;
+ }
+ </style>
+ </head>
+ <body>
+ <div class="section">
+ <h2>Do Now</h2>
+ <p><a target="donow" href="https://docs.google.com/forms/d/1iwC9Iibm3lOPP9TjYyTaCxcLaqv9njj5W2X9MVjOL4o/viewform">Do Now</a></p>
+ </div>
+ <div class="section">
+ <h2>Snap Setup</h2>
+ <p>Remember, your Snap! username is: ywls-{firstname}{lastinitial}. For example, Alicia Smith would be ywls-alicias.</p>
+ <p>Your password is 'teals2013'.</p>
+ <p>Before doing anything else, log in.</p>
+ <p><a target="snap" href="http://snap.berkeley.edu/run">Start Snap!</a></p>
+ </div>
+ <div class="section">
+ <h2>Loops: N-Sided Polygon</h2>
+ <p>Your challenge: Create a program that</p>
+ <ul>
+ <li>Asks you how many sides you want in your polygon</li>
+ <li>Sets a variable for the number of sides</li>
+ <li>Sets another variable with the angle to turn at each side</li>
+ <li>Uses a loop to draw each side of the polygon, and turn to prepare to draw the next side</li>
+ <li><em>Make sure</em> to initialize your program with "clear" and "go to 0, 0" blocks so you
+ have a clean stage each time.</li>
+ </ul>
+ <p>Here is an example of running the N-Sided Polygon program and choosing 4 sides:</p>
+ <p><img src="http://i.imgur.com/uHnTWKT.png" class="screenshot">
+ <img src="http://i.imgur.com/W8Fd5j1.png" class="screenshot"></p>
+
+ <p>Here I run it again, but choose 8 sides:</p>
+ <p><img src="http://i.imgur.com/DwwhFrC.png" class="screenshot">
+ <img src="http://i.imgur.com/EMsrQeO.png" class="screenshot"></p>
+
+ <p>This is my program (made blurry so you don't just copy it!):</p>
+ <p><img src="http://i.imgur.com/FBShXMA.png" class="screenshot"></p>
+ </div>
+ <div class="section">
+ <h2>Conditionals</h2>
+ <p></p>
+ </div>
+
+
+</body></html>
+
+

0 comments on commit 86d9f35

Please sign in to comment.