Noodle.ai
Inventory Flow
Role
Lead product designer
Primary Tool
Figma
Year
2022-2023
A SaaS product using AI to enable distribution managers to anticipate and address supply chain problems before they arise
AI/ML
b2b
SaaS
Product Design
Data Viz
Supply Chain
Background
The global supply chain is hugely volatile, and when products aren’t available on the shelves when consumers want them, companies loose money. Inventory Flow was built to mitigate these risks, however, the app was suffering from a bloated, unintuitive interface, and we discovered that our customers were not using the existing UI.
My Role
I was brought in to fix a UI that had become overly complex and unintuitive. I was the lead product designer on the product, and while I worked closely with our product and engineering teams, I drove the redesign.
I was brought in to fix a UI that had become overly complex and didn’t fit our users needs.
Solution
Screens
A new interface redesigned from root to branch consolidates screens, gives more clear way finding cues, and illustrates the interconnectedness between transit hubs.
In the redesign, all interactions and information occur within the same “space”.This allows the user to remain oriented while drilling up and down through different hierarchies of information.
This screen shows “small multiples” of bar charts, showing how great supply shortages are at all hubs over a 13 weeks horizon.
I designed the hub starburst to be a clickable element, which opens the detail panel on the right. Now, all the details that were previously shown at a top level are shown in a drill down.
The new design includes a "compare plans" view that allows the user to see side-by-side views of different distribution plans and assess which plan is best for the given situation.
I utilized panels and tiered drill-downs within a single-page app to resolve an issue users were having of getting lost within the information architecture
Each arrow represents an "edge", or space between two hubs. I designed these to use width to indicate volume being transferred, and each edge is a clickable element which opens a panel showing all shipments made in the user specified time window.
Research
Lots of research led up to the screens you see above. What needed to be changed? How processes were our users taking within the application? I employed a handful of research types.
Heuristic evaluation of existing application
For starters, I did a heuristic evaluation of the app. What issues did I see that would impact the apps usability or cause our users unnecessary cognitive load?
Stakeholder interviews
In order find the roots of this problem I had to better understand what the issues were. I met with Stakeholders within Noodle — from the product team to better understand the strategic direction of the app, as well as Enterprise Services who were closer to our customers and had an excellent understanding of their needs. Additionally, I met with and researched our potential users, Distribution Planners at Enterprise companies in charge of local, regional, and global supply networks. I compiled the results of my research and narrowed it to the following list. While many other issues came to light in my research, these were the recurring items, and a small enough list that I could get the team behind it:
Enterprise Services
It’s not efficient for our users to have to approve of all of these stock transfer changes individually. It’s just too many clicks!
Product Leadership
Prepare for a new, more sophisticated data science approach which will optimize actions across the network, not just to individual stock transfers. “This will be a wall of complexity.”
Engineering
Our code base is different for different customers. It all needs to be unified.
User research
I needed to find out more about how planners were currently using our application, and I knew user research would be key. The question was what type of research would be most beneficial to this project. I landed on remote moderated testing, in which I selected a handful of existing users and had them walk me through how they would go about accomplishing some key tasks in the application.
—Distribution Planner
Task & workflow analysis
I charted each step of our users process for some key tasks including “Accepting an AI-generated recommendation” and “Create task list for manual distribution changes”. The Task Analysis shows a wholistic view of a single users steps between the Noodle application and other applications, while the Workflow Analysis shows a process with steps shared between a team of different roles and archetypes.
The Task Analysis shows a wholistic view of a single users steps between the Noodle application and other applications
The Task Analysis shows a wholistic view of a single users steps between the Noodle application and other applications
I compiled the results of my research and narrowed it to the following list. While many other issues came to light in my research, these were the recurring items, and a small enough list that I could get the team behind it:
Here are 5 conclusions of my research
Can't zoom out to see interdependence of nodes
Can’t compare various distribution plans or do scenario analysis
No consistent underlying navigation
Too many clicks
Accepting and rejecting individual stock transfers is far too slow
Results
While this was a recent update, the initial reaction from our users has been quite positive. This is still very much in process and additional user testing will allow Noodle.ai to further improve on the application.
