# My Breakthrough Into Game Development!

The AP Tradeshow Card Game is definitely ranked in the top five of all of the projects I have ever done. It all started with the Consumer Electronics Show, or CES in 2016. The company I work for had been to the show regularly for a few years, but months before the 2016 show, they announced that the show's format was going to work a bit differently. They put the word out that they were looking for ways to increase engagement within the booth, and this is when I got to thinking. Although I didn't know exactly what I was going to be making at first, I knew that this would be a perfect opportunity to demonstrate my passion for gaming, and my interest for game development to my manager.


I got to work developing what basic knowledge of game development that I had. I had already played around a little bit with the Unity game engine, and I figured that this would be a good choice since I could script the game in C#, a language I already knew how to handle. My first idea for the game was very ambitious. I had planned to have five different mini games, all vastly unique. After realizing that I would have to keep the overall playtime to around two minutes per player, I decided to use just my favorite mini game, which was a card matching game. I also figured that since the show is held in Las Vegas, a card game theme would fit nicely. Once I landed on this theme, I was able to start gathering assets for the game. I downloaded some free game sounds, and played around with them in Audacity until I got the sounds that I wanted. I modeled the cards in Blender so that I could get a nice 3D flipping animation within the game. Once I had all of this, I used my free time to develop a proof of concept, pitched the idea, and then got approval to fully develop the game for the show.


## Features

### State Machine Programming
The concept of state machines is actually a concept that I derived from some of the hardware projects that I completed in the past. The basic concept is that every game object can be found in one of any finite number of states at any specific time. While in any state, the object responds to outside influence and changes state accordingly. The state machine for each card started in a “hidden” state. Once a card was clicked in this state, the card entered the “flipping” state, and would animate. Clicks were ignored during this state, all the way through to the “visible” state. Once a second card was chosen, the state machine would determine if the card was a match. If there was a match, the card enters its “disappearing” state, and then finally its “disappeared” state wherein it vanishes. If no match is detected, both cards re-enter the “flipping” state, and are finally returned to their “hidden” states.


### Real Time Overhead Display
The game was meant to attract passers by, and did so with the help of a large overhead display above the play station. As players were hitting high scores, or signing up to play, messages would display on the overhead screen in real time. At any time throughout the day, players could return and see how their high score held up against other players. This functionality was achieved by having the game station Android tablets send an HTTP request to a Windows server running a WCF service. The request would have encoded player data, which the service would parse and display appropriately. one of several prizes. 

Roles: Designer, Full Stack Developer. A mobile video game developed for the Android operating system, using the game engine Unity. The game was featured at the 2016 and 2017 CES Tradeshow events.

large_tradeshowgame.png

medium_tradeshowgame.png

small_tradeshowgame.png

thumbnail_tradeshowgame.png

tradeshowgame.png

Tradeshow Card Game

# A Place to Share my Development Work
Welcome! This site hosts details of projects I've worked on, along with a Blog of software engineering concepts I've learned and would like to share. Developing this website was a fun little challenge itself, as I wanted to put together something that was both convenient to keep updated, and dirt cheap to host. Here's an overview of how I've managed to do this. 

## Backend: Strapi
Choosing a tech stack was a fun exercise and finding the most cost effective way to produce and serve a modern blog site. It was important to me to have some form of content management system (CMS), but the site should overall be as cheap as possible to run and host. I've used systems like Opencart in the past, where I was able to hack together a CMS from an e-commerce platform. This works alright if you plan on having some kind of shopping system in your website but locks you in to using PHP and we're looking for something a bit more modern. 

Enter [Strapi](https://strapi.io/), a "headless" CMS which lets you put together a collection of content, and serve it with a simple REST API. With this system I could split the layers of content creation and content presentation, allowing me to go with any Frontend stack I want. For this I chose NextJS.

## Frontend: NextJS
The most important feature of NextJS for this website is Static Site Generation (SSG). This feature of NextJS allows me to compile a fully static website with all of the content I've written with Strapi. The magic happens with the special NextJS function `getStaticPaths()` that allows you to define the list of content to crawl at compile time. When you run `yarn build`, NextJS crawls the pages retrieved in `getStaticPaths()` and renders out HTML files for each post. With this setup, we can fully host the site with a lightweight server like Nginx, no need for a back end server language!

More details about how exactly I host this site as cheaply as possible, as well as details on how I automate updates to the site will be coming up in future posts! 

Blog and portfolio website built using Strapi headless Content Management System, and Next.js as a front end. 

Tradeshow Card Game

jeremycastillo.net - This Website