ORDER MANAGEMENT SYSTEM
User Experience/Interface Design
10 MIN READ
The Low Down
I worked as a User Experience/Interface Designer with a team to create an order management system for a video conversion store. We set out to make a system that allows staff members to manage their customers' information and orders efficiently on a day-to-day basis.
PLATFORM
DESKTOP - IOS
TYPE
ACADEMIC WORK
METHODS
USER TESTING
WIREFRAMING
PROTOTYPING
TOOLS
FIGMA
Filmex Order Management desktop app
Add new customer flow
The Challenge
Our team was challenged to design a desktop user interface using a lean UX approach to deliver a high fidelity prototype of the first MVP release of a desktop app that manages the clients of a video conversion store. Our prototype needed to include the following functions:
1. Add and delete customer accounts
2. Add an order for an existing customer
​
3. Show an overview of the orders for a customer (with a way to mark orders as open or closed)
Our team decided to design this desktop app for the Mac OS, and then we set about completing the challenge!
The Process
Taking guidance from the lean UX guidelines laid out in "Lean UX: Designing Great Products With Agile Teams," our team came together to form our:
PROBLEM STATEMENT
Cloud-based Media Conversion Services (CbMCS) manages clients' media conversion orders through a highly manual process. The manual process involves various time-consuming tasks: tracking, storing, and updating of paper records. In addition, this requires extensive data entry into a large excel sheet, which requires constant editing, and updating.
BUSINESS AND USER ASSUMPTIONS
The business and user assumptions can be. found in detail here!
CREATED A PROTO PERSONA
The proto-persona that we developed is named Danielle - meet her below!
AND FEATURE HYPOTHESIS STATEMENTS
1. We will achieve the ability to manage customer and order information if Danielle can create and add orders and customers using a form feature.
2. We will achieve the ability to manage customer and order information if Danielle can delete customers and close orders using a radio or toggle button feature.
3. We will achieve the ability to manage customer and order information if Danielle can have an overview of all orders including all open or completed orders and customers' transaction history with a table view feature.
IDEATION, USER TESTING & ITERATION
With the knowledge of who we were designing for and what their goals are, we set out to make sketches that included all the features we listed. We then set out and rapidly tested our designs and got user feedback through A/B testing and general look and feel questions. A lot had to change! We made the necessary changes and created a mid-fidelity prototype using Figma and user tested again. We found that some layout issues arose and needed to be changed around. We also called a video conversion store to talk to a staff member there regarding how they manage their orders and what turn around time to better know our user.
Some major changes that happened were on the home page. This page originated with two search bars, one for Order related searches and one for Customer related searches which then evolved into one search bar as we felt that two search bars may get confusing for our user. We settled on the one search bar for a few days but then came together to regroup and remind ourselves,
"what is our user's goal and what is the simplest way to get them there?".
So we changed the home page to allow for instant access all the orders, allowing the user to take action right away. To allow the user to perform the search actions that were originally on the home page, we added them to a sidebar menu that is available to the user on every page.
1st iteration of home page
Preliminary sketches of interface
2nd iteration of home page
3rd iteration of home page
Final home page!
The Impact
At the end of our 2-week design sprint, we had created a desktop app for Mac OS that allows a staff member of a video conversion store to manage customer's orders and customer information by:
1. Adding and deleting a new customer account
2. Adding an order for an existing customer
​
3. Showing an overview of the orders for a customer (with a way to mark orders as open or closed)
Take a look at the flow of adding a new order below!
Key Takeaways
TALK TO YOUR USERS, LIKE REALLY TALK TO THEM: Although those around you can be your users in a sense, talking to the users that will use your product daily gives you the best information. Don't be lazy about it!
ITERATION CAN BEAR FRUIT TO SOMETHING WONDERFUL: Because our team continuously tested at every stage of the ideation and prototyping phases, we were able to catch design decisions that were not ideal for our user base. As a designer, you bring your own bias of what you feel the design should look like, but user testing and changes based on the feedback amend that design into what it should be for the users.
WHEN WORKING WITH A TEAM, LET PEOPLE FLEX THEIR BEST SKILLS! : Working with this team, we all found out what our individual strengths were and how to bring them together to make a great product. We also left room for those that felt they had a weakness in one area to work with the person that had a strength in that area and it turned out really great!