Wayfinder Reward Tower Website Design

Wayfinder Reward Tower Website Design

Objective

The goal of this project was to create a webpage to promote and explain Wayfinder's "Reward Tower" system. The Reward Tower is Airship Syndicate's spin on the typical "Season Pass" program that many modern games adopt. One challenge to overcome with this project is that Wayfinder is a brand new IP so most users won't be familiar with the game's content or branding. Because of this, the imagery and content had to efficiently explain everything without being too text-heavy or overwhelming. 

Wayfinder Reward Tower full desktop and mobile website designs

Challenge #1: Responsive Transitions

The second half of the page includes a linear transition of images starting with a star-filled texture and ending on the final reward tower.

It’s easy enough to create this in Photoshop but this large image cannot scale with the page’s content. Because of this, I re-created the artwork and cut it up into multiple images so they’re able to scale independently from each other.

Wayfinder Reward Tower website images cut up

Challenge #2: Full Page Localization

The entire page had to be localized into six different languages. Because of this, I had to consciously design all elements on the page to look aesthetically pleasing when they're twice as long as the original copy as well as twice as short. This is due to the fact that translating text from English to other languages often results in a completely different size of copy. I also recreated certain logos on the page to use live text generated with HTML and CSS so that these could be fully localized as well.

Wayfinder Reward Tower website design localizations
Wayfinder Reward Tower website mockups

More by Ryan Wagget

View profile