Client / Duration
Jun 2015 - Sep 2016
Lead (and sole) UX Designer
Product manager, developers and QA testers
Full stack design
Release planning using JIRA
UI coding in HTML/CSS
1. New product, worked on it since its incubation
2. 2 sucessful product launches
3. Evangelized design thinking through the organization via lunch-and-learns
4. Fine tuned UI for pixel perfection, with full access to code base
5. Srum master for the whole team
6. Sole UX Designer on the team
Asset Management, done smarter.
1. Context Setting
Mobile Work Manager (MWM) is a new mobile application used to manage infrastructure asset operations related work orders.
Annually, every State Department of Transportation (DOT) across the United States gets an annual budget towards maintaining/constructing new infrastructure in their states (This includes big assets like bridges, roads, etc. to small assets like road signs, traffic signals, etc.). The state budget trickles down to districts and further down to county offices which are resposible for maintaining assets within their specific areas. The county offices hire contractors to complete the work (each task/work is called a work order). When the crew goes into the field to complete a work order, they need to record asset location, labor, equipment, materials used and time spent.
Before this project, the work orders were being tracked and recorded using analog mechanisms like paper and manually entered into online systems by the office clerk. MWM was developed to make their process faster, smarter and reliable.
1.1 CURRENT CX
2. Why mobile application?
As seen in the image above, currently the major portion of the asset management operations workflow is done manually and on paper. This leads to high level pain points listed below
2.1 High Level Pain Points
A mobile solution for asset management operations workflow posed amazing opportunities -
3. Ethnographic research
To dive deeper into the existing day-to-day workflow and identify user needs, the Product Manager, Charles, and I conducted ethnographic research at 3 state departments of transportation - NYDOT (Albany, New York), LADOT (Baton Rouge, Lousiana) and TXDOT (Austin, Texas), where we spent several days at the county offices, talking to crew leaders, crew members, managers, and office clerks. We accompanied the crews on a few work orders and documented their day to day work flows and challenges. We reported back and translated the research findings into product requirements. In classic agile scrum terms, we developed epics, themes and user stories directly informed by the research.
3.1 Selected Pictures
3.2 Selected Quotes
“I want to be able to add all 300 activities on the device. They should be easy to search and add to work orders” - Vince Latino, Main Office
"All LEM (Labor, Equipment, Material) has to be booked individually for each task (in their current system MAMS). We want it to be easier." - Justin, Crew Leader, LADOT
(Lifecycle maintenance) "Create work orders based on date at the back of an asset (eg: sign). These dates should be maintained in inventory” - Unknown, Crew Leader
From the journey map, the team concluded that having the crew leaders as the primary target user for the mobile application would have the highest impact on the overall user experience. In addition, other factors like county budget (for #devices per county office), primary responsibility to record data, etc corroborated this conclusion. From then on, Andrew, Kenny and Jodie became the "user" in our user stories.
- Due to dev resource constraints, the business decided to implement the app in hybrid HTML5 (cross platform and no native UI).
- From device availability data and usecases, the team concluded the priority of device/screen-size to be 1. Android tablet (Landscape mode), 2. iPad (Landscape mode) 3. Tablet (Portrait mode) 4. Mobiles
5.1. LAUNCH #1
The first launch was intented to serve as a proof of concept for testing functions critical to the success of the product.
Launch 1 Goals
1. Offline support
2. Download work orders assigned to your crew
3.View work orders on map
4.View locations within a work order on the map
5. Test that google map APIs and existing database backend are compatible with hybrid HTML5 app.
5.1.1 Login screen
5.1.2 Settings screen
184.108.40.206 Settings screen / Offline Map
5.1.3 Work Orders Screen
220.127.116.11 Work Orders Screen / Selected WO
18.104.22.168 Work Orders Screen / WO Details
5.2. USABILITY TEST #1
Since this was more of a "View only" POC, the first usability test was intended to get initial feedback from users regarding the direction of the application. The test was done remotely and users were asked to share their feedback regarding the settings screen and the Work order screen.
1. Users expressed interest in having Google Earth maps in addition to the 2-d maps.
2. Users also wanted to see comments on individual locations on a work order, in addition to the work order itself.
We also asked questions around what information they would like to see about the work order in the list view. We landed on WO number, date, Activity type and comment from this usability test.
5.3. LAUNCH #2
Launch 2 Goals
There are 2 types of locations - Linear (example bridges, guardrails, etc.) and Point (example signals, signs, potholes, etc.) Since adding linear locations were more complicated, we decided to start with the funcationality of adding linear locations to existing work orders in our second launch.
5.3.1 STEP 1
5.3.2 STEP 2 / Select Route
5.3.3 STEP 3 / Select From point
5.3.4 STEP 4 / Select To point
5.3.5 STEP 5 / Save
5.3.6 STEP 6 / New location added
5.4. USABILITY TEST #2
The test was conducted remotely using Cisco screen share. Users were given the task of adding a new location to an existing work order.
1. Alternate method to enter location - Users wanted alternate methods like manually entering locations in addition to GPS
2. BACK button vs CANCEL button - Users were confused with cancel button on the 4-step location adding process. Instead they wanted a BACK button to be able to go back a step
5.5. Next (Not launched)
5.5.1 create new work order
In order to communicate motion to developers, I also created short movies (using JustInMind and Adobe AfterEffects). I do not possess such movies for the features above anymore unfortunately.