Hautr - World's first and only Map based interface for Salon/Spa service appointments!

Hautr is an incredibly convenient platform that lets users pre-book their salon visits. The long hours spent by you just to get a haircut is saved!

Boilerplate was handed over the whole project i.e mobile application, ERP for the Admin/Employee and Booking Manager (for salons to keep track of their bookings and more).

Mobile application:
This was designed in Adobe XD and later exported to Zeplin to provide better access to the Mobile Development Team. Our top-most priority was to develop a simple UX that would make the users want to come back. We adopted a minimalistic approach to achieve this.

At the time of app development, Google maps, which was extensively used in our application, was still a Beta version. However, we stuck with our gut feeling, choosing the Flutter platform. In the end, this was the right choice, proving suitable for both android and iOS.

Making sure that the application maintains the same consistency across various device sizes and OS was a troublesome task. We were amazed by the backward compatibility of Flutter. When the application was run on an Android 4.4 (KitKat version) device, it looked as expected with respect to the functionalities, but with the presence of a lag. We decided to keep the min SDK for the Android version to be 21 (Android 5.0) so the application graphics and animations would be displayed without any discrepancies.

We decided to follow the guidelines of Stacked Cards which would give the user the illusion of being on the same screen while doing several tasks, making it easier to go back to the Home Screen altogether.

The ERP:
Developing an intensive, intricate ERP for Hautr was a challenging task. Some of their major features include -

  • Multiple Departments (Tech, Support, Business, Marketing, Mobile, Admin, Finance).

  • Message-Board (To share information between departments).

  • Approval System for each change made by the relevant department by Admin or the Parent Department.

  • Parsing an Excel Sheet to add various products for a salon.

  • Adding/Editing/Removing Headquarters, Zones and Branch for each Brand.

  • Adding/Removing Coupons (Zone Specific, Product Specific, User Interaction Specific).

  • Transactions list and export options (for Financing).

  • Details of Each User, Each Booking and more.

Adding the Mobile Department in the ERP was a fairly simple task in the initial stages with just the user details, suspending/unsuspending user functionality. However, that was not enough as the Admin/Employee didn’t receive any valuable information about the user. Thus, we integrated Google Analytics in the Mobile Application and added the relevant hooks to obtain the data in the ERP, giving us an in-depth review of the user and their actions on the Mobile Application, ultimately improving the Mobile Application.

Adding Master control for the Admin without disrupting any other departments was slightly perplexing initially, but the message-board approval system resolved this issue by requesting Admin’s or Parent Department’s approval for any change, solving the problem of overlapping changes in the ERP.

There were a lot of iterations made for this ERP, tailored to perfection for all the client requirements. There have been several UX changes proposed to the client, which might be added in the future updates to enhance the Usability of the ERP.

Hautr Professionale:
This was developed in MERN stack since the modularity and ease of code that React offered were really helpful for such a complex application.

The main component of this application was the Calendar View, designed from scratch. Developing the Calendar View to be dynamic, i.e., the ability to adapt to as many chairs as possible with any value of time-slots was the most challenging part.

Populating various Bookings on the calendar was the next task at hand. Since some cells didn’t require to be coloured completely, we could not add a background colour to each cell. We finally decided to use divs, which worked out just perfectly!

Keeping all the Client Accounts on at the same time was a tricky task as any booking made from the mobile application had to reflect on the Booking Manager with the same TimeZone (IST – As the application is not open for International Market just yet). We use the server time and take the TimeZone on the user’s device and add or subtract the offset accordingly. To make this production-ready, a lot of hard work from our end was put in.

The Booking Manager has a user-control module where the admin can dynamically add or remove users as needed via email address. The added users receive an email with their respective passwords. This idea caused a lot of conflicts (based on the market survey done) and was eventually dropped. Most salons have one person handling all the bookings so it deemed fit to have only one account for the Employees. The Admin, however, retains user control to add ad-hoc(temporary) Admins to take over the business operations, who can be removed later when the main admin resumes their duties.

Another option added later based on market survey is the ability of the salons to go offline/online based on their needs, apart from opening and closing time.

We are always open to making more additions in the future based on the user reception. Booking a salon appointment should be as easy as booking a cab!

The application can be found Here.