cass.cityboundforest.com
+84
3
+84
3
···
1
+
<!DOCTYPE html>
2
+
<html>
3
+
<head>
4
+
<link rel="stylesheet" href="/style.css" />
5
+
<link rel="stylesheet" href="/icons.css" />
6
+
<script src="index.js" type="text/javascript"></script>
7
+
<title>CityboundForest - Home</title>
8
+
<meta name="viewport" content="width=device-widthy,initial-scale=1.0" />
9
+
</head>
10
+
<body>
11
+
<div id="nav-links">
12
+
<span class="nav-link"><a href="#">Home</a></span>
13
+
<span class="nav-link"><a href="#about">About</a></span>
14
+
<span class="nav-link"><a href="#portfolio">Portfolio</a></span>
15
+
<span class="nav-link"><a href="/blog">Blog</a></span>
16
+
<span class="nav-link"><a href="#links">Links</a></span>
17
+
</div>
18
+
<div id="home-page" class="page">
19
+
<h3>CityboundForest / Cass Unterholzner</h3>
20
+
<p>Storyteller working in the media of film, theatre, video games, and music</p>
21
+
</div>
22
+
<div id="about-page" class="page">
23
+
<h3>About</h3>
24
+
<img src="/img/self.png" width="300px" alt="A picture of Cass Unterholzner sitting while playing the cello. They are holding their cello bow and have it resting on their knee upright. They are wearing a suit." class="floated" />
25
+
<p>"Creativity is an energy. It's a precious energy, and it's something to be protected. A lot of people take for granted that they're a creative person, but I know from experience, feeling it in myself, it is a magic; it is an energy. And it can't be taken for granted." --Ava DuVernay</p>
26
+
<p>Every person is a story, and storyteller Cass Unterholzner is no different. They have been telling stories since they were younger. Their creative cravings have been sought after through short films, acting and playing music in musical theatre, developing and critiquing video games, and writing and recording music.</p>
27
+
<p>Cass is currently producing an audio drama podcast titled The Four Woods Podcast after developing it as a serial novel story with inspirations from the Magicians TV show and Percy Jackson novels.</p>
28
+
<p>Even before entering high school, Cass participated in the "Go Film!" workshop at the San Joaquin County Office of Education in Stockton, California learning about camera, lighting, and sound techniques. They worked with other teens to create and release a short film, as the Gaffer, the Foley Artist, and a Sound Editor. In high school, Cass took a class expanding their film knowledge in creating the school's announcements. After graduating, they started a YouTube channel where they posted short videos.</p>
29
+
<p>Along with working in film, Cass also participated in musical theatre. They appeared in many productions starting in 2007 with "Dear Edwina Jr" at Stockton Civic Theatre as well as many church musicals. In 2009, Cass starred in "The Music Man" for a senior project in Manteca, California. Later, they were cast as Professor Quirrel and were set to be the Musical Director for a production of "A Very Potter Musical" while directing and developing a Murder Mystery Dinner containing mostly improvised scenes.</p>
30
+
<p>Cass has always been interested in video game development and design as they played them often throughout their adolescence. This interest flourished and inspired them to major in Computer Science, first at San Joaquin Delta College and then University of the Pacific. They ended up switching their major to Media X to further pursue their passions. During their coursework, they worked with classmates to develop two games: a combat simulator for the tabletop role-playing game Dungeons and Dragons and a bullet-dodging game like the video game Cuphead. Cass intends to continue using video games as an alternate form of storytelling in the future.</p>
31
+
<p>Music has always been part of Cass's life. Inspired by their older sister taking lessons, they decided to learn piano at age 5. They later picked up more instruments such as the clarinet, the cello, and the guitar. Cass was active in their high school's band program where they took to arranging and writing for their school's wind ensemble and jazz band. They also played cello often in college and assisted East Union High School's theatre class in a production of "Next to Normal." In 2019, Cass sent a video of themself playing an original song to the University of the Pacific's student association. This resulted in Cass playing both original and cover songs at their Brickyard Series concert. Cass now writes indie pop music in their spare time.</p>
32
+
<p>Cass hopes to further their storytelling career using their YouTube channel talking about gaming, music, and languages. Their free time consists of learning German, American Sign Language, Spanish, and Italian. When they're not crafting fantasy novels, Cass plays and runs sessions of various tabletop role-playing games for which they hope to develop a podcast in the future.</p>
33
+
</div>
34
+
<div id="portfolio-page" class="page">
35
+
<h3>Portfolio</h3>
36
+
<p><span class="portfolio-link"><a href="/portfolio#shut-in">Shut In - Jun 2012</a> <span class="desc" data-desc="Short Film - Gaffer, Foley Artist, Sound Editor" data-label="Shut In">Desc</span></span></p>
37
+
<p><span class="portfolio-link"><a href="/portfolio#cansat">CanSat - Fall 2014:Nov 2019</a> <span class="desc" data-desc="A simulated sattelite in an enclosure the shape and size of a soda can - Programmer" data-label="CanSat">Desc</span></span></p>
38
+
<p><span class="portfolio-link"><a href="/portfolio#meme-machine">Meme Machine - Mar 2017:Feb 2018</a> <span class="desc" data-desc="Download, rate, and create memes - Programmer" data-label="Meme Machine">Desc</span></span></p>
39
+
<p><span class="portfolio-link"><a href="/portfolio#dnd-combatsim">Dungeons & Dragons Combat Simulator - Aug 2018:Dec 2018</a> <span class="desc" data-desc="Combat simulator for the 5th edition of the Tabletop RPG Dungeons & Dragons - Programmer, Project Manager" data-label="Dungeons & Dragons Combat Simulator">Desc</span></span></p>
40
+
<p><span class="portfolio-link"><a href="/portfolio#bullet-rush">Bullet Rush - Aug 2019:Dec 2019</a> <span class="desc" data-desc="Cuphead meets First Person Shooter games - Programmer, Project Manager" data-label="Bullet Rush">Desc</span></span></p>
41
+
<p><span class="portfolio-link"><a href="/portfolio#four-woods">The Four Woods Podcast - Jan 2021:Apr 2021</a> <span class="desc" data-desc="An audio drama podcast about myth and magic - Writer, Director, Editor, Producer" data-label="The Four Woods Podcast">Desc</span></span></p>
42
+
<h3 id="desc-label"></h3>
43
+
<p id="desc-box"></p>
44
+
</div>
45
+
<div id="links-page" class="page">
46
+
<div style="padding: 5px 0px;">
47
+
<a href="https://tiktok.com/@cityboundforest"><img src="/icons/tiktok.svg" alt="tiktok logo" width="25px" title="TikTok" /></a>
48
+
<a href="https://instagram.com/cityboundforest"><img src="/icons/instagram.svg" alt="instagram logo" width="25px" title="Instagram" /></a>
49
+
<a href="https://youtube.com/@cityboundforest"><img src="/icons/youtube.svg" alt="youtube logo" width="25px" title="YouTube Channel" /></a>
50
+
<a href="https://github.com/skeetcha"><img src="/icons/github.svg" alt="github logo" width="25px" title="GitHub" /></a>
51
+
<a href="https://bitbucket.org/cityboundforest"><img src="/icons/bitbucket.svg" alt="bitbucket logo" width="25px" title="BitBucket" /></a>
52
+
<a href="https://tangled.sh/cass.cityboundforest.com"><img src="/icons/tangled.svg" alt="a spool of thread representing tangled.sh" width="25px" title="Tangled" /></a>
53
+
<a href="https://twitch.tv/cityboundforest"><img src="/icons/twitch.svg" alt="twitch logo" width="25px" title="Twitch Channel" /></a>
54
+
<a href="https://cassforest.bandcamp.com"><img src="/icons/bandcamp.svg" alt="bandcamp logo" width="25px" title="Bandcamp - Cass Forest" /></a>
55
+
<a href="https://mirlo.space/cass-forest"><img src="/icons/mirlo.ico" alt="mirlo logo" width="25px" title="Mirlo.space - Cass Forest" /></a>
56
+
<a href="https://wiresbranches.bandcamp.com"><img src="/icons/bandcamp.svg" alt="bandcamp logo" width="25px" title="Bandcamp - Wires&Branches" /></a>
57
+
<a href="https://mirlo.space/wires-branches"><img src="/icons/mirlo.ico" alt="mirlo logo" width="25px" title="Mirlo.space - Wires&Branches" /></a>
58
+
<a href="https://venmo.com/u/cityboundforest"><img src="/icons/venmo.svg" alt="venmo logo" width="25px" title="Venmo" /></a>
59
+
<a href="https://cash.app/$cityboundforest"><img src="/icons/cashapp.svg" alt="cashapp logo" width="25px" title="Cashapp" /></a>
60
+
<a href="https://tumblr.com/cityboundforest.tumblr.com"><img src="/icons/tumblr.svg" alt="tumblr logo" width="25px" title="Tumblr" /></a>
61
+
<a href="https://mastodon.social/@cityboundforest@computerfairi.es"><img src="/icons/mastodon.svg" alt="mastodon logo" width="25px" title="Mastodon" /></a>
62
+
<a href="https://bsky.app/profile/cass.cityboundforest.com"><img src="/icons/bluesky.svg" alt="bluesky logo" width="25px" title="BlueSky" /></a>
63
+
</div>
64
+
<p>27 || musician, gamer || they/them, ze/zir, xe/xim || may or may not exist</p>
65
+
<p>Stream Cass Forest and Wires&Branches on Apple Music, Spotify, and elsewhere</p>
66
+
<iframe src="https://ko-fi.com/cityboundforest/?compact=true&hidefeed=true&widget=true&embed=true" title="integration" allow="" style="border: medium; width: 100%; display: block; height: 300px;"></iframe>
67
+
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/cityboundforest/unweather';">Stream the Unweather EP</button>
68
+
<button type="button" onclick="window.location.href='/#links-four-woods';">The Four Woods Podcast</button>
69
+
<button type="button" onclick="window.location.href='/#links-electronic-music';">Electronic Music</button>
70
+
<iframe src="https://mirlo.space/widget/trackGroup/2740" style="width:100%; height: 371px; border:0; border-radius: 4px; overflow:hidden;" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts">Your browser does not support iframes.</iframe>
71
+
<iframe width="640" height="360" src="https://youtube.com/embed/K1smIMmJ2uQ" style="width: 100%; height: 100%;">Your browser does not support iframes.</iframe>
72
+
</div>
73
+
<div id="links-electronic-music-page" class="page">
74
+
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/polyphonics-in-b-minor';">Stream Polyphonics in B Minor</button>
75
+
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/lightning-marbles';">Stream Lightning Marbles</button>
76
+
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/woods-n-wires';">Stream Woods n Wires</button>
77
+
<iframe src="https://mirlo.space/widget/trackGroup/2743" style="width:100%; height: 371px; border:0; border-radius: 4px; overflow:hidden;" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts">Your browser does not support iframes.</iframe>
78
+
<iframe width="640" height="360" src="https:///youtube.com/embed/4vEkTfyjpWU" style="width: 100%; height: 100%;">Your browser does not support iframes.</iframe>
79
+
</div>
80
+
<div id="links-four-woods-page" class="page">
81
+
<p>Under construction...</p>
82
+
</div>
83
+
</body>
84
+
</html>
+1
public/blog/index.html
+1
public/blog/index.html
+1
public/blog/item/index.html
+1
public/blog/item/index.html
+4
-3
public/index.html
+4
-3
public/index.html
···
5
5
<link rel="stylesheet" href="/icons.css" />
6
6
<script src="index.js" type="text/javascript"></script>
7
7
<title>CityboundForest - Home</title>
8
+
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
8
9
</head>
9
10
<body>
10
11
<div id="nav-links">
···
67
68
<button type="button" onclick="window.location.href='/#links-four-woods';">The Four Woods Podcast</button>
68
69
<button type="button" onclick="window.location.href='/#links-electronic-music';">Electronic Music</button>
69
70
<iframe src="https://mirlo.space/widget/trackGroup/2740" style="width:100%; height: 371px; border:0; border-radius: 4px; overflow:hidden;" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts">Your browser does not support iframes.</iframe>
70
-
<iframe width="640" height="360" src="https://youtube.com/embed/K1smIMmJ2uQ">Your browser does not support iframes.</iframe>
71
+
<iframe width="640" height="360" src="https://youtube.com/embed/K1smIMmJ2uQ" style="width: 100%; height: 100%;">Your browser does not support iframes.</iframe>
71
72
</div>
72
73
<div id="links-electronic-music-page" class="page">
73
74
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/polyphonics-in-b-minor';">Stream Polyphonics in B Minor</button>
74
75
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/lightning-marbles';">Stream Lightning Marbles</button>
75
-
<buton type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/woods-n-wires';">Stream Woods n Wires</buton>
76
+
<button type="button" onclick="window.location.href='https://distrokid.com/hyperfollow/wiresandbranches/woods-n-wires';">Stream Woods n Wires</button>
76
77
<iframe src="https://mirlo.space/widget/trackGroup/2743" style="width:100%; height: 371px; border:0; border-radius: 4px; overflow:hidden;" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts">Your browser does not support iframes.</iframe>
77
-
<iframe width="640" height="360" src="https:///youtube.com/embed/4vEkTfyjpWU">Your browser does not support iframes.</iframe>
78
+
<iframe width="640" height="360" src="https:///youtube.com/embed/4vEkTfyjpWU" style="width: 100%; height: 100%;">Your browser does not support iframes.</iframe>
78
79
</div>
79
80
<div id="links-four-woods-page" class="page">
80
81
<p>Under construction...</p>
+2
-1
public/portfolio/index.html
+2
-1
public/portfolio/index.html
···
4
4
<link rel="stylesheet" href="/style.css" />
5
5
<script type="text/javascript" src="/portfolio.js"></script>
6
6
<title></title>
7
+
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
7
8
</head>
8
9
<body>
9
10
<div id="nav-links">
···
19
20
<p>The San Joaquin County Office of Education held a two-week filmmaking workshop in June 2012. After a full day of shooting at a daycare in Manteca, CA, the crew premiered the film at the Lincoln High School theatre to a packed house. The crew then held a Q and A session with those in attendance.</p>
20
21
<p><b>Skills</b>: Final Cut Pro X, Adobe Premiere Pro, Foley Art, Lighting Setup</p>
21
22
<p><a href="https://www.imdb.com/title/tt2644836/">IMDB Link</a></p>
22
-
<iframe width="854" height="480" src="https://youtube.com/embed/1g2i2bYbwC8">Your browser does not support iframes.</iframe>
23
+
<iframe width="854" height="480" src="https://youtube.com/embed/1g2i2bYbwC8" style="width: 100%; height: 100%;">Your browser does not support iframes.</iframe>
23
24
</div>
24
25
<div id="cansat-page" class="page">
25
26
<h3>CanSat</h3>
+13
-7
public/style.css
+13
-7
public/style.css
···
10
10
font-family: "Izayoi Monospace";
11
11
}
12
12
13
-
@media only screen and (max-width: 700px) {
14
-
.page, #nav-links, #blog-content {
15
-
width: 100%;
16
-
}
17
-
}
18
-
19
13
.page, #nav-links, #blog-content {
20
14
width: 50%;
21
15
margin: 0 auto;
22
16
}
23
17
18
+
@media (max-width: 700px) {
19
+
.page, #nav-links, #blog-content {
20
+
width: 100%;
21
+
}
22
+
}
23
+
24
24
.page.active {
25
25
display: block;
26
26
}
···
48
48
padding: 5px;
49
49
}
50
50
51
+
@media (max-width: 700px) {
52
+
.floated {
53
+
width: 200px;
54
+
}
55
+
}
56
+
51
57
.portfolio-image {
52
58
width: inherit;
53
59
}
···
67
73
color: white;
68
74
border-color: white;
69
75
transition: all ease-in-out 100ms;
70
-
}
76
+
}