Since 2014, a comScore report pointed out that smartphones and tablets combined account for 60 percents of all online traffic. Therefore, HPE Propel is designed and built with responsive UI based on HTML5, so that users can interact with Propel with their tablets or mobile phones as well. However, from our customers' visits, there were lots of conversations keep popping up for the mobile experience. Given that, "Service Broker Mobile" app is designed for filling up the gap in response to our customers' feedback. In additional, for HPE internally, "Service Broker Mobile" project was also considered as the leading project for next-generation HPE Service Broker product by having one mobile client that works with both HPE Propel and HPE Service Anywhere (SAW) backend.
Based on our customers' workflows, I worked with HPE SAW team and narrowed out below cases that a mobile app will be handy:
A clear sample case from the customer is that:
An employee set up a print job, left his desk and headed toward the printer, and then found the printer was not working. He has to walk back to his desk, and access the web portal on his laptop for filing the support ticket. And chances are the ticket asks for printer's model and serial number, so he has to walk back to the printer, capture the info, and return to the desk for completing the ticket.
Even in this kind of situation, the user still preferred to create the support ticket with the laptop instead of on the mobile browser, is simply because he feels using the laptop is still easier. This reveals that the interaction design on mobile still has rooms for improvement. Hence, we believe a native mobile app with dedicated mobile experience design can deliver additional benefits in terms of Convenience, Speed, and even Personalization, to help users achieve their goals on mobile with ease.
Based on our internal discussions, here are our visions that Service Broker Mobile should:
Also, from HPE SAW team's data, we found that "Over 40% of the requests are covered by less than 1% of the service offerings." And the popularity among the service offerings shows certain similarity and trending within the same organization. And from our side, other than typical "self-services portal" functionalities, HPE Propel's customers are also interested in tracking "Approval" type of events, and they are happy with the "My Workstream" smart feed capability. So we highlighted the primary features of "Service Broker Mobile" are:
Per our managements, the pilot product will be targeting on Android platform. Hence, I studied the latest practice of mobile design practices and went through the comparative analysis on multiple consumer- facing apps for evaluating the pros and cons. I designed the user interface from wireframing, and try finding ways to help easier streamline the interactions on the mobile. I started from "flow of creating support ticket", the primary use case that customer shared us.
I designed two extra quick access routes in addition from the app's home screen. One is allowing users to add the quick access widget on their Android's home screen; the other is added a hook in Android native Gallery app so that users can easily take a photo and directly attach it to the support ticket.
The first screen of the ticket creation process, the UI presents a grid of issue categories to help the backend system roughly dispatch it to the correct divisions. For the main ticketing UI, I envisioned it like a chat interface and having the intelligent/robot assistant to interact with users and guide through the process.
Intelligent/robot assistant should prompt questions, and potentially embedded quick toggle options in messages to help users avoid typing and filling up the long list of questions on the mobile screen. Users can also utilize various native Android capabilities to attach more files, capture photos, geo-tag location, voice-to-text, etc to streamline the ticket creation process.
By entering/selecting the particular keyword, the intelligent assistant will go ahead and create the support ticket for the user. User can click back key (top left corner) to navigate to the Support Request main page to get the full lists of support requests. Support Requests are grouped by states (i.e. "OPEN", "CLOSE", "ALL"). And on the list view page, UI supports "swipe-to-close ticket", "select multiple and close", "pull-down-to-refresh", and other latest Android native interaction patterns (see details in Ticket Creation Flow Chart below).
Recall that our project visions include:
A straightforward approach is to leverage the existing HPE Propel launchpad design as close as it can, but only keeps the essential features that fit the mobile context. Since the UI layout between desktop and mobile app is similar, the learnability should be great for all kinds of users. However, users won't benefit much with this home screen design, since it makes too little differences comparing to Propel's responsive web UI. So this design could be considered as less innovative.
So in the next iteration, I came up a proposed design that provides a more personalized experience. In our internal meetings with HPE SAW team, we both agreed the "Smart Feeds" (HPE Propel: My Workstream-like) capability should be placed on the home screen for proactively bringing user-specific information.
In addition to the alerting capability, the card now also supports two to three quick actions toggles so that users can respond right away without entering the source app.
And then the "Popular Services" or "Trends in your Organization" is directly placed right below the smart feed section on the home screen. This way, based on HPE SAW team's data analysis and research, the UI should be able to help users discover the services or the supports, and sort of giving the impression of "guessing" what they are looking for.
Also, a floating action button is added to the home screen for easier creating a support ticket.
I also reviewed the information architecture for seeking a new unified UX between HPE Propel and HPE SAW. In my first design, the home screen simply lists out all the micro apps: "Shop", "Request Support", "Knowledge", "Approvals", and "Workstream Inbox" similar to HPE Propel launchpad. While in my latest design, I followed HPE SAW's approach by merging the "Shop" and "Request Support" apps into a single "filing request flow" through categorizing the request types properly. To achieve that, an additional "sliding-up" panel is added with all the high-level categories of the request types. And the "Knowledge" app is replaced by smartly pushing the relevant knowledge-based articles to users during the support ticket filing process.
By now, we only left "Approvals" and "Workstream Inbox" micro apps, and these two are more "event-driven" in nature. So I put them under the hamburger menu along with the red-badge alert for improving the discoverability. When there are pending events/actions in "Approvals" or "Workstream Inbox", the red badge will show up and serve as an additional approach to alert users other than the "Smart Feed" on the home screen.