Invader Crusaders
Play the game here.
Client
Invasive Species Council of British Columbia
Project Type
Interactive Web Game
Timeline
Spring-Summer 2020, Winter 2021
Tasks
Visual Design, UI/UX Design, Illustration, Animation
BACKGROUND
Education made fun
The Invasive Species Council of British Columbia (ISCBC) is a non-profit organization that is dedicated to reducing the spread of invasive species in BC through educational programs and initiatives. ISCBC wanted a fun and engaging solution to help educate youth about invasive species by online means.
Goal
Create an educational web game for ISCBC that teaches children ages 8-16 to learn more about invasive species found in British Columbia. Learning objectives include:
- Identify common invasive species found in BC
- Educate youths on their impact on native species
- Inform them on what they can do to prevent the spread of invasive species
Moodboards
EXPECTATIONS
Scope
All illustrations had to be original and appropriate for a classroom environment. Illustrations should adequately portray given scenarios in the game, where each scenario needed 3 images each: scenario, positive outcome, and negative outcome. Everything had to be scalable to fit both desktop and tablet interfaces.
First steps
With our UI/UX designer, I first collected information on popular game graphic styles, which ranged from dimensional vector graphics, to simple, flat, hand drawn illustrations. I created moodboards with distinct styles to show the project coordinators of ISCBC, and presented advantages and disadvantages of each style. Throughout the several weeks, I updated ISCBC on graphic assets that were produced each 2 week sprint and implemented their feedback after each meeting.
Scenario Illustrations
VISUAL DESIGN
Flora and fauna
For the in-game species, we chose to go for more realistic vector renderings. When presenting ideas to the ISCBC team, they stated that this style would help youth identify native and invasive species in wild. In total we showcased 17 native and invasive species.
Scenarios
When it came to the scenario illustrations, we went for a more cartoon approach to attract both youth and their parents. It was also imperative to showcase diversity, as we wanted kids from all backgrounds to be able to see themselves in different situations and encourage them to take part in preventing the spread of invasive species. Over 60 original illustrations were created to demonstrate the different kinds of scenarios kids may find themselves in.
ANIMATIONS
Bringing it to life
While the game was informative and challenging, the interface did not compare to current games on the market. This was when we decided to add in individual animations for each species to give it life. We also created an animated title screen that included all of the species in the game.
Species Animations
UX DESIGN
Unlocking challenges
A few months later into the pipeline, we were tasked to create a level unlocking system for the game. This way, first time players would be able to play through a tutorial to understand the game mechanics and unlock new levels with increasing difficulty. As the levels progressed, more species and initiatives would be introduced.
Together with the game designer and engineers, we designed a level unlocking system that allowed players to unlock levels sequentially, but also provide additional leeway if they wanted an extra challenge. Completing levels would also unlock badges that players were encouraged to collect if they replayed the game.
Badges
REFLECTION
Growing and learning
Overall, we were able to create a successful product for ISCBC. As stated in our Clutch.io review, they were impressed with the graphics and animation for their web game.
After completing this portion of the project for my internship, I received feedback from the team regarding pacing myself and planning ahead when it came to the illustrations. Had I started and planned out smaller portions of illustrations for each sprint earlier, I could have spent more time in creating more polished illustrations with a more dimension, action, and a consistent colour theme. This project also taught me the importance of colour theory and contrasting elements.