Hello!
I am Justin Mariner and I make things
Projects
Intelligent Living
Intelligent Living is a Case Study assignment for my first JavaScript course in college. I went into this already being very fluent in JavaScript, so instead, I put focus on practicing use of Bootstrap, as well as working on UX and design. The site is built with the Jekyll HTML pre-processor, which removes the need to copy-and-paste HTML across the site. Jekyll also allowed me to move all of the data to JSON files, and have HTML generated accordingly.
Aim to Learn
Aim to Learn is an educational shooter game styled after Space Invaders. The player controls a ship at the bottom of the screen and is given a question to answer at the top of the screen. Possible answers fall downwards towards the player’s ship until the correct answer is shot. This game was my case study assignment for my advanced Java course, where I worked with two team members to create the entire game. I ended up writing all of the code and my team members created with the sound effects, background music, art, and questions/answers. It included much planning, inlcuding a requirements document and storyboards.
MathSlash
MathSlash is a web-based video game that I created in my senior year of high school. In it, you are a knight that tries to fight away enemies by quickly completing certain mathematical tasks. A friend handled the art and story, and I wrote all of the code from scratch. In this, I used SCSS and Babel for the CSS and JavaScript portions, jQuery for most HTML manipulation, and MathJax for handling of formatting fractions and exponents. I also had to create a dynamic CSS system that allows the animation keyframes for the sprites to be generated through JS. Looking back, there is a ton of room for improvement now that I’ve become more experienced.
High School English
This is two simple sites containing work from my Senior high school English class. One site is based on the renaissance and was made solely as practice for creating the second site using the same layout. The second site, which is the main one, contains my English portfolio from all throughout high school. In it, I created a embedded document viewer that used an online Word document to HTML converter called Zamzar. This site also used Jekyll and was the first time I had used it. I even learned a bit of Ruby so that I could understand Jekyll plugins. Also note that at this point in my career, I had not even thought about good webpage design standards, so the color schemes and layouts aren’t the greatest.
Topple Chess
Like my MathSlash game, Topple Chess was created for my junior year high school symposium. In general, it is a chess game with a twist: each player is forced to sacrifice a piece of their choosing every few turns (hence “topple”). Topple Chess is the work of myself and two classmates, one who handled the custom art for the chess pieces and another who helped me with the logic of the code. It used no precompilers for any of the HTML, CSS, and JavaScript, but still uses jQuery for HTML management. The game also includes advaced drag-and-drop control via interact.js. Similar to MathSlash, this game features dynamic CSS, but this time it is used to have the game interface scale with the browser window. The core feature of this game is that it was created with network capability using Node.js and socket.io, meaning games can be played remotely between two people on different machines. The connection is made by using a “game code” that both players must enter to join the same game. The networking code using socket.io isn’t great, and after years of additional practice, I could definitely improve upon it.