Smart Coffee Maker 


MSI has developed automotive, industrial, and commercial grade ARM-based Linux and Android solutions for more than 15 years. The company is also experienced in developing rugged tablets. Our team utilized these key strengths to offer coffee machine manufacturers an optimized experience of brewing a cup of coffee. The smart coffee maker aims to provide rush urbanites a simple way to slightly customize their americano, espresso, latte, and more other coffee types.


Industrial design

User Interface design

B2B project @ MSI


UX designer - PI-FEN HSU

Software Engineers - MAO-JUN YAN  l  WEI-CHEN CHU


Pro-E  l  Keyshot

illustrator  l  Photoshop


3 months ( 2019 ) 

The purposes

Ver. 01

Retrofit the old model of a coffee maker with an IoT tablet, providing a smarter way to brew a cup of custom coffee.

Establish a community for users of coffee machine brands to enhance customer engagement.

Utilize the Internet to inform users of replenishing coffee beans. (Also offer a platform for coffee bean brands to promote their products.)

Flow chart


Cooperated with UX Designer - PI-FEN HSU

Final outcome

The Home page

1024 X 768 px

Options for customizing different types of coffee

Grind sizes & Caffeine content

The volume of water

The volume of milk

The process of brewing a cup of customized coffee





The coffee community

This page shows the top-rated coffee recipes downloaded by customers today.

Directs to the details of each recipe

Offer a slight range for customizing the coffee based on the recipe that users choose.

The dropdown menu contains another page of coffee recipes shared by the professional baristas

Directs to the details of each recipe

Advertisement page for coffee beans' brands

Coffee Street provides a platform for coffee beans' companies that are business partners of the coffee machine manufacturers to promote their products.

Directs to the purchase page

Setting page

Remote-controlled coffee maker 

  • Brew coffee with smartphones and share the results on social media instantly.

  • Check the status of coffee machines and visit coffee beans' websites efficiently.

Wireframes of our Coffee Makers' APP

High-fidelity screens

Iteration goals

Retrofit a different coffee maker model that offers americano solely.

Refine the design of the machine and enlarge the screen.

Iterate the APP for remotely ordering coffee through smartphones.

Ver. 02

The outcome of our iteration

The new coffee maker aims at a commercial scenario that offers americano for office workers.

The coffee maker's APP 2.0

The APP is repositioned as an approach for workers to order their coffee remotely and grab a hot beverage when pass by the machine.