MutualofOmaha.com Sticky Navigation Enhancement

When the redesigned Mutualofomaha.com was initially launched there were no sticky navigation elements. Below is a GIF that recreates what the site looked like when it was release in May of 2017.

We decided to tackle this problem in phases. First we made the main navigation sticky when the user scrolled.

But I wanted to spend some time on the secondary navigation. I felt we needed to also make the subnav stick to the top of the page to allow the user to quickly navigate between sections of the product. So, I started working on how we could accomplish this.

Some things I had to keep in mind:

  • The contact information on the right would need to remain prominent and easy to access.

Some of my initial ideas:

Exploration for the sticky subnav.

While I liked the idea of keeping the contact buttons exposed on the mobile device I knew we would run into a problem because of state regulation. In some states we are not allowed to call our agents “agents”. So there was a potential for “Contact an Authorized Representative” to be the CTA so we would run out of real estate quickly.

Ultimately I came up with the following design and worked with a developer to get it built.

You can see the GIFs below.

Or see it live on www.mutualofomaha.com/life-insurance

Desktop
Tablet
Phone

My Role on this project

Visual Designer

Tyson Reeder’s Case Studies

Case studies of Tyson Reeder’s work

Tyson D. Reeder

Written by

Senior UX Designer (Visual) at Mutual of Omaha

Tyson Reeder’s Case Studies

Case studies of Tyson Reeder’s work