TPP E-APP Solution

Hub Services

  • Client: eBay

  • Product: Hub Services

  • Platform: Angular

  • My Role: Sr. UX/UI Designer

  • Project Duration: Sep 2022 to till date


Tools we used

Pen paper Figma Figma photoshop illustrator Figma

Hub Services

The Hub Services is an internal web application that contains all information related to Pay, Health benefits, Company holidays, Policies, News, Pages, Articles, Tools, Featured search results, Employees data of the organisation. It helps each employee to find whatever they search for and displays the data accordingly to their search results.

The Goal

Creating a Hub Services web application  which provides information about entire organisation.

Problems/Challenges (Feedback from Users)

  • Application should be User friendly, easy to review the cases with less navigation
  • General layout, real-estate utilization and organization of information
  • Reduce clicks, scrolling and navigation to enable low-touch processing i.e. screen design needs to be in line with user tasks/intent use of the application
  • User role specific Dashboards and Summary screens
  • Ability to access different areas of application from the Dashboard
  • Flexibility in managing layouts to adapt to changing user needs
  • Ability to view data from external applications such as Risk scoring engine
  • Features to improve productivity such as Floating Notes widget, Automated Notes, Reminders, etc.
  • Ability to perform A/B testing and Analytics on user behavior
  • Improve tracking of data changes and user actions
  • Help users recognize, diagnose, and recover from errors

Outcome

  • Delivered user friendly application with various features
  • Rich user interfaces using Bootstrap
  • Adaptive and Responsive user interface
  • Web Content Accessibility Guidelines (WCAG) 2.1
  • Multi-column layout for utilization of better UI and reduce vertical scrolling
  • Floating notes for taking notes without losing the context of the case
  • Use of Google Analytics and address search
  • Ability to perform A/B testing

Our UX Approach (Double Diamond)

We followed Double Diamond Process to address the existing issues in the product


UX process

Research phase

Discover the problem

  • Identify potential problems that underwriters might have when using the TPP application 
  • Collect data from users in a variety of formats, including Docs, PDFs, images, and spreadsheets
  • Met with the underwriters in-person for the interviews
  • We had brainstorming sessions based on the underwriter and stakeholder interviews

Define the problem.

The following steps were taken:

  • Sift through the data and concentrate on the key problems that the product seeks to address
  • List all underwriter pain points in a logical order
  • Classify all underwriter pain points by module
  • Take into account technical limitations before offering a solution

Develop solutions for the problem

  • Initially we designed the wireframes to finalize the solutions
  • Once solution is finalized, we created the visual mockups followed by branding guidelines.
  • After visual mockups are freeze we converted those in to functional prototypes by using bootstrap framework to implement in the real-time application.

Deliver the product

Before delivering the product we tested the application to meet the Usability goals, Branding guidelines, Alignments, Functional Correctness, Browser Compatibility, Device Compatibility, and Accessibility standards.


Thank you

For taking the time to go at my work! If you'd like to participate,
See more or contact us for additional information.


Check out some of my other case studies