Overview

I was tasked with implementing proven UI/UX principles to design 3 large-scale hotel distribution platforms while managing front-end design & development of their existing admin application. I was also in charge of creating a brand identity for Hotel Trader to be used in email & marketing campaigns, physical billboards, posters, conference wallpapers, employee badges and much more.

I joined the company when it was only 22 members strong as the Founding UX Designer, and in my 3 years in the company I designed and co-developed the Hotel Trader ecosystem of products ( 4 in all ) and was in charge of creating the first Product Team while overseeing hiring of designers, subject matter experts and eventually the first product managers of the company.

Numbers ? When I joined the company it was doing $15k-$20k of daily transactions with an estimated 20% profit margin. When I left the company was consistently having upwards of $200k daily transactions, with profit margins up to 40% , all measurably related to the 3 products I designed & co-created. And finally In the month of March 2024, Hotel Trader raised over $100 million in series B funding :)

My Role

Role: Senior UX Designer
Company: Hotel Trader
Date of joining: 12th November 2021

Background

Hotel Trader is a B2B hospitality platform that connects hotel suppliers and clients through a dynamic marketplace focused on inventory distribution, pricing intelligence, and performance optimization. As the platform evolves, there's a strategic imperative to design intuitive, scalable, and seamless user experiences across three mission-critical applications:

1. Supplier Portal – for hotel suppliers and property owners to manage listings, availability, pricing, and performance analytics.

2. Client Portal – for travel agencies, OTAs, and corporate buyers to search, book, and manage hotel inventory.

3. Global Controls – for internal and admin users to oversee settings, permissions, global configurations, and system-level parameters.

Objective

To design and deliver a cohesive and scalable user experience across the Supplier Portal, Client Portal, and Global Controls, ensuring ease of use, operational efficiency, and alignment with Hotel Trader’s brand principles and business goals.

Part 1

Discover and understand users

This section is all about discovering and understanding the user's needs, goals, and pain points. I set myself a few research goals before getting started.

1. Learn as much as possible about my potential users. In this case the users were both sellers ( suppliers ) and buyers ( clients ), both of whom interacted with our in house supply , demand and operations teams.

2. Understand current solutions and the competitive landscape.

3. Determine if and how I can leverage new technology and innovation.

I ended up creating user personas for each class of user in the entire ecosystem, including but not limited to :
Suppliers, Clients, In-house sourcing team members, In-house Ops team members, Hotel revenue managers, Demand clients and other tertiary users of the Hotel Trader product(s).

Here is a visual representation of what that looked like :

Conducting a design sprint

After learning my users' characteristics, I organised a design sprint to clearly form an understanding about current expectations and user experience and use that as a baseline to improve upon. I included ~20 stakeholders and key team members for their inputs and ideas. The goals of this sprint was to :

• Clearly identify the problem at hand and write a definition for it.

• Ask poignant questions about any doubts or gaps in knowledge, and get their answers.

• Work on a solution concept together based on all the collected data so far.

• Design and develop a prototype for quick AB testing, feedback collection and iterative improvements.

Limitations and assumptions: Sprint participants were not pre-screened. All participants have either a) made a hotel booking  b ) tried to sell a hotel room to buyers,  at some point in their life. I made an assumption that people trying to book travel abroad would have similar pain points to those trying to book hotels from another country.

Based on these points, I created a simple notes board wherein I took all the information collected and organised them for later reference.

Key design sprint insights & takeaways

I noticed some common themes and patterns among the survey responses, the most important ones being :

• Usage of multiple tools

Most users did not rely on a single tool to get hotel information and post them on their shelves, nor to sell them. They used multiple websites and service providers to get real time updates about hotel (rooms) availability, rates and inventory (also known as ARI).

• A need for real time information

Users spent a lot of time ensuring that the information they have is the latest and most accurate. This involves manually coordinating with PMS and CRS support teams, all while dealing with technical limitations.

• Cumbersome manual troubleshooting

Nearly all users have had to troubleshoot an issue relating to buying or selling hotel rooms, which may or may not be a direct result of their own actions. Or in other words, a lack of error handling automation.

• No dedicated workspace for different user classes

When I joined the company, there was one ( admin ) application which served as the control centre for all activities for both suppliers, clients as well as team members of the company. The suppliers and clients were given access to a limited portion of the admin app , while the company teams had access to all of it.

Part 2

Problem definition & ideation

At this stage it was time to re-define my goal and narrow down its scope based on the insights I gained from users. Because of the relatively short timeline for this project, I chose to focus on a single feature : Automation.

The definition

Hotel Trader operates in the hotel distribution space, serving multiple classes of users, including hotel partners, distributors, internal operations teams, and support staff. Currently, the company relies on a single, monolithic application to support the diverse needs of all these user groups. This “one-size-fits-all” system has become a bottleneck for scalability and efficiency.

Each user class has distinct requirements and workflows, yet the lack of dedicated applications tailored to these needs results in a cluttered and confusing user experience. This fragmentation hinders productivity, increases the learning curve, and leads to higher support demands.

Furthermore, much of the company’s troubleshooting and onboarding processes remain manual and reactive. When issues arise, resolving them typically requires direct human intervention, which slows down response times and limits the company's ability to scale operations efficiently. Similarly, the onboarding of new partners or clients lacks automation, leading to inconsistencies and delays in activation.

The absence of specialised applications and automation not only impacts operational efficiency but also threatens customer satisfaction and the company’s ability to grow in a competitive market.

Hotels (sellers) need an easy and convenient way to update their ARI ( availability , rates , inventory ) in one place, in real time and with low to 0 human interaction, so that they can easily list their rooms on the shelves of booking clients at the most competitive rates.

The idea

An ecosystem comprised of 3 platforms : Global Controls, The Supplier Portal & The Client Portal

Offer an API Client Questionnaire to onboard clients on to the platform. Offer welcome emails & log in credentials to the list of hotel suppliers in our portfolio.Monitor sign ups/ logins and other user statistics through Global Controls. Handle payments, manage metadata, advanced ARI search and validation tools.Advanced ARI Search, Reservation Reports, Metadata management and Invoicing as modules offered to both clients and suppliers. Gamify account completion and alignment scores, to incentivise suppliers & clients to create a friction-less automated booking ecosystem.

Feature requirements

Based on the survey conducted, user personas created and internal/external interviews with stakeholders, employees, suppliers and client, It was clear that all 3 apps in the ecosystem should:

1. Be convenient and accommodate all user classes

• There needs to be different portals for suppliers and clients, as their operations work counter-intuitively to each others.
  For eg : Suppliers are trying to list available rooms for sale, while clients are trying to acquire more rooms from different suppliers to sell on their own platforms.

• Store information so that it's organised and easy to access

• Have a single admin application which manages the activities of suppliers and clients and acts as mediator during disputes.

2. Be transparent and trustworthy

• Always displays the source of content

• Ratings and reviews are easy to find

• Allow for viewing real-time ARI and validate metadata upstream.

3. Automate cumbersome manual tasks

• Allow debugging and troubleshooting problems as and when they occur, with little to no downtime.

• Incentivize users to complete their profile and make sure the hotel data they provided is accurate and updated frequently.

Time to define the scope of the project(s)

With feature requirements drawn up, it was time to define the scope of the entire project

1. Supplier Portal

• Users: Hotel property managers, revenue managers, regional hotel groups

• Key Features:

  • Property and listing management

  • Pricing, availability, and yield controls

  • Booking and cancellation dashboard

  • Performance metrics and reporting

  • Messaging and notifications

• UX Goals:

  • Minimize cognitive load during inventory updates

  • Design for mobile-friendly quick edits

  • Support bulk editing with intuitive UX patterns

  • Leverage data visualization to drive insights

  
  

2. Client Portal

• Users: Travel agencies, OTAs, corporate travel planners

• Key Features:

  • Advanced search and filtering of hotel inventory

  • Dynamic pricing and rate negotiation interface

  • Booking, modification, and cancellation workflows

  • Wallets, invoicing, and payment tools

  • Communication with suppliers

• UX Goals:

  • Simplify booking workflows for speed and clarity

  • Offer responsive and accessible interfaces across devices

  • Deliver trust through transparency in pricing and policy

  • Facilitate comparison and decision-making through clean layouts

    
    

3. Global Controls

• Users: Internal admins, ops teams, configuration managers

• Key Features:

  • User management and permission control

  • Platform-wide configurations (e.g., currencies, regions)

  • Content moderation and override settings

  • System monitoring dashboards

• UX Goals:

  • Build logical hierarchies for nested controls

  • Emphasize clarity and prevention of user error

  • Support auditability and traceability

  • Enable efficient task execution for power users

    
    

A quick guideline for design approach

• Research: Stakeholder interviews, user journey mapping, competitive benchmarking

• Wireframing & Prototyping: Rapid iteration using Figma with stakeholder input

• Design System: Extension or creation of a shared design system to maintain consistency

• Validation: Usability testing and analytics-driven refinement

• Collaboration: Partner closely with Product, Engineering, and Customer Support

And finally, success criteria

• Reduction in time-on-task and user errors across all portals

• Positive qualitative feedback from internal and external users

• Increased engagement with self-serve features

• Streamlined onboarding and training requirements

• Design system adoption across product teams

With all the documentation out of the way, it was time to get down to the actual designs.

Early sketches

I started by sketching some user flows and early wire frame ideas. Here are a couple screenshots but trust me, there were many…many more.

User flows for each

A project of such magnitude needed to be carefully broken down into individual modules, to formulate and ideate how exactly those parts would work independently and with one another. There were quite a few user flows made for each component of the Hotel Trader Application Suite, of which 3 are displayed here :

1. Client On-boarding Workflow

2. Supplier Invoicing

3. Metadata Workflow

Part 3

Wireframing, visual design & prototyping

This section demonstrates the designed solution, from low-fidelity wire frames to a high-fidelity prototype, all done in Figma.

Low-fidelity wireframes

I designed some wire frames for all 3 products based on all the information collected so far. Here are some examples of the supplier portal onboarding wire frames. Even though the wireframes are low visual fidelity, I believe it is important to use as close to real world data and language as possible, to clearly demonstrate the potential user paths and experience before moving on to the design phase.

These wireframes show :

1. Supplier Portal on-boarding.

2. Supplier profile creation and completion.

3. Alignment scores ( how well do suppliers stack up against their competition )

4. Profile mediation and statistics.
   
   It is to be noted that even though these were low level wire frames, they too went through a couple rounds of feedback and iteration before finalising ( hence the sticky notes ).

Style guide

I kept the colours simple and chose a modern, variable sans-serif font that is easy to read on all screens. I kept layouts consistent by using a 4-column, 8px grid. I also made Illustrations to add some delightful touches to a simple UI. There was a desire for the whole platform to be in 'dark mode' as the default setting with an option to switch to 'light mode' at any time.

Here are some screens of an earlier version of the styleguide which was used throughout all Hotel Trader products:

Component library

After setting up colour and text styles in Figma, I started to build a component library to maintain consistency across the designs. Components were setup using auto layout to make sure they are scalable across different screen sizes. Here's a sample showing just a few of these components.

The final designs

The designs are owned by hotel trader so even though I can't show everything here, what I can show are variations of some pages which were made at some point of the design process. To view the actual (proprietary) design, you would have to be a paying customer of hotel trader.

Supplier Portal

Client Portal

Global Controls

User feedback

The designs all went live between Jan 2022 and Jan 2023, as each product were launched separately depending on the most prescient goals at the time. I collected feedback from real world users that included hotel managers, revenue managers, operations team members, demand client representatives and even in-house customer support members. Here is a quick overview of what that looked like:

General/Global Feedback

1. User flow clarity:

   • "The navigation is consistent, but some user flows (e.g., switching roles or resetting passwords) could be more intuitive."

   • "Can we simplify the onboarding experience for first-time users?"

2. Responsiveness testing:

   • "Designs look great on desktop—have we tested key flows on tablet and smaller mobile screens?"

   • "In mobile view, filters and modals might need additional spacing or touch targets."

3. Accessibility:

   • "Even though components are consistent, we should double-check text contrast and keyboard navigation support."

   • "Do form fields have accessible labels and proper focus states?"

     
     

Supplier Portal Specific

1. Inventory management UX:

   • "Adding new room inventory works well—could we add shortcuts for bulk updates?"

   • "Tooltips or inline help might improve understanding of less common fields."

2. Analytics/dashboard usefulness:

   • "The revenue and performance charts look polished—can we make them more interactive (e.g., hover for details)?"

   • "Consider adding a snapshot summary at the top of the dashboard for quick insights."

3. Navigation structure:

   • "Menu is well-structured—could we allow users to customize their dashboard layout?"

     
     

Client Portal Specific

1. Booking and comparison flow:

   • "The search and filter interface is clean—could we add a side-by-side comparison feature for hotel options?"

   • "Can we make room details expandable without leaving the search page?"

2. Trust & transparency:

   • "Great use of clean UI—could we visually elevate verified stays or highlight limited-time deals more prominently?"

   • "Are reviews easy to filter by recency or rating?"

3. Support and help access:

   • "Support options are present but not obvious—consider a persistent help icon or contextual FAQs."

     
     

Global Controls & Settings

1. Role switching & permissions:

   • "It’s clear who’s logged in, but switching between supplier and client views could be more prominent."

   • "Can we add a summary view of permissions per role?"

2. Localization settings:

   • "The design of language and currency selectors fits well—how does fallback behavior work for unsupported languages?"

   • "Consider showing recently used currencies/languages for frequent travelers."

3. Notification preferences:

   • "Can we allow users to set preferences per channel (email, SMS, in-app)?"

   • "Are preview options available for notification templates?"
     
     
     

Tl;dr

The design was mostly well received, with the clean and uncluttered UI being a very strong point amongst all feedbackers. In using the designs over a period of 6 months, areas which could be improved or engineered differently from a functional point of view came into light giving rise to new opportunities to improve overall performance and enhance usability of the product suite. New ideas also came to light based on user behaviour and now there is on-going talks of another platform to be created purely to deal with metadata management and supplier invoicing.

Next Steps & Reflection

Receiving feedback from stakeholders and users confirmed the strength of our design system and validated our adherence to Hotel Trader’s brand and UI standards. With the foundations firmly in place, the feedback we received focused on refining user flows, improving mobile responsiveness, and enhancing the overall experience through clearer interactions and better support tools. These insights are now informing the next iteration of our design, where we’ll prioritize usability enhancements and edge-case handling without compromising consistency. This stage marks a critical point in moving from a solid, scalable design to a truly intuitive and delightful product experience.