Facility management app redesign

Deliverables

Research | User Flow | Wireframe | Visual Design | Logo Redesign

Client

Redi4 Media Management
January – February, 2020.

What’s all this?

Custom ticketing solution.

Tech FM

Redi4 (Mobile Management) is a software development company specialised in facility management (FM). They offer complete FM software solutions for big clients, who are handling multiple business building operations simultaneously. Part of that solution is Tech FM.

Mobile app made for on site technicians to use in the everyday workflow. Tech FM helps them to manage through the incident tickets and ordinarily maintenance tasks. For every task documentation must be provided, such as time spent working, materials used and proof of completing the task.

Problem

Old application was based on outdated technology so Redi4 decided to make a new one. User experience and visual design in general were not on high level in the old version, so focus was to improve that segment as well. Except for making technicians more productive, usability and good design were also recognised as an important selling point. So, I was hired to lead the design process and create all needed deliverables.

Was it a fun one?

Yes, learned a bit of German along the way.

Getting familiar

Before making improvements I had to completely understand the old application and all of the existing functionality. A lot of information was provided by the Redi4 team. Also, I have deconstructed an old design and made sure to understand each element.

Internal dictionary

To help me move faster and not stumble, I have created small German-English-Croatian dictionary with all the words from the app and general terms from the facility management world I boldly stepped into.

Users

Advantage of redesigning a system for internal use is that you know who will be using it. To help me detect problems with an old app and determine the most important design features of the new design I have turned to people who are and will be using it every day.

Collaborating with a team from Redi4 we created a list of questions for technicians. 24 technicians participated in the pool. To get better feeling about how they operate in the field, we conducted live interviews with 5 people.

Pain Points

From the beginning, it was clear that not a lot of attention has been given to UX / UI design in the process of making the old app. Here are those deficiencies, boiled down to four basic groups.

Where am I? In some situations it’s not clear where the user currently is within the app. When working in the field this can be a real issue, because technicians are often interrupted in the middle of the process.

Feedback for user actions is missing even for some basic operations, e.g. new ticket creation, adding new material.

Cluttered UI makes it hard to click on the right thing. Show me only the essentials, please.

Too many steps in process. The specific process of connecting the “item” with the location was especially problematic. It was kind of a logic loop with multiple steps with screens that look almost the same. After the redesign, it became a simple 3 step process.

Design Challenges
  • Simple to use (but handles a lot of data)
  • Tablet first design (that works great on mobile screen sizes)
  • Improve user flows
  • Maintain a visual connection with the old app
  • German language

What have you delivered?

Let’s get visual!

Task Flow

To make sure everything is taken into consideration, a graphical overview of all basic steps is created. Collaborating with Redi4, few revisions of the task were done.

User Experience

A vital part of this project and my main assignment were to design more fluent, efficient and easy to use user interface.

Visual Design

Simple and clean. Modern look and feel. Iconography in lineal style. The color palette is a classic selection for the IT industry. Selected typeface is a bit softer to bring balance to the overall feel.

Over 80 screen designs

for each screen size.

Priorities and Statuses

Ticket Priorities and Statuses are color coded. The result is super simple hierarchy. Priorities are all in shades of red/orange and ticket statuses in blue/green.

Alert Messages

Offline Mode

The interface will turn to grayscale when Offline mode is entered.

Icons
Logo Redesign

New logo design has an arrow symbol incorporated to maintain connection with the old version. The symbol is framed with rounded rectangle to resemble the app icon style.