garstka.dev

Author: Chris

  • Cycle Of Steel

    You can play the web exported version here:

    https://garstka.dev/static/cycle_of_steel/index.html

    Or try it out on steam:

    https://store.steampowered.com/app/3136590/Cycle_of_Steel

    This was my capstone project for my senior year at DePaul and developed in a group.

    It features rogue-like gameplay with pixel art graphics in a dystopian future where you have to battle through robots.

    It was developed in unity using built-in tilemap features, and a relatively simple random dungeon generation system, where it tried to generate more difficult rooms the further you are from the center. Each dungeon room was designed, but the order you encounter them in and the loot you obtain is random.

    I may write more about the mechanics at some point, or better yet cycle of steel 2?

  • Canvas Renderer

    My weird first renderer using a 2D canvas element to draw primitives.

    https://garstka.dev/static/canvas_renderer/index.html

    So first of all, this is really not the right way to draw things, webgl exists, and I actually have another project here. But this is dear to my heart because it was an old project I attempted back in high school and it really almost worked in so many ways. It was at the time the closest I could get to truly coding something from scratch, even if I didn’t realize at the time that canvas was anywhere near low level graphics. But nevertheless I learned a LOT about graphics programming on my hunt for visualizing 3D cubes (I should eventually link even older prototypes I have which are even jankier).

    This is an updated version of that initial project, with the same… mechanics for 3d rendering but everything surrounding it cleaned up much nicer. The webgl has even more modern patterns but this already is way cleaner in my opinion.

    So for how it works, essentially this is rendering isometric and drawing full triangles ordered by the centroid… there is no depth buffer or anything, two triangles cannot intersect. This surprisingly works pretty well given that massive limitation, concave low poly shapes struggle the most from this, but with small enough polys the centroid is a pretty good estimate for depth and you just get some visual artifacting around the edges while rotating.

    Because this is isometric, we can skip most of the projection and matrix math that would normally be done for 3D affairs and just use the x and y values:

    JavaScript
    const x1 = (v1.x * S) + transform.x; 
const y1 = (v1.y * S) + transform.y; 
const x2 = (v2.x * S) + transform.x; 
const y2 = (v2.y * S) + transform.y; 
const x3 = (v3.x * S) + transform.x; 
const y3 = (v3.y * S) + transform.y; 
drawTriangle(x1, y1, x2, y2, x3, y3, shaded_color);


    Here I was applying some scaling and translation, although I would write this differently even now looking back at it.

    Maybe I’ll write more details some other time but that’s all I got on my mind for now.

  • The Cycle of Hosting

    This website isn’t even fully up and built yet but I already wanted to write a blog post about how funny it is this is a word press website.

    Working our way back, my last website was using a C# standalone webassembly project. This was interesting to me because I had started using a lot of C# at work, so I was hoping it would make developing a website fun. Unfortunately I think that whole technology chain is cool, but overly bloated and conplicated for what I was trying to do, as well as not achieving what I really wanted. I did not realize it at the time but I really did want a dynamic website, because writing a blog post in some hybrid razor language on my desktop before building and pushing to github was not a workflow that encouraged posting a lot, it was a hassle and I did not feel like cleaning up my pages. Immediately wordpress is better in all aspects for this because its built with blog posting in mind, even from mobile(!).

    Before that I used hugo to write html pages, and it allowed html reuse through some snippet system (I forgot the proper terminology). This may have actually been nicer if you want a completely free way to host a blog as it comes with themes and a way to insert markdown blog posts as pages. It has the same core issue as the C# website, and if I were to go back to staticslly generated only, I would expore other generators like Jekyll, as everything for web development really is easier done in html/css/js.

    Before that it was a manually coded static site also hosted on github pages, this is the most flexible if you want to explore the languages from scratch, and I think it was really worthwhile, but not sustainable, I will be interested in how flexible wordpress is for presenting more raw html and javascript for if I want to showcase old or external web projects.

    And to complete the cycle, I do remember my first website was actually hosted on wordpress.com (very different from self hosted which you download from wordpress.org). So how we have come back to where we started…