NOF Website Redesign

NOF

Project Type

Web Design

UX Design

Role

Creative Director

UX Designer

Introduction

The National Osteoporosis Foundation (NOF), a long-time partner of JEL, approached us to redesign and re-imagine their public website nof.org. A thought-leader in their industry, NOF's previous website housed a wealth of engaging articles and videos, but the site was so disorganized there was no clear path to their content. Going through a thorough UX and visual design discovery process, I identified specific goals to achieve during the redesign and served as a UX designer and creative director on the project to ensure these goals were met.

UX Discovery

Working closely with NOF's marketing team, I led a discovery process to define what the goals should be for the redesign. NOF wanted to give key user groups clear direction on where to go to find the information most relevant to them. In short, they wanted to steer osteoporosis patients towards treatment/prevention information and give healthcare professionals the resources they need to inform their patients and themselves on osteoporosis related issues. They also wanted to attract a younger audience to encourage preventative methods earlier in life.

Wireframe Design

To meet these UX goals, we created a new navigation structure to target these key user segments. This paved a clear path for patients, healthcare professionals, and potential NOF donors to find any information they needed quickly. To mitigate UX concerns that sometimes accompany audience navigations, we took several precautions: First, we made it so that subcategories were easily visible by simply hovering over a category. Second, we used approachable, natural language to ensure it was clear where each user group should go. Third, we made the navigation global, so one could easily switch categories if needed.

The homepage wire leverages the findings from discovery by using an audience navigation, improved sitemap, and bringing their industry leading articles and events to the forefront.

Visual Design

NOF describes themselves as a mature, authoritative, and helpful resource for osteoporosis related issues. These values were key pieces of the creative direction for the redesign. The use of family centered imagery, bright colors, and playful iconography reinforce a welcoming, homey feeling. I worked with a local DC designer to relay this look and feel in the final design. To ensure that NOF could easily add new content to the site, the website was designed using a fully custom Wordpress backend. Feel free to visit the live site here.

Related Cases