Mill offers a simpler alternative to traditional kitchen composting, which can be difficult for city dwellers. The core product is a modern garbage bin that turns food scraps into a dry, odorless powder. The processed food waste from the bin can be sent back to the company in a prepaid mailer, and is then repurposed as nutrient-rich chicken feed. This entire process reduces emissions and lowers waste management costs for cities.

I designed the LED-based hardware user interface for the first and second generations of the bin, working closely with the industrial design, product, and engineering teams. The goal was to keep things as minimal as possible, which we achieved through some novel ID and mechanical engineering. 

A disappearing interface

The Mill app provides detailed bin and service status, but the bin itself must convey basic status information locally. To keep the physical UI as minimal and non-intrusive as possible, we integrated three LED-based indicators into the surface of the lid that disappear entirely when off. When the device is idle, only the lid surface and button are seen.

ID: Rocky Jacob

Minimal indicators

Our goal was to make the UI as basic as possible, yet flexible enough to support an evolving feature set over time. Implementing such a simple interface was a deliberate constraint, a commitment to ensuring the product would never seem too complicated.

To make the indicators expressive enough to communicate the device's different states, I designed a visual language of colors and animations.

Visual language

In addition to the indicators themselves, I designed the language of colors and animations they use to show what the device is doing at any given time. This language had to be expanded and revised as new features were added, which pushed the limits of our self-imposed constraints for simplicity.

Users aren't expected to interpret the meanings of these UI states without a guide. All behaviors are explained in the Mill app, and the on-device UI is used to provide users with visual confirmation of the current state indicated by the app.

UI states and UX flows

The bin's UI consists of a few dozen separate UI states, each of which I defined in terms of their explicit behavior. These are the behavioral "building blocks" of the interface, and directly referenced in logic flows for product features.

Additionally, I developed the initial set of UX logic flow diagrams to define how users would experience the core features of the bin. These diagrams outline how UI states are activated by feature logic and include separate tracks for user and app interactions.

UI states and UX flows

The bin's UI consists of a few dozen separate UI states, each of which I defined in terms of their explicit behavior. These are the behavioral "building blocks" of the interface, and directly referenced in logic flows for product features.

Additionally, I developed the initial set of UX logic flow diagrams to define how users would experience the core features of the bin. These diagrams outline how UI states are activated by feature logic and include separate tracks for user and app interactions.

Safety features

The bucket inside the bin can become very hot while processing material, at which point the lid is automatically locked for safety. However, users may need to manually override the lock, which introduces a design challenge, particularly in homes with small children. Balancing functionality with our commitment to child safety, I designed a child-safe lock override feature and worked closely with the team to test, refine, and validate it before release.

LED animations

As part of the visual language, I designed the animations the UI uses to communicate the bin's status. Once refined, I worked closely with the firmware team to ensure they were implemented properly for production. 

Because they were created in After Effects, these were easily repurposed for use in the Mill App, the web site, marketing resources, support assets, and more. 

From screen to device

Animations designed on screen need to somehow get translated into code that the actual hardware can run. To this end, I created a method for exporting After Effects animations as usable code. Collaborating with the firmware team, we established a process for easily running these exported animations on hardware. I used this method not only for testing and refining UI behavior, but also for delivering production-ready animation code.

Bringing device and app UI together

The Mill app is essential to the overall product experience, offering detailed status information that the device’s UI doesn't display.

There was a desire to make the bin's internal activities more observable with some animations in the app's main screen. I created these to both represent what’s going on inside the bin and complement the device UI.

Second generation

I also designed the UI for the second version of Mill’s bin, now called the Food Recycler, incorporating insights and improvements based on our experience with the first generation. The interface has been moved from the lid to the upper lip of the bucket enclosure, a dedicated heat indicator has been added for increased safety, and the animations are more refined.  

The new heat indicator helps users better understand when the inside is hot, so they can exercise caution when opening the lid. We supported similar behavior in the first generation, but later decided that a clear, dedicated icon was appropriate. 

While my contributions to the product are modest compared to the rest of the team, it's received some noteworthy recognition.

Mill.com

While my contributions to the product are modest compared to the rest of the team, it's received some noteworthy recognition.

Mill.com