Clear Ocean
VMware wanted to build an upgraded EMS system with self-service functionalities to reduce IT dependency and empower department heads to manage their own services. I was brought in as a user experience designer on the project. My responsibility was to follow the design process to deliver a product with top-notch interaction design and user-centric experience. Once live, Clear Ocean will be used by VMware across the globe and will be also sold as an EMS product to VMware's customers.
THE CHALLENGE
VMware has been using an ESM (Enterprise Service Management) system called HelpNow+ which was entirely managed and maintained by their IT team. All the changes that were needed in the system, offered services or adding new services have to be done by the IT team. This increased IT dependency tremendously resulting in delays in the process and request management being bottlenecked. The challenge was to develop a new ESM product from the ground up with self-service capabilities at its core to regularise processes and empower department admins to manage their service portfolios.
Final Design
.png)
Homepage
Keeping the state of mind of the users who would be coming to this portal for seeking help we have kept the design language very simple and minimalistic. The search bar directs them to find the relevant issue and raise a ticket for it.
Recent search and typeahead feature and helps in swift identification of the required service.
The user can scroll down to access additional information such as their previous tickets, pending approvals or relevant KB articles.
.png)
Search Result Page
On this page, the search bar shifts to the top of the page to give maximum real estate to the search results. Users can find a solution by either raising a ticket for a required service, by reading the KB articles or referring to the existing tickets.
The colours, font styles and typeface were used mindfully to bring out information hierarchy in all the cards.
.png)
.png)
Service Form
Once users select a service they would fill out a form and submit it to raise a ticket. The uppermost section on this page gives a brief description of the service and later collapses as the user scrolls down allowing the form fields to occupy the screen space.
The single-column form structure keeps the layout clean, makes it easy to comprehend and is also scalable. As the system is highly customisable keeping scalability was imperative while designing the mobile screens.
Ticket Details
This is one of the most content-heavy section of the whole product. All the information related to a ticket, its form fields, assignee information and other details is presented here.
To accommodate all the data points I introduced a bottom bar for this module which divided the content into 3 major sections. Each of these sections had their own tab structure which further segregated the data.
