Air Insight: Air Quality Monitor With Raspberry Pi

The air insight air quality monitor is a device that lets you monitor the indoor air quality. It measures Co2, particulate matter, volatile organic compounds, temperature, relative humidity and atmospheric pressure. All with the use of just three sensors. Depending on the air quality, the fan speed will change. The fan is a placeholder for in-home ventilation.

The device allows you to have a better insight in the air quality, telling you when you should ventilate, run your dehumidifier etc.

I wanted to make this project because according to my relatives, the air quality in my room can get very bad, while I don't notice it.

Electronics (~ €175)

• A 5-inch Touch screen LCD display
• Raspberry Pi 4
• MH-Z19B CO2 sensor
• PMS5003 PM sensor
• 5V 4A power supply
• NF-A4x10 5V PWM Fan
• 3.3V to 5V level shifter
• 4x pnp transistor
• some E24 resistors

Other supplies (~ €25)

• Heat shrink
• female to male pin headers
• HDMI - micro-HDMI cable
• 6mm MDF wood
• copper wire
• protoboard
• Wood glue

In the following lines, I'll go through the main components, their functions and why I have chosen them

1. Raspberry Pi 4 is the brain of the operation. It was chosen for the ability to run a webserver, as well as control the electronics
2. 5-Inch touch display is used as the dashboard of the device, all the data will be shown on here. It has a touch screen so you can navigate between the real-time data and the history. It connects to the pi via HDMI and SPI
3. MH-Z19B is used to perform Co2 measurements, using the non-dispersive infrared (NDIR) principle to detect the existence of Co2 in the air. The data from the sensor is easy to extract with UART, with just one command
4. PMS5003 is a particulate matter sensor. It can detect particles up to 10µm. I chose this sensor, because it is affordable, and was in stock at the time. the PMS5003 is a kind of digital and universal particle concentration sensor, which can be used to obtain the number of suspended particles in the air, i.e., the concentration of particles, and output of them with the UART bus
5. Bosch BME680 is an environmental sensor which is able to measure temperature, relative humidity, atmospheric pressure and volatile organic compounds. The Bosch BSEC library allows for calculation of the indoor air quality, and corrects the read values. The sensor is connected to the pi via i2c.
6. Noctua NF-A4x10 5v PWM fan is a 'smart' 5v fan, that takes a 5V PWM signal to operate, and has a tachometer to measure the fan speed. I included this in the project to have an actuator. In the end, it just represents the in home ventilation
7. Level shifter is used to convert the 3.3V PWM signal to a 5V PWM signal that is readable by the 5v fan.
8. 2n2222 transistors are used to switch which UART device is allowed to send data. It sort of works as hardware flow control

Breadboard

Before you solder everything together, it is nice to be able to test the sensors without permanent connections.

Soldering

I opted to solder the components together with the use of protoboards. These allow you to have permanent wiring while not having to order a PCB. You can use male to female pin headers to make sure your sensors can be removed or changed if necessary.

In the electronics schema you can find how to connect all the electronics together. The breadboard gives a visual view of how you can test on a breadboard

I want to quickly go through the design process of the website, since this is an important part for visualizing how you want your page to look, without having to write HTML or CSS.

Flows

First of all, it helps to visualize some flows that the user could go through. I made them using diagrams.net. This helps with brainstorming, and helps later to know which pages to make etc.

Wireframes

After working out the flows, I started making the wireframes, using Adobe XD. These help to quickly sketch the flows in grayscale, without worrying about the typography, or color. Here you focus on using the flows from the last step, and sketching how you want your page to look on different devices.

User Testing

Feedback is always nice when designing a website, at this point, you can ask colleagues, family or friends to test your design and flow. They will find things to improve, which you might not have thought about. Make sure to use your feedback and try to implement it in the best way possible.

Finding a color theme & typography

It is important to find a color scheme that you like, with colors that go well together. Adobe Colorwheel is a great tool to make a color scheme with colors that go well together. I decided to go with a monochromatic color scheme for the website. It is important to do a contrast check, to make sure your content is readable.

Go with a sans-serif font for the main attributes of the website, this will look readable. I prefer to use a single font, Proxima Nova, and play with the font-weights.

Applying the design to the wireframes

When I was happy with my color scheme, icon set and typography, I applied them to my wireframes.

Result

You can find the results of the design in the pictures above.

Software Development

For software development I used Visual Studio Code. The project is written in Python, HTML, JavaScript and CSS.

The electronics and the backend are handled with Python with flask & socketio.

The front-end is written in HTML, CSS and JavaScript. I used Socketio for the real-time communication and Apex Charts for you guessed it, the charts and graphs.

You can find the complete software and install manual on GitHub

Action (acties)

table where the different kind of actions are stored. E.g. reading a sensor, power on, power off, change fan mode & speed

DeviceUnit (deviceEenheid)

Table where the units of the sensors are stored, with some additional information.

History (Historiek)

Table where all incoming values are stored. The table is dependent on Action and DeviceUnit

setpoint, date of insertion, a unique id, and the foreign keys are kept. These can be used easily for historical data.

To cut the wood, I used a laser cutter, but a regular saw will do, if you don't have access to the tool. In the attachments you can find the vector image required for the laser cutter.

Before you start assembling your case, make sure you do a test-fit to make sure that all the components fit.

If everything fits, remove the components. Now go ahead and glue the sides to the front-panel. Make sure to clamp the wood down to the table when you let it dry.

To paint the case, you first need to sand the surface of the wood, so the spray paint can stick better to it. I used a microfiber cloth to remove the sawdust leftover from sanding.

Before painting to the case, make sure your spray paint works on your type of wood by testing first on a piece of scrap wood. When you confirm that the paint works on the wood, start painting the casing.

I found that it is better to apply multiple thin coatings of paint, instead of one thick coat.

Sadly, there are some glossy spots where the wood glue used to be. You should be able to avoid them by removing the spilled glue.

Start by inserting your LCD display. the rest of the components will follow. Now just nail the back panel shut and your product is finished

These were the steps to make the air quality monitor.

I hope you liked it!

If you have questions or comments, leave them down below!

If I were to remake this project, which I definitely would, I'd 3d print a bezel/ cover to cover the display.