Save RainCity

Project Overview

Save RainCity is a website created to help spread the word of the CEAP (Climate Emergency Action Plan). You play as the Mayor of RainCity and make difficult descisions between saving the environment and pleasing your people. Will you save RainCity or will you get kicked out and the world ends due to pollution?

Experience Summary

Save RainCity was a Spring project I had to do while in the CST, Computer Systems Technology, program at BCIT. I worked along side four other programmers to build and host this website. This project taught me how to work in an AGILE workflow environment. I had daily meetings with the team, weekly meetings with the client and had to keep a strong communication between both in order to deliver a product up to the client's standard.

I also learned many technical skills from this project, such as reading/writing to a database and hosting a website. This was the first team based programming project I ever did, so being able to keep up with the communication and integrating code with other people was a challenge. Through these challenges I've learned how to be better at keeping up with team members as well as how to write modular code so integration would be simple and a lot less buggy.

I was part of this project throughout the entire development cycle until release.

LeaderBoards

Being tasked to creating the leaderboard I had to find a way to dynamically add elements with info retrieved from the database. I acomplished this by finding the "scores" table in our FireStore database and retriving the collections from it. Since the database was unsorted to I used a quick sort to sort the items and took the first ten elements to dynamically populate the page.

Character Customization

To create the character customization was quite simple as I only had to create arrays that contained the links to the image asset and have an index counter that would increase/decrease when you pressed a button. However, I quickly found out there was a major problem with the CSS and that each asset would not line up properly like they were supposed to. At first I tried to create a system that read the size of the asset and adjust the CSS accordingly, however that didn't work really well. So, I had to create a quick meeting with our artist and asked him to create all the assets the same size. After the meeting, the recreated assets all lined up properly with minimal work required of both mine and our artist's end.

About Us

Each one of our members in our team was tasked with an html page to write and since I was tasked with the About Us page I really wanted to make it stand out. So, I took the initiave to learn some more complex CSS with animations and 3D transforms and it made our about us page and each of our faces much more memorable.

With this new found CSS knowledge I was also able to apply it to another part of the project as well, the end screen.

Score Saving

In order to acomplish score saving in our game I had to figure out a way to write to our database. This was accomplished by my knowledge of finding the "scores" table then writing a new collection to it. However, just simply doing this would cause an issue with our leaderboards because you could save without having a name to it. So to fix this issue, I created a check to make sure the user was already logged in to our website, if not the it would request them to log in before saving the score.