Projects / CoS Gestalt

Curse of Strahd: Gestalt is a webcomic based on the Dungeons & Dragons campaign Curse of Strahd. The comic is written by a friend of mine, and I was asked to create a website to host it. The site is built from the ground up using pure HTML/CSS/JS, with no frameworks or libraries, which I prefer for smaller projects due to the granular control it gives me over the site's appearance and behavior. The comic navigation is also done from scratch using custom JavaScript.

The hosting service we chose is a managed one, which gave us less freedom for the server-side code, but also meant we didn't have to worry about writing a backend. It would have been nice to write a more robust API on the backend, but this way kept things relatively simple and meant less work overall. It also meant I had to familiarize myself with configuring managed servers (such as setting up .htaccess files), which was a good learning experience for future web development projects.

The comments section under each page uses Hyvor, a third-party commenting service. This was chosen because it is relatively lightweight, and easily integrated into the site. It also has a free trial, which is always nice. The only issue I ran into with Hyvor was that its styling seemed to clash with the site's CSS, and their styling settings seem to be slightly broken, so I had to override some of its styles to make it fit in better.

The bulk of the work on this project was the comic navigation. The custom navigation script uses the query string to determine which page to load, and understands that negative numbers navigate relative to the last uploaded page, and dynamically updates the controls when the most recent page is reached. It can also take input from the keyboard to navigate with the arrow keys. The navigation script also handles the comic page images, which are loaded dynamically from the server to avoid having to reload the HTML every time user navigates to a different page. The URL is also updated dynamically to reflect the current page, so that users can share links to specific pages. This is done using the History API, which allows the URL to be updated without reloading.

This being one of my first full-scale projects for a client, I also compiled documentation in a user manual for future maintenance of the site. This included instructions on how to add new pages, add content warnings to pages, and add news posts to the front page. Little future intervention on my behalf is expected, so I wanted to make sure the client had all the information they needed to maintain the site themselves. The site's source code will also eventually be entirely documented so that future collaborators can easily understand how it works.

"Micah knew what I wanted before I knew I wanted it. They were incredible to work with."