5 min read

Actabl Unified UI

Unifying the User Interfaces of Multiple Hospitality Products

Cover for Actabl Unified UI


ASG Alpine acquired 4 products, Alice, ProfitSword, Transcendent, and Hotel Effectiveness, and created Actabl in 2022, to combine business and labor intelligence with comprehensive operations software.

But the products were completely different, in every aspect possible.

The team



Design Lead


6 months


Figma, Miro, Sheets




How to unify the user interfaces of four acquired products (Alice, ProfitSword, Transcendent, and Hotel Effectiveness) into a single cohesive platform? How to maintain consistency and enhance user experience while preserving the unique functionalities of each product?

After extensive research and prototyping, a unified UI design was created and partially implemented, resulting in a more consistent user experience and a foundational design system for future updates.

Context and Motivation

With the acquisition of multiple products, each with its own unique UI, users faced inconsistencies and inefficiencies when navigating between tools. The challenge was to unify the design while maintaining the distinct functionalities and strengths of each product.

Acquired Products UI
Acquired Products UI

Process: Design, Product, and Engineering

At Actabl, each designer leads the Product Design aspect of their squad. I led this initiative with support from my Product Design Director. Alongside me were the Product Managers and Engineering Manager from each POD, contributing to the business and technical aspects, as well as a talented team of engineers.

The team
The team

Initial Findings:

Our first step was to conduct a thorough review of the existing UIs for Alice, ProfitSword, Transcendent, and Hotel Effectiveness, identifying common elements and discrepancies.

  • Inconsistencies in design elements across products.
  • A need for a unified design system to streamline future updates and maintain consistency.
  • Different frameworks running under the hood.


The second step was to gather insights from product designers and stakeholders, understanding their requirements and pain points.

  • The need for a consistent look and feel across all products.
  • Importance of maintaining the unique functionalities of each product while unifying the design.
  • It would be benefitial to have a centralized design system or, at least a style guide, for ongoing and future UI enhancements.


We created multiple design options that combined colors and UI elements from each product. A navigational prototype was developed in Figma to visualize the unified UI. Feedback from stakeholders was collected and incorporated into the final design.

Start the craft

For a project like this, we're very lucky because Markting team already had set a guide for the new brand, defining colors, styles, assets. My job was, then, to review all of the assets they've created to find our common language, from graphic/print to digital/product.

Study brand guidelines

Try out brand colors, "merging" interfaces


Feedback round after design critique


Iterate again: mix indigo and gray, so colors woudl be more noticeable

Mixing Colors

What success looks like

  • Handoff started by mapping the colors to be used in the products from now on.
  • We've established a design system repository in Figma, including standardized components that all product designers could use for their mockups.
Map color for the developers hand-off
Define style guide
Create and document components

The unified UI was implemented in all products, with one product undergoing a complete font style revamp.



Hotel Effectiveness

Hotel Effectiveness





Future Steps

  • The unified UI design will be rolled out across the remaining areas of each product (atfer all, many of us have to face legacy code).
  • User feedback will be monitored, and iterative improvements will be made.
  • The design system repository will be expanded to include more components and guidelines.

Learnings and Reflections

  • The importance of stakeholder engagement and feedback throughout the design process.
  • The need for flexibility and adaptability in design to accommodate various product requirements.
  • The value of a centralized design system for maintaining consistency and facilitating future updates.
  • Iterative design and feedback cycles are crucial for successful implementation.
  • Despite challenges, the project set a foundation for scalable and consistent design practices.

The team

The amazing team working (and supporting) me thorough the process:

  • Rafael Bucker
  • Felipe Miranda
  • Natalia de Luna
  • Henrique Stockler
  • Stephen German
  • Engineering and Product Teams ❤️


#user interface