OnTarget Mobile App General Assembly UX Team: Elizabeth, Caterina, John V.
OnTarget Mobile App General Assembly UX Team: Elizabeth, Caterina, John V.
OnTarget UX App Analysis General Assembly Team: Elizabeth, Catarina, John V.
Project Goals:
OnTarget asked for help in redesigning the existing mobile app.
- Field users need an easy way to communicate- Users need to be able to update progress from the field - Users should be able to make comments or upload images - Should still get all features of existing onTarget app
- User Flow should be focused on tasks and communication - All relevant categories should be accessible in the app
OnTarget UX App Analysis General Assembly Team: Elizabeth, Catarina, John V.
Our 3 Week Design Plan:
1. Discovery: Competitive Landscape Analysis, Current App Analysis
2. Research: Survey, Research Data, User Interviews, Competitive Analysis, Heuristics Analysis, Feature Analysis
3. Iteration: Storyboard, User Flow, Hand Sketches, Medium Fidelity, High Fidelity Prototypes, User Testing
4. Delivery: App Map, High Fidelity Final Prototype, Next Steps
PHASE 1: DISCOVERY
Competitive Landscape, Current App Analysis
OnTarget UX App Analysis General Assembly Team: Elizabeth, Catarina, John V.
Initial Client Meeting
Initial Observations
Competitive Landscape
OnTarget Initial Observations
Previous Web App
- Design is clean and simple, using both iOS
and Material Design elements - Alerts on top right - Dashboard is the Main Page - Global nav changes based on page - Native app requires a login to continue - No on boarding process for new users - Cloud based appeared to be “Freemium”
Tablet Version
Specific Version for iPad or Android?
What does the Tablet app provide that the online does not?
Will it be able to do anything when offline?
How does the 4D integrate into the Tablet version?
OnTarget Initial Observations
- Tagline: helps firms drastically increase project efficiency and accountability by streamlining and mobilizing project communication and documentation.
- The world’s #1 widely used construction management tool - Wide array of products - Steep learning curve - Targeted at GC, PMs
OnTarget Competitive Landscape
- Tagline: The Construction App for the Field Join over 50,000 projects who trust Fieldwire every day to save time and money on-site.
- Robust Ipad/Mobile/Web functions - Fastest floor pan viewer - Free to Try
OnTarget Competitive Landscape
- Tagline: BIM 360™ is the perfect tool for Project, Field and BIM Managers to accelerate delivery, save money and reduce risk.
- Recently released - Autodesk powered - Free to Try
OnTarget Competitive Landscape
- Tagline: Join The Building Revolution: Turn simple field updates into game-changing insights. Finish projects faster.
- Specific for GC’s and for Subs - $500/month pro pricing - No free access or demo
OnTarget Competitive Landscape
- Tagline:Viewpoint is built on a foundation of Rock Solid Collaboration. Smoother, Easier & More Profitable Results
- Increased efficiency with field data-capture - Anytime access with or without internet connection - 35 years in business - Easy-to-use native app
OnTarget Competitive Landscape
- Tagline: Smart, Powerful, Easy-To-Use Construction Management Software Accessible Wherever Work Takes You
- business management for small & large construction companies - fully-integrated web-based document management - 35 years in business - Easy-to-use native app
OnTarget Competitive Landscape
OnTarget Current App Overview
- Dashboard Home Page
- Opportunities:- Start New Project being so large
and prominent may be unnecessary.
- Need to focus on what the field worker would want to see first.
- Color and contrast can be used more effectively to differentiate the main areas of the app.
OnTarget Current App Overview
- Project Home Page
- Opportunities:- Circles are off center - Client requested a change involving
the projected date vs the actual date. - Info can be set side to side and still
give the same detail without taking up the entire mobile app real estate.
- A bottom nav, or any kind of nav would me more helpful than relying on a very long scroll and the Hamburger menu to Navigate to the areas.
OnTarget Current App Overview
- Project Home Page 2 (Scroll down)
- Opportunities:- RFI information could be a small
bar, as it does not require 50% of the screen.
- When there is 0, the information should be dynamically pushed to the bottom
- RFIs are project manager only
OnTarget Current App Overview
- Project Home Page 3 (Scroll down)
- Opportunities:- Critical and Paste Due tasks
should be more prominent and higher on the screen.
- Adding models should not even be available on mobile as its not possible to accomplish.
OnTarget Current App Overview
- Project Home Page 4 (Scroll down)
- Opportunities:- Safety information can be a
smaller infographic rather than a large box, or be contained in its own page.
- A current hazards/roadblocks window might be more informative for the field worker.
- Scheduling is done by only select few users so should not be shown to those without admin privileges.
OnTarget Current App Overview
- Project Home Page 4 (Scroll down)
- Opportunities:- Hamburger menu acts as the
main navigation. - With only 5 choices, can be
better accomplished by a bottom nav bar.
- Hamburger menu can still exist but for things like account settings, models, deeper functions that are not accessible to the layman.
PHASE 2: RESEARCH
Competitive Analysis, Heuristics Analysis, Feature Prioritization, User Surveys, Affinity Mapping, User Personas
Competitive Analysis
To evaluate OnTarget’s competitive environment, we surveyed a number of onTarget’s direct competitors, their features and market position.
Competitive Analysis
• onTarget’s most interesting feature is it’s mobile integration of 2D and 3D models. It completely differentiates them from all other apps in the market.
• All of the apps we analyzed had opportunities for improvement to their navigation and user flows.
• FieldLens’s use of familiar Facebook formatting works to their advantage in that there is a very small learning curve to use their newsfeed feature. It also facilitates effective communication.
KEY TAKEAWAYS
OPPORTUNITY
“We must create the mobile product that offers a more focused navigation, with better communication.”
Heuristic Analysis
Heuristic analysis to determine how usable each app compared to onTarget. This shows where to focus our efforts in regards to usability.
KEY TAKEAWAYS: onTarget has the greatest opportunities for improvement in regards to learnability and error management. Overall minor improvements to efficiency, memorability and satisfaction would make onTarget a market leader.
User Survey
We formulated a User Survey to allow us to identify potential candidates for User Interviews. We sent this out on a number of social media channels in order to receive variety in terms of respondents.14 responses were recorded. Some example questions and results:
How long have you worked in Construction?
What was your role in the company?
Survey Results
What kind of devices do you use on the job?
How do you communicate your project progress to coworkers on the job site?
Feature Prioritization
KEY FINDINGS:
• 3 user types had different needs and permissions.
• Unavailable or unused features are still shown to all users.
• Big difference between Field Worker feature need and the other two user types.
OPPORTUNITY:
• Simplified User Flow
• Activity Log Focus
• Hide unused features
User Interviews
We posed questions about job related behaviors, experiences and pain points…USER QUOTES
User Interviews
We posed questions about job related behaviors, experiences and pain points…USER QUOTES
“Good communication helps us set up realistic goals. Like if a job is at 45% we can figure out what we need to hustle on the next day.”
“I still have my notes on an old school index pad, using pen and paper to track my tasks.”
“I wrote out a list of tasks for my workers each day and post it up. They cross off and initial the tasks as they complete them.”
“We need to improve the scheduling. A daily task list would be great, even a whiteboard on the jobsite would be better than nothing.”
“I need a way to know what my tasks are going to be.”
Affinity Mapping
Affinity mapping the results would help us to identify any patterns and common themes, helping us to further identify the most important features, and the situations in which they would be used.
MAPPING THE DATA
• texting and phone calls were the main forms of communication
• all users had at least a cell phone on site.
• nothing was able to replace the effectiveness of an on site visit.
• miscommunication was the biggest threat to the success of a project
• the bigger the work crew, the bigger the communication problems.
We then used these insights to create user personas.
KEY TAKEAWAYS
User PersonasWe discovered that onTarget mobile has 3 distinct user personas: Administrators and Project Managers who had top level access, Foreman and GCs, having power user access, and the Field Worker, who had view but no edit access on many features.
User Personas
FIELD WORKERS:
• Most of onTarget’s mobile users would be those field workers on the job site.
• Field workers do not care much about the analytics, but do care about things such as weather, tasks, task completion, and deadlines.
• Field workers wanted the ability to see and communicate progress on tasks.
• Safety Alerts were requested by the Field Workers.
PHASE 3 : ITERATION
Storyboard, User Flow, Hand Sketches, Medium Fidelity, High Fidelity Prototypes, User Testing, A-B Testing
,
,
,
! ,
Storyboard
Storyboards help to visualize the way in which the user might use the application. In our scenario, a carpenter named Sergio, checks his tasks using onTarget and is able to complete his tasks ahead of schedule. His project manager is happy that the project is running ahead of schedule.
, !
User Flow
User flow dictates the 5 bottom nav choices with the Activity Log being the primary landing and destination.
Hand Sketching
We started from the brainstorming. We
created some ideas in hand sketches
Using Marvel program we tested our paper
wireframes and get some good feedback
A-B Testing
onTarget has many features to navigate through and as a result one of our bigger decision points was to find out whether the app needed a hamburger menu to guide navigation or if a bottom navigation bar would suffice.
We took the opportunity to test our medium fidelity wireframes on 5 users, one of whom is a current onTarget user. This would help us decide what type of navigation made the most sense to users.
Hamburger menu Bottom menu
“I find the hamburger menu confusing.”
“I like the bottom navigation better, it’s more visual.”
“I don’t want to have to go back to the menu.”
“I feel like three out of the six icons on the web app mean the same thing.”
• 3 out of 5 users preferred the bottom navigation.
• The hamburger menu was too complex for users who mainly needed to update tasks or create posts.
• All 5 of the users were unable to identify the Schedule, RFI and Files icons. Users either thought they meant the same thing or signified what stage of completions a document was at.
A-B User Testing Key Takeaway
With these observations and pain points we were able to move onto a high fidelity iteration of the app with a clear idea what changes to make. Including using a bottom navigation and making the iconography clearer.
Opportunity
• Hand A/B Testing Takeaways
User testing on the Field
“No, I never saw something like this, but it
looks very clear to understand!”
Have you ever used this kind of
construction app?
Mid to Hi Fidelity
Mid to Hi Fidelity
From Mid to Hi Fidelity Make ups
From Mid to Hi Fidelity Make ups
From Mid to Hi Fidelity Make ups
From Mid to Hi Fidelity Make ups
The photos assigned with the task
Users can slide the progress line to change complite job %
User can see the person or team the task is assigned to
NotesThis is the screen users see choosen task information like photos, whom assigned to, progress, dates, status, comments. Users can add comment or just come back on the previous screen
5.04 View task Screen
Start and due dates of the task
Users can see priority, but only project manager can change
Users can see status, but only project manager can change 6
Users can see subject, but only project manager can change
User Can see comments of the users, who posted it and the date. User can also add his own comment in the new comments box
Tap on the post botton user post new comment to task
28
67
29
9
5
UXDI P5: onTarget Mobile AppJohn VukusicElizabeth KuklikovaCatarina Abballe
UX DesignerUX DesignerUX Designer
4
1
2
3 3
3
1
2
78
7
6
9
4
5
3
100%9:41 AMVerizon
Tuesday
65 ºF 63.5 ºF 58.5 ºF 43.5 ºF 61.5 ºF
Wednesday Thursday Friday Saturday
Plumbing 80% CompleteBathroom plumbing complete on 10th Floor. Waiting for audit.
Nick Tejada 8:45AM
Drywall Install 70% CompleteAll drywall installed on 9th Floor.
Umberto Masci 8:35PM
Roofing Install 50% CompleteTar Northeast corner of roof.
Fernando Lam 10 Hours Ago
Landscaping 70% CompleteAll sod and trees planted on North side. South side will be completed 10/12.
Arien Hall 12 Hours Ago
ACTIVITY LOGExposed live wiring on 10th Floor, Northeast corner. Please use caution when working in the area.
Windows need to be reordered. Size is incorrect.
David Delgado 9:00AM
Install Doors10 doors on the 4th floor.
Cut and Measure Wood for doorframesWood being delivered 10/31.
Install FramingMaterials will be on the 4th Floor
My Critical Tasks
Due in 1 Week
Due in 2 Weeks
TEAMGRAPHSFILESDATESLOG
100%9:41 AMVerizon
New Comment
Progress
Comments
SubjectInstall Framing
Due DateStart Date
Assigned To
Install Framing
See plans for details. Suppliesarrive day before.
David Delgado 10/8/2016
Carpentry Team 1
Post
CriticalStatusPriorityActive
80%
TEAMGRAPHSFILESDATESLOG
PHASE 4 : DELIVERY
App Map, High Fidelity Prototype, Next Steps
MODELS Sort by
Submittals16
Tasks32Uploaded Date: Febraury 11, 2016
Model Name
Alerts3
Submittals16
Tasks22Uploaded Date: Febraury 11, 2016
Model Name
Alerts3
Submittals19
Tasks28Uploaded Date: Febraury 11, 2016
Model Name
Alerts5
Submittals5
Tasks14Uploaded Date: Febraury 11, 2016
Model Name
Alerts2
Submittals19
Tasks28Uploaded Date: Febraury 11, 2016
Model Name
Alerts5
100%9:41 AMVerizon
TEAMGRAPHSFILESDATESLOG
TEAMSantiago CalatravaOwner
Michael Musk
Michael Musk
Manager
Nick SheenUser
Shawn ConnorUser
Gorana VukusicAssistant PM
100%9:41 AMVerizon
TEAMGRAPHSFILESDATESLOG
The photos assigned with the task
Users can slide the progress line to change complite job %
User can see the person or team the task is assigned to
NotesThis is the screen users see choosen task information like photos, whom assigned to, progress, dates, status, comments. Users can add comment or just come back on the previous screen
5.04 View task Screen
Start and due dates of the task
Users can see priority, but only project manager can change
Users can see status, but only project manager can change 6
Users can see subject, but only project manager can change
User Can see comments of the users, who posted it and the date. User can also add his own comment in the new comments box
Tap on the post botton user post new comment to task
28
67
29
9
5
UXDI P5: onTarget Mobile AppJohn VukusicElizabeth KuklikovaCatarina Abballe
UX DesignerUX DesignerUX Designer
4
1
2
3 3
3
1
2
78
7
6
9
4
5
3
100%9:41 AMVerizon
Tuesday
65 ºF 63.5 ºF 58.5 ºF 43.5 ºF 61.5 ºF
Wednesday Thursday Friday Saturday
Plumbing 80% CompleteBathroom plumbing complete on 10th Floor. Waiting for audit.
Nick Tejada 8:45AM
Drywall Install 70% CompleteAll drywall installed on 9th Floor.
Umberto Masci 8:35PM
Roofing Install 50% CompleteTar Northeast corner of roof.
Fernando Lam 10 Hours Ago
Landscaping 70% CompleteAll sod and trees planted on North side. South side will be completed 10/12.
Arien Hall 12 Hours Ago
ACTIVITY LOGExposed live wiring on 10th Floor, Northeast corner. Please use caution when working in the area.
Windows need to be reordered. Size is incorrect.
David Delgado 9:00AM
Install Doors10 doors on the 4th floor.
Cut and Measure Wood for doorframesWood being delivered 10/31.
Install FramingMaterials will be on the 4th Floor
My Critical Tasks
Due in 1 Week
Due in 2 Weeks
TEAMGRAPHSFILESDATESLOG
100%9:41 AMVerizon
New Comment
Progress
Comments
SubjectInstall Framing
Due DateStart Date
Assigned To
Install Framing
See plans for details. Suppliesarrive day before.
David Delgado 10/8/2016
Carpentry Team 1
Post
CriticalStatusPriorityActive
80%
TEAMGRAPHSFILESDATESLOG
PHASE 4 : DELIVERY
App Map, High Fidelity Prototype, Next Steps
MODELS Sort by
Submittals16
Tasks32Uploaded Date: Febraury 11, 2016
Model Name
Alerts3
Submittals16
Tasks22Uploaded Date: Febraury 11, 2016
Model Name
Alerts3
Submittals19
Tasks28Uploaded Date: Febraury 11, 2016
Model Name
Alerts5
Submittals5
Tasks14Uploaded Date: Febraury 11, 2016
Model Name
Alerts2
Submittals19
Tasks28Uploaded Date: Febraury 11, 2016
Model Name
Alerts5
100%9:41 AMVerizon
TEAMGRAPHSFILESDATESLOG
TEAMSantiago CalatravaOwner
Michael Musk
Michael Musk
Manager
Nick SheenUser
Shawn ConnorUser
Gorana VukusicAssistant PM
100%9:41 AMVerizon
TEAMGRAPHSFILESDATESLOG
App Map
6 7 8 9
54
2
3
1
New Post. User can tap here from the Activity log to create a new post.1
Tasks. User can tap here to view task details or filter their tasks.2
Activity Log. User can scroll to view important updates and alerts. Can also tap on entries to comment on them.
3
Activity Log. User can scroll to view important updates and alerts. Can also tap on entries to comment on them.
4
New Post. User can fill out form to add a new post to the Activity Log.5
Dates. User can view the project schedule along with the completion percentage for the various tasks/schedules.
6
Files. User can view the 3D Models, blueprints and other files. 7
Graphs. User can view the onTarget’s project analytics. 8
Team. User can view the different project contacts as well as call and text.
8
Short termCreate a iPad version of the mobile app.Modify the mobile app for different access, specifically super users and admins
Next Steps
Next StepsLong termCreate a Material Design Android version.Create a robust Chat function for the Mobile, Website and iPad versions.