Aboitiz ESG Sustainability

Aboitiz ESG is the sustainability component of the Aboitiz Group. Through the years, their efforts and initiatives in sustainability have shown that they are an organization committed to corporate social responsibility and achieving the Sustainable Development Goals (SDGs), positioning themselves as one of the leaders of sustainability in the industry today.

Read more

Overview

The scope of the project entails the overhaul of Aboitiz’s existing sustainability website in favor of a new redesign that communicates the organization’s vision in sustainability more effectively through the use of exemplary user experience based on well-articulated design strategies and best practices in crafting virtual space.

Outcome

The envisioned outcome is a visually and functionally revamped website that reflects the brand’s legacy and their adaptability in the changing digital landscape.

Services Provided

  • UX Strategy
  • Information Architecture
  • Interaction Design
  • Visual Design
  • Website Development
Main Photo

Designed to Cater for a Diverse Audience Group

At the onset of the project, we first defined the various audience groups and their categories through intensive UX Research and Strategy in order to anticipate how the website should be created with their interests and objectives taken into consideration. With this information, we consciously crafted the visual and functional dimensions of the website’s experience. We generated foresights based on the various flows and scenarios where users  enter and explore the site. This affected how we thought about the content structure and the presentation of information across pages and sections. As such, a collection of modules, which acts as flexible content blocks, was created to be rearranged across different subpages to serve user needs.

Designed to Cater for a Diverse Audience Group

Synthesizing Tradition and the Future

In developing the visual direction of the project, we developed visual narratives and syntaxes based on the company’s legacy and vision of its historically defined traditions and their optimistic foresight towards the future. We did this by exploring the contrasts of sans-serif and serif typeforms. The former connotes a restraint reflective of tradition and formality while the latter exemplifies a playfulness reflective of dynamism and adaptability. This dichotomy of past and future is also present in the selection of images that range from expansive to tight shots. This allows us to continue this conceptual contrast even further into the visual engagement of photo assets.

Synthesizing Tradition and the Future

Developing Patterns to Define User Priorities

The crafting of the website’s experience does not stop in the definition of user personas and flows. Information from these categories should be translated into tangible user-interface patterns that anticipates the behavior of these users and their tendencies. We did two approaches in generating these patterns: first is by creating patterns based on  best practices in the industry which attempt to create familiarity on the site, second is by creating a new repetitive layout and visual  patterns that consistently recur throughout the site. The former grounds the project with the rest of the exemplary website experiences found in virtual space, the latter sets it apart from them.

Developing Patterns to Define User Proclivities

Curating Data and Information

As an informational website, the project has a lot of information that needs to be conveyed. This information varies in nature ranging from numerical data to narrational text. The numerical data was aggregated and curated into different subtypes which were distributed across various pages and sections on the site to make it more easily comprehensible for the user. We used narrational body copies to support the numerical figures and to diffuse the seriousness of these data into narratives that help the user understand the story and logic behind it.

Curating Data and Information

Exploring Visual Translations of Sustainability

In figuring out the possible look and feel of the website, knowing that it utilizes the idea of sustainability, we challenged the existing visual notion of green in sustainability. We thought about how we can use different colors to communicate this voice of the organization without resorting to clichés . We explored different vibrant colors that range from teal, sunset and gradients of aquamarine. In using the hues found in nature, we attempt to elevate the idea of sustainability from the notion of green-ness and into something more encompassing: the impression of oceans, forests and soft cities.

Exploring Visual Translations of Sustainability

Related project
UI Design

ConcepStore

A fresh take on modern living made accessible through a seamless online shopping platform.

View project

Let’s make something great together

Ready to take your brand to the next level?
Talk to us and let’s see how we can help you make something amazing.

Get in touch with us

Loading: Yellow Cab

Yellow Cab

One of the largest pizza restaurant chains in the Philippines owned and operated by the Max’s Group.

Read more

Challenge

To celebrate Yellow Cab’s 15th anniversary, the brand gave itself a refresh. The brand’s new energy boasts of a more dynamic, youthful, and eclectic vibe. The team was tasked to match Yellow Cab’s website to the brand’s new mood and feel–all while driving traffic and promoting an engaging ordering experience.

Outcome

A fresh website powered by a scalable and robust design system. The new Yellow Cab website features larger and more appetizing product shots, enhanced accessibility, and easy-to-follow ordering steps. This online refresh not only gives the site a more dynamic look but it also gives its audience a user-focused browsing experience.

Services Provided

  • Design Audit
  • Visual Design
  • Frontend Development