ServiceNow at IBM

2020
UI, UX, Web Design, Illustration

My task was to redesign IBM’s ServiceNow portal site. To summarize the tool, it is a platform where users can go to check on existing tickets, incidents, and reports that have been filed. It offers management solutions and provides support to people who use this tool. It is currently used by over 6000 IBM employees.

Original Site

Me and another Visual Designer were given a heuristic evaluation with suggestions and recommendations for improving the current site. Our job was to develop and prioritize content based on the original portal site.

In short, we knew what was wrong, but there was more to do here than just applying the design system. Some of the errors noted on the page were the large banner and global map located underneath the navigation bar. The stock ticker, location, and weather were items that could be omitted. The links, such as Help@IBM, were redundant and repeated throughout the site.

Sitemap

One of the first items we completed was revising the current sitemap. Sitemaps were helpful for us to understand the content and define the goals of the site as workflows. We went through three different versions in order to refine and simplify the sitemap each time.

Wireframes

We created these simple wireframes incorporating some of the research from the first heuristic report. For now the navigation bar has been eliminated, there is clearer terminology, and the distinction of "Help@IBM". We implemented the W3 design system to feature smaller headers and removed irrelevant items such as the stock ticker, weather, location and global map.

Version 1 design

The stakeholders liked how minimal it was, but went back and forth about what content to feature. While content has been generated in these designs we still wanted to collect user feedback to help us refine our portal site.

User Testing

We interviewed 12 users ranging from new users to daily users. We asked the users questions ranging from what they do, to how they interact with the tool. In terms of content, we conducted AB testing to determine what to prioritize and feature.

Our biggest challenge was that the users had varying levels of experience with the tool. Moving forward we used the user experience research to lead with both content and design.

Illustration Exploration

Based on the user testing, we explored different illustration styles created for the call to action sections.

Final Design  

In this final version we added a search bar and combined the sections create, request and modify workflows into one call to action button. We added another section called group management that was specifically added for experienced and daily users who wanted to use the tool to manage their teams.

In the end we were able to create a portal that not only follows our W3 design system, but also makes a complicated product much easier to digest and comprehend.