Back to projects
University PrototypeInteractive SystemsIoT PrototypeSaarland University

iTea - Intelligent Tea Brewing Assistant

Interactive Systems group project at Saarland University: a working physical prototype that used NFC tea cards, a scale, OLED feedback, timers, temperature estimation, Telegram notifications, and a web dashboard to guide tea brewing.

My role

Web Interface Developer · Group Prototype Contributor · Interactive Systems

Value created

The result was a demonstrable connected prototype that helped users follow numbered brewing phases, receive timing feedback, and monitor progress on both the device and the web interface. User testing reported good usability scores and positive feedback on the smooth transition between brewing phases.

Case story

Overview

iTea was built for the Interactive Systems course as a group prototype for guided tea preparation. Instead of fully automating tea making, the device assisted the user with stored tea instructions, phase-by-phase feedback, timers, and status visibility.

Interaction Problem

Different teas require different temperatures, steeping times, amounts, and sometimes multiple infusions. The project asked how a physical assistant could reduce guesswork while still keeping the user in control of the brewing process.

My Contribution

My main contribution was building the web app / web interface for the device. The interface provided a dashboard view of the brewing process, showing device instructions, timer information, and temperature-related status so the physical prototype could be monitored from a browser.

Prototype Flow

Tea instructions were written to NFC cards attached to tea boxes. During brewing, the device read the card, let the user choose an infusion, detected the cup with a scale, started the cooling and steeping timers, signaled actions with the display, LED, and buzzer, and exposed progress through the website.

Technical Build

The prototype combined an ESP8266/Wemos D1 Mini, PN532 NFC reader, HX711 load cell, SSD1306 OLED display, buttons, LED feedback, buzzer alerts, Arduino/PlatformIO firmware, Telegram bot interaction, and a lightweight HTML/CSS/JavaScript dashboard.

Evaluation

The group tested the prototype with users and compared the temperature approximation against thermometer readings. The report noted good SUS scores and feedback that users understood the phase transitions, while also identifying improvements such as clearer instructions, a larger screen, a more compact waterproof housing, and a more self-contained app experience.

What It Shows

As a portfolio project, iTea shows my ability to connect a real physical prototype with a usable browser interface, work inside a multidisciplinary group, and think about interaction design across hardware, software, user feedback, and everyday routines.

Process artifacts

Evidence of the thinking behind the work

Research framing

Tea brewing often depends on small details - infusion, steeping time, water temperature, and cooling time - that are easy to forget or track with separate tools.

Workflow sketch

I contributed the browser-based interface for the device: a dashboard that mirrored the device status, displayed the running timer and instructions, and connected the physical brewing workflow to a web view. The group integrated this with an ESP8266-based prototype using NFC cards, an OLED screen, a load cell, buttons, LEDs, a buzzer, and Telegram bot support.

Design decision

Next I would make the web interface more robust as a product surface: clearer responsive layout, stronger connection-state feedback, safer handling of device credentials, and a self-contained app flow instead of relying on a messaging bot.

Gallery

iTea prototype with laptop web dashboard and physical tea brewing assistant device
The working iTea prototype during testing: the web dashboard on the laptop mirrors the device workflow while the physical box handles sensing, feedback, and brewing guidance.

Materials & Links

Open the project evidence

Reports, posters, demos, code, and related links are collected here so visitors can inspect the work behind the case study.

4