Athena Home Loans Interactive Brand Launch Website | S1T2
Athena Home Loans website design.

Athena

Project Type

A Home Loan Website That Reimagines How We Interact Online

When home loan company Athena launched on the web, they wanted to do something radical. In order to bring that dream to life, S1T2 created a brand launch website that pushes at the boundaries of what a website can be, reimagining how we navigate and interact with brands online.

While screens might be two-dimensional, the Athena suggests that websites themselves don’t have to be. Throughout the site, users are encouraged to explore what it might be like to scroll into rather than down a website, and what adding a new dimension to the digital could do. All this in a minimal yet rhythmic visual style created entirely in three-dimensional WebGL.

As users scroll through the site, content is delivered through a radically different approach: interactive story. Bold metaphors give a visceral experience of abstract concepts while sparse written content is revealed only when necessary. Subtle, user-driven animations then inspire a curiosity and intrigue that leads them seamlessly from one scene to the next, creating a website that reflects not just the brand’s words but its underlying mission and values.

At its core, the Athena website aims to be a digital manifestation of the brand’s game-changer personality. In a marked departure from the formulaic nature of most financial websites, the site clearly separates the brand from its competitors while underscoring its commitment to being a driving force of change throughout the industry.

Athena web development.
Athena website design.

An Unconventional Approach to User Experience Design

Moving away from conventional website layouts, the design of the Athena website considers navigation as a distinct and potentially meaningful experience for the user. While users might be used to scrolling down a two-dimensional webpage, the Athena website encourages them to scroll into a three-dimensional digital space.

By stepping away from a traditional web layout in favour of more user-oriented navigation, the website gives control back to users to create a surprising and enjoyable experience. This choice also encourages a more personal relationship with the brand, as users are given the chance to explore and uncover for themselves an experience of what Athena is, and what their relationship with the brand could be like.

While much of the movement on the site is mapped to the user’s scroll, the site also features a number of subtle animations throughout serve to enhance the emotions inspired by the illustrations. These subtle, automatic movements give life to the bold, modern aesthetic, adding a warmth and intimacy that make the website a little more human.

  • Design

    • Adobe Creative Suite,
    • Sketch.
  • Development

    • Three.js.
Athena Website interactive web development.

Lightweight Illustrations Enable Cross-Device Compatibility

The minimal design style of the Athena website was largely driven not only by the story being told, but also by the technology bringing that story to life. Creating the simple, three-dimensional illustrations entirely with WebGL resulted in an incredibly lightweight website able to run quickly and smoothly across browsers and devices.

While creating a story-driven WebGL experience for a branded website was an unusual decision, it is this use of innovative technology that brings Athena’s brand proposition to life in the website itself. Just as Athena is redefining what customers can expect from a home loan company, its website is reimagining how we interact with brands in the digital space.