top of page
F&B App
How I designed a portal for building landlords to efficiently manage F&B merchants, alongside creating an intuitive app experience for tenants, focusing on seamless navigation, robust functionality, and user satisfaction through iterative design and stakeholder feedback.
Overview
Background
Habitap is a Smart Living and Smart Building Management system that is geared towards residential and commercial properties in Asia.
For this project, we were working with two commercial building landlords who operate their own merchant and retail stores, which are frequented by office users. To foster stronger engagement between these office tenants and the merchants within the building, we're enhancing our app with additional community and lifestyle features. Our focus for this project is to develop an F&B app tailored for food pickup and delivery, complemented by a user-friendly portal for efficient order management.
Role
Being the only designer in a team with a Project Manager and several app and backend developers was a unique and challenging experience for me. While it was unfamiliar territory, it proved to be incredibly rewarding. In addition to designing mobile app screens for tenants, I was tasked with brainstorming backend functions for the portal. This involved creating processes for landlords to establish F&B stores for merchants and developing systems for merchants to effectively handle customer orders. Despite the steep learning curve, the journey provided invaluable insights and opportunities for personal and professional growth.
Stakeholders map
User personas
Recognising user's backgrounds
Problems with existing platform
01
Currently, the platform requires merchants to create and edit add-ons individually, even if they're meant for multiple items. This means that if a merchant wants to add the same add-on to several food items, they have to do it repeatedly. Similarly, editing the add-on presents the same challenge, requiring changes to be made item by item.
02
Managing orders through the merchant's order kiosk can become complex, especially when numerous orders come in simultaneously. Merchants might find themselves overwhelmed with managing orders in person alongside handling a flood of incoming orders on the kiosk..
Research
After brainstorming the essential features for managing the F&B store across different portals, I've drafted a flowchart outlining the necessary pages for both the Landlord and Tenant portals. To address the challenge of handling multiple versions of add-ons, I introduced the concept of an 'option group' to categorise add-ons, which can then be linked to specific food items.
For the Merchant portal, it's crucial to have an order system where they can receive orders and have the flexibility to accept or reject them. Additionally, in cases where inventory is low or items are out of stock, they should be able to manage these instances and remove unavailable items from orders as needed.
Finalised app screens
Finalised tenant portal screens
Menu items
To get a food item onto the app's menu, it has to be made on the portal first. The person running the show, like the restaurant manager, can create the item here and spice it up with extras and custom touches as they see fit.
Option groups
To customise your menu items, you've got to bundle them into a neat package called ‘option groups.' Think of it like putting all your topping options together. This way, it's easy for the person in charge to slap on the same set of toppings to different items on the menu and tweak them all at once if needed.
Finalised merchant portal screens
Accepting orders
Merchants can conveniently manage their orders using a tablet device. All orders received from the app will be displayed here. To streamline the process, merchants are provided with two buttons: one to accept and the other to reject orders.
Additionally, there are two toggle settings available for merchants to manage incoming orders more efficiently. They can opt to activate the "Auto-Accept" and "Auto-Prepared" toggles, which allow for automatic management of all orders. This feature eliminates the need for frequent tablet checks, enhancing user-friendliness for the merchant.
bottom of page