Modernizing a Dated Website

The goal of this project was to redesign the UI for a website while maintaining the basic site structure and elements, making for an economical but impactful update.

A Facelift to Keep it Current

I had a client who wanted to revamp her site but didn't want to spend a lot of time and money.  I worked with the developer to add a new section and keep the general layout comparable so there wouldn't be any costly development updates needed.

Check out the results below.  Here are the key areas I focused on:

  • Modernize typography
  • Improve color palette
  • Introduce full-screen images
  • Introduce better photography
  • Increase clarity
  • Add a new 'Virtual Consultation' section
  • Find a design solution for implementing two CTA buttons (per client's request), while focusing on one primary action
  • Solve for a complex and large procedure menu with inventive navigation
Modernizing a Dated Website

New 2020 Site Facelift

Modernizing a Dated Website

Old Homepage

Previous Version of Site

Notice the following characteristics:

  • Outdated fonts, colors & graphics
  • Unengaging buttons
  • Distracting mixed font colors
  • Small and incohesive photography

Interactive Prototype via Invision

Interactive Invision Prototype for Mobile Navigation Exploration - V1

Exploration to find design solutions for a very large menu that would work well on mobile. The prototype is interactive! Check it out.

Modernizing a Dated Website

Low-Fi Axure Wireframe to Get the Ball Rolling

Sketch & Axure Wireframes - Mobile V.1

You can write here as much as you want, this text will always look nice, whether you write longer paragraphs or just a few words. Click here and try it out.

Sketch & Axure Wireframes - Mobile V.1

Lo-fi Axure to High-Fi Sketch

Modernizing a Dated Website

Sketch Wireframes for Mobile Navigation V.2

We wanted to find a way to get users to the information faster than the nav layout above.

Interactive Invision Prototype

Interactive Invision Prototype and Wireframes for Mobile Navigation V.3

Using a bit more innovation to find a solution for a robust navigation structure. and riff on V. 2. The prototype is interactive! Check it out. 

Desktop Version for Nav Exploration V.3

Here are the desktop wireframes of the mobile version.