Built a New Stepper Flow for Better Technician Decision-Making ~ Mainteny

Make the newest software technology available for small and medium size elevator companies to keep them competitive.

– Earlybird Venture Capital

Overview

This product has 3 types of users:

The Service Manager (the manager of technicians)

The Property Manager (Client of our customers). In this case study, we only focus on Service Manager users.

The technician with the mobile app

Previously, we didn’t have any option for this step.

This step is for the Service Manager (the manager of technicians) to order the service. In this example, the category that we show is ‘Callout Order‘ which is it has the most complete option (3 options) that the app offers.

Scope

Based on user insights that already occurred before I joined, the Service Manager users need to be able to choose whether to order the service based on:

Order their technician immediately

Order the services by selecting the schedule

Order the technician by selecting the schedule

Unless the manager selects the ‘Emergency Order’ category, then they can order the technician immediately (1 option only) without the ability to choose the schedule.

My Challenges

My challenge here was as a UX Design Lead, which was more of a player-coach, so I needed to give the Junior Designer a try to make some design alternatives while also making some other design alternatives by myself. As he was a junior designer, of course, this was challenging enough since he needed to struggle between design and design limitations and possibilities on the development with a very tight timeline, along with other work scopes. Although this is good for him to learn more, of course.

The problem we need to solve

The problem here is more about UI and the interaction, because we already have the solution in mind as I mentioned above.

How can we add these options inside the stepper while we also show the content of each option? The content here is in short form.

Some design alternatives we made as I remember whether to use a popup/modal to put the content or another one by putting the options and content side by side/left and right, etc. Unfortunately, I don’t keep the previous design choices.

Solution

After we showed our work to the stakeholders, here’s the design that they chose, which coincidentally was my proposal. We use a horizontal radio button with cards. Use cards so we can put some text on each option.