My first assignment with Halodoc as soon as I landed in Jakarta was to eat some local food or drink or wear the local traditional wear or at-least learn the survival words in Bahasa or at least exchange Indian currency notes to the local currency, Rupiah. The last one was immediately possible at the hotel we stayed. I must say having Indonesian currency in your hands makes you feel like a millionaire.
State of design at Halodoc
I joined Halodoc as a lead designer and was supposed to bring design thinking to the recently funded series A startup. The existing prototype of the proposed pharmacy app made by a graphic designer looked something like this.
When I started interacting with the product team and the graphic designer I realized the first iteration of mock was built with very less design. I tried giving feedbacks on the existing design and tried to influence the graphic team to arrive at a usable design by giving heuristic reports on the existing designs in a visual format.
…….and gave a detailed list of issues existing in the current form of the app (and prototype) along with suggestions ……
…..and also giving a heuristic score (with an intent to institutionalize the heuristic evaluation process at Halodoc
Design begins
I couldn’t see any considerable progress except a few quick fixes. There was a need for step back and design-thinking. Hence, I took a step back from UI design and did an UX enquiry of the overall Halodoc as a product which the team was trying to build. With the support of product team, I was able to arrive at the following big-picture (or the Grand-vision)
Zooming on-to Halodoc-Order (later to be renamed as Pharmacy) itself was an eco-system of multiple apps as shown below
Once the big picture (mental model) was visualized and every stakeholders on the same page, I started plotting the mind maps (for the different states of an order in the Pharmacy app) which I also used to
- Clarify my design questions
- Introducing design related terminology to the team
- Eventually bringing everyone on the same page
- and Communicate design
…and worked on low fidelity mocks in Balsamiq for the Pharmacy app
… took paper printouts of hi-fidelity version of the same (in black & white)
…allowed the product team discuss the same over a wall
… setting the stage for next iterations till we arrived at a final version
The final refined sketch mocks looked something like this
Since the app is supposed to be in two different languages, it was critical to co-ordinate with the product team for content strategy. Following excel sheet was created and maintained over multiple iterations to keep in sync with the content strategy team.
Validating the design with the end-users
For a detailed user testing report please click here
Final iteration
Hence, we have to rework on the Halodoc Pharmacy app as per the brand guidelines which resulted in something like this
The impact of work is clearly visible in the following pixelated picture from the investor meeting by the CEO of Halodoc, Jonathan.
Halodoc went on to achieve series B round of funding of 65 Million USD
