SweetAware — AI-Powered Diabetes Risk Detection Platform

Overview

SweetAware is a self-prediction web platform that helps people assess their diabetes risk in just a few clicks, built as a capstone project for the DBS Foundation × Dicoding Coding Camp (Group ID: CC25-CF243). Built by a six-person team split across machine learning and frontend development, I worked as a Frontend Developer, focused on building the intuitive, responsive interfaces that make an ML-powered health tool approachable for people with no medical background. The app is live at sweetawareapp.netlify.app.

The Challenge

Diabetes in Indonesia is growing fast, and mostly invisible.

The number of people with diabetes aged 20-79 in Indonesia is estimated to reach 20.4 million by 2024, up from 7.3 million in 2011 — and 73.2% of cases go undiagnosed.

Early detection matters because of cost as much as health: research cited in the project shows out-of-pocket early-detection costs as little as Rp 0 – Rp 10,000, while treating complications from undiagnosed diabetes can run Rp 5,000,000 – Rp 15,000,000 in hospitalization. Most people never take that early-detection step — not because they don’t care, but because screening isn’t accessible or top-of-mind. That’s the gap SweetAware set out to close.

The market backed up the opportunity: an estimated 184M adults aged 20-79 in Indonesia (TAM), 176M of them smartphone users in the target demographic (SAM), and roughly 130M health-conscious individuals as a realistically reachable audience (SOM).

Design & Product Decisions

The solution

SweetAware addresses the lack of access and awareness around early diabetes screening by offering a self-prediction tool that’s accurate, easy to use, and built to encourage a healthy lifestyle — no clinic visit or medical history required to get started.

Building for people with no medical background

1. Input form — collects age, gender, and BMI (with an option to auto-calculate BMI from height and weight), plus hypertension and heart disease status as required fields, and optional blood glucose and HbA1c levels for a more precise assessment. Optional fields are clearly labeled so a first-time user never feels blocked by data they don’t have.
2. Machine learning model — analyzes the submitted health data to assess diabetes risk, returning a risk level (low, moderate, or high) with a numeric risk score.
3. Prediction result — breaks the result down by risk factor (blood glucose, HbA1c, BMI, hypertension, heart disease) and pairs it with concrete next steps: lifestyle recommendations, monitoring guidance, consultation prompts, and recommended foods.
4. Educational page — a “Diabetes Education Center” with learning modules (Understanding Diabetes, Healthy Living, Managing Diabetes), interactive tools, resources, and an FAQ, so the app supports prevention, not just detection.
5. Informative dashboard — surfaces total predictions, average risk score, a breakdown of low/moderate/high-risk cases, and a risk-score trend chart, so returning users can see whether their habits are moving the needle.

Visual identity

The interface is built around purple as the brand color (#8B5CF6 primary, #9F7AEA for CTAs) — chosen to balance the calm trust of blue with enough energy to feel modern, framed around the keywords Health, Prevention, Education. Paired with clean cards, soft shadows, and a laptop-and-phone product story, the visual tone stays closer to a wellness product than a clinical one, which mattered for an audience that may be seeing a risk score for the first time.

Results & Learnings

SweetAware shipped as a live, working product rather than a prototype — the deployed app takes a user from landing page to a personalized risk assessment in a handful of steps, with a dashboard that turns a one-time check into something people can return to.

Working across a frontend/ML split team was the core lesson: the input form had to be simple enough for a non-technical user, but structured precisely enough to feed a prediction model correctly — including flagging which optional fields (blood glucose, HbA1c) meaningfully improve prediction accuracy, so users understood why filling them in was worth the extra effort. Translating a model’s output — a risk score and a set of risk factors — into something a person without a medical background could actually act on, through the recommendations panel, turned out to be as much a UX problem as it was a data problem.