Furry Fireball

The Group with Mr Ang
Home
Profile
Campaign
Game
Friends
Leaderboard
Inventory
Store
Lucky Draw

Inspiration

Our team wanted to enjoy our coding journey and spread that joy by letting others play our game. So, we chose to work on this game. It allowed us to display our utmost creativity. Additionally, we decided to do something different and design a game instead of the typical e-commerce websites we create every semester to spice up the project this semester. By developing a game, we may examine the various aspects we must take into account, such as design, usability and game logic. While this project may have been difficult for us, the fresh idea behind making this game served as our inspiration and motivation to both design and build a fun game.

Gameplay

Get to play as a dog, but not just any ordinary dog. Being a fiery furry, this dog has mythical pyro abilities which can be used to incinerate any enemies that get in the way. However, it needs your guidance and training to be able to learn new pyro abilities which can be unlocked as you train this dog by fighting against nightmarish enemies. Help this fiery dog to unleash its full potential!

How we built it

The team thought through the features together and picked the most suitable features to implement
Team members choose the features they are interested in and implemented them
Designed the UI
Coding & Bug fixing

Tech Stack

Built as a PERN Stack:

PostgreSQL (Database)
ExpressJS (Backend)
ReactJS (Frontend)
NodeJS (Environment)

Challenges we ran into

Animation of the features like daily reward, lucky draw and player animations
React Query
Designing of UI
Database Allocation
Global functions & Variables

Kehan

This project would be my favorite assignment since year 1. I learned to be more patient when solving bugs and had taken the chance to explore my areas of interest. It was my honor to have a group of excellent teammates and Mr Ang as my lecturer, I really enjoyed this journey. I am a slow leaner but I'm always willing to try things out. I believe I will remember the time I rushed CA2 after recovering from covid. It was a tiring and stressful time. The key challenge I faced was trying to build an authentication server. Luckily with the help of Mr Ang I made clear about the logic flow. Honestly, the completion of this project exceeded my expectation. I would say that the Furry Fireball is the result of a combination of energy and time from all team members. We would not have been able to accomplish this project if we were not in the same team. Overall, it is one of the best memories I had in SP! Thanks again to my teammates and Mr Ang! Your are the best! 🥳

Vernell

I had trouble doing the spinning box animation for the daily rewards and understanding the code to change some parts of the css code. I took the spinning box code from codepen, and applied it to my project. However, there were some problems with the code and I had to understand where it had gone wrong. So, what I did was I searched online for what I didn't understand and did trial and error on the code. I learned how to use and edit animation in css, and that when meddling with readymade code, we must be patient in editing the code.

Akshay

I faced difficulties when doing the game animations in Html Canvas, namely fireball and revival. Html Canvas was a new topic which I have never ventured through before. It was a new experience for me but definitely a fun one as it gave me the opportunity to be creative with my animations and learn something new. The difficulties I faced regarding this matter is regarding how to manage player animations when they are already in the middle of another animation, such as allowing the player to shoot fireballs while they are running. There are no online tutorials directly addressing this issue so I had to be resourceful and make use of the multiple insights I gained online to tackle this problem. Revival animation was another issue since it was not included in the sprite sheet. However, I quickly realised that even if the revival animation was unavailable, the death animation is. So I just reversed the death animation to animate the player revival (a cool easter egg if you're able to see it 😅).

Robin

Trying to understand state management took longer than I’d like to admit. But after watching videos on React and trying it out myself I gradually got the hang of it. I also ran into a lot of problems as I was trying to convert my pages to React. When I couldn’t solve a problem, I would turn to online resources and teammates for help and consult them on what I can do to solve them. Most of the times, these sessions were fruitful, and I was able to solve my problems. The learnings from these consultations, enabled me to grow and apply them in similar situations. So, from this, I learnt that reaching out for help is a good way to learn more and grow your knowledge.

Accomplishments that we're proud of

Given the time period of less than 3 months, we were able to do the majority of our intended features and make them work well together!

What we learned

We learned to build a full stack game website. The team step out of our comfort zone and tried out something new. It is important to support and help each other when working in a team. Through out this journey, we gained a strong ability to work together.