Interactive Experience
The Amazon Rainforest Fires
How might we bring awareness to the Amazon rainforest fires & the current climate crisis?
Overview
For this project, I wanted to educate and inform users about climate change's impact through a visual interactive experience. I decided to focus on the recent massive wildfires spread throughout the Amazon Forest due to its closeness to home. As a South American native, I think it's important to communicate these issues to a global audience to raise awareness, and pressure local officials to address the climate crisis.
Tools
──
HTML, CSS,
C4D, ThreeJS, WebGL, Illustrator
Role
──
Researcher, Designer, Developer
Team
──
(Me)
Process
There were 4 stages for the completion of the project, beginning with research, ideation, and content planning to reflect the issue at hand.
➊ Research
➋ Ideation & Storyboard
➌ 3D Modeling
➍ Coding
Research
Since 2019, fire hotspots in the Amazon have increased by more than 80%. An alarming figure that demonstrates signals of neglect and permission to deforest one of the largest and most important forests on the planet. Deforestation and threats to traditional peoples have increased dramatically in recent years, and the numbers are likely to increase further with the lack of oversight and the granting of land for oil extraction and mining in sacred territories.
The recent data about fires in the Amazon is showing that the current environmental policies are leading to even more carbon emissions. Scientists and Indigenous Peoples are demanding a quick and thorough transition to clean energy, stronger measures for forest conservation and real participation of the communities in the government decisions.
Ideation
After gathering data on the subject, it was time to decide how the website would be structured and how the user would learn & interact with the website. Many questions arose, including:
❋ How can I communicate clearly without overwhelming the user?
❋ How can I simplify the information to make it easy to learn?
❋ How can I maintain the user engaged and interested in the content?
❋ How can I create powerful visuals that produce empathy and compassion?
These questions helped shape the website's user experience, resulting in a linear narrative or story using three-dimensional graphics. The finalized idea consisted of bringing the user to a beautiful Amazonian landscape that quickly takes a turn for the worst.
Narrative
The website will be able to transport the user to a natural rainforest scene through the push of a button, immersing them through the Amazon forest, only to find fog and ashes beginning to cloud the environment. As users dwell further into the forest, the realities of deforestation, and extreme heat will cause users to take action.
Storyboard
Initially, my idea was to start the camera sequence with a forward movement, or dolly in, which would simulate the user gradually walking towards the rainforest. However, I decided to create a horizontal sequence, or side scroll to keep a flat, cel shade look that looks more illustrative.
3D Modeling
I created vector illustrations to establish the style and aesthetic of the visuals, utilizing bright and vivid colours. I proceeded to create 3D models in the 3D software Cinema4D, emulating a flat style, inspired by Pop-Up books. The models were kept simple, without too much detail, so that the browser could load faster.
Coding
Once the 3D models were created, I used WebGL and the library ThreeJS to set up the scene, which would be animated using camera movements and trigger interactions.