KAGUBATAN

A web showcase of the Philippines

ROLE

Web Designer

DURATION

8 Weeks

TOOLS/SKILLS

HTML/CSS, Javascript, Adobe Photoshop, Art Direction

PARTNER

Erika Morales

OVERVIEW

Kagubatan is a youth-led forest conservation multimedia art exhibit that aims to culminate and empower local storytellers, artists, and conservationists in the Philippines through a series of online educational webinar programs named ‘Conservation Conversation’ an inclusive and immersive virtual reality forest exhibit.

This project integrates both technology and art to immerse, educate, and bring forth support to stop the deforestation, to reforest, and to conserve the major Marikina Ipo watershed that provides water, biodiversity, and life to millions of Filipinos living in Metro Manila, Philippines.

BACKGROUND

Our task was to create the website to showcase the art and illustrations of the featured Filipino artists. Our concept was to lead the viewer through three main ecosystems of the Philippines: Wetland Forests, Agroforests, and the Montane Forests.

    

Our initial pre-production made use of concept boards by gathering many parallax websites as inspiration, before going into storyboarding through the experience and two stages of wireframing.
Illustrations of Nature
Each graphic element was drawn by hand, with the parallax effect emulating falling leaves or lily pads flowing past a river

Coded from Scratch

The entire site is written with pure HTML/CSS and Javascript. Our main concept and difficulty comes in the form of the extensive parallax effect with layered illustrations. My role was to take the static illustrations and use the CSS and Javascript to emulate movement as the user scrolls through the page.

   

The effect creates a general flow through the website that is meant to evoke the feelings of traveling through the Filipino forests. We didn't want to do anything too flashy, but rather subtle and evocative.
It's Just Wine
GDC
LinkedIn
Email
Resume
© 2024 Justin Leung - Designed and animated by me