Aquatic
Hunt Game

December 2023

HTML / CSS / JavaScript / Adobe Illustrator

Aquatic Hunt is an educational game created to learn about the various aquatic ecosystems in the world, featuring 4 levels and 40+ types of aquatic life.

Live Project

Project
Overview

Aquatic Hunt is a browser-based game set across four distinct environments — The Coral Reef, Mangrove Swamp, Forest River, and Lakeside Beach. The game challenges players to find hidden objects within each scene while learning about the diverse flora and fauna of these vital ecosystems.

By combining engaging gameplay with informative content, Aquatic Hunt aims to raise awareness about the importance of preserving aquatic wetlands and foster environmental stewardship among players of all ages. Shown below is the user journey which was the starting point in this project.

Objective
& Challenges

During the development of Aquatic Hunt, the primary goals were to efficiently map assets from design to development using SVGs via Adobe Illustrator and implement a data management system for tracking found or unfound items.

Challenges included ensuring cross-platform asset compatibility and designing an intuitive user interface for displaying items, score, and the timer. Asset creation involved research into wetlands and species or objects usually found in them. Due to the nature of aquatic life, they can adapt to various types of wetlands, hence this game only focuses on species most commonly found at a specific wetland type and may not be 100% accurate.

The
Process

Starting off with picking a style for the game, I went with the pixel art style and created proofs of concept with smaller aquatic animals.

Next, I created the 4 scenes and made a list of all objects to display, which would include the aquatic life and objects found in those specific wetlands. These scenes need to accurately represent the biome.

I then transformed the scenes to pixel art style levels and created the layout for the information to be displayed, and picked a matching font.

After this, the assets were exported to Adobe Illustrator, where special identifiers were assigned to the objects to make them easily identifiable in code, followed by the actual coding itself.

The
Final Product

The game is hosted on my domain and can be viewed by clicking the link below. Please note this game will only work properly on tablets and desktops.

Live Project