nolan-casey-website/html/pages/portfolio.html

179 lines
12 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nolan Casey Portfolio</title>
<link rel="stylesheet" href="/css/style.css">
<link rel="icon" href="/images/nolanLogo.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Balthazar&family=Germania+One&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Germania+One&display=swap" rel="stylesheet">
<script src="/js/colors.js"></script>
</head>
<body>
<header>
<a href="/index.html" class="logo"><img class="header-logo" src="/images/nolanLogo.png" alt="Nolan Casey logo"></a>
<a href="/index.html" class="header-button">Link Hub</a>
<button type="button" id="brightness" onclick="toggleBrightness()"><img id="brightness-icon" src="/images/darkMode.png" alt=""></button>
</header>
<div class="spacer"></div>
<div class="box vflex thin">
<h1>Portfolio</h1>
<hr>
<p>
Welcome to my portfolio! Here I will have links to my public projects and their source code (if available).
</p>
<br>
<div>
<h3 class="left">This Website!</h3>
<h5 class="left">Category: Personal Project</h5>
<hr class="left">
<img src="/images/nolanLogo.png" alt="Nolan Casey logo" class="lfloat about-image-v">
<p class="left">
There is a lot more information about this site on the <a href="/pages/about.html">about page</a>, but
I will give a shorter version here. This website serves as both a hub for my self-hosted services and
a portfolio for recruiters to see what I can do. It is hosted on my own hardware on which I am the sole
administrator. The source code for the website itself is also available over on my Gitea site!
</p>
<h5 class="left">Links</h5>
<p class="left">
<a href="https://www.nolancasey.click" rel="noopener noreferrer">Main Site</a> |
<a href="https://gitea.nolancasey.click/nolan/nolan-casey-website" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
<br>
<div>
<h3 class="right">Sweep Miner</h3>
<h5 class="right">Category: Personal Project</h5>
<hr class="right">
<img src="/images/mine.png" alt="Mine" class="rfloat about-image-v pixel">
<p class="right">
I had some downtime and wanted to work on a project. One of my favorite games is Minesweeper, so I decided
to make a clone of it. It is currently under development, though the actual game logic is completely done.
All that is left is to hook up the main menu, add sounds, and redo the input method so that I can port it
to mobile devices.
</p>
<h5 class="right">Links</h5>
<p class="right">
<a href="https://gitea.nolancasey.click/nolan/Minesweeper" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
<br>
<div>
<h3 class="left">Water Shader</h3>
<h5 class="left">Category: Classwork</h5>
<hr class="left">
<img src="/images/water.png" class="left about-image-h"></img>
<!-- <img src="" alt="Water shader picture" class="left about-image-h"> -->
<p class="left">
This project was made for CS5641 Immersive Virtual Environments. It consisted of me researching how
different water shaders were made and experimenting with making some myself. I also worked on a buoyancy
algorithm, but only one was finished. None of the shaders turned out quite how I wanted, but I learned
a ton about how these kinds of shaders work. <br><br>
In the end, the things I have functional are a sum of sines approach using e^sin as the wave, and a sum
of sines approach using gerstner waves as the wave. The e^sin shader also has a compatible buoyancy algorithm.
</p>
<h5 class="left">Links</h5>
<p class="left">
<a href="https://gitea.nolancasey.click/nolan/water-shader" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
<br>
<div>
<h3 class="right">Croak Counter</h3>
<h5 class="right">Category: Classwork</h5>
<hr class="right">
<img src="/images/croak.png" alt="Croak Counter home page" class="rfloat about-image-v">
<p class="right">
Croak Counter was a group project for CS4760 User Interface Design and Implementation class. I worked mainly on interacting with
Google spreadsheets and storing survey data with local storage. I also worked on creating the survey pages. Most of the styling
was handled by my teammates. <br><br>
As for functionality, Croak Counter serves as a way for citizen scientists to provide information on frog populations to
frog scientists in the Keewenaw. The site provides information on different frog calls, their mating seasons, and instructions
on how to conduct a survey. Users confident in their ability to identify frogs based on their calls can use the advanced form,
while the novice form just allows for a general "how many frogs do you hear" selector.
</p>
<h5 class="right">Links</h5>
<p class="right">
<a href="https://2025-ui-sp.github.io/5-Frog-Mapper/" target="_blank" rel="noopener noreferrer">Github Deploy</a>
</p>
</div>
<br>
<div>
<h3 class="left">Speedin' Santa</h3>
<h5 class="left">Category: Game Jam</h5>
<hr class="left">
<img src="/images/speedin.png" alt="Speedin' Santa cover art" class="left about-image-h">
<p class="left">
Speedin' Santa is a game I made in one month for a game jam. The theme was special delivery, and since it was a
December game jam, I decided to go with a Christmas theme. The gameplay consists of steering Rudolph through rings
that give a speed boost, while avoiding rings that slow you down. In order to score points, you have to make stops
at marked houses and help Santa down the chimney. <br><br>
The game was made using Godot 4.3 and is available to play in your web browser.
</p>
<h5 class="left">Links</h5>
<p class="left">
<a href="https://nc543.itch.io/speedin-santa" target="_blank" rel="noopener noreferrer">Itch.io</a> |
<a href="https://gitea.nolancasey.click/nolan/speedin-santa" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
<br>
<div>
<h3 class="right">Shorty Shooters</h3>
<h5 class="right">Category: Husky Game Development</h5>
<hr class="right">
<img src="/images/YdrBeQ.png" alt="Shorty Shooters gameplay" class="right about-image-h">
<p class="right">
Shorty Shooters is a game that we made in Husky Game Development. It was created using Godot 4.3. We spent one semester working on it,
before most of the developers had to leave the enterprise for various reasons. <br><br>
The game is a mix of a 2D shooter and a 2D fighting game. Each player controls a little guy. The movement options are fairly limited.
The little guys can run side to side slowly, jump, and wall jump. The real movement options come into play once you grab a gun. Due to
these guys being little, they can be launched around by the recoil of the guns.
There are a lot of details I could go into about this game, but I will leave it for you to discover the features and quirks. I will say
that it is more fun than expected to get in a lobby with some friends and launch yourselves around for an hour. <br><br>
I handled all of the multiplayer code for the game, as well as tweaking features and fixing issues gamewide.
</p>
<h5 class="right">Links</h5>
<p class="right">
<a href="https://huskygamedev.itch.io/shorty-shooters" target="_blank" rel="noopener noreferrer">Itch.io</a> |
<a href="https://github.com/HuskyGameDev/2024f-team5" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
<br>
<div>
<h3 class="left">Raise Your Wand</h3>
<h5 class="left">Category: Game Jam</h5>
<hr class="left">
<img src="/images/Ymi3pl.png" alt="Raise Your Wand gameplay" class="left about-image-h">
<p class="left">
Raise Your Wand is the first game I ever submitted to a game jam. The gameplay is focused around dualing another wizard. Throughout playing,
you can unlock several spells with different elements and attributes. Some spells are defensive, some offensive. Some have long cast times,
some short. Spells vary based on cooldown speed as well. A unique twist to this game is that you can weaken or destroy your opponent's offensive
spells with your own. If your opponent is casting fire bolt, cast rock throw to cancel it out. If it is timed so that they collide in midair,
the earth attack has an advantage over the fire attack. <br><br>
Each spell has its own unique animation, so with enough experience, you can always know what your opponent is going to cast. Find the right
combination of spells against your opponent's and cast them wisely, and they will not be able to damage you. <br><br>
Raise Your Wand was made over a month while I was working full time. There are still a few bugs in the game, but I think it turned out fairly
well. If I were to revisit the project, I would try to finish implementing the legendary class of spells that exist in code, but none were
finished enough to have usable.
</p>
<h5 class="left">Links</h5>
<p class="left">
<a href="https://nc543.itch.io/raise-your-wand" target="_blank" rel="noopener noreferrer">Itch.io</a> |
<a href="https://gitea.nolancasey.click/nolan/Raise-Your-Wand" target="_blank" rel="noopener noreferrer">Source Code</a>
</p>
</div>
</div>
<br>
<div class="box hflex thin">
<a href="https://github.com/nc5432" class="site-icon" target="_blank"><img class="icon-image" src="/images/github-mark-white.svg" alt="Github link"></a>
<a href="https://gitea.nolancasey.click" class="site-icon" target="_blank"><img class="icon-image" src="/images/Gitea_Logo.svg" alt="Gitea link"></a>
<a href="https://www.codewars.com/users/nc543" class="site-icon" target="_blank"><img src="/images/codewars.svg" alt="Codewars link" class="icon-image"></a>
<a href="https://nc543.itch.io/" class="site-icon" target="_blank"><img src="/images/itchio-logo-textless-white.svg" alt="Itch.io link" class="icon-image"></a>
<a href="https://steamcommunity.com/id/nukgroik/" class="site-icon" target="_blank"><img src="/images/steam.png" alt="Steam link" class="icon-image"></a>
<a href="https://www.linkedin.com/in/nolan-casey-25a32a288/" class="site-icon" target="_blank"><img src="/images/LI-In-Bug.png" alt="Linkedin link" class="icon-image"></a>
</div>
</body>
</html>