preno.webp

Improved Settings Navigation

Preno is a hotel management software provider helping hoteliers with front-of-house and back-office needs. I led design for the entire product building out areas like booking management, reporting, payments, and integrations to name a few. 

As the Preno product grew in features and integrations we found ourselves pushing the Settings UI to its limits and noticed a decrease in ease of navigating this area. I redesigned the entire settings area improving scaleability, the information architecture of pages, and page content. 

Integrations-old-new.png
2.png

Updated Settings Pages

IMPROVEMENTS

  1. Improved UI and navigation components to scale as the product and settings grow 

  2. Redesigned how settings are grouped to make it easier for users to find the settings they want 

COLLBOARTION

I took designs from wireframes to hi-fidelity, reviewing ​with the PM and engineers along the way to keep everyone across progress and get feedback on technical feasibility. 

We user-tested before releasing to validate the new grouping of settings made sense as well as to check for anything we missed and everything tested well. 

I worked closely with the developers through their build to support and review where needed. As our team was small, I also helped with testing before release. 

FINAL DESIGNS

INTEGRATIONS

Integrations-old-new.png

New 🎉

Integrations-old-new.png

Old

Vertical nav

The vertical nav increases space for new settings pages to be added and increase ease of readability, scanning down a list rather than across. 

Separated setting by integration

This increased the ease of navigation of the setting area. It also increased the scalability of each integrations settings page to allow for our integrations to improve in sophistication and customisation.

BOOKING EXTRAS

2.png
Post Facelift Settings - Extras _ Add, Edit, Remove.png

ROOMS

RoomTypes _ Unsaved changes.png
RoomTypes _ Order on grid.png