Intuitive Online Inventory Management – Beyond Pixels | User Experience Design by Lucia Ziyuan

Inventory management is a process known to be tedious and tiring. The client’s customer support team spend hundreds of man hours on manually setting up new customers through the same storage process over and over again. How can technology empower customers to easily manage inventory on their own?

Spacebox is a leading player in logistics known for their innovative approach to storage solution. Their key product is self-service storage that brings more clutter-free space to urban dwellers and corporations alike.

However, with their fast-growing user base, the manual approach to customer service doesn’t scale. The client is in deep need of a digital product that can automate most of the check-in and check-out processes in the warehouse so that customer service team can focus on lead generation.

Working closely with product team in an agile environment, we quickly generated product requirement and started on the iterative design to development process. Read the story below to find out how we approached a complex problem with clarity.

CLIENT: Spacebox Ltd

MY ROLE:

User Experience Design, User Flow Wireframing, Prototyping, Interaction Design, User Interface Design, Web App Design, Native Mobile App Design

TIMELINE: 4 Weeks

The Challenge

Make web more intuitive than human touch

The biggest challenge for Spacebox’s growth is the inefficient manual process of scheduling, delivering and checking in boxes for new customers.

Before redesign, the web-based workflow is neither intuitive nor simple. This leads customers to call customer support team and request the steps to be done manually by the CS team.

To increase the productivity of the CS team whose primary KPI is to acquire new users instead of managing inventories on customers’ behalf, I worked with the team to identify key touchpoints in the customer journey that can be made more simple and intuitive so that new users won’t need to ring up CS team for help.

Edge Cases

Spacebox serves both enterprise clients for large-scale warehouse needs, as well as individual clients with small household inventories. With edge cases of hundreds of items to be scheduled, checked in and managed online, my role as a UX Designer is to find a solution that can work for all types of users.

The Approach

Mobile First Design

Our research reveals most of Spacebox’s users are managing their inventory workflow on mobile devices, I took a mobile-first approach.

I start out prototyping in mobile and explore potential interaction patterns in the mobile format. I presented 3 solutions, and after discussing with dev team on business and technical constraints, we combined 3 approached into a system that would work best.

Fast Iteration for Agile Development

Working closely with product manager and the dev in an Agile manner, I work intensively on one feature design at a time. To quickly brainstorm on design solutions, I prototype in low fidelity wireframes or even paper sketches first before taking the design high resolution.

Agile Team Communication

While Agile presents challenges for the human-centric design processes that involve length research and planning, being Agile is about mental flexibility and adaptability.

To keep design agile and user-centric, I use task analysis to optimize for the most efficient user flow of each feature, and ideate on two or three variations for each proposed solution.

Working in an Agile manner, I share designs early and often for PO’s feedback so that I don’t waste too much time to polish designs before we agree on the specifications.

Iterative Design Process

My process follows user flow mapping > low-fidelity prototyping > design > fast iteration throughout the entire Sprint.

Oftentimes, I will be sharing a few proofs of concept with PM and lead devs, discuss the feasibilities in implementation and then proceed with a direction we all agreed upon.

Web dashboard PoC version A

Web dashboard PoC version B

Mobile dashboard PoC version A

Mobile dashboard PoC version B

The Solution

I delivered all key screen designs and states for the entire user flow for both web and mobile platforms.

Web Dashboard Design

The main goal of the dashboard design is to give user clear paths towards action, and help them prioritize to-do list to make it easy to accomplish one thing at a time.

Using data to add urgency to actions, I designed a desktop dashboard featuring key stats as call to action, as well as giving users a quick birds eye view of their inventory status.

Mobile Dashboard Design

Designing for the mobile web, I took into consideration of mobile gestures as well as UI constraints of the mobile web that makes conventional mobile UI patterns unavailable to this design. The result is mobile dashboard that clearly prioritizes user tasks.

Mobile Check In Flow

Select items to check in

Edit items to check in

Items edited ready for check in

Web Check In Flow

View Items

Designing with the system conceptual model in mind as well as matching the user mental model, I worked towards a clear, simple navigational structure to easily navigate a complex backend inventory of items.

View all items on desktop

View all items on mobile

Learnings

In the software environment, Agile development and UX design can work against each other. Through working with the dev team on fast, interactive design dashes, I learned a few things to make Agile work for UX:

Start with low fidelity, and work out the kinks of user flows first
Present the team with multiple iterations, and explore more than one solutions around the problem space. Involve PM and dev team in design problem solving.
Communicate as often as you can during the design sprint. Early communication is key to avoid hold-ups in implementation once design is handed off. Avoid surprising dev team with a brand new solution.
Use as many tools as you can to present and communicate design ideas. I used live whiteboarding to demonstrate how the solution works.

Product design is an iterative and collaborative process. Communication and collaboration are equally important as pixel perfect design when it comes to software design. Your PM and devs are your best friend. The key to successful design in Agile is being a resourceful and willing team player.

Next Case Study

The music sharing space is broken. Next up you will be introduced to how research and ideation techniques can create an elegant design solution to make music sharing relevant and personal again.

Behance

Instagram

Facebook

Twitter

Pinterest