Interaction Designer & STEM Educator
portfolioproject_Split Screen copy.png

Web Gamification

Motion designs to compliment a proposed competition enhancing app. 

Katlin Walsh - Interaction Designer & STEM Educator

image_Split Screen copy 2.png

The Polar Bear Project

Web Development, 3D Model, Social Change

 

View Project

Live Website

Proposed Client

Families with Young Children, World Wildlife Fund

 
 

Teammates

Katlin Walsh

Duration

10 Weeks 

My Roles

3D Modeller, Developer, Key Researcher

 
 
 

 

00 Problem Overview

You Don't Actually Care.

As the world is affected by global warming, deforestation, and melting ice caps, humans continue living their lives as normal. The truth of the matter is that most people don't care, or understand the truth about life for polar bears.

 

Website Goals

Educate an audience using appeals to emotion to allow them to understand the severity of global warming on polar bears. Make people feel something in reaction to the website. 

Play the Live Version

 
 
 

01 Campaign Research

Polar Bears... This Again?

Audience

Using stuffed animals as a vessel for communication, World Wildlife Fund targets families with young children to educate the inheritors of the earth; much like the final product created. 

medium

As global warming is a global problem, the final product focused on a digitally accessible website which connects users to accurate information from the World Wildlife Fund. 

Branding

World Wildlife Fund's website was largely used to focus on a set colour scheme with artic shades to inspire a deeper connection from the audience.

 
 

02 User Flows

Problems to Games

Bringing it Home

As the user makes their final choice, a full page of information overlaid on top of their game allows them to remain connected to previous screens, while consuming much needed information. 

 

 

 
 

03 wireframes

Light on Text

Young and inexperienced

Complicated website elements and effects were removed in favour of a young audience in order to highlight key information about polar bears.

Star of the Show

Image heavy layouts were featured to allow interaction from a young audience, providing space in a consistent corner for the user to interact with the website. 

 
 

04 digital Model

An Icy Tundra

Software

All models were created using Cinema 4D, creating objects and incorporating lighting to be exported into a Collada Model in the final website.

Simple Environment

A simple glacier in a pool of water was created, using a low polygon approach in order to make the atmosphere easily understandable to a young audience.

recognizable characters

As the World Wildlife Fund uses soft toys to start conversations about endangered animals, polar bears were modeled in a familiar art style to young children such as Minecraft.

 
 

05 Web Protoype

Building the Website

Javascript Modelling

The exported model was brought into the web page using JavaScript, animating both the glacier and bears with the click of a button. 

Making it Snow

Randomized snowfall set the scene by adding a mesh into the 3D space and slowly moving them down the screen. 

Adding the Overlay

As the final animation occurs, a full page information screen was added using an ID within the page container. 

 
 

06 Final Piece

The Polar Bear Project

Would you Rather?

The experience begins by asking simple questions based on the childhood would you rather game. The user is asked questions that a typical human would experience, next to what an average polar bear faces every day. 

Sinking Bears

As the player clicks on the 'Human' choices, polar bears slowly sink from view, killing the population of bears. There is no option for the users to undo their actions, as they continue making choices that humans think nothing of every day.

Maybe it's funny to You.

The experience ends when the user selects the Polar Bear's choice, or they have made the ice cap melt completely. The firm text displayed prompts the user to think about humanity's actions to global warming, sparking potential converstations within families and providing educational resources. 

Play the Live Version