Undisclosed Company

  • INDUSTRY
    Oil & Gas
  • PROJECT
    Website Application
  • TOOLS
    Adobe XD, Photoshop, Illustrator, UsabilityHub.com, Bloomreach
  • Team

    Project Manager, Project Owner, Scrum Master, Change Management, Business Analysts, Architecture, Design, Development, Quality Assurance

  • role
    UX/UI Design Lead

The Project

Our team was designated to build an application that enabled a 360° view of the customer for internal users. External users are able to enroll as new customers, place orders, access order related documents and manage users.

The Problem

  • SUMMARY
    • Provide external users access to order related data and documents.
    • Enable the ability to search and filter data within each document.
    • Provide ease of use for searching and filtering on mobile devices.
  • VALUE

    A majority of current customers do not have a digital application for accessing order realated documents. By providing online access, customers are able to self-serve online, reducing the amount of sales and customer service teams touchpoints and enabling increased productivity in other performance areas.

The Process

Design
The application framework was built on Material Design + React. The design system utilizes Material Components that were customized to align with the company's branding guidelines. Wireframes, mockups and prototypes were completed with Adobe XD.
Research & Workflow

The first release of the application was intended for customers who did not have an online application to access order related documents. My research included multiple interview sessions with stakeholders and users from three business units to uncover relevant data. I created layouts that would display the information and allow users to view the necessary documents. I performed usability tests and surveys between iterations.

The Solution

mockups

Several iterations resulted in a layout that allowed users to view, search and filter documents based on relevant data. Within the layout, I created a structure that defined the correlation between documents. The document hierarchy was displayed using a collapsible component that allowed users to see the Order data while the component is closed and drill down into options to access each document when opened. Responsive layouts provided the same functionality for mobile devices.

V1
View Orders V1.1
V1.5
View Orders V1.5
V1.10
View Orders V1.10
click to enlarge
end result

The final prototype displays a solution that allowed users to access their order related documents online from any device, therefore reducing churn and eliminating calls to sales representatives or trudging through email chains. This solution also gave users the ability to review and analyze data in a holistic view, something they were never able to do.

orders protoype

    Let's chat.

    © 2007-2021 JxnGraphix