RAD Property Management System

RAd_Mockup.jpg

The Project

Rad is a Property Management System for Irish B&B’s and small hotels.
It is a Desktop Web Application being developed by a Limerick start-up company.

My Role

After agreeing on a UX strategy that suited budget and timeframe, I began working as UX/UI Designer alongside a Product Manager and Product Developers.

Sketch

InVision

Illustrator

Bootstrap

Omnigraffle

Interviews

Contextual Enquiry

Benchmarking

Persona

Wireframes

Prototype

Interface Design

Style Guide

Competitive analysis

To get started, I compared different Property Management Systems (PMS) currently on the market.
I considered competitive advantages, target market, pricing models, strengths and weaknesses, compatibility, aesthetics, brand voice, usability, layout and navigation.
This stage is key to understanding the product’s potential position in the market , defining an MVP
and  deciding how to leverage strenghts and weaknesses.

 

User Research

User Research was conducted mainly through Interviews and Contextual Enquiries.
This information, together with Market Research, showed some interesting insights about our prospective user base.
Behaviour, attitudes and goals became more clear after interviews, as did  pain points with existing products.

 

Rad_Persona.png

Usability

In terms of usability, the most important finding was that approximately four out of every five B&B operators are aged over 50 years, with half of that number aged 60 or over.
Designing with accessibility in mind for this  group will improve design for all.

For adults over 50, it is recommended to -

  • Allow suffcicient contrast
  • Avoid small fonts
  • Avoid light grey
  • Avoid animations
  • Avoid bright white backgrounds
  • Be consistent
  • Stress discoverability
  • Repeat patterns
 

Use Cases    Task Flows     Sitemap     Wireframes    Low-fi Prototypes

At this point, requirements, features and functionalities were revised and re-defined.
A sitemap was used to visualize content relations and design how users navigate through logical paths.
Use cases and task flows for our target users supported the information architecture of the app, described in the sitemap.
Sketches and wireframes ensured the best possible flow for the interactions. I worked on (tons of) paper and moved onto low-fi Sketch wireframes.

Rad Front DeskWireframe.png
Rad_Setup.png
Rad _Flowchart 1.png
 

Interface Design

High fidelity wireframes turned into first iterations, used to create clickable prototypes with InVision.

Rad’s screens fall mainly into three patterns - calendar view, table views and forms.
The interface was based on Bootstrap’s 12 column grid - this was a developer’s preference.
Interface elements are based on Bootstrap components.

Visually, I aimed for an interface that was clear, simple, harmonious and well structured.

Rates Inventory.png
Property.png
Front Desk.png
 

style guide

Rad_Styleguide.png