Jordan Kooge - Qminder (UX UI Design Project) by Academy Xi

UX UI Transform (UXTO-PT-05)

By Jordan Kooge

What is Qminder? Qminder is a virtual queue management system, where visitors to a business can register their arrival for meetings, appointments or interviews on an iPad. This service is used all over the world by companies such as Ola & Lyft, down to local businesses including medical waiting rooms, tyre shops & repair shops. The Qminder core values include “Dare to Care”, “Face the Challenge” and “Keep it Simple”. This showcases that the user is always front of mind, and nothing is out of reach. In this assignment, I decided to take a look at my own place of work where we use Qminder everyday to see where improvements could be made. 2

1 DISCOVER Understanding the problem space

1.1 PROJECT SCOPING I developed this Scoping Framework to help outline the particular issues for the overall project. This was an easy view for the process from all sides of the Discovery phase, to ensure all major positives & negatives could be seen.

1.2 PROBLEM STATEMENT This problem statement was created to assess the hypothesised problem space from the point of view of the user, when attempting to use Qminder.

"A customer who feels uncertain about signing into Qminder when arriving, needs to feel empowered and knowledgeable enough to do so, but faces long & complicated processes during the sign-in process, with too many open ended questions posed to the customer/user."

1.3 USER RESEARCH The research on this project was key, as the Qminder platform already showed promising signs with users, however I wanted to refine the process even further. The types of research I conducted were more defined than normal, but it was paramount to the success of the project. COMPETITOR ANALYSIS With many queue management options available, the market is flooded with possibilities. Competitor Analysis allows us to understand the many variables within the market, and utilise the valuable insights into each platform helping us reach a simplified spectrum of what works and what doesn’t. 1-ON-1 INTERVIEWS Interviewing users of the platform is an excellent way to truly see how users interact with Qminder. With 1-on-1 Interviews we can isolate, and in turn ideate, the true frustrations of the user in a more direct fashion, allowing for enough open ended questions to understand the user on an emotive level.

1.4 COMPETITOR ANALYSIS As Qminder is not the first of its kind, there are hundreds of other virtual queue management systems in the world, so analysing the best out there and what they do was a great way to refine an already great platform.

1.5 1-ON-1 INTERVIEWS The interview process was completed with seven interviews in total (four employees of the business, three customers; all users) and all seven had very similar feedback:

“I like the layout of Qminder. It shows info in rather large detail, and is relatively easy to use with the simplistic overview of how to sign in.”

“I like how the colour is consistent, and if you asked me in a week what the colour was, I’d be able to say Green straight away.”

“It would make more sense to have a QR code service to ease sign in away from the iPad required to check in.”

2 DEFINE Synthesising the research to generate insights to uncover what problem we are attempting to solve

2.1 AFFINITY MAP With all the research conducted, creating an Affinity Map allowed me to create a visual layout of the feedback received, and helped me sort the data into a designated area of priority for the project.

2.2 EMPATHY MAP The flipside of understanding user data, is to find the emotive response to how the user feels whilst using the platform. With an Empathy Map we can create a similar map of feedback, directly showcasing the understanding of the users thoughts, feelings & emotions.

2.3 RESEARCH INSIGHTS With the feedback I had received so far, there was a consistent and clear way forward with how the users of the platform wanted to see Qminder improve. These insights were key drivers in the next steps to take.

Ease of use and QR Codes are the way forward. Living in a COVID-19 was not going away anytime soon, so a familiar and user friendly approach was vital.

Green is good - and creates a clear and positive mindset.

Too many call-to-action and pages to the platform, made the registration process feel endless & annoying.

2.4 USER PERSONAS Creating the user personas from my research allowed me to put a user to a profile, and get to know their story. From the personas created, I chose Chris as my primary persona of focus, as his background of technology, eager nature and desires aligned with the problem statement. CHRIS HOLMES

GOALS -

BIO Age: 28 Occupation: Content Creator Location: Melbourne, VIC Chris is a YouTube streamer, and Part-Time Mobile Technician. He enjoys playing games, drinking coffee and using his smartphone to connect with streamers all over the world. Chris moved from Sydney a few years ago and now resides in Melbourne with his girlfriend who also is a streamer. Chris uses technology fairly frequently in his personal life, so is familiar with most UI platform.

MOTIVATORS To inspire others by being engaging and authentic with his content creations. To hit 15,000 subscribers on his YouTube page. (@Holmes) To travel (when possible) back to Japan with his girlfriend and explore more of Asia. To continue to grow the channel, his following and bring new players to the platform.

Informative Ease of Use Simplicity Social

BEHAVIOURS -

Chris showed eager interest in the idea of changing the UI of the platform. He finds there are multiple businesses with similar sign-in features, but none that create engagement or make users advocates for Qminder. Chris is a constant user of social media; Twitter & Instagram, and he will share content to all platforms regularly.

PAIN POINTS -

Overwhelming amount of information required to see a technician. UI seems “clunky, jumpy & not very quick”. Very little to interact with in Qminder. Text/typing only. Would be easier with bigger, more obvious calls-to-action. No QR Code for simple sign-in?

PERSONALITY Indecisive Introverted Analytical Passive

Calculated Extroverted Emotional Driver

2.5 CUSTOMER JOURNEY This customer journey map was created as a staplepoint of how the interaction with Qminder would work in the store where Chris works. It is an Apple Authorised Repair Centre called XYZ, and have customers book in to have their devices serviced. SCENARIO: Chris enters the store, and is here to see a technician. He already has an appointment, and has arrived at the time requested.

Arrive & Locate iPad to Register

Choose Language

Enter Name/Visitor ID

GOALS & EXPECTATIONS: To create a fulfilling user experience. To engage the customer with the platform. To have a user of the platform turn into a promoter of Qminder.

Appointment? Yes/No

YES - “What time is your appointment?”

NO - “Please take a GAINS: Easy to locate device, with clear & intuitive call-to-actions on the iPad. PAINS: Only one place to register - an iPad that is used by everyone. Not COVID friendly, with potentially large quantities of people congregating in one small space at the front of the store, creating traffic & congestion.

GAINS: Friendly & accepting. PAINS: Can be limiting to selected languages, e.g. no option for the hard of hearing/hearing impaired customer. Can also be limiting to customers who require extra assistance - no “Start Over” feature to start over if the sign-in can’t be completed.

GAINS: Simple, straight forward, easy (after the appropriate language has been selected). PAINS: No option for “I don’t know my Visitor ID” or “Start Over”.

GAINS: Can end the process here if they do not have an appointment. Closed questions create solid answers. PAINS: No option to create an appointment for the customer via Apple Support through their device if they select “No”. Could be done via SMS link to mobile.

seat, and we will be with you shortly.”

GAINS: Makes the interaction specific to the customer. PAINS: Could make the user frustrated with more questions, when they just want to see someone and be over with it.

Successful Check-In (Complete) GAINS: Check in is successful, no more questions. Customer can relax. PAINS: No“Thank You! You are now signed in.” notification. Confirmation is obviously not complete.

3 DEVELOP Exploring effective solutions using an iterative approach

3.1 “HOW MIGHT WE…” The first step in developing a solution for our project, is the “How Might We…” statement. This helped me create a vision for the start of our solution, and these are some of the statements to best approach the process:

How might we make the check in process easier? How might we utilise QR codes within the platform? How might we bring more simplicity to this platform?

3.2 IDEATION Ideation is a core foundation in the design process, and during the develop stage is a key factor in the success of the project. In this stage, you’ll see below my three areas of ideation were Crazy 8’s, Minimal Viable Product (MVP), and Storyboard. High Value & EASY : QR Codes High Value & HARD : Linking QR Codes with local state COVID-19 check-in systems for ease of use. Low Value & EASY : Visual simpliﬁcation of some features e.g. time of appointments, name, etc. Low Value & HARD : Introducing "Learn about our business while you wait" features. Could become complicated, and businesses will have to deal with it themselves for the feature.

3.3 USER FLOWS The user flow below was created in mind specifically for XYZ, in how a user might use Qminder when arriving at the store. With ideation in full swing, this user flow shows what would happen when using Qminder at XYZ.

3.4 WIREFRAMES Wireframes are the best representation of “what could be” when it comes to UX Design. At this stage, I had ideated on the design & colour palette 3 times, and the Low/High fidelity wireframes below show an easy journey for the user.

4 DELIVER Building & testing our solution

4.1 HIGH FIDELITY WIREFRAMES After ideating numerous times, we found that this was the best step forward in creating a user friendly and memorable experience within Qminder. Users felt this was the best of the designs that best represented our vision.

4.2 USABILITY TESTING Luckily enough, the users during the usability testing of the deliver phase had excellent feedback. Little-to-no change was required, only minor design changes to create more excitement & attachment to the service.

There is a clear difference between the old version and this new version. Having everything on one page, instead of one call-to-action for each is great.

It’s clean and very user friendly. I can tell when there is a clear next step to take, and can exit out at any stage and start again with ease.

4.3 PROTOTYPE TESTING The Prototype Testing found minor issues, as some transitions were not as clean or crisp as expected, and these were resolved easily enough.

PETER: Tested on iPad The Exit button wasn’t working correctly. No other concerns.

JESS: Tested on iPhone XS Each icon could use ghosting/change in colour when hovering. No other concerns.

4.4 PROTOTYPE

4.5 CONCLUSION As I finish this project, here are some key takeaways:

Summary This project easily addressed the problem statement, as the key focus for this project was simplicity, and improving a platform that already had value. With my concept, creating QR codes, keeping interactive screens to one or two pages for simplicity, and enhancing the colour design to be more fluid, the current prototype has proven the concept I have created to be a positive & enriching update to an already excellent existing platform. Qminder is a service that keeps both businesses & customers front of mind, and these improvements will ensure a seamless experience on both sides of the counter.

Thank You Jordan Kooge @thejordankooge