Clear Spider

Client

Clear Spider

Project

Design case competition for an inventory management system

Role

UX/UI Designer
(1st place winning team)







Overview

Clear Spider is the market leader in cloud-based inventory management solutions for businesses. The case was to design a new inventory management system with an emphasis on usability, visual aesthetic, and overall user experience. We were not shown the current system to prevent it from influencing our design decisions. In a team of 5 designers and marketers, we designed and prototyped a solution within 30 hours that impressed the CEO and sales manager.


View the InVision prototype here.

mockup-dashboard

Design Process - Order Management

My main contribution to the design was creating the Order Management feature. We considered the user's main goals with this feature, which are to 1) search and filter through their orders and 2) create new orders.

The management system features an easy-to-use filter, with options in each column that will narrow down the order list with each filter that is applied, so that users can quickly find the order they are looking for. The user can also enter an item in the search bar, and the list will show all orders containing that item.

The ordering system follows a linear, straightforward process, so that the user can easily create their order without getting confused or frustrated. I drew out the task flow that a user would typically go through while creating an order, and designed the necessary screens.


Wireframes


Overview
Overview
View Order
View order
Create New Order
Create new order
Fill Order - Empty
Fill order - Empty
Fill Order - Full
Fill order - Full
Review Order
Review order
Confirmation
Confirmation

Mockups

We decided to add a "Pending" screen, where the user can view orders that have just been made and haven't started processing yet, with an option to decline or acknowledge these orders. This allows users to stay organized with acknowledged orders separated from new ones.


Overview
Overview
Pending
Pending

View Order
View order
Create New Order
Create new order



Fill Order - Empty
Fill order - Empty
Add to Order
Add to order
Fill Order - Full
Fill order - Full
Review
Review
Confirmation
Confirmation

Final Thoughts

Given the limited time allowance of the case competition, the design is not complete, although it includes the main features that Clear Spider requested in their order management system. On the "Fill Order" screen, I would include an option to remove items from the order, as well as keep the "Add products to your order" option on the screen, in case the user forgot to add something to their order. Also, the title "Stock Control" could be misleading, since stock refers more to inventory items than to orders, which often contain multiple items. I would simply rename the page to "Order Management".

The UI was kept simple and plain, avoiding user distractions and unnecessary design elements. Typically, enterprise software prioritizes functionality over aesthetic, but we made sure to still keep a modern-looking interface to represent the quality and reliability of the system. Since many users would be using this system in a warehouse or factory setting, we ensured that our design was responsive and could be presented on a tablet.

Widgets screen on tablet Overall, this was a great challenge presented by Clear Spider that really pushed myself as a designer to think critically from a user's perspective and design a system for a user that was unfamiliar to me.