GoTrim by Gojek
(Online Barber and Salon Reservation)
[DISCLAIMER] This project is made for personal portfolio purpose. There is no such feature like GoTrim in Gojek apps the day this study is written (February 1st 2021). All design material, concept, content, and copyright belong to Gojek company itself.
I. Overview
The Covid-19 outbreak has changed the way we live. Nations including Indonesia has applied the social distancing regulations that also limit business and public activities. Salon and barber shop are two examples of businesses that affected by these regulations. GoTrim is a service that offers the experiences of barber/salon reservation and call-in service (like personal hairdresser).
II. Problem and Workaround Solution
Before the pandemic started, most Indonesian folks get their hair cut about once a month for men and once in 3–4 months for women. We usually come to nearby barber or salon and wait for our turn, sometimes it takes longer to wait especially for women (salon). For some others, they just choose to make an appointment or call their personal hairstylist/barber to their place. These are the two common ways of how Indonesian get their hair cut before the pandemic. Nowadays, some of us feel more cautious about going out to public places including barber and salon because we have to wait with other people in a closed space where the virus can spread more easily according to WHO. This situation has decreased the number of customers for the business itself even though some of the customer just change the way they consume the service (by calling to their places).
I did a small research whether an application that offers the solution of these problems is already exist or not. Zenwel (Indonesia), Booksy (Poland), and Gosalon (UK) are the best three I can find with the similar business concept. I can say that none of them is having an ecosystem as complete as Gojek. So, why not for Gojek itself to make a similar service that works as a solution for the user, barber, and hairstylist. The booking and call-in reservation can be done inside the Gojek application with the help of GoPay for the payment method and even GoRide for the user if they want to directly go the barber/salon they booked earlier. It’s the complete ecosystem that offers the best experience for the user.
III. Design Process
The Logo
The Gojek application has categorized each of their services with colors. We can see that red is used for food delivery and shopping; green is used for transport and logistics (except bluebird); blue is used for payments; orange is used for daily needs; and lastly pink is used for news and entertainment.
Barber and salon are things that we have been using since we were kids. Hair is a part of human body that keeps on growing and cannot be stopped. From that point, we can conclude that GoTrim is a part of our daily needs, so we can start with orange as the base color of the logo.
Next, we are going to pay attention to each logo of the services. Most of the services have a playful, economical, simple looks, so we are going to make the logo with those three characteristics. The result can be seen in the following images:
User Flow
On the first iteration I try to think of a quick and simple way to book or call-in the service. The flow would be to choose GoTrim from the list in Gojek application which will show the GoTrim dashboard followed by the barber/salon detail with a call-in or book button and lastly a payment page.
But I feel like the flow is a little similar with Gojek transport and logistic service which lack of detail about the barber/salon itself, so I try to change the flow in the next iteration by comparing the flow from this iteration with GoFood and GoMart flow.
The result of the second iteration can be seen in the following picture. We can see the change on the dashboard where the position of label and content mapped accordingly with a shortcut for specific category of barber/salon service such as men’s cut, women’s cut, hair coloring, and other. The detail page now includes review, distance, and price category to make the look feel more consistent compared to other Gojek service. In this page, user can also see a more detail service offered by the merchant and now able to pick more than one service in a single transaction (Example: haircut and hair coloring). The checkout detail page is a new addition to the existing flow. Checkout detail page contains details for reservation method and reservation date. User can also give side note for the barber/salon. User can adjust the method and date which allow them to fit the time with the barber/salon availability before continuing to payment page.
The third iteration is just a simplify model from the second iteration which combine the checkout detail page and the payment page into a single rich action page. This is the flow used for the final design.
UI Component
The component used in this design mostly taken from Iconscout extension in Adobe XD which offer loyalty free svg icon to use. For the UI typography, “Neufile Grotesk” is the most similar looking font I could find compared to the one Gojek used. Lastly, the use of Stubborn illustration library comes in handy for a little bit of visual storytelling in dashboard page.
Final Design
IV. Conclusion
I believe there are still more things can be added and adjusted for further development. This is just a raw concept design I make because I feel the needs of barber during the pandemic. Personally, I would like to see this feature implemented by the Gojek team so that I can book barber easily and cut my hair without having to wait for a long period of time.
