Desktop. Enterprise. Logistical Software.

BuildSelect

Year
2021 (1 Week)
Role
Product Designer
Team
Designer, PM, Architect; Engineer

Overview

This project made it up to the high fidelity prototype/design stage and is pro-bono.

In a world of small business owners, owners want as many advantages, tools, and opportunities beneficial to them to make a profit.

With the client I worked with, their main concerns were having a way to manage schedules, reports, weather forecasting, and costs all at once.  I am brought on as a designer and the task is to satisfy both user and business requirements set forth by the project manager. This is an interesting project because I’m designing enterprise software for a very specific client rather than discovering the user.
Solution Preview
TL;DR system for how the dashboard is set up for BuildSelect

Design Process

Understand & Define

Good news; it's internal so no chasing down users.
This UX redesign effort sought to benefit current employees, specifically those working closely with scheduling or subcontractors, so focused on confirming the needs of the current employees rather than searching for new users.
What do the employees want?
I went over requested features with the project manager and verified with the architect on other features to add.
  • Priority 0 is MVP and within scope.
  • Priority 1 is within scope.
  • Priority 2 is out of scope, but possible in the future.
Putting a face to the employee
I interviewed the project manager mostly like to use the product, as well as the architect and engineer, to develop a persona going into the design process. The persona kept me aligned with what I needed to do and remember I'm designing a feature beyond just an Excel sheet.
Persona image
Figuring out the backups
The team I worked with considered other software alternatives so I did competitive research as a bonus to better inform their decision-making process.
Competitive Findings
  • Every competitor has multiple features outside of the ones defined by the stakeholders.
  • There are two primary dialog windows involved and consistent among competitors: a dialog when creating an event and a dialog when clicking or editing an event.
  • The information itself is complicated but viewing the information should be simple.

Ideate

Setting up the All-In-One package
Information architecture should already mirror both what the employees did with Excel as well as existing programs so it is easy to transfer between softwares.
Fine-tuning wireframes
A mid-fidelity prototype was used in a 1-on-1 with the project manager who gave direct feedback, confirm the features added were designed as they intended, and make any changes to what the product should have.
Wireframe with red text detailing edits to makeWireframe showing changes to make in red text, such as readjusting values in data tables
Acting on Feedback
After the moderated user study, I collected and condensed which feedback is actionable and beneficial and wrote out specific changes to make.
  • Adjusting the data tables to show payments.
  • Additional column with an icon to add and view notes.
  • Allowing editing to fields by clicking on them with the mouse.

Testing

For this particular case study, the users were the employees going to use the product and we did moderated, one-on-one testing sessions to monitor how they went through the product.

Some questions I asked were:
  • Can you accurately tell when jobs need to be done on the calendar?
  • Are you able to navigate throughout all screens?
  • Can you make your own items within the app?
The user research and tests focused on confirming the business needs of stakeholders and adjusting any final details before I went ahead and submitted the final versions for review.
Approval Rates
All stakeholders–the project manager, engineer, and architect–approved the designs and considered BuildSelect a viable solution to solve their problem.

Final Designs

Style Guide
Because employees may look at this for 8 hours a day, 5 days a week, if not more, I must ensure no designs are excessively flashy or verbose, but still informative, within components and the style guide.
Form Components
For forms, Material Design guidelines and templates proved accessible and sufficient. I adapted their designs to show the different states in brand colors.
Cards and Windows
Cards are made to condense and summarize various types of information across the system. By creating “Lego blocks” through components and windows, finishing out the final design was expedited and I created the pages to satisfy multiple user needs.
Data Row Design
Tables should allow for sorting, in-line editing, organization, and legibility. Columns in tables were given more space with padding which accommodates both in-line editing and legibility concerns at once. I spent the most time on data rows because it's the part most looked at by users.
Summary
Summary page contains the 1000-yard view of all active projects, tasks, and the schedule sorted by most recent events.
Summary page showing condensed information about a project.
Weather
Because the company work and schedule is dictated by the weather conditions of the project area, a dedicated page for weather was made with a calendar view and week-long forecast.
Weather Calendar for a region
Calendar
A single view to track all tasks helps the project manager see what is happening at a glance and takes information from the Gantt chart to visually show durations.
Calendar Screen for BuildSelect, showing 2 items listed.
Gantt Chart
An expansion of the calendar allows employees to define the stages where each task occurs, the start time, and the phase/task duration.
Schedule List
Consolidating all scheduled items into a list allows a quick reading of the table to alter, remove, or add future schedule items.
Project Overview
This page provides employees a summary confirming pertinent details in short form.
Warranty
This page keeps track of all contract repairs a developer is contracted to do when issues arise for new homeowners and categorizes them by date and severity.
Warranty order screen showing priorities on orders
Change Orders
This page allows users to see if there needs to be a contractual or informal change to a current phase or task without cluttering the schedule views.
Prototype
I built a functional prototype of the software in Figma as well including the interactions between dialog windows and in-line editing.

Learnings & Insights

While each stakeholder involved with decision making power did approve the design, they still could not settle on the product I designed. A timeline crunch on their side caused them to investigate the other alternatives I found in the competitive analysis they could also decide from, since they didn't have the time or budget to do outsourcing like they predicted before the start of my design project.
Key Takeaways
This is the first project in Enterprise UX I've done and the first project where I got the opinions and decisions of other people on the team directing design choices.

By following and taking inspiration from competitor designs, I knew what designs were feasible and went through rounds of testing on their ends, so they were safe to use as inspiration. Relying on display sites like Dribbble are ok for examples of pretty design, but not great for program functionality.

In the future, I hope I can design more advanced and better Enterprise UX features and software. The field of data and how data is formatted and appears to its viewers may prove to be great for job security as its always an issue no matter what industry.