Redesigned an iPad app for a proof-of-concept at Deloitte Digital.

Streamlining the health inspection process

Streamlining the health inspection process

2018, HEURISTIC REVIEW / UX DESIGN / VISUAL DESIGN

2018, UX DESIGN / VISUAL DESIGN

Inspection

Inspection

Inspection is an iOS app used on iPads for field workers conducting facility inspections. The app integrates features such as pulling the user's list of scheduled inspections from Salesforce in real-time, displaying map navigation to each location, aggregating content such as facility information and attached files, and guiding the user through an intuitive and flexible inspection questionnaire process. 

I was responsible for improving both the UX and UI created by the previous designer. I created the high-fidelity screens in Sketch App 3 and collaborated with the development team using InVision App.

Inspection is an iOS app used on iPads for field workers conducting facility inspections. The app integrates features such as pulling the user's list of scheduled inspections from Salesforce in real-time, displaying map navigation to each location, aggregating content such as facility information and attached files, and guiding the user through an intuitive and flexible inspection questionnaire process. 

I was responsible for improving both the UX and UI created by the previous designer. I created the high-fidelity screens in Sketch App 3 and collaborated with the development team using InVision App.

inspection-mockup-1

Home

The first access point in the app is a list view of the user's scheduled inspections. The page can be toggled between list view and split map view. Selecting an inspection will open its individual summary page. I chose to make the following design improvements:

Home

The first access point in the app is a list view of the user's scheduled inspections. The page can be toggled between list view and split map view. Selecting an inspection will open its individual summary page. I chose to make the following design improvements:

inspection-markup-1
inspection-markup-2

Inspection Summary

When an inspection assignment is selected, a summary from the last inspection for the facility will display. Users can perform a number of tasks on this screen: reassign the inspection to another user in the database, enable map layers, begin navigation to the facility, view facility and inspection information, open related documents and files, and read comments from the last inspection. To begin a new inspection, users press "Inspect".

inspection-markup-3

Questionnaire

Users are launched into the inspection questionnaire once they press "Inspect". I designed standard components for 4 types of questions: dual-option, multi-option, drop-down, and free-form. Users can navigate freely between sections of the questionnaire and add attachments to each question. The questionnaire can be saved at any point if the user needs to navigate away without losing work. I gave extra consideration to how the questionnaire could be laid out effectively in both portrait and landscape modes.

inspection-markup-4

Non-Questionnaire

Some inspections require a non-questionnaire, where the user attaches policies or codes to the inspection instead of filling out a form. These can be submitted along with non-compliant statements, corrective action statements, and attachments. I redesigned the flow so that each policy and code must be completed individually with its respective statements prior to selecting another. I divided the non-questionnaire form into two sections to create a space to store the completed policies and codes prior to submission.

inspection-markup-5
inspection-mockup-2

Key Learnings

  1. How to design according to Human Interface Guidelines for iOS
  2. How to simplify an application with information architecture and user flows
  3. The importance of consistency for usability

next project

SLEEPTUNE