<html> <style type=“text/css”> .comment { font-style: italic; color: #c0342d; } .name, .variable, code var, pre var { color: #9e5cb1; } .name { font-weight: bold; } .variable, pre var, code var { font-style: italic; } .keyword { color: #abafb3; } .builtin, .string { color: #417fb8; } .constant { color: #e89f27; } table { margin: 1em auto; } table td { padding: 1pt 4pt; } div.dw-content a { text-decoration: underline; } div.dw-content p, div.dw-content li { font-size: 110%; margin-bottom: 1em; max-width: 700px; } blockquote { font-size: inherit; } </style>

<h1>Assignment 1: Fun with Flags</h1>

<p><strong>Assigned</strong>: Thursday, 1 September <br /> <strong>Due</strong>: Wednesday, 7 September, 11:59 p.m.</p>

<h2>Learning goals</h2> <ul> <li>Navigate Pyret documentation</li> <li>Work with Pyret image operators to compose expressions</li> </ul>

<h2>Getting started</h2> <ol> <li><p>Open <a href=“https://code.pyret.org”>code.pyret.org</a> (CPO) and ensure it’s connected to your

vassar.edu

Google account.</p></li> <li><p>Make a new file named

asmt01.arr

.</p></li> </ol> <p><strong>Note</strong>: We’ll grade the assignments anonymously, so please don’t include your name anywhere.</p>

<h2>Help!</h2> <ul> <li><p><a href=“https://www.cs.vassar.edu/~cs101/3/resources/cpo.html”>This guide</a> will help you get started with Pyret!</p></li> <li><p>You’ll want to consult the <a href=“https://www.pyret.org/docs/latest”>Pyret documentation</a>. It’s accessible from CPO by clicking on the pirate button. (That’s Bonny, named after pirate <a href=“https://en.wikipedia.org/wiki/Anne_Bonny”>Anne Bonny</a>.)</p> <p>In particular, we recommend at least quickly browsing through the <a href=“https://www.pyret.org/docs/latest/image.html”>

image

documentation</a> <em>before</em> you start working on this assignment!</p></li> <li><p>Your friendly coaches and instructors are also here to help with this assignment one-on-one. Check the schedule of student <a href=“https://www.cs.vassar.edu/~cs101/3/resources/coaching.html”>coaching hours</a> and your instructor’s <a href=“https://www.cs.vassar.edu/hours”>office hours</a>.</p></li> </ul>

<h2>Assignment</h2> <p>Write code to generate these three flags:</p> <ol> <li><p><a href=“https://en.wikipedia.org/wiki/Flag_of_Switzerland”>Switzerland</a></p> <p><img src=“https://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Flag_of_Switzerland.svg/500px-Flag_of_Switzerland.svg.png” alt=“Flag of Switzerland” style=“border: 1px solid black” /></p></li> <li><p><a href=“https://en.wikipedia.org/wiki/Flag_of_the_Republic_of_the_Congo”>The Republic of the Congo</a></p> <p><img src=“https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Flag_of_the_Republic_of_the_Congo.svg/500px-Flag_of_the_Republic_of_the_Congo.svg.png” alt=“Flag of the Republic of the Congo” style=“border: 1px solid black” /></p></li> <li><p><a href=“https://en.wikipedia.org/wiki/Flag_of_Panama”>Panama</a></p> <p><img src=“https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Flag_of_Panama.svg/500px-Flag_of_Panama.svg.png” alt=“Flag of Panama” style=“border: 1px solid black” /></p></li> </ol> <p>Set up your code so that the three flags are output in the interactions pane (on the right) when we press the <em>Run</em> button. Make sure nothing else is output (no sub-images, numbers, strings, or otherwise).</p>

<h2>Grading criteria</h2> <p>When we grade the assignments, we <em>will</em> be looking for accuracy in</p> <ul> <li>the shapes that are present,</li> <li>their general locations,</li> <li>sizes, and</li> <li>orientations.</li> </ul> <p>We do <em>not</em> care about</p> <ul> <li>exact positioning,</li> <li>exact size ratios,</li> <li>borders,</li> <li>exact angles, or</li> <li>precise color shades.</li> </ul> <p>For instance, you can use

"green"

as the color name even though it produces a brighter green than on these flags. If you want to be more accurate, a comprehensive list of the color names Pyret understands can be found <a href=“https://www.pyret.org/docs/latest/color.html#%28part._s~3acolor-constants%29”>here</a>.</p> <p>For this assignment, we won’t be grading on style (but we will on future assignments!)</p>

<h2>Submitting the assignment</h2> <ol> <li><p>Download your file (<em>File</em> → <em>Download</em>) and ensure it’s named

asmt01.arr

.</p></li> <li><p>Upload your assignment on <a href=“https://www.gradescope.com”>Gradescope</a>.</p></li> </ol> <p><strong>Note</strong>: You can submit as many times as you want before the deadline. Only your latest submission will be graded.</p>

<h2>Challenge exercises</h2> <p>The following won't be graded, but if you want to test your flag-making abilities, we recommend trying:</p> <ol start=“4”> <li><p><a href=“https://en.wikipedia.org/wiki/Flag_of_Jamaica”>Jamaica</a></p> <p><img src=“https://upload.wikimedia.org/wikipedia/commons/thumb/0/0a/Flag_of_Jamaica.svg/500px-Flag_of_Jamaica.svg.png” alt=“Flag of Jamaica” style=“border: 1px solid black” /></p></li> <li><p><a href=“https://en.wikipedia.org/wiki/Flag_of_Greenland”>Greenland</a></p> <p><img src=“https://upload.wikimedia.org/wikipedia/commons/thumb/0/09/Flag_of_Greenland.svg/500px-Flag_of_Greenland.svg.png” alt=“Flag of Greenland” style=“border: 1px solid black” /></p></li> </ol> <p>These are more challenging than they look!</p>

<h2>Acknowledgments</h2> <p>This assignment is adapted from Kathi Fisler and colleagues at Brown University.</p> </html>