top of page
home-siding.jpeg

James Hardie

R.png

Summary

The James Hardie mobile app gives users the ability to quickly and easily fill out all essential documentation for their job position.

KPI's

96%

Employees agreed that the app made documentation completing easier than current methods.

Group 44 (3).png

"We definitely need this app, it would make things easier".

white-time-icon-413670.png

Documents are completed 2 times faster using app which saves each employee time for other tasks.

Group 45 (2).png

"This app is really cool, I'd use this before using paper".

kindpng_1124035.png

Saves hundreds of dollars annually by reducing costs for printing supplies.

Group 46 (2).png

"I love the notification feature, it would help me keep the guys reminded to do their paperwork".

I need to figure out a solution to make paperwork completion more efficient, simple, and quick so that managers, supervisors, and hourly operators can do their tasks more easily.

Project time

4 weeks

Tools

Figma, Miro, Invision, Octopus 

Challenge

My role

Project manager/ UX designer

Press to buttons below to skip to each phase

The Back story

As I sat in the break room talking with my coworkers, I noticed how everyone's attention was fixed on their phones and I pondered how I might use that attention to benefit our company. I began to reflect on that observation and asked myself,  "How could we use our phones to fulfill some of our daily tasks?" This question formed the basis for my case study.

Empathy

empathy phase

Proto persona and user Interviews

To get a better understanding of the user's needs, wants, and behaviors I needed to conduct some research. I created an interview plan and interviewed managers, supervisors and hourly employees across the plant.

Group 36.jpg

Manager

Group 31.jpg
Group 30.jpg

Supervisor

My First Board - Frame 1.jpg

Hourly

What I discovered.

  • 97 % of employees have failed to turn in their safety engagement at some point due to documents being unavailableforgetting and not having enough time.

  • 90% of employees use paper to complete documents rather than using tablet or desktop.

  • 100% of employees have mobile phones and are familiar with using apps to complete tasks.

  • Management has to continuously remind employees to complete their paperwork each week.

My First Board - Frame 2.jpg
Define

Define phase

The Problem

Employees are failing to turn in required paperwork due to documents being unavailable, too many documents to complete, and a limited amount of time. These obstacles create extra problems for managers and supervisors. If this continues our plant will reflect poorly on the company, which will lead to costly penalties.

The Solution

Design a system that all work documents and information can be accessed from one place. Employees need to be able to easily find and submit documents faster.

IDEATE phase

Features

Ideate

Next, I went back to my affinity map and looked at my data to see which features needed to be included in my design. After brainstorming, I created a prioritization matrix.

My First Board - Frame 3.jpg

User scenario

I needed to visualize my design achieving the goal I set out to accomplish, so I designed a user scenario to bring all of my ideas together.

Group 42.jpg

User flow and Style guide

Next, I wanted to begin building the structure of the app's navigation and aesthetics so I created a user flow and style guide. 

Screen Shot 2022-03-15 at 8.14.47 AM.png
Group 39.jpg
Group 40.jpg
Group 41 (1).jpg

prototypinG 

Wireframes

Prototype
wireframes.jpg

My wireframes started as paper sketches, to mid-fidelity digital wireframes, and finally to high fidelity wireframes after testing and iterating.  

Group 38.jpg
Group 43 (1).jpg

testing

User testing

Test

I needed to do some user tests to see how users reacted to my design. I devised a testing strategy and had several users attempt to perform a series of tasks while I observed and recorded their actions and comments.

yy.jpg
ww.jpg
hth.jpg

Iterations

  • Increase header and body text size

  • Rename header titles on main page icons

  • Change logos for main page icons

  • Add back buttons

  • Middle align all wireframes

  • Fix navigation bugs

  • Add image to main page background

  • Activate button press feedback

Final design

Group 27_edited.png
  • Documents can be easily accessed, filled out, and submitted in a quick step-by-step process.

  • You have the option to enable alerts and notifications to give you an extra reminder when something is upcoming or past due.

  • Managers can quickly filter through employee records using the filter feature.

  • Safety meeting info can be accessed to keep you informed at all times.

Group 48.png

Final thoughts

I'm quite pleased with the final design of the James Hardie App. It was great to see how enthusiastic my coworkers were when they were given the opportunity to try out the app. I had the opportunity to show the app design to management, who were very impressed with the concept and are now considering future plans to get the app created and installed across the James Hardie network.

Thank you

bottom of page