Zero Emissions World is a climate-focused NGO where dedicated individuals and organisations are banding together to speed up the achievement of the Sustainable Development Goals (SDGs) and protect Earth from climate collapse.

Society, public figures and organisations can contribute to meaningful small projects all over the world. The funds stays fully transparent, so everyone can see exactly how it's being used and how positive impact is created.

So, what's the problem?

Zero Emissions World wanted to have a gamified approach to their branding. They wanted to create a different feeling around donating by making it feel more like a collaborative community-driven game where you individually & collectively earn achievements, track progress and build progression, similar to role-playing games. 

When I joined the project, they were about to start on building the website, without a clear brand strategy & brand identity in place. I'm all for bootstrapping and evolving as you go. But without having a basis, consistency becomes an issue. We had to take a step back, form a core foundation for the brand and expand from there. 

Molding the core brand strategy

I created & facilitated multiple brand strategy workshops with the core members & key stakeholders to surface how we wanted to position the org in the market, who the target audiences was, how we would want to stand out from competitors, what the overatching goals are, what the tone of voice + look & feel should be, etc.

With newfound clarity on what we wanted to be and become, we used the core principles as a starting point when heading into designing. It also made it a whole lot easier to create new concise pitch decks and have talks with potential investors given everyone on the team had a shared vision in mind.

Vision

We collaborate to create a
world with net-zero emissions.

Mission

We empower people to take action
on our emission-reducing missions.

Purpose

We strive to create a habitable
bright future, one step at a time.

Together with fellow designer, Natasha Fallas Calderón, we explored a few directions for the brand identity through styleframes. We tried to figure out the balance of imagery, colors, typography, tone of voice and how much inspiration we should take from videogames, while staying clear that it's a climate organisation.

Throughout the process we took inspiration from games like The Journey, Firewatch, and other games with a minimal yet expressive artstyle. We mimicked these styles as it was subdued enough to make it not feel like a full-fledged game whilst making it more feasible to create imagery & assets for in terms of production speed and budgets.

Crafting the Zewmans

Just like in games, we wanted users to have their own avatar which they could personalise and level up every time they'd contribute to a project. After researching and testing what would be a fitting character, we settled on creating our own version of a Kodama; a Japanese folklore figure that was said to be the protector of the natural land.

We made out version slightly more humanoid in it's proportions and gave it a customisable mask so it's easier for users to self-identify with it (Somewhat similar to The Legend of Zelda - Majora's mask).

Kodama's as seen in Studio Ghibli's movie; Princess Mononoke.

Mockup of a Zewman's customisation page

Depending on what type of project you'd support, you'd unlock theme-related items.

Share a post about a rainforest restoration project and get a forest-themed staff, donate to a water-cleaning project and get a limited edition water-themed mask, etc. Albeit simple, its a mechanic that works well to keep people engaged and give them a sense of ownership.

Quick layout sketches before going to final rendering

3D key-visual for the website' splashpage by Studio Nuts.

Making it tangible

Together with Elena Kyriakou I designed & guided the creation of wireframes and screens for the final website. A lot of NGO websites tend to have a pretty overwhelming amount of content, lack good UX and tend to have a too serious tone of voice compared to what we wanted to go for. So we took inspiration from other sites that were more lean, had clearer call-to-actions and contained more fun copy, like Netflix, Oatly and Alphaputt.

Once we had some flows done, we'd align together with the developers and the core staff to get initial reaction and see what's feasible. Afterwards Victor Isichei user-tested it with the target audience to see if what we came up with would work in practise.

Flow structures for sponsor advertisement tiers

Homepage flow tests

Bringing it all together

After we laid out the foundation and got everyone on board, we created a brandguide to capture the essence of Zero Emissions World. Instead of going overboard with nitty-gritty details, we distilled the core essentials so that any internal or external person could craft something that was in line enough to pass the test. 

We wanted to give staff and vendors some wiggleroom to experiment. This way we could adapt & refine the brand identity over time based on real-time feedback from both staff and, perhaps more importantly, the actual users. As Marty Neumeier stated before; "Your brand isn't what you say it is. It's what they say it is."

If I can help you with a similar project, let's talk.