Darren Halstead UI / UX / HTML / CSS / Accessibility

A screenshot of several artboards in Prototype Mode inside Adobe XD.

Managing Gift Card Outages at InComm

Occasionally the systems InComm used to generate gift cards would have outages. These outages were not something InComm employees could resolve and an outage would impede InComm customers from purchasing gift cards, however InComm’s system had no way to handle outages, so customer orders would be negatively impacted without the customer understanding why.

We were approached by the production support team who managed this process. They requested a simple interface to manage and track outages. This interface would allow them to input outages as they became aware of them.

The product owner and I conducted early interviews with the team to understand what they needed. We learned there were four types of outages that could occur, but initially they only wanted to cover what they believed was the single most common type.

Outages could occur in these ways:

  • Processor (the source of the gift cards) - Most Common
  • Brand
  • Single Product
  • System wide

After spending time with the team and learning what they wanted to do the product owner and I drafted some user stories. Once the user stories were created I got to work designing the most common use case.

one of the screens from the first version.
This is an example of one of the screens from the first version of the design.

This early design went unused for a time due to business priorities. Late in April we revisited it, and discussed the early version with the team who had requested it. They had done some additional digging into their logs and discovered their biggest needs were to cover outages concerning brands or individual products.

This was an increase in scope over the original version, as we had to cover two types of outages that had some differences in what was required on both the front and back ends. We decided this was a good opportunity to run a user test. I created a version of the mockup robust enough to use as a user test and was able to run the prototype through a testing session with each of the three members of the production support team.

an image from the test prototype
This is one of the screens from the test prototype. You can view the test prototype. Please note, this prototype has notes to developers (pink text) on some screens.

View The User Test

While the results of the test were very positive, some issues were revealed. Test participants requested wording that was more friendly on some of the dialogue boxes (this wording was to warn the user that if they changed availability customers would be notified and impacted).

Changes were made to the prototype and handed off to the development team. Due to development constraints, only the two outage types from the user test were developed, and they were still missing some of the requested features (such as notifying customers via email if there was an outage).

an image from the final version

This is an image from the final version of the prototype, which was handed off to developers.

Later in 2019 the React components used to create this feature were updated to meet the Web Content Accessibility Guidelines. Unfortunately, I don’t have images of that version of this feature.

View the History of my work at InComm

Lead UX Designer

User Interviews, Wireframes, Information Architecture, User Testing, Final Design, Front End Development (HTML/CSS)

InComm

Timeframe: March - May 2019 (this feature)

Challenge:Radmin is an internal tool used by InComm to configure gift cards, customer catalogs and a growing list of other functions needed by the business. I inherited the Radmin project when I started at InComm in 2017. This feature would allow a new team to manage card processor outages.