MING Labs Case Study: Mann+Hummel – Tap to breathe

Mann+Hummel: Tap to breathe
How good is the air in your room?
This app will tell you

Client
Mann+Hummel
Location
Ludwigsburg, Germany
Industry
Mechanical engineering
Company size
≈20,000
MING partner in
Early 2016
Image
The needs

To create some apps that will
complement the indoor air filters

The results

The app is available in the App Store. We are proud that many teams and companies finally breathe the highest levels of clean air — not only in Asia.

What we've done

Mobile app, desktop app, design, development

The air quality in most of China leaves much to be desiredit's bad, so Mann+Hummel launched OurAir, an indoor air filtration system, and we did some apps for it.

About the client

Mann+Hummel is a big deal: For over 100 years, it’s been producing filtration systems for air and water, primarily used in cars, and the company firmly established itself as what might be called a World Market Leader in the Automotive Industry. 

In the light of the quick development of electric mobility — electric cars, electric scooters, electric everything — which marks the beginning of the end of the diesel motor, M+H began to look for new applications of its filtering systems. Soon enough, they created...

Air filter system as white box with digital screen on top, device by Mann+Hummel

OurAir, an air filter system for indoor use.

Simply put, it's a device that you place in the corner of your room to make the air cleaner. In countries and cities with unreasonablylooking at you, China high levels of air pollution, this is something particularly relevant.

We designed some mobile apps

OurAir was originally intended to be a consumer product, and the idea was to use an app on your phone to control it. The app would tell you whether or not you should turn on the filter, how good the air is inside, how good the air is outside, and so on. Pretty straightforward stuff.

Digital user interfaces designed for Mann+Hummel showing devices connected and peoples' profiles and air quality
Next step: same, but for B2B

M+H decided that since they’re already very good with selling things to big companies, they could do more of that with this new product too. Workplacesor rather people at workplaces need clean air as much as homes do, so why not equip an entire building with these filters then?

So now we needed to figure out the logistics of having maybe several hundred filters in one building. How will they be set up? Once they’re set up, how will the building manager monitor air quality?

In addition to repurposing the already existing B2C mobile apps, we designed a web app for managing this whole thing that would give an overview of the air situation in a given office. Dashboards, analytics, all good things.

Digital user interface for Mann+Hummel web app with dashboard of air quality in buildings showing data overview and maps
From design to development

We did the front-end development for the project ourselves: just the mobile apps, though — the hardware engineering, the back-end, and the web app development was done by other M+H partners.

Developing an IoT app is not a very common skill yet, so the development phase presented some interesting and unexpected challenges:

To connect different devices, we needed to use different protocols and sometimes different connections (Bluetooth/Wi-Fi), while keeping the user experience consistent. To resolve the connectivity issues, we worked closely with the back-end and hardware teams. 

Since we needed to deploy the app both in and outside China, we had to use different services for users from different places: While Chinese users would sign up with a phone number and would use WeChat login and Baidu Maps, global users signed up with emails, logged in with Facebook and used Google Maps.

What we've learned
  • Adapting a B2C mobile app for a B2B context is an interesting exercise with some challenges re: information architecture

  • Working with a hardware product is both exciting (because this is all real and tangible) and difficult (there’s tons of hardware issues to solve and overcome)

  • Localizing an app made for the Chinese market is not just about translating the copy — it also may involve a lot of changes and modifications in terms of third-party platforms
Credits

MING Labs: Sebastian Muelleraccount lead; André Gomesproject manager (design); Klaus ZimmermannUX director; Martina Maitan, Julian WohlleberUX designers; Michelle Yangproject manager (development); Thinkey Xin — technical director; Derek Zhang, Kenneth Dai, Xiaofeng Zhusoftware engineers.

ROTATE YOUR PHONE TO PORTRAIT MODE TO CONTINUE BROWSING THIS WEBSITE ¯\_( )_/¯