2DComputerGraphicsPortfolio/index.html at main · WolfCipher/2DComputerGraphicsPortfolio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<!DOCTYPE html>
<html>

<!-- CS559 Workbook Pages - page content &copy; 2021, Michael Gleicher -->
<!-- This page is part of a Workbook developed for the
    CS559 Computer Graphics Class at the University of Wisconsin
    https://graphics.cs.wisc.edu/Courses/559-sp2025/ -->
    <head>
	<meta name="generator" content="Hugo 0.140.2">
        <meta charset="UTF-8">
        <link rel="stylesheet" href="./css/workbook.css">
        <script src="./js/resizeIFrames.js"></script>
    </head>
    <body>
        <div class="container container--outer"><div class="maincolumn">


<main class="main list" role="main">
	<header class="main__header">
		<h1 class="main__title">Portfolio 1: 2D Graphics</h1>
	</header>
	<div class="content main__content clearfix">


        <p>Please read the instructions on the course web.</p>
<p>Place your work on web pages in this repository. You are free to organize the files however you like, but you should make web pages with one program/picture.</p>
<p>You may use the blank pages in the starter repository, or you may delete them and make your own.</p>
<h2 id="filespages">Files/Pages</h2>
<p>Make a list of the pages we need to look at - this is a requirement. Only list the pages that you actually have things on. (you should delete the empty pages, and the links to them). Please change these to descriptive names for the pages (like &ldquo;1 - Fireworks&rdquo;).</p>
<ul>
<li><a href="./docs/1/">1 - Feed the Beagle</a></li>
<li><a href="./docs/2/">2 - Train</a></li>
<li><a href="./docs/3/">3 - Boids</a></li>
<!--
<li><a href="./docs/4/">4</a></li>
<li><a href="./docs/5/">5</a></li>
-->
</ul>
<h2 id="checklist">Checklist</h2>
<p>Please keep this checklist, and check off the things you have done.</p>
<ol>
<li><input checked="" disabled="" type="checkbox"> A sample checkbox to show what it looks like checked</li>
<li><input checked="true" disabled="" type="checkbox"> A title page that has this checklist, links to all other pages, and explanations of how each requirement was met.</li>
<li><input checked="true" disabled="" type="checkbox"> Graphics that respond to click events</li>
<p>See page 1</p>
<li><input checked="true" disabled="" type="checkbox"> Actions that take time to unfold</li>
<p>See page 1</p>
<li><input checked="true" disabled="" type="checkbox"> Many objects moving at once</li>
<p>See pages 1, 2, and 3</p>
<li><input checked="true" disabled="" type="checkbox"> Sets of graphical objects that come and go</li>
<p>See page 1</p>
<li><input checked="true" disabled="" type="checkbox"> Non-trivial 2D Canvas animation</li>
<p>See pages 1, 2, and 3</p>
<li><input checked="true" disabled="" type="checkbox"> Multiple animated <strong>hierarchical</strong> objects (parts moving relative to other parts)</li>
<p>See page 1</p>
<li><input checked="true" disabled="" type="checkbox"> Use of basic transformations (scale, rotate, translate)</li>
<p>See pages 1, 2, and 3</p>
<li><input checked="true" disabled="" type="checkbox"> An SVG that uses instancing (<code>&lt;use&gt;</code> tags), and arc, and curves (cubic or quadratic Beziers)</li>
<p>See page 3</p>
<li><input checked="true" disabled="" type="checkbox"> A complex curve through multiple points</li>
<p>See page 2</p>
<li><input checked="true" disabled="" type="checkbox"> An object that moves along the complex curve and orients itself appropriately</li>
<p>See page 2</p>
<li><input checked="true" disabled="" type="checkbox"> Something that indicates that you have arc-length parameterization implemented correctly (e.g. train has constant speed or track has properly spaced rail ties)</li>
<p>See page 2</p>
</ol>


        <h3 class="get__started">Get started on
            <a href="./docs/1/">Page &nbsp;index&nbsp; (1 - Feed the Beagle)</a>!</h3>

	</div>
</main>

                </div>
                    <div class="sidebar">
<h2 class="Side_Title">Portfolio 1: 2D Graphics</h2>
<p class="Side__Note">Pages:</p>
<ul class="Side__List">
    <li class="Side__Item Side__Selected">Index (Portfolio 1: Index Page) </li>
        <li class="Side__Item Side__Unselected"> <a href="./docs/1/">index: 1 - Feed the Beagle </a></li>
        <li class="Side__Item Side__Unselected"> <a href="./docs/2/">index: 2 - Train </a></li>
        <li class="Side__Item Side__Unselected"> <a href="./docs/3/">index: 3 - Boids</a></li>
        <!--
        <li class="Side__Item Side__Unselected"> <a href="./docs/4/">index: 4 </a></li>
        <li class="Side__Item Side__Unselected"> <a href="./docs/5/">index: 5 </a></li>
        -->
</ul>
</div>
</div>
    </body>
</html>