Check-in

Ensuring compliance and efficiency in dispensaries' customer base

Overview

Flowhub's customers needed a faster, easier, and more accurate way to check new and existing customers in to their dispensary, while remaining in compliance with varying and ever-changing regulations.

Role + Duration

Creative Director + Lead UI/UX Designer

Summer - Fall 2016

So here's the problem

To maintain transparent compliance, Flowhub’s POS requires customer ID information to be entered before they can shop. This helps track customer purchase histories, stores medical patient records, allows dispensaries to offer a seamless Loyalty Program to return customers, and, most importantly, keeps the business in compliance with local regulations.

Entering ID information on a keyboard is a tedious, time-consuming task with so many people coming through your door, and adding new medical patients to your store can take several precious minutes per patient. User error is common, and it’s up to the employee to prove the authenticity of an ID.

How do they do this now?

We met with several of the retailers we had good relationships with to walk us through their process of checking customers into their store. Generally, they would enter the customer's name and look up whether they were already an existing customer. If not, they would add them, ask the customer if they'd like to join the loyalty program, or if they'd like to register as a medical patient, which requires more paperwork.

The paperwork above is just a few steps and inputs needed to add a medicinal patient. The user also has to scan and upload all of the customer's paperwork and ID cards, another tedious process that can take several minutes to complete.

And this is just to allow the customer in the door. There had to be a better way.

How can we solve this?

Flowhub has a cannabis grow management application that uses what’s called a NUG: an iPhone 5 inside of a Honeywell barcode scanner (referred to as the ‘sled’).  

If we can get the NUG to accurately read the data within an ID’s barcode, as it does for individual plant tags in a grow facility, we can build an iOS application to read that data and send customers to the Queue within the POS web app.

On top of that, we can use the iPhone’s camera to record medical documents and add new medical patients to a store in seconds instead of minutes.

Make the journey simpler than the process

There’s not much complexity to checking an ID to verify age, so we needed to create just as simple of a user flow for the app. We took our research and references, and created a flow that gives users what they need right away so they can get where they’re going with barely any thought.

There are a few different types of customers that could come into a store, each requiring slightly different types of information.

Recreational customers only require a valid ID (from any state, though regulations vary between states) or a passport, in which case we'd rely on a manual ID entry, though that's not common.

For medical customers, the user can scan the customer's MMJ card, and the system will recognize if this is a new or existing patient. If they already exist in the system, the user can simply add them to the queue. If they're a new patient, the user just has to snap a few pictures of the patient's paperwork, add in a few details, and add them to the system, all with the NUG.

Talk it out, sketch it up

We explored several different visual options for what we needed to accomplish. The key was to keep the interface incredibly simple and clear to annihilate as much user error as possible, directing users to simply scan a customer's ID.

Nothing unnecessary. No additional distractions.

The best UI is no UI

Or, at least, as little as possible. Dispensary employees already have enough distractions, and we weren’t going to add to it. The user scans the barcode on a customer’s ID or medical marijuana registry card (with a manual entry fallback in case the barcode doesn’t scan, the scanner can’t process the data, or the customer only has a passport), and is prompted with simple options on how to proceed with this customer.

From a barcode scan or manual entry match, the app will recognize whether or not this is an existing customer. No recreational customer data is stored unless the customer opts-in to the dispensary’s Loyalty Program. Existing Loyalty and Medical customers are immediately recognized, with options 
to edit their information (update MMJ card, change phone number, etc.) before sending them to 
the Queue.

Going a little deeper

Sometimes the user needs to add a little bit more data, or capture documents using the NUG's camera.

The queue

When customers get checked-in, they're put into a queue for the cashiers (AKA budtenders) in the showroom to select from in order to start shopping.

Additional information

For a more personal shopping experience, customers can sign up for a business's loyalty program, giving them access to deals, and giving the company more data around their customers.

Capturing documents

Medicinal customers and members need to register their MMJ information with the dispensary before shopping, which includes capturing and storing various documents.

So how's it working?

Remarkably well. Nearly all of Flowhub’s customers pay to use the NUGs for checking customers into their store, though they’re able to opt-out. Employees can go through long lines of awaiting customers in seconds, and add new medical patients in a fraction of the time it used to take. The connection between web (POS) and mobile (Check-in) apps is seamless, and we’ve gotten great feedback on how this has sped up Flowhub's customers’ workflows.

See the Check-in NUG in action in the video below (skip to ~6:00)...

What I've learned

This was one of the first apps we worked on and shipped in the legal cannabis retail space, so there were plenty of opportunities to learn.

Regulations

The legal cannabis industry, especially in these early days, is notorious for heavy and ever-changing regulations. This is something we had to keep in mind while building all of our applications in the space. For instance, while anyone over 21 is able to purchase cannabis legally, non-native customers can only buy a limited quantity: in Colorado, CO residents can purchase up to 28.5 grams of product, while customers from any other state can only purchase 7 grams, at least at the time of development. So passing the issuing state of a customer's ID was extremely important in this app.

Accessibility

The blue and yellow colors used for the check-in buttons were intentionally chosen as they pertain to the plant tags in a grow facility in Colorado: blue is for recreational plants, yellow is for medicinal. So to check-in a recreational customer, the button is blue, and yellow for medicinal. However, these colors do not offer an adequate contrast ratio with white text, a design component I would certainly re-visit if I had the opportunity.

Design process

Being a scrappy startup at the time, we had to move fast and didn't always have enough time to conduct extensive testing with users. This came back to bite us only a little bit, fortunately. One instance was in the 'cancel' and 'more' text you can see in the final design. Previously, there was only an 'X' icon in the upper-left corner, to cancel the check-in process. After we released the first version of the app, we got feedback around users not being able to figure out how to cancel out of a check-in process. As the designer, I figured the 'X' icon was obvious enough, but it wasn't. This taught me a very important lesson: test everything, all the time, and never assume what I think is obvious would be obvious to everyone else.

Colors & icons & forms, oh my!

Toolbox

Sketch

Screen designs

Illustrator

Iconography

InVision

Prototypes

Zeplin

Handoff

Meet the team

Wade Sellers

iOS Developer

Alex Möller

iOS Developer

Mark Goetz

Product Manager

Jonathan Eitel

UI/UX Design

Flowhub Dev Team

Web Development