Skip to main content

Coffee Machine

Overview

This sample shows an automated coffee machine HMI solution. It is designed to make preparing drinks easier, smarter, and more connected through an advanced user interface. It brings together different functions in one organized way, helping users navigate the machine efficiently and manage the preparation process.

The solution includes features such as drink selection, user profiles, drink customization, and coffee machine management. Its main strength is a central interface that connects different modules for drink preparation, maintenance, and settings. These parts work together to create a smooth workflow and a consistent user experience across the entire coffee machine system.

Overview_CoffeeMachine.png

Feature Description

Scene
No. Name Scene Name Description
(1) Background StatusBar This scene acts as a commonly used layer within the Coffee Machine solution and contains shared components such as profile information and digital time display.
(2) Welcome Screen Scene_Welcome The main screen upon starting the demo. The screen features a "Good Morning" message that is addressed to the selected profile. This scene features three pre-selected coffee types. More coffee variants are available in the Scene_Selection.
(3) Profiles Scene_Profiles This screen allows the selection of pre-defined profiles (Marcus, Alice). A "New Profile" button is available, however, non-functional in this demo. The changed profile is also reflected on the other scenes.
(4) Coffee Menu Scene_Selection This menu shows all available coffee variants. The selection is implemented via a horizontal scrolling list that can be navigated either by the press of the navigation buttons or by swiping.
(5) Adjustments Scene_Adjustments

In this scene, the use can individually adapt the previously selected coffee to their needs. It allows the user to adjust the following parameters:

  • Intensity (amount of coffee beans)
  • Milk (amount of added milk)
  • Sugar (low, medium, high)
  • Foam (none, low, medium, high)

The previously selected coffee type is being displayed in the left of the screen.
(6) Preparing Screen Preparing Screen This scene covers the coffee preparation process after the drink configuration is completed. It displays a coffee cup that gradually fills up until the process is completed. Upon completion the user is automatically re-directed back to the Welcome Screen.
(7) Settings Scene_Settings

This scene contains various options for the coffee machine maintenance and setup:

  • Maintenance
  • Beans
  • Water
  • General
  • Connection

The various options are currently implemented as placeholders and lead to the Restriced scene.
(8) Placeholder Submenu

This scene is acting as a placeholder for further functionality implementation. It currently displays a lock indicating that there is no further action possible aside from returning to the previous scene.
3x2CoffeemachineImage.png
Control

The solution is designed using the predefined controls available in the Scene Composer toolbox, including lists, buttons, etc.

There is one customer control for the progress bar. For this custom control the interpolation behaviour was removed from the default toolbox to restrict animation behaviour when changing values on the progress bar (used for Milk and Intensity adjustment).

Please note that this could also be achieved by using the default progress bar and changing its "InterpolateBarValue" property "Receivers" --> settings "UnitsPerSecond" & "FilterTimeConstant" to "0".

Transition

The default transition is used for all scenes in this solution ("Cut").

State Machine

    Back to top