Overview

︎A Project and Resource Management tool to assist A&E firms in scheduling and managing an overwhelming number of projects.

Mosaic’s patented AI dynamically updates people’s work plans to optimize who works on what and when. Mosaic’s features include project planning& management, team management, time tracking, and budget monitoring. It can also integrate with financial software to track projects, monitor budgets, and the business' health.

Website  ︎More Info

︎My Role

I’m the sole UX/UI designer on the team and I’m working directly with the Product Manager, CEO, and Cross-functional Team Members.

My duty at mosaic includes all design stages, including creating and refining design features, researching, building the information architecture for the new capabilities, working on the low/ high fidelity mockups, doing the company-wide user testing, uiqa, etc. I’m also working on optimizing Mosaic's Design System and Website.

Challenge

What
A Project and Resource Management tool to assist A&E firms in scheduling and managing an overwhelming number of projects.

Why
Many organizations and teams which rely on traditional spreadsheets to administer their work are struggling from lack of proper communication and task management.

Who

Research

People use the product differently depending on the role, tasks, or expertise. To understand the workflows of our different types of users, I tried to gather as much insight as I could about the parameters that affect their work, and how that, in turn, affects the company. The goal was to understand the following:

︎Company Hierarchy


︎Structure of an Assignment/ Project


︎Pain Points

Main Feature
Workload & Planner

The main feature I worked on since I joined the team named Workload & Planner. The feature is trying to improve teams work efficiency. You can easily see who is working on what. It helps Managers enjoy planning in a visual and easy way.

Current Screen (Split Screen Function)

 

User Flow 1.0

When we started designing the feature of “Workload & Planner”, to better understand user flow, I created a User Flow map. I shared the map with cross-functional team members to prepare for the next brainstroming section.

Driving Forces

Also, from Primary and Secondary research, I distilled the key facts and summarized the pain points into four sections: “Phase”, “Project”, “People”, and “Quick Change”.

In these four parts, “people” and “projects” are much wider impacts. They are the two most important parts of the team, So I decided to start from them.

︎Project side
One project might have several phases and many people working towards it.
And The project is related to the budget. It can go longer or go over budget.

︎People side
Every day, each employee might work on different projects and spend different amounts of time. Sometimes, they might also just work on a phase of a project.
And usually, they charge a bill to the client and get a salary from the company.

Brainstorming

Low-fidelity Prototype

Based on the driving forces and user flow map and brainstorming. I tried to translate the ideas into low-fidelity prototype.
I introduced the timeline bars to better display the relationship between Dates & People and Dates & Projects.

Optimizing

︎Reusability


I also introduced Mosaic’s existing features in the prototyping stage. It can improve the system consistency as users are familiar with theses features. Also, it will help the team save some time as they are easy to build.


︎AI Suggestions

We also tried to introduce AI suggestions, the potential feature we assumed in competitive study.
It includes “ Project & Member Suggestions” , “Automatic Rescheduling”, and “Predictive Workload & Revenue”.  All these AI suggestions are based on employees profile and experience.

User Flow 2.0

Mid-fidelity Prototype

As you can see, we use gray as the background color and we used brighter color for the bars to let them stand out from the screen. Since it is the part we hope user notice the most.

Interactions

To make sure users interact with the bar with a minimum effort, I worked on different kinds of interaction potentials.

Pilot Testing

After Mid-fidelity, we did company wide design critique and pilot testing. The pilot test group consisted of 3 Architects and 3 Engineers from AEC firm in New York City. We tested functionality, workflow intend, and interactivity of the product. It helped us find usability issues early on and identify edge cases for us to study.

Iteration

From the user testing, we found the result was dissatisfactory. About 80% of participants are still hard to know how much capacity do employees have. 

So we decided to have a 2nd round Brainstorming section. After that, I tried to use a heat map on the first level. So in the default view, the manager can better know the employee’s workload. It can help them easier to assign work.

High-fidelity Prototype

︎Workload Heat Map(Collapsed State)


︎Workload (Expanded State)


︎Work Plan Modal & AI Suggestions Modal


︎Planner

Agile Product Development

While Mosaic has shipped a set of features that will satisfy day to day tasks on most teams, we didn’t stop there. We hold Sales feedback for product demo meeting every week to gather feedback from users. 

Measure Success

Take Away

︎Communication
Transparency, Teamwork and Vision can work wonders.

︎Assumptions
Failure is nothing to fear. Always “Start Small, Make Quick Cuts, Test Assumptions, Fail Quickly, Make Adjustments and Improve”

︎Collaborated with cross-functional team members in a remote setting
The pandemic accelerated existing trends in remote work. To balance the time for communication and the time for design independently, I got used to delivering design solutions in a friendly way for others to understand with minimal verbal communication.

︎ Back to the top

Next ︎

---

Post Order Item Addition

Mosaic

Member Commnucation Optimization

Green To-Go

Cubitac

Janus

NYU Worklink

Access For All