An interactive employee/project tracker concept that allows the user to gain insights on activity and hours.

01_BL-project-tracker-concept-mockup.png
 

role

UI/UX, Data visualization, wireframes, data mapping, user research

timeline

4 weeks

technology

Illustrator

 

Overview

This project came about when management wanted to better understand employee project allocation to allow them to effectively plan future projects without overwhelming the team.

 

Findings and Ideation

After scoping the project to gain a better understanding on why they needed this interactive tool, we gathered requirements from management and began our brainstorming and initial sketches and wireframes. We explore various ways to convey the projects, hours, and employees in a creative yet complex approach.

A few high-level requirements:

  • Show hours on each project

  • Projects currently being worked on and by whom

  • Number of individuals are on each project

  • A visual that is interesting and reflects the company’s style

  • API integration with company hours tracking tool

 
Initial sketches

Initial sketches

Concept 1

Concept 1

Concept 2

Concept 2

 

Design Draft

One of the many mock-ups versions that we went through as a a team. After vetting out the positives and negatives of each visual, we landed on a halo chart as oppose to the previous wireframes.

BL_PeopleTracker(1)_v4.0.png
BL_PeopleTracker(3)_v4.0.png
BL_PeopleTracker(2)_v4.0.png
 

Final Designs

With more revisions and fine tuning, we ended up with a clean, modern, and easy on the eyes visualization.

BL_PeopleTracker_ShowAll.png
 

Quick walkthrough on how to read this visual:

  • The cluster of circles in the center represents the ongoing projects with varying circle sizes representing the amount of hours being placed into the project.

  • Outermost grey circles are the employees within the company with segmented colored ring representing their discipline (data, designers, developers, business)

 
Or by individual view by clicking on the outermost circles.

User can view by projects simply by clicking on the innermost project circles

BL_PeopleTracker_IndividualView.png

Or by individual view by clicking on the outermost circles.

 

What we’ve accomplished:

 

1.

Created a visual tool that resonated with the team. It was designed to be interactive, functional, and eye-catching.

 

2.

Ability to interwove methods of data encoding to layer information in a complex but digestible way.

 

3.

Reflects the type of work Boost Labs does (data visualization products). This could potentially be productized after testing and development.