Medication Made Easy: A UX/UI Success Story

Experience CISTEC AG's "KISIM Patient" web app, improving medication management for patients through thoughtful UX/UI design.

About the project

CISTEC AG has developed a web application named KISIM Patient, which assists hospitals in directly communicating information about hospital stays and treatments to patients. To better cater to the needs of patients, the company aims to improve the application's medication prescription feature. The main objectives of this project are to determine whether patients require medication intake tracking and how to support them in remembering to take prescribed medications. The design should meet user requirements and be sustainable.

Various mobile screens of todays KISIM Patient app
User Interface of todays KISIM Patient App

The process

To achieve a user-centric design, the Goal-Directed Design approach is applied, focusing on the phases of Modeling, Requirements Definition, Framework Design, Design Refinement, and Design Support. Leveraging existing artifacts such as personas, user needs and goals are defined, leading to the formulation of requirements through context scenarios. The identified requirements include: viewing and checking medications, setting reminders and configuring push notifications, adding/editing/deleting custom medications, and accessing a history of medication intake.

Goal-Directed Design process by Kim Goodwin

During the Framework Design phase, low-fidelity paper prototypes are created based on sketches and key path scenarios. These prototypes are then translated into a visual representation using Figma for subsequent usability tests. The usability tests indicate that the revised medication overview and the intake tracking via the plan are well understood by users. Importing and editing custom medications is also executed intuitively. However, the assumption that interval intakes would align with the standard intake schedule is not confirmed as a user need and is not further considered.

Evolution of medi-card design

The outcome

As a result, CISTEC AG receives a detailed persona, a high-fidelity prototype, and an updated design system. Additionally, recommendations that couldn't be addressed within the scope of this project are provided to the client company. These recommendations include an optimized header design and edge cases from validation scenarios that may be considered in the future.

The prototype

Explore the app in the below Figma prototype by clicking on the medication cards on the home screen. Discover prescribed medications and learn how to take them. Track your daily medication schedule and mark them as taken - did you take everything the day before? Want to add or edit medications? Simply click on the floating action button to manage your list. Enjoy the seamless experience of the KISIM Patient app.

Retro

The insights gained from this project are highly significant for the HCID (Human-Computer Interaction and Design) techniques and methodologies learned during the second year of studies. Working collaboratively as an agile team resulted in intrinsic motivation to deliver actionable results to the client.

Other projects: