5th World

Project Deliverables: Branding, website design, print design

My Role: Branding, Creative Direction, UX/UI design, and graphic design

5th World has over over 20 years of experience building autonomous and regenerative digital and physical solutions. 5th World's mission is to accelerate the world's transition to regenerative, distributed energy, water, and food solutions.

5th World had recently hired its first Marketing team. As Brand Designer, my role was to audit their existing branding, consolidate and bring consistency to a variety of designs, and establish a new look and feel for the company.

My first step as Brand Designer was to establish company-wide Brand Guidelines. Brand guidelines cover a brand's core messaging (values, mission, vision), logo usage rules, color palettes, guidelines for image and icon usage, and set a clear tone of voice. These guidelines help to ensure brand consistency and maintain a coherent brand identity across all communications and designs.

The previous 5th World website had a lot going on. Different menu items opened into pop-up windows, and the design treatment of each page varied a lot in terms of layout, typography, color and illustration style. There were a lot of clunky animations that slowed down page load speeds, and the pages leveraged a lot of AI-generated imagery that upon closer inspection revealed a lot of unsettling details (multiple fingers, odd blurry sections, and so on). This all led to a disjointed and confusing user experience while trying to navigate the website.

Most importantly, the website did not perform well on different devices, which led to large areas of copy not being readable on different screen sizes/devices. 

Here is a look at the original 5th World website design:

For the website redesign, we wanted to establish a new brand look and feel that conveyed luxury, cohesion, and an eco-friendly vibe (without relying too much on clichés). 

We also focused on correcting many web responsiveness issues with the previous website, ensuring the design behaved the same whether it was viewed on desktop, tablet or mobile devices. We also removed the unsettling AI-generated imagery in favor of high quality, authentic stock photography and 3D renders, and built out a new library of consistent icon design for use across the website.

Below are screencaps of the website in both desktop and mobile versions:

Once we had established a brand look and feel, it was time to move onto collateral designs. The first thing we needed was a solid Product Brochure, that we could hand out at events and seminars. We leveraged the new website design to create a beautiful 16 page saddle-stitched product brochure: