Pillbie
The story of our startup
Roles
Brand & UX/UI Designer
UX Researcher
Co-Founder
Timeline
Q2 2023 – present
Tools
Figma,
Adobe CS,
Draw.io,
Google Jamboard
Team
PM: Batric Krvavac
Dev: Sreten Madzgalj, Luka Radonjic
Visuals:
Sticker illustrations by Viktor Dlabac
3D renders by Davor Golubovic
Animated product demo by Tomo Komnenic
As someone who battles with the direct results of nonadherence daily, I was looking for a way to get around it, and maybe to solve this problem for a number of people who are walking in my shoes. We teamed up, we were looking for answers, we found a solution, and Pillbie was born.
Pillbie is a smart IoT dispenser which comes with a mobile app solution to help young patients take their medication on time as described. It aids users by storing their medication securely, providing them with important information about their therapy and reminds them to take every dose to keep up their adherence without any interruptions.
Scope
Since it’s an MVP design, the scope has been redefined multiple times, but the outline remained the same: working on our first minimum viable product for both hardware and software. The app design had to be changed both in UX and UI aspects as we redefined our target audience and rebranded accordingly. The visuals shown here are from the 2nd iteration after rebranding.
Problem Statement
The effect of a medication and its long-term benefits depends on the patient’s adherence to prescribed instructions. Yet, according to an Australian study 40% to 60% of patients fail to consume medications as prescribed. Taking the right dose at the right time is commonly required for efficacy and safety, but nonadherence (the failure of patients to properly take prescribed medications) still causes 30 to 50% of chronic disease treatment failures, and results in 125,000 deaths per year in the U.S. This is a global problem for which we aimed to find a solution for.
Users and Audience
A user persona of Pillbie is a person in the age-group of 16-45 years old who has difficulties integrating adherence into their daily routines. They typically have time or focus related reasons for forgetting about their medication and therefore unconsciously endanger their therapy and healing. They have either short or long-term therapy prescribed by a doctor or take supplements on a regular basis.
Design Process
Defining scope and use cases, discovering user pain points, mapping
During this initial phase use cases were defined for Pillbie. Along with the basic functionalities we wanted to define hypothetical pain points of our users and were looking for data to validate it. After agreeing on the 2 most important pain points, a concept map was created in which we already described some ideal user flows. This was all setting the stage to the next crucial phase: research on our competitors.
Competitors Research
The app was built by first conducting a thorough research on existing medication reminder apps and dispenser+app solutions. This was important both for defining the scope of the MVP version of the mobile app, as well as to avoid future scalability issues of the navigation and IA. Based on the findings, the main functionalities of the first version were outlined by creating flow diagrams.
Creating Story Boards and User Flows
Competitors’ Research – First Notes
Our Hardware Solution
As we launched our product right after the redesign phase of the user flows, and as the product launch started to generate early users for the product, we conducted a usability testing with a combined method of interviews and user tasks. In these moderated rounds of testing we were looking for usability issues, inconsistencies and friction in user flows, for which the first analysed Hotjar recordings of our users interacting with the web app. This helped us narrow down a set of hypothesises, and though the entire web platform and mobile app was tested, we were able to point at specific issues that we aimed to correct in the next phase. We conducted research with 4 test subjects for Operator & Manager roles of the web application and with 5 test subjects for Manager & Driver roles of the mobile application.
Wireframes
Wireframing was mostly conducted on paper with user flows drawn in multiple versions. As a team work with our in-house engineers, we chose the path we believed to be most user-friendly and intuitive. In this we based our decisions on the findings the analysis of competitors brought to our attention. It’s needless to say, that an MVP is opening up much creative freedom, yet we would like to see in our next beta testing where results will lead us in evaluating our initial design.
Pen and paper Wireframes
How it works
Using Pillbie is easy. After setting up a connection between your smart dispenser and mobile app, you just load the dispenser and set alarms for your medication. When it’s time to take a pill, your dispenser will signal from which compartment you should take out a pill. The box will know if you took it and updates your adherence automatically.
Exploration of Visual Representation of the IoT Device in the App
Interaction design
The exact interaction design between the mobile app and hardware is drawn up with planned out user flows, while our hardware prototype is still being adjusted and has new iterations to reach its final form. During this time, while we work on the hardware, all planned out flows and interactions can change.
UI & Prototype
As the startup grew with a team of developers, existing wireframes have been eventually redesigned to adjust to the device’s specifics. After refining the wireframes, a design system of components was created, which eventually had to be changed following our rebranding. In this step, the brand colors and several UI components were adjusted to give a more youthful yet clear visual experience to its users.
A series of sticker illustrations of the hardware were created to incorporate in the screens and other graphic elements when needed. In this design phase we also improved our brand message, as the initial version was more “generic” and serving a broader audience. This course correction made it clear for us how to align our brand values and visual identity with the characteristics of a product serving a younger audience.
Design System
Our current “design system” is still evolving and therefore contains some customized third-party components. Our custom made iconography is aiming to support our brand’s visual appearance. We are using our brand colors in a minimalistic and unique way to create a design experience for our future users that align with the industry standards.
View more case studies
Ambages Design 2024