How to design UI/UX for a medical IoT startup


About the Client

Bonacea is a young medical startup aiming to help people throughout their long-term treatments. A set of hardware devices and sensors measure customized parameters of a patient's body. All the data is analyzed by an AI neural network and if an abnormality is found, a notification is sent directly to a doctor. The mobile and web apps remind and keep track of medication dosing. They are also hubs of treatment progress and history.

Client profile Medical Location USA Work duration 1 month


Bonacea is a large, complex project involving software and hardware. The main objectives are for it to be easy to set up and intuitive to use. We were asked to prepare UX and UI concepts for the web and mobile interfaces. This time, "mobile" also meant... smart watches.

Here are the challenges that we faced:
  • develop a clear UX flow within an application, consistent among devices
  • create intuitive UI for various types of screens — from 4k monitors to smart watches
  • give clear and straighforward information on medicament dosing
Project scope: browser-2 UX/UI Design


We started with defining stakeholders and final users of the app. Then we gathered and analyzed UI/UX requirements from all of them. Our UX team created flows for various devices and app roles. At this stage, we agreed on the overall functionalities of the app. Afterwards, we started prototyping low-fidelity designs, along with gathering more specific requirements. When that was completed, discussed and accepted, we agreed on the final form of the system and began drawing designs.

Here are the details:
  • we designed UX flows for computer screens, smartphones, and smart watches
  • we drew low-fidelity mock-ups to ensure a common understanding of the project
  • we built a clickable prototype to mimic the final UX of the app
  • we created high-fidelity mockups
  • we designed the final layout using a design system delivered by our UI team
With focus on UX Flow UI design

Business outcome

87 screens developed
5 types of devices
160 design system elements
200+ mock-ups

Bonacea received the complete design of the system for all devices. The process of gathering requirements and drawing low-fidelity mockups helped to save a significant amount of money by avoiding costly modifications during the development. Additionally, we made sure that everyone involved had the same understanding of the final product by building clickable prototypes. It reduced further discussions and increased productivity during the next phases of building technical architecture. Here is the summary:

  • we discovered differences between stakeholders' visions early in the process
  • we made a prototype before writing the first line of code
  • we created a design system that allowed the designers to quickly create new pages with blocks