Old design,

old problems

This project started with many users describing their terrible experience with the old service portal. Throughout the portal feedback system, users sent several tickets describing their pain points.

The 3 most significant issues described by users:

• Web forms were organized by department, making it difficult for users to find the correct one to submit a request.
• Web forms were described using unnecessary words and business jargon that sometimes lacked clear meaning.
• The navigation was not visible to users; first, they had to select a first-level category page, then a second-level category, and sometimes even a fourth-level category page to access the web forms.

Groundwork

As the senior member of the UX team, I needed to determine how to conduct various studies to validate the problems identified by users. Therefore, I took several steps:

Implement Google Analytics to capture basic user data

Until I joined the team GA wasn't implemented, and we didn't have any basic usability data about the portal. With GA implemented we started to see a few portal stats, and a funnel was created to evaluate the service catalog conversion.

Map the existent information architecture

I created a navigation map of the existing organization to document how the web forms and categories were grouped. While I was mapping I noticed all the problems described by users, the difficult navigation, verbose web form titles, and other non-mentioned problems like web forms with misleading titles, questions capturing data with the wrong input field, fields wrongly organized in two columns, and many other problems.

Task Analysis

While mapping the architecture I also created a task analysis documenting the path users needed to go through to open a request. This activity was important because it raised a big problem, users only had one way to open a ticket and browse the structure.

Sidebar menu of the redesigned service catalog navigation. The menu was created to make the structure inviting for all users.

Observe the user and evaluate the experience with Hotjar

We already had over 100 tickets describing how bad the experience was, we knew the obvious problems, but I wanted to see in action and on a big scale the errors that users were making while browsing the catalog. I couldn't do user testing with too many users, and a small one would only show what we already knew, so I decided to implement Hotjar to evaluate the overall experience, observe users through the service catalog journey, and ask them to rate their journey as they would do in traditional user testing. During 6 months this unusual way to evaluate the experience was very successful and we ended up with more than 600 written feedbacks and task ratings.

Interview Bussiness Analysts to understand the web form creation process

When someone from an internal team wanted to create a web form in ServiceNow to manage their offerings, they had to meet one of the BAs from the Service Management team. The BAs and the client were responsible for defining the scope, writing all the questions, descriptions, help text, and the web form title.

While interviewing each BA, I noticed they didn't have a common process. Each created the web forms following their own rules. They also didn't question the customers' technical decisions, letting them do whatever they wanted. The result was web forms with misleading or verbose titles, missing descriptions, wrong input fields, wrong categorization, and many other problems already mentioned.

The interview process was important because it revealed the source of the chaos. In an ideal situation, the team would have benefited from having another UX Designer to collaborate with each Business Analyst (BA) on designing every web form. However, that option was not available.

Outcomes

Creation of the Web Form Best Practices

The BAs were tasked with creating web forms, but they lacked the necessary education to design them effectively. Therefore, I developed a set of web form best practices. This document outlines all the essential UX rules for crafting a quality form, from writing to selecting the appropriate input fields based on the data to be collected. All forms are now written in Plain Language, from the titles to the questions. The document also evolved into a training video that I recorded, enabling anyone interested to learn the rules in a different format. Implementing this new process was challenging, but today it is a success and has been crucial in improving conversions by nearly 50%.

See a sample of the training video:

Audit All Web Forms

Using best practices as a foundation, a coworker and I audited over 400 web forms, identifying all the issues that needed to be addressed. Following the audit, we revised nearly 300 web forms by giving them new titles and concise descriptions, adjusting questions, and adding helpful text. All written content now adheres to plain language principles, questions are arranged sequentially, and help texts are relevant. Without this effort, a new structure would not be successful.

Draft a New Information Architecture

After reviewing all feedback and web forms, I developed a new structure for the Service Catalog that organizes all forms by topics. The previous organization grouped web forms by departments, but through hundreds of user observations and written feedback, I identified that users had difficulty deciding which department to choose because the navigation reflected the company's structure. Internal teams used naming conventions that were not descriptive enough to help users understand their internal functions and service offerings (e.g., GWS refers to facilities services, which is not a well-known acronym among employees). The topics created are based on the services each web form provides, so if the form is for account creation, it is placed under the Account Access category.

Hybrid Card Sorting and Tree Testing

The drafted architecture was tested in a closed card sorting, and I also conducted an open card sorting activity with a group of users to understand how they would organize web forms. The results from both studies were used to refine the initial draft, and the final structure was subsequently tested with 50 users through tree testing. The test revealed the exciting potential of the new structure, with 75% of users successfully completing the tasks and achieving an 85% directness rate.

New Task Flow

Before the redesign, users had a single entry point to the service catalog: a red button in the header labeled "New Request" that redirected them to the catalog homepage, which displayed all first-level departmental categories organized in blocks. The navigation structure was not fully visible; users could not access lower levels without selecting one of the first-level options. I addressed this issue by enhancing the navigation in the header with the support menu, enabling users to access any category from any page.

Conclusion

This project represents a major milestone for Service Management at Red Hat. Web forms are now organized in a user-friendly manner, and all text adheres to plain language principles. The structure is accessible from any page, and additional entry points have been created, enabling users who aren't sure what they’re looking for to easily browse the catalog and find what they need. The design is modern and consistent, accommodating smaller screens, even though the platform is primarily used (98%) by desktop users.

The result of all this effort was incredibly positive, and the numbers do not lie:

The new service catalog has transformed how users engage with web forms daily. The increase in conversions was expected, considering the potential of the new structure highlighted during the card sorting and tree-testing activities. I felt honored to work on a project like this and achieve such great results.