Safety Management Suite Design

Background

The design for J. J. Keller’s Safety Management Suite was a project many years in the making. The original service, KellerOnline, was originally designed in 2001 and was developed in an effort to move from products from CD-ROM software to online web services.

KellerOnline is a very popular service with over 20,000 subscribers from numerous industries – some of whom were original subscribers to the website. The site provide various services for safety managers to help them develop their company’s safety program. The tools included safety audits and inspections, OSHA incident tracking, safety plan templates, employee training management, and access to safety regulations as well as how to interpret those regulations.

The third, and final, major redesign of KellerOnline was done in 2008. Not surprisingly, the site was now lacking in many of the modern features that customers came to expect from a web offering. This project looked to understand if we could enhance the existing solution.

Previous Safety Management Solution

User Research

KellerOnline customers had been receiving Quarterly Satisfaction Surveys for over a decade. These surveys provided valuable insight as to what they felt was missing from the service and what features could be enhanced. The initial focal points from a marketing perspective were on the overall site aesthetics, while the UX team was focused on menu organization and page navigation. The general consensus was to focus on the following concepts.

  1. Unify site navigation and page processing
  2. Increase marketability by modernizing site aesthetics
  3. Improve page load times and page rendering.

Sketches

Throughout the entire design process whiteboard sessions were held to create dashboard concepts, navigational possibilities, and feature flow. This continual process allowed the design to evolve as project needs changed. Project stakeholders also appreciated the increased transparency into the design process as they gained a greater appreciation for the effort that goes into UI and UX design.

Menu Ideation

Current menu limitations were widely known. Sidebar navigation varied from page to page and was not always consistent even when a user was engaged with a particular feature of the website. Multiple concepts were designed for review.

User Testing

After extensive user testing with existing customers, tech support, and other J. J. Keller associates, the most efficiently tested design was the static sidebar with breadcrumb trail.

Testers were regularly able to navigate between various tools and had no trouble distinguishing what area of the site they were on.

UI Library / Living Style Guide

A UI Library / Living Style Guide was created to provide developers, designers, and marketing creatives access to the current styles of the site. It used CSS that was actively used one the website so as the site changed, so did the style guide.

Feature Functionality

The existing site was lacking in many modern features: inline editing, column sorting, live search, and inline reordering. These features were incorporated along with the user to have the ability to customize which columns were displayed in data grids.

Completed Design

After what seemed like hundreds of whiteboard gatherings, brainstorming sessions, and product research reviews, the Safety Management Suite became reality and is currently in the process of migrating KellerOnline users into the new service.