Availability Checker

Research & Definition Phase

Userforge Lucid Chart Hotjar

Our company had a very old availability checker that was outdated and not very effective. As the need for more real-time pricing increased, our team decided to go back to basics and completely re-imagine our availability checker. I made a decision to do some early ground work in order to get some of the basics done. Some of which were:

  • Business requirements,
  • User needs,
  • UX strategy,
  • Metrics & tracking,
  • UX Wall

I will be drilling into each section in the following sections. This is to describe my thinking process and how I went about this problem.

Business Requirements
  • Build a public facing availability checker catering for Go2Africa - & external clients,
  • Provide real-time pricing on accommodations for travel planners,
User Needs
  • Ability to search for any product on the system,
  • Ability to add it to a grid to check accommodation level availability,
  • Ability to check room level availability,
  • Bulk removing of products on grid,
  • Single product removing abilities,
  • Check info of product
UX Strategy

This is my approach to keeping documentation as little as possible. I usually gather enough information in meetings and I quickly capture all the needed information on this document once I have time. Every so often, I sync up with our project manager to confirm what I have is consistent with his understanding. Once complete, this document is mailed to all relevant stakeholders to review and to give their input. Once that's done, the document goes to the UX wall.

Metrics & Tracking

Adding tracking and metrics to this product is something that I pushed for and working closely with the project manager and other relevant stakeholders, we managed to make a list of things that we want to track once this feature is implemented.

UX Wall

I've created this concept quite recently in an attempt to have a centralized place for all of the research, prototypes and any valuable information. This UX wall has boosted engagement within the team, especially when we need to go through a prototype or feature flow.

Design Phase

Sketch Zeplin Jira Balsamiq InVision

At this point, I usually have a pretty good idea what needs to be done. By referring to the Stacked UX Process, I reflect on each layer to make sure I have what I need.

  • Strategy - user needs & business requirements,
  • Scope - needed functionality
  • Structure - information architecture,
  • Skeleton - wireframes,
  • Surface - prototype
Wireframes & Initial Variations

Taking into consideration, all the groundwork that has been done to this point, I start to conceptualize a few ideas and usually push out a few variations. See all alternative screens for each variation

Prototyping Final Concept

The team meets to have a look at the concepts, this usually happens at our UX wall. After committing with a concept, I immediately start to do a full visual prototype of that concept.

Assets & Handover

At this point, I make sure that all the Sketch files are exported to Zeplin, ready for the developers to tackle. It is at this point that I continue collaborating with the developers, should there be anything unclear.

Functional Spec

After the preparation of all the assets and files, the functional spec gets added to Jira. This is a summary of functionality that is reflected in the prototypes. This functional spec can also typically include notes and any other discoveries or changes as we go through the process of implementation.

  • Build 2 panel screen splitting products form availability grid,
  • Add bulk- & single delete feature,
  • Have the ability to add products to grid for availability checking,
  • Add the ability to expand accommodations to reveal room level availability,
  • Have the ability to adjust dates for your trip,
  • Add a button to the right-hand panel that will allow the panel to slide open, for a more broad view of everything,
  • Have an info modal at their disposal to check for any information regarding a property, should they have the need for that

Test Phase

Parallels Toolbox Hotjar
Creating The Test Plan

I made a decision to do a usability test instead of a classic training session where we "show & tell". The idea behind this is to put the feature to the test. I created a simple task list for the users and observed their interaction with the system, providing no assistance.

I made sure to do a screen recording of these usability test session. Unfortunately these videos cannot be disclosed due to privacy policies within our company.

Test Results

I made sure to take notes during the session as I observed the users interacting with the feature. The images below indicates some of the feedback that was generated in these sessions.

Takeaways & Next Iteration Improvements

The final step, before starting with the next iteration, was to consolidate all of the feedback into a list of possible improvements and new additions to the feature.