Case study
Stashable's customer service and warehouse teams were plagued with issues relating to order management and logistics. How could Alfred solve these problems?
As part of the design team I was tasked to build, reiterate, and prototype the Alfred administrative dashboard. Part of this process involved sketching, producing wireframes, application map flows, testing, redesign, and high-fidelity prototyping.
The problems
Stashable's customer service and warehouse teams were plagued with issues relating to order management and logistics. There was no central location to access customer information, orders, and scheduling.
Basic information such as new orders, scheduling, and inventory were hard to find. Listed below are just a handful of the problems that Alfred aimed to fix:
• The data being shared between customer service and the warehouse team was disjointed.
• The system for receiving and inputing customer information was slow and inefficient.
• Inventory information was manually tracked on paper to be later inputted into a computer.
• Microsoft Excel was being used to track customer's orders, payment, routing, and more.
How could Alfred solve these problems?
User's needs
The primary users of Alfred will be customer service, the warehouse staff, and market managers. They want a more efficient way to do the following:
• Create and edit a customer profile
• Create, edit, schedule an order
• View order details
• Ability to view truck routes, and schedule
• Adding new operators to the system
• Terms & Conditions acceptance for new customers
Goals with Alfred
Stashable's data shows that a majority of customers have placed their orders through phone compared to its website and chat bot. Alfred should be a single administrative platform for the Stashable team, and have the ability to perform all of the necessary tasks to create efficiency within the business.
Testing
We invited the customer service and warehouse team members to test out the early iteration of Alfred. Comments and requests for new features were noted, such as the following:
• Ability to create a new order to an existing customer on file
• Ability to view orders by appointment date of service
• Ability to hover over a scheduled appointment to view order details
Constraints
• Time – Release Alfred before peak season
• Engineers were overloaded with other projects
• Engineers were overloaded with other projects
"Create a New Order" Flow on Alfred
For brevity and as an example in this case study, I will focus on showcasing how a user (such as a team member from Stashable's customer service) can create a new customer order using the Alfred dashboard.
The Customer Service Representative's user flow of creating a new order for an existing customer using Alfred.
User flow for "Create a New Order" for on Alfred.
Documentation of "Create a New Order"
Wireframes
Wireframes and documentation for Alfred's "Create a New Order."
UI Design of Alfred and "Create New Order" Modal
Create a New Order modal is a single form launched from a customer’s profile. A customer service representative can input all of the relevant information, including a customer’s inventory, supplies drop-off, notes, and schedule an appointment for pick-up or delivery without leaving a screen.
Below are the UI design to parts of Alfred, including the Create a New Order modal, feedback dialogs, and empty states.
Animated GIF of "Create a New Order" modal.
UI design of modals for creating a new customer.
UI design of a customer's profile for a customer.
Feedback dialog windows for Alfred.
Empty states on a customer's profile for addresses and payment methods.
Full Application Documentation of Alfred
Alfred Full Prototype (Marvel)
Alfred: Email Terms & Conditions
Stashable accepts orders in three different channels: website, chat, and phone. Based on data, a majority of our customers' orders comes through phone.
How does a new customer review and accepts the Terms & Conditions after placing an order over the phone?
Alfred allows a Customer Service Representative (CSR) to email the new customer with a unique link, taking the customer to Stashable’s terms and conditions. Once a new customer reviews and accepts the terms Alfred gets notified automatically.
The unique link is time sensitive. A new customer must review the conditions within a four-hour period.
Whiteboarding of Terms & Conditions flow with its active timeframe.
Terms & Conditions email flow illustrating its active timeframe, acceptance.
Email on desktop/tablet and mobile view.
Once the new customer reviews and accepts Stashable's terms and conditions Alfred is then notified of the acceptance and the customer's order's status is automatically updated to Scheduled in Alfred.
Warehouse will be able to view the scheduled order on Alfred.
Summary
Creating the Alfred dashboard application required the ebb and flow of testing, feedback, and re-iteration from both the customer service and warehouse teams.
Seeing and hearing how the end-user uses the Alfred application, especially in nuanced scenarios, helped me and my team in better understand how Alfred can be improved on, as well as which features should be included or sacrificed in later releases.
The documentation of Alfred was one of the most extensive and challenging aspects of this project. I learned how to better organize an application's complex behaviors, actions, and how it communicates with its host server.
