Creating a Virtual Forest
TEAM:
Ted Lee 🙋🏽♂️- UX/UI Designer
Jerry Yu - UX/UI Designer
Lei Aspe - User Research
Kat Pangan - Product Manager
Dana Sianghio - Product Owner
PROJECT STATUS
GCash Forest has been fully rolled out feature. It’s continuous being updated with more partners, exciting features, and new tree species 🌳🌳🌳
TOOLS USED:
Sketch, Abstract, and lots of Illustrator
Overview
GCash Forest, a localized version of Ant Forest, is a mini program where users collect green energy from their in-app activities that can be used for virtual tree planting.
In addition to this, the project was also done in partnership with WWF where GCash will match each virtual tree with a real one, making our user’s tree planting efforts more tangible.
Research
Proof of Concept
Before moving ahead with the project, the team conducted research to see the viability and potential adoption of the feature in the Philippine market. There were a lot of different concepts that we wanted to touch on for GCash Forest, but we wanted to see which areas we’d focus on.
From the research, we found that tree planting, conservation recovery, biodiversity, and helping indigenous communities were the ones that resonated the most with our users, and eventually distilled the different concepts to: cause, commitment, community and collaboration.
UX/UI: Key visual usability testing
We showed our users different layouts to understand (1)which concepts were most important and (2) which design elements would resonate with them the most.
Feature Phasing
With different features planned, we cut the features into key phases:
PHASE 1 was really focused on creating out foundations for the platform: entry points, permissions, mechanism for earning and collecting green energy; as well as being able to communicate the mission of the platform: 365,000 trees in 1 year.
PHASE 2 was about building out our social features. To be able to increase customer engagement, we wanted to let our users interact with each other by allowing them to add friends and collect energies from each other.
PHASE 3 was to enable the tree planting features and achievements.
We decided to do this last because we had projected that our first user would take ~3 months to get enough energy to plant their first tree.
Key Elements into Features
PH 1: CAUSE AND COMMUNITY
How to earn green energy
First, we needed to come up with the mechanics on how users could earn their green energy. The big idea was to reward our users’ green actions, i.e. using GCash services as a way to minimize their carbon footprint, with the equivalent points in GCash Forest.
At our MVP stage, we started with five main use cases, with a goal of adding more and more with every new release.
Access Points + Permissions
Next was thinking about how to introduce this to our users. We wanted to make sure we had a nice landing page and a clear call to action to onboard users when they come across the platform.
We also needed to get additional app permissions for health to collect their steps/ walking data to convert these into green energy.
New User Onboarding
We wanted to help users become more familiar with the platform, so we created a simple tutorial flow to simulate collecting their green energy, and introducing some of our key elements.
Real World Touch Points
We wanted to be show a stylized view of what the actual planting site would look like, we wanted to highlight the zones, waterways—really trying to give a sense of the forest we were trying to help rebuild
At the MVP level, it was only a static image. Eventually, we wanted to make it more interactive, and a place where we would showcase community milestones and tree planting updates.
PH 2: Collaboration
In this phase, we were really focused on the social features for GCash Forest: updated the dashboard to include (1) sections help increase friendly competition in GCash Forest: a leaderboard, real time energy tracker, easy referral flow, (2) fleshed out how users can add friends, (3) added capability to visit a friend’s tree and steal their energy.
PH 3: commitment
We were finally able to rollout our tree planting flow—whoohoo!—, wherein users could choose a tree from our catalogue and get a personalized certificate with tree they collected. We also added badges to help celebrate our user’s milestones in helping them grow the forest.
My favorite detail about GCash Forest is that after planting and we reset your main tree, we add a tiny version of your tree in the background. Just so that our users are reminded of their milestones.
This is my what mine currently looks like~
The platform has grown a lot since I turned-over my Sketch files for this.
As of writing (Sept 2021), there are now four (4) forests being supported across the PH, six (6) community partners, sixteen (16) tree species and about 8.2M people on the GCash Forest platform.
However, the real measure of success is whenever I see people post and share their certificates online with pride—some even had their framed! 😊
