Guest Commentary: Improving WCS User Interface Design
Great Interface Design Is Everywhere … Well, Almost
by Sean Johnson, Senior Software Engineer
Recent upheavals in popular software applications are a reminder how important user interface (UI) design is. In the desktop world, a drastically redesigned Windows 8 interface elicited strong reactions across the user base. A refreshed “flat” UI of Apple iOS 7 continues to make waves throughout the mobile handset community. And, the frequent fine-tuning of Web interfaces in applications we use every day — such as Facebook and Gmail — further illustrates the importance of usability. Simply put: UI design matters.
UI design has become a key selling point for mobile devices. With the cost of hardware plummeting and device features commoditizing, phone manufacturers must differentiate on their products’ ease of use. It’s not just about if a device can do something, but how easy it is for a user to accomplish the task.
With the goal of ease-of-use in mind, software providers have developed beautiful and intuitive interfaces for DC operators to use on their personal phones and the many other remote computing devices they use daily. The one exception is the software they use in the DC itself.
WCS Software Interfaces Lag Behind
While at the DC, staff and management wrestle with hard-to-use (and downright ugly) software to manage their day-to-day operations. Warehouse Control System (WSC) software isn’t known for its aesthetic beauty. It’s built by software engineers focusing on the algorithms and routing logic to make sure cartons flow around a conveyor system in the most efficient manner possible; in in their eyes, the user is the conveyor system, not the floor staff. User experience experts and interface designers are typically not consulted to consider the needs of the humans who use these applications day in and day out.
As a whole, industrial software applications have not kept pace with the usability and attractiveness of their consumer counterparts. Nine out of 10 WCS providers won’t have a single screenshot of their product offering available on their websites. Of those who do, the interface is comprised of off-the-shelf widgets that are easy to implement by developers. But, these widgets are rarely suited to the task at hand. The real-time demands of a WCS, along with its criticality to keeping your DC running smoothly, require a more thoughtful approach to UI design and development.
Principles for a Better WCS UI
Here are a few design principles I’ve applied to our WCS, Automation Director®, to help make its interface user friendly. Many of these concepts have come from years of working in other industries, as well as personally approaching UI as a designer first, and a developer second.
1. Skip the off-the-shelf widgets. The default controls/widgets offered by third party component developers are marketed to those who can’t design, and are styled in a way to be flashy to developers, not end users. There is a difference between “flashy” and “attractive”. Since few widgets met our needs, we’ve developed our own, taking into account each individual component to make sure everything fits well, runs smoothly and is easy on the eyes.
2. Avoid skeuomorphism, or the practice of trying to design interfaces to look like real-life counterparts. No glossy buttons, fake metallic surfaces, and unnecessary background textures that attempt to simulate the real world. While a WCS interfaces with real machinery, there’s no need to coax the user into believing that it is real.
3. Focus on presenting only useful information. Automation Director displays a conveyor-belt system overview with real-time updating, but that doesn’t mean we should display it in exacting detail (down to the bolt). Our WCS works with the conveyor in a logical manner where machinery is abstracted away, and our graphic representation reflects that. As engineers, it’s tempting to recreate the exact system, but it rarely helps the user on the floor who wants the current status of the system. Too much graphical detail not only slows down rendering, but can also obscure the user’s access information. Think more along the lines of a mall directory or a subway map, not an AutoCAD drawing.
4. Steer clear of 3-D. I’ve researched 3-D interfaces and concluded they’re not usable for a WCS. They are difficult to build and program, are slow, and are potentially limited by the hardware available for most HMI installations. A user shouldn’t have to fuss with a 3-D model of their conveyor belt system on a small and slow piece of hardware. While 3-D may be flashy and cool, it rarely translates into a good experience for operations staff.
5. Stay neutral with color palettes. Our WMS utilizes a limited color palette, featuring neutral colors for general interface elements. By using either a dark background with light text, or a light background with dark text, Automation Director provides as much contrast as possible for critical information. We also follow the best practice of reducing contrast for less important elements.
6. Adopt industrial color standards. Our interface clearly communicates events and statuses by adopting the universal language of colors in industrial, transportation and safety applications:
Red Stopped, alarmed, critical, we have a problem
Yellow Keep watch, warning, we might have a problem
Green Go, all is good, things are running fine
We use these three colors only when they have meaning to the user, and avoid using them for any superfluous design accents, including branding. If floor operators see something in red, they instinctively know it’s related to a problem.
7. Keep iconography simple. We’ve made a conscious decision to keep icons and symbols simple and user-friendly. Icons should convey meaning with little to no color or adornment. We look to everyday applications for inspiration, e.g., traffic signs, airport terminal signage and modern consumer software.
Bonus tip: If you don’t have a graphic/user experience/interaction designer on your development team, hire one — or find a developer who can play the role.
A thoughtful approach to the design and usability of Automation Director helps keep our customers more aware of their system, and sets us apart from our competitors — including the ability to proudly display our WCS, with screenshots, on our company’s website.
Further Reading
The origin of green, yellow, and red color scheme for traffic lights
The international language of ISO graphical symbols
Sean Johnson, Senior Software Engineer with MHI Member FORTE. #forte
