Amili
Lead Product Designer
2021 - 2023, Singapore
Scope
UX Design
Design System
UI Design
Prototype
Stack
Figma
Miro
ClickUp
UX Design
Team
2 Designers
2 PMs
3 Developers
1 Medical Adviser
Problem
Amili is one of the leading healthtech companies in Singapore, primarily focused on gut health. It offers various services to enhance gut well-being, including laboratory testing and analytics. To expand in this area, the company decided to develop a new laboratory dashboard under a separate brand, LILAC. This allows the product to be distributed to other laboratories as well.
Laboratory operations are complex, involving multiple employees, customers, specimens, and large amounts of data. Processes need to be fast and efficient since samples have a limited lifespan and can become invalid. The goal was to streamline workflows while ensuring accuracy and reducing human error.
The main objectives were to facilitate the management of laboratory staff, customers, orders, and supplements. Based on collected data, the system needed to generate reports and provide supplement and dietary recommendations.
Solution
Based on stakeholder requirements, our team began developing a web dashboard for laboratory management. We worked closely with laboratory experts, conducting interviews to better understand medical processes and how physical workflows interact with customers.
I created user flows and a feature list to map out the product's complexity and ensure a structured approach. From this analysis, we decided to divide the dashboard into key sections based on their primary functions, including laboratory management, customer management, order processing, supplements, and a donor section (FMT). To ensure all essential features were covered, I designed a comprehensive Product Map.
For the design, I developed a dedicated design system and grid structure tailored to this product while integrating some legacy elements from Amili’s existing system and other products to maintain consistency and speed up development.
This section presents the general product flows along with the dedicated Donor Enrollment process. The web app’s workflows are directly connected to real-life processes.
The product includes three types of users:
Customer — an individual taking a gut health test.
Receptionist — a laboratory staff member responsible for creating orders, customer profiles, and administrative tasks.
Laboratory Assistant — a specialist handling supplements and conducting tests.
FMT serves as a bank of gut microorganisms, where individuals can donate healthy bacteria in exchange for compensation. The donor flow outlines all the steps required for a potential donor to complete the process, including application, three stages of testing, and a final briefing.
This flow is more complex than others because, instead of the standard Yes/No outcomes, we introduced a KIV (Keep in View) status, allowing users to retake the test after three months if they don’t qualify immediately.
The Product Map outlines the step-by-step user flow, aligning with the laboratory’s operational processes. Since medical procedures for supplement testing and order management must be strictly followed, we structured the system to mirror real-world workflows.
The defined sequence includes: Create Customer → Create Project → Create Order → Activate Kit → Create Extraction Batch → Extract → Create Customer Report → Send.
Additionally, the map covers essential flows such as customer management, sequencing batch creation, FMT donor enrollment, and profile management. Each step ensures data accuracy, reduces human error, and optimizes efficiency in laboratory operations.
By structuring the product this way, we created a clear, logical, and intuitive dashboard experience while maintaining compliance with medical procedures.
This is the main dashboard page. I focused on structuring the sidebar based on a detailed user flow analysis, ensuring clear organization by section, main purpose, and user roles.
The dashboard itself provides an overview of laboratory efficiency, allowing users to sort data by period and channel (internal subsections within the laboratory structure). The key performance indicators (KPIs) include the number of kits, projects (B2B clients), orders, and tested samples—all displayed in a clear numeric format.
Since tested samples are one of the most critical metrics, I introduced an additional graphical representation, enabling admins to track daily stats and compare them with the previous period for better performance analysis.
The Add New Project page is one of the most complex pages due to the large number of attributes required. Admins must input detailed project information across multiple fields, making usability a key challenge.
From a design perspective, the goal was to organize data and inputs into clearly defined sections. Additionally, this page showcases a variety of data entry options, including dropdowns, text fields, toggles, and date pickers.
The Add New Order page is featured in this case study because it demonstrates a complex grid system, seamlessly integrating order details, product lists, and receipts within a single interface.
A key aspect of this design is its interaction with an IoT barcode scanner, which streamlines the ordering process by reducing manual input. This integration enhances efficiency and accuracy, making the system more intuitive and user-friendly for laboratory staff.
The Orders page provides a structured list of all customer orders. Given the variety of attributes associated with each order, I implemented multiple filtering options to enhance usability. To enable quick navigation between projects, I added a project segmented picker at the top and a basic filter dialog for refining results.
An important consideration was data sensitivity. By default, certain information remains hidden, ensuring privacy and security. Admins can reveal this data when necessary, but every action is logged, preventing misuse and maintaining compliance with data protection standards.
The Order History is a quick preview side menu that allows admins to instantly review the current status of a specific order.
A key challenge was handling orders with multiple products and kits, requiring a clear and structured display of essential details. In addition to tracking the order status, date, and admin responsible, I ensured that the KIT ID is easily accessible for accurate identification and traceability.
The KIT Details page provides a timeline view of the current status with the ability to update it as needed.
Additionally, this page displays projects linked to the KIT and samples associated with it, ensuring full traceability and a clear overview of its journey within the laboratory workflow.
The Extraction Batch page is used when a laboratory assistant completes testing and enters the final concentration value.
A critical aspect of this process is ensuring that the KIT ID is accurately linked to the test results, so reports are delivered to the correct person. To streamline this workflow and reduce errors, we integrated a barcode scanner, allowing for quick and precise data entry.
The Login page serves as the primary entry point for users.
A key security measure is that new users cannot sign up independently. Access is only granted through pre-registration by an admin, ensuring controlled onboarding and maintaining data security within the system.
This project was particularly challenging due to its large scale and the limited references or existing solutions in the market.
The design process was structured into multiple sprints and successfully delivered within four months—ahead of the initial schedule. One key factor in minimizing disagreements with the team and stakeholders was the detailed planning and clear structuring of data and processes into well-defined schemes.
At each stage, I delivered key assets, including wireframes, a design system, high-fidelity designs, and the final prototype. Our Figma file contained around 20 sections with nearly 200 design pages, covering all necessary variations to provide comprehensive instructions for developers. The collaboration with developers continued beyond the design phase to ensure smooth implementation.
The photo below shows the Amili Laboratory Reception in Singapore, where a laboratory assistant is actively using the product designed in this case study.
Amili Laboratory Reception
