
GetMyLab.Online
UX/UI redesign of a point-of-sale system for photo labs
Old POS interface (left) vs. New Redesign (right).
Client:
GetMyLab
Overview
GetMyLab is a B2B comprehensive order management system for analog film labs. Its creator Caleb Savage is a photographer and web developer who recognized an opportunity in this underserved space while working as a film lab technician. Photo labs that use GetMyLab now, were previously using a paper system or MS-DOS to process and manage customer orders. Caleb’s product added much needed efficiency and accountability to the process. After several years of operations, and the added goal of scaling this product to the larger marketplace, Caleb realized GetMyLab needed a bit of a facelift and an improved user-experience. This is where this UX project started.
Scope: 2.5 weeks, redesign of the POS system
My Role: UX Designer & Lead Researcher
Team: Andy Zheng and Matt Craig
Tools: Sketch, InVision
Our Challenge
How might we organize the POS system in a way that is intuitive from the start and gives its users the ability to place detailed orders with minimal errors?
Old GetMyLab POS Interface
Everything is on one screen with four sections.
New Redesign of POS system
Research Process
Purpose & Goals
Understand the key partners & stakeholders, the many value propositions, and the customer segments. And, of course, we wanted to understand how the current process works, which would help us see things from the user’s perspective.
Our research goals are as follows:
Business Space
Business Model Canvas
Insights:
GetMyLab’s software optimizes functions that go beyond completing orders such as analytics, delivery, and communication.
Levels of interaction with the system such as admin and staff as well as volunteers.
Resources that are necessary to work with the system such as using an iPad as the platform and Square for payment.
Competitive Feature Analysis
Purpose: The purpose of creating a competitive feature analysis was to identify the features of similar business models in the photo lab developing industry and observe where the business stands out and what the business has in common with, compared to the other industry models.
Methodology: Extensive research was conducted into the different photo lab developing industries to gather features into a spreadsheet. By recording these features along with features from GetMyLab.Online’s business model, comparisons were able to be made.
User Interviews
Purpose: To obtain an understanding of how photography lab employees currently use GetMyLab.Online to ring up customer orders as well as understand some of the highlights and pain points within the current process.
Methodology: Two big clients of GetMyLab are Griffin Editions and Bushwick Community Darkroom so we made multiple site visits to observe how the system was used and we conducted 7 interviews with lab employees and volunteers. Employees consisted of executive directors, operations managers and volunteers who have experience with using the POS interface in GetMyLab.Online to ring up customer orders.
Click here to view full User Interview Discussion Guide with notes.
“I think each item doesn’t need a picture. I don’t like how you have to scroll down on the left side to see all of the items.”
“The current system is clunky. Hard to find certain features, such as the fees and discounts. Not the most intuitive. Doesn't look very organized.”
“I can only discount an entire order, not just one item.”
Affinity Map
Purpose: To identify patterns within the results of interviews and identify insights.
Methodology: Each observation from the interviews was written on a sticky note. Sticky notes are then rearranged according to common themes and patterns. Each category was then labeled based on the shared theme.
Insights from Affinity Map
Reduce or eliminate the number of offline process steps.
Visual design needs to be clear, easy to read and navigate, and appropriate for customer-facing moments.
Notes section need to be in location relevant for the step.
Discounts and rushes need to be applied to product, not just entire order.
Persona
Tyler represents the typical user based on the insights gathered from the interviews in order to help us view the process from the user’s perspective. Meet Tyler!
Journey Maps
Existing vs. Proposed
We wanted to bring the photo lab checkout process to life using our persona Tyler, so we created two Journey Maps which visualize the high points and pain points he experiences during the checkout process. One is with the existing POS system and the second is with our proposed system.
Existing Journey Map
New customer inputs their info into small forms fields and can see irrelevant product buttons.
Little control to indicate a specific roll is a “rush” and notes field not in obvious place.
Frustrating when Twin Check numbers get out of sync.
Proposed Journey Map
Some pain points still exist with this MVP, such as iPad system being given to customer.
Now able to add services, discounts, and notes to specific product lines
Important Twin Check numbers obvious and editable in multiple locations.
Synthesis
Ideation
In order to improve GetMyLab as soon as possible we needed to identify the best features and then prioritize them for an MVP. Therefore, we created a MoSCoW Map and a Feature Priority Map.
MoSCoW Map
Purpose: Identify the most essential features that can be implemented quickly to help the photo lab staff become more efficient right away.
Methodology: Using insights gathered from our affinity map, features were organized into 4 categories of what must be implemented, should, could, and won’t be implemented in the redesign.
Insights:
Using a MoSCoW map, insights were gathered into what what the most necessary to include in the redesign and what was not, such as:
Twin check information, rush/gift card button, including a user name, and new customer input were some of the features committed to include in the design.
Having a discount for students, highlighted twinchecks, and multiple contacts per customer were features would be great to have but not as important as others and necessary to making the system work.
Features such as status stamps on invoices, wizard for completing order and a key for dashboard lights, were features that would help but were not necessary for the redesign and most likely wouldn't be considered when sketching out features.
Features that were thought of but were not considered strongly and mainly brought out from brainstorming were Images for clients and recommended icons.
Feature Prioritization Matrix
Purpose: Further organize proposed features in a hierarchy of what is absolutely necessary to include in the redesign and what effort is included in creating said feature. This assists with narrowing down the final implemented features in the final design.
Methodology: Creating this feature prioritization matrix included creating our axis which were labeled necessary-nice to have as well as low effort-high effort. Using these axises, features were narrowed down what was likely to be included in our redesign. From the matrix we determined what was inside the Necessary - Low effort quadrant was essential to include and what was inside the Nice to have - High effort was eliminated from the design.
Insights from Feature Priority Matrix
Using a Feature Prioritization Matrix, in depth insights were gathered into what the process of adding features into the redesign would entail such as:
Including twin check info, submit order button, individual discount buttons were features that were considered necessary to have and would also be considered low effort when including in redesign.
Including a customer confirmation order prompt and confirmation screen/window were also necessary to include but would be more difficult when building the redesign.
Including customer-facing iPad and recommended icons were features that were not necessary to include and difficult to build, so those would not be included in the final design.
Design Process
Design Studio
Several rounds of paper sketching allowed us to quickly visualize potential feature layouts, which we then narrowed down and converted to low-fidelity whiteboard sketches.
Low-Fidelity Sketch Wireframes
Opening: Customer search screen
New Customer input screen
Order page
Review page
Mid-Fidelity Prototype
The five low-fi screens were converted to a mid-fi prototype for usability testing. These are three samples. Click to navigate this mid-fi prototype.
Usability Testing - Round 1
Purpose: Determine whether the POS interface in GetMyLab.Online is intuitive to navigate when processing a customer order.
Methodology: 5 participants consisting of lab volunteers at Griffin Editions and Bushwick Community Darkroom and non-volunteers were gathered. Each participant was given four scenarios and tasks. Directness of paths taken, user easiness, time taken on task and success rate were documented during the usability test.
Insights of Usability Testing - Round 1
Scrolling through the pages was an issue for users.
Cabinet layout of product list was good, but users would like to see most used categories expanded.
The customer search screen was nice, but sometimes users want to check price of products without having to sign-in a customer.
Final Redesign
The mid-fi usability test gave us insights to make improvements for our final hi-fidelity prototype.
The final redesign was improved upon using user-insights from the mid-fi prototype:
User can view prices before signing in a customer
A clean sign-in screen hides behind-the-scene info from the customer
Most used product cabinets start open (can be closed to save space)
Overlays used for product add-ons to save screen real estate
Line items condensed to only show necessary information
“Place Order” button moved to bottom-right position so it’s the last action of the user.
Final Redesign Demo