A Fresh Look for a Better User Experience

The new design of SAP GUI A Fresh Look for a Better User Experience

The new “signature design,” widely known inside SAP by its code-name, “Nova,” made its big debut at SAPPHIRE 2008 in Orlando, Florida, draped on products such as SAP Customer Relationship Management 2007 (SAP CRM), SAP Business ByDesign, SAP Business All-in-One, as well as on SAP Graphical User Interface (SAP GUI).

“‘Drape’ is a gross simplification,” counters Esther Blankenship. The manager of the SAP Ux – Visual Design Team is quick to point out that harmonizing the user interfaces of SAP’s diverse products involves a lot more than slapping the same colors onto every application window. “You can’t apply one design for one interaction paradigm to another completely different interaction paradigm,” she says. Each product has to be designed individually. It’s a process that involves the participation and dedication of visual designers, interaction designers and, very importantly, developers.

Chief Development Architect, Peer Hilgers nods, adding, “There are a number of technologies that our products are based on. For example, compare SAP CRM, which is Web-based, with SAP Business One, which runs as a smart client programmed in C++. We have to work closely with development to see what design aspects fit a given technology.” Indeed, since the new look was first rendered on SAP Business ByDesign in 2007, the SAP Ux – Visual Design Team has been working feverishly with various development teams to deck out SAP’s entire product range in the new design.

Forget the fads

Despite differences in technology, all products with the new signature design reflect a common design foundation. The team has taken inspiration from real, tangible objects. The content screens, for example, imitate a white porcelain surface held in place by a dark blue, brushed metal clasp.

Porcelain surface and metal clasp

According to Esther Blankenship, this physical and material approach to rendering business content is an elegant counterbalance to the disconnected experience of working in a virtual environment. Zeitgeist has no place here – the team’s aspiration is to develop a fresh yet timeless design based on sound design principles such as the right level of tension and contrast as well as attention to detail.

For the SAP Ux – Visual Design Team, the signature design is about a lot more than making the UI blue, as Blankenship explains: “We want to provide users with a world-class visual design, so that they feel good about using our products – our products should look like we care about our customers,” she says.

This is particularly important in SAP’s aspirations to win over business users. “If you want to get more business users on your applications, you’ve got to create software they want to use,” Blankenship says. “The whole of User Experience at SAP is focused on leveraging SAP’s functionality in a way that better supports business users and that makes our entire solution stack more attractive. Ultimately, we are in this to help increase the uptake and sales of our software.”

Performance and appearance

Often, performance dictates what works and what doesn’t. “You really have to fight for milliseconds,” User Experience Development Architect, Leif Jensen-Pistorius says. “So to get the design right without compromising performance, developers have to write the code as efficiently as possible, and we in the Visual Design team have to identify where we can shave bytes off the UI assets.”

SAP Business ByDesign

Hilgers uses an input field to exemplify how important it is for designers to weigh the design benefits and performance costs of everything they propose. A standard input field in HTML can have a very sophisticated design with rounded corners, gradients and lots of depth but this would require images to render the borders and background. Multiply this by 30 fields per interface, and you could quickly have a clogged processor or a lumbering browser on your hands. As a solution, the team opted for leaner flat fields, and added a little more sophistication to the less numerous UI elements. “These are the kinds of little compromises that you have to make as a designer together with the development in order to get the right mix of aesthetic appeal and high performance,” Jensen-Pistorius adds.

The performance challenge is compounded by browser-based applications, which can’t deliver the throughput of installed software. Installed clients can make full use of modern graphics cards – browser-based software cannot. Also, the team has less control over the appearance of a browser-based application, as the browser itself is its own application and is always present as a frame around the SAP product. Nevertheless, Peer Hilgers is more than happy with the results of their design for the browser-based products: “Those not directly involved in the design processes have a hard time noticing the difference between Business ByDesign running in the SAP NetWeaver Business Client or in the SAP NetWeaver Portal,” he says. “So that tells us that we are doing a solid job on both fronts.”

Software customers want to use

According to Hilgers, users form a positive or negative opinion of an application within the first ten to 15 seconds of launching it. So if a design can evoke a positive emotional response right off the bat, business users will be more likely to continue working with the application – and to recommend it. It is for this reason that the SAP Ux – Visual Design Team takes their job very seriously, determining which aspects can be designed, whether it makes sense to design it, and how they can design it consistently so that the details fit together.

Although SAPPHIRE 2008 marked the first official introduction of the team’s design to customers, there are many more milestones on the horizon. A little application known as SAP Business Suite still needs their attention.