PLANGRID
Project hub dashboard design for efficiently managing construction builds.
PlanGrid Project Hub
PlanGrid is a powerful construction productivity software that enables general contractors, sub-contractors, project managers, project engineers, and field workers to build more efficiently than ever before. PG pioneered how users interact with digital products in the field and ensures a sustainable workflow–giving access and markup capabilities to important documents, sheets, field reports, and more.
This incredibly collaborative tool houses a ton of information for any given construction project. Users were familiar with the original navigation that directed them around the product but there was no dashboard for at-a-glance information. Working with the dynamic, multi-faceted powerhouse that is Pixelfat, we were tasked with creating a home for general data that could work across any project.
Project timeline
To give y’all better insight into the mammoth sized complexities of this project (aka a truly meaty widget), we’ll focus on one of the component build outs I led, the project timeline. An at-a-glance overview of the project timeline, high level milestones (goals) within a project, and milestone statuses to keep the team on track. Here’s a quick video the team put together to walk users through our beta round of the project hub dashboard. Git into it!
The problem
The project timeline was a highly requested customer feature, created to provide context for users as to where in a project the team is. Most construction projects occur on a longer time frame so how could we help orient users in the day-to-day with a top level picture of what’s happening? Is there an effective way to alert users of upcoming project milestones to help them reach their project project completion dates? (TL,DR; YES!)
The process
This component went through multiple iterations, taking into consideration the nuances of a task management tool within the larger dashboard. We began with a straightforward timeline with start and end dates an administrator could customize and after unanimous feedback from informative user sessions, milestones and multi-marker milestones were added on. Users wanted a way to contextualize the larger timeline with those high level tasks happening within a project.
Does it get more low-fi than this?
“Easy to read” sketches.
Early iterations
Round II, request for milestones + multi-markers
After our beta launch of the project hub dashboard, a unanimous user request was for milestones, the ability to create top-level goals throughout the project timeline. With this the ability to denote multiple milestones within a close timeframe. We were inspired to do anything other than what the current interface of low-fi scheduling tool was doing. (Beautiful chaos, really.)
Try to discern this, I dare ya.
Milestone statuses
Completed milestone
Overdue milestone
Upcoming milestone
Multi-markers
Multi-marker milestone
Multi-marker milestone, expanded
Adding a new milestone
Complete a milestone
Edit or delete a milestone
Early mobile iterations
The outcome
The complexity of this internal task management tool added essential functionality to a robust dashboard system. We elevated an expansive design system that created a new look and feel for the project hub, while still connecting with an already familiar user base. The timeline tool has since proven to be an integral part of the project hub beta release, specifically for administrator users. I was incredibly excited to be a part of such a diverse platform build out, each component offering new opportunities to grow and learn.