-
The idea
1a. Who are we?
1b. What is this?
1c. Why this idea?
1d. Inspirations
This is a project created by Teresa Cremonesi, Andrea Febres Medina, Filippo Ferrari and Cristina Pita da Veiga developed in the course of Creative Coding at Politecnico di Milano.
Creative Coding 2018/2019 (https://drawwithcode.github.io/2018/)
Politecnico di Milano - Scuola del Design
Faculty: Michele Mauri, Tommaso Elli
This project is an interactive game where the user has to find in the Amazon Rainforest, five different animals endangered or threatened (Sloth, Butterfly, Armadillo, Frog and Monkey) using a variety of tools: voice, keyboard, mouse... Through the time they spend playing with it, they will discover different characteristics of the animals and interact with the computer. We create also "fake animals" in the background, which are not really in the jungle, to distract the user. To start the game, the player has to use the tools, two of them have to be selected meanwhile the other two are active during all the game, so they can be use all the time.
The idea came from the lack of awareness about the problems that humans cause to the environment and to the animals. In the last years the number of species in danger or threatened has increased because of human acts and it has been declared as a “global epidemic”. Scientists estimate that up to 200 species die every hour. The deforestation of the Amazon, hunting and other human actions are destroying distinct species.
With this game the user will discover some species in danger. This is a way to make people aware about this problem: we want to create conciousness about our "global village".
- Interactive projects inspiration
Hidden folks is an inspiration for the project because of the idea of creating a big screen to find the animals. https://hiddenfolks.com/
Species in pieces is a website where animals in danger are creating with different pieces geometricaly, in this way you can discover more about endangered animals. http://www.species-in-pieces.com/
This project developed by propublica give us an idea of what we want to talk about: animals in danger of extintion. From this information we achive the idea of the project. https://projects.propublica.org/extinctions/
- Theorethical
We have selected the Amazon because is the biggest deforestation front in the world, as WWF explain, and is the home of the 10% of species in the planet. In this image provided by the ESA (European Space Agency) we can see how has increased the deforestation in the Amazon, one of the main reasons of the dissapearence of animals.
The Amazon is the world's biggest rainforest. Nearly two-thirds of the Amazon rainforest is found in Brazil, but it also cover other countries as Colombia, Peru or Bolivia. The Amazon River is, by far, the world's largest river by volume: 7.000 kilometers. But this incredible rainforest has a very big problem: human action. Unless the deforestation in the Amazon rainforest has been declining since 2004, is the biggest front in the world and, as explains WWF, interventions are needed to prevent a large-scale ecological disaster. Right now, a 20% of the Amazon biome has already been lost.
This butterfly is one of the most known, emblematic and favorite of all Amazon species. We choose it because is a butterfly protected and there are associations to preserve them because of their natural interest.
The Sloth is known because of his funny ralentization use in cartoon movies. But what we don't know is that there are different species of it, and one of them is in very danger. There are also another facts that we are not concern about: is a very good swimmer, and information that the user can learn at the end of the game.
Is not the most common of the monkeys but an important one. As the sloth, in this family, there are a lot of species of them, sometimes can be confused by others. It's very important for the enviroment because they play a key role in seed dispersal in the rainforest.
The giant armadillo is a huge animal (one meter long, the tail add another 50 centimetres). Their population has fallen by 30% - 50% in the past few decades. Some are also captured in an effort to sell them on the illegal exotic pet market.
This frog is popular, but also in danger. Their vivid colors atract a lot of people. The changes in the environment are making them dissapear even if they are one of the most ancient animal: that specie has a fossil record in the Palaeocene (65 to 53 million years ago).
- Visual
The idea was to create an illustration with a strong style focus on adults. The visual elements are colorfull and the background is black to hightlight the foreground objects. The illustration is full of plants, animals, vines, flowers, etc... to distract the user and make the goal of the game more complex. One of the last screens represents the aim of the project: showing information about the animals, the user can discover other characteristics of them and be more conscious about the situation of some animals in danger.
- Voice
With the speech recognition have been created interactions with two animals.
Voice tool: saying the name of the animals hidden, the user will find two of them. In this way, will appear the armadillo and the butterfly.
- Sound
The aim of the background sound is to create atmosphere and to move different objects.
- Keyboard
Keyboard tool: Pushing the space the user is able to move the plants and clicking over it he/she will see the hidden animal: the frog.
- Mouse
With the mouse the user can move around the screen and select the animals. Also the light and the banana tools work with that.
Light tool: some animals are sensible to the light (in this case the sloth). Activing the light appears a cover to search the animal moving the mouse.
Banana tool: clicking over the banana the users active the tool and when is aproximiting to the monkey the forest start to move so they can select the plant and see the monkey.
The project consist in different pages connected with buttons that finally arrive to the big screen of the rainforest. When the user finish, appears more screens with information about all the animals.
- Big screen
The main design problem we had was the Big Screen. At the beginnig we started with the idea of creating an illustration bigger than the canvas and where the user could move around. The main problem was that if we created it, we had to cut other parts, so we decided to create a fixed screen with all the elements, as Hidden Folks.
- Illustrations
We decided to do the sketch by our own illustrations. The illustration is made with a big amount of different objects and levels. A big important challenge was to organize and configurate them in different layers and also to manage the weigh of the files.
- Light
The light was one of the main interactions we wanted to create with the camera, but we found problems to create the reaction with the whole screen (at the beginnig the "moving screen" gave us a better interaction with light), so we decided to create a different way to use it. With a cover we develop a "light" to wake up the sloth.
var dlight = dist(mouseX, mouseY, windowWidth / 3, windowHeight / 9);
if (dlight < 20) {
light = true;
}
var dsloth = dist(mouseX, mouseY, windowWidth / 1.7, windowHeight / 3);
if (dsloth < 50) {
leavessloth = false;
light = false;
}
- Zoom and resize screen
Another problem was connected with the size of the screen: when the user zoom or resize the game, the background change. We manage the problem creating an "error" screen to avoid it.
if (windowWidth < 1100 || windowHeight < 620) {
push();
rectMode(CENTER);
rect(windowWidth / 2, windowHeight / 2, windowWidth, windowHeight);
textAlign(CENTER);
textSize(50);
text('THE AMAZON RAINFOREST IS BIG.', windowWidth / 2, 300);
textSize(20);
text('Do not change its dimensions. Love it the way it is. ♥︎', windowWidth / 2, 600);
fill(255, 0, 0);
pop();
}
- Buttons
To link all the screens we created different buttons with "if" conditions. The challenge was to write the right order of the screens without changing the whole code.
if (brad) {
if (butter) {
if (monkey) {
if (armad) {
if (frog) {
if (giraffa) {
// schermata finale giraffa e lupo
image(girlup, 0, 0, windowWidth, windowHeight);
image(refresh, 0, 0, windowWidth, windowHeight);
} else if (finale) {
[...]
}
}
}
}
}
- Coding sources
We used p5js, p5.dom, p5.sound and P5.speech. This are the main sources:
Coding train: https://www.youtube.com/watch?v=Rk-_syQluvc
https://www.youtube.com/watch?v=q_bXBcmfTJM
P5.js: https://editor.p5js.org/piecesofuk/sketches/SyBpNOJTb
https://p5js.org/learn/interactivity.html
P5.speech.js: http://ability.nyu.edu/p5.js-speech/
Processing: https://processing.org/examples/
Github: https://github.com/processing/p5.js/wiki/Positioning-your-canvas
Banana: https://www.google.com/url?sa=i&source=images&cd=&cad=rja&uact=8&ved=2ahUKEwjF09bP96HgAhVJ26QKHRk_DM8QjRx6BAgBEAU&url=http%3A%2F%2Fwww.freestockphotos.biz%2Fstockphoto%2F15912&psig=AOvVaw2cnhZ2xFLxXtII08a70JnX&ust=1549364751305777
- Information sources
We search in different platforms the animals endangered or threatened and we selected the most interesting for our projects. Here are some of the sources:
Proceedings of the National Academy of Sciences
World Wild Life
NYT
BBC
IUCN Red List of Threatened Animals
More information about animals and amazon:
https://www.rainforest-alliance.org/species/blue-butterfly
https://nationalzoo.si.edu/animals/lemur-tree-frog
https://slothconservation.com/about-the-sloth/three-fingered-sloths/
http://www.ourendangeredworld.com/species/land-mammals/giant-armadillo/
https://www.worldwildlife.org/species/black-spider-monkey
https://www.theguardian.com/environment/2012/jul/12/amazon-endangered-species-doomed-brazil
