XAVIER UNIVERSITY
DIGITAL
WEBSITE
fade3

CASE STUDY

www.xulastory.com

It is with the greatest honor that GPM launched the website to celebrate the Xavier story. When we were approached to develop the digital experience for this incredible institution, we were humbled and utterly energized. Here is our story.

The Website

The fulcrum of the roll-out projects recounting the Xavier story. Working with an Emmy award-winning documentary director and film crew, GPM was responsible for the project’s identity, user interface (UI), user experience (UX) Content Management System (CMS) and full development. Experience the website by clicking here.

What we did

Discovery

Our first step in any major touchpoint project is to produce a discovery document. This crucial tool covered: project objectives & definition, target groups, content delivery, technology, features & functionality, font families, color palate, road map, design, UI & UX and budget scenarios.

px web xray7

Development

We believe building websites by a rigid template system is archaic. We build toolkits—a series of components with specific functionality that can be used virtually anywhere within the website. We also believe in mobile first, so we build mobile up. And we are fans of big visuals and taxonomy. Load the media, tag it and share across the environment. The discovery phase locked the resources, the UI & UX, so now time to go develop!

px web inset

Delivery

px web delivery1
01:

Home

Big full-screen video experience. Minimal top-level navigation with a clean black & white contrast UI. Xavier corporate colors to draw users to powerful custom search feature.
NEXT
px web delivery2
02:

Nested Menus

Accessibility is vital to the success of any website, as is understanding the context & content. We developed an intuitive menu system to assist users deliver on both.

NEXT
px web delivery3
03:

The Story

The heart of the project: 6 acts chronologically traversing the history of Xavier University.
NEXT
px web delivery4
04:

Telling the story through video

The film crew conducted a series of interviews on location in New Orleans with the key protagonists. Their story is the real story. Each act includes short videos relating to a pivotal moment in Xavier’s history, and we provided the environment to broadcast those reflections.

NEXT
px web delivery5
05:

Telling the story through imagery

The project directors worked closely with Xavier University archivists to unearth a treasure trove of imagery. We formatted and organized the images into albums to support the video interviews.
NEXT
px web delivery6
06:

Image albums

The story unfolds when albums are exposed with a dedicated CDN server providing rapid delivery and user interaction.

NEXT
px web 9
07:

Historic archive

Interactive repositories pull associated document, audio files and link resources to pages, filterable by date and by type.

NEXT
px web delivery8
08:

Interviews - the key characters

The voices of the Xavier Story Project, assembled in one section. Brief profiles lead to groups of media assets associated with each character.

NEXT
px web deliveryx
09:

Timeline

An at-a-glance journey through landmark moments in the history of Xavier University. Designed to provide a chronological reference point for the story and a key tool to engage casual or younger website visitors.

NEXT
010203040506070809