The WeatherHub V1 | Diy Multi-Display Arduino Weather Station Under 10$

A few months ago I saw a weather display project that used a single OLED to show basic weather information. Inspired by that concept, and driven by my recent exploration into multi-display systems and API integration, I decided to create my own comprehensive weather station that could display multiple data streams simultaneously .

I have called the project the WeatherHub.

What are the features of the WeatherHub?

1. The WeatherHub displays information across 3 separate OLED screens with different layouts and purposes.
2. It shows current weather, tomorrow's forecast, and real-time clock information.
3. Open Hardware design using common, affordable components.
4. Uses the ESP32 with built-in WiFi capability.
5. All the software libraries used are Open Source and free to use!
6. Features custom weather icons displayed as bitmap graphics on the OLED displays.
7. Built from recycled cardboard materials promoting sustainable making practices.
8. Connects to live weather APIs for accurate, up-to-date information.
9. It will work with various WiFi networks and can be easily reconfigured.

The WeatherHub provides comprehensive weather information at a glance while serving as an attractive desk accessory!

Please help support sustainable making projects like this one.

Electronic Components:

1 x ESP32 Development Board (costed 2.99 $ from Aliexpress)

1 x TCA9548A I2C Multiplexer (costed 0.99 $ from Aliexpress)

2 x SSD1306 OLED Display (128x64) (costed 1.19 $ from Aliexpress)

1 x SH1107 OLED Display (128x128) (costed 1.99 $ from Aliexpress)

1 x Breadboard or PCB for connections or Jumper wires for connections (used wires and costed 0.99 $ from Aliexpress)

1 x USB Cable for power (costed 0.99 $ from Aliexpress)

Housing Materials (free :) ):

2 x Recycled cardboard boxes

1 x Sheet of decorative paper or a printed out page (be creative!)

Hot glue sticks or Double-sided tape

Craft knife or any other knife at hand

Ruler and pencil

Software Requirements:

Arduino IDE

ESP32 board package

WiFi network credentials

WeatherAPI.com account (free)

TimeAPI.io access (free)

The basis for this project was the desire to create a multi-information display that could show weather data, forecasts, and time information simultaneously. My starting point was to find an efficient way to control multiple OLED displays using a single microcontroller.

However I wanted a design that was both functional and environmentally conscious. Rather than purchasing a manufactured enclosure, I decided to use recycled cardboard boxes and create custom decorative elements using PowerPoint graphics.

The system needed to handle multiple I2C devices (the OLED displays) which typically share the same address. To solve this I used an I2C multiplexer that allows addressing multiple devices independently.

The challenge was creating an attractive housing from waste materials while maintaining proper display visibility and cable management. I took inspiration from modern smart home devices but wanted to add artistic elements.

To cut a long story short, after researching various multiplexer options and display configurations, I settled on the TCA9548A multiplexer and a combination of SSD1306 and SH1107 displays for optimal information layout.

Electronic Components:

1 x ESP32 Development Board (costed 2.99 $ from Aliexpress)

1 x TCA9548A I2C Multiplexer (costed 0.99 $ from Aliexpress)

2 x SSD1306 OLED Display (128x64) (costed 1.19 $ from Aliexpress)

1 x SH1107 OLED Display (128x128) (costed 1.99 $ from Aliexpress)

1 x Breadboard or PCB for connections or Jumper wires for connections (used wires and costed 0.99 $ from Aliexpress)

1 x USB Cable for power (costed 0.99 $ from Aliexpress)

Housing Materials (free :) ):

2 x Recycled cardboard boxes

1 x Sheet of decorative paper or a printed out page (be creative!)

Hot glue sticks or Double-sided tape

Craft knife or any other knife at hand

Ruler and pencil

Software Requirements:

Arduino IDE

ESP32 board package

WiFi network credentials

WeatherAPI.com account (free)

TimeAPI.io access (free)

The housing design incorporates artistic cutouts featuring swirl patterns and decorative silhouettes. These not only look attractive but also allow the OLED backlighting to create ambient lighting effects.

Safety Note: Always ensure proper ventilation when using hot glue guns and craft knives. Take care when handling electronic components to avoid static discharge damage.

Where do we start? Well firstly we need to establish our I2C communication network. The TCA9548A multiplexer allows us to connect multiple I2C devices that would normally conflict due to shared addresses.

The multiplexer acts as a traffic controller, routing I2C signals to different channels on demand. Each OLED display connects to a separate channel, allowing individual addressing and control.

I'll be using three channels of the multiplexer:

1. Channel 0: SH1107 128x128 display for current weather
2. Channel 1: SSD1306 128x64 display for tomorrow's forecast
3. Channel 2: SSD1306 128x64 display for time information

The ESP32 connects to the multiplexer using the standard I2C pins (SDA and SCL). Power distribution is straightforward - 3.3V and GND connect to all devices in parallel.

Connection testing is critical at this stage. I recommend connecting one display at a time and verifying communication before adding the next. This helps isolate any wiring or addressing issues early in the build process.

Connection Sequence:

Step 1: Connect ESP32 to TCA9548A multiplexer

Step 2: Connect first display to Channel 0

Step 3: Test communication with basic display code

Step 4: Add remaining displays one by one

Step 5: Verify all channels respond correctly

More info on connections can be found here: https://forum.arduino.cc/t/multiplex-two-ssd1306-oled-i2c-displays-using-tca9548a/1051307/4

The visual appeal of the weather station relies heavily on the custom bitmap icons displayed on the OLED screens. These icons represent different weather conditions including sunny, cloudy, rainy, drizzle, and snow.

Each icon is stored as a byte array in program memory (PROGMEM) to conserve RAM. The bitmaps are created at specific dimensions to fit optimally on the display screens while leaving room for text information.

Icon Creation Process: 1 | Design icons in a graphics program at 60x55 pixel resolution

2 | Convert to 1-bit black and white bitmap

3 | Use online bitmap converter to generate byte arrays

4 | Store arrays in PROGMEM to save RAM

5 | Create display functions to render icons based on weather codes

The weather API returns condition codes that map to specific icon types. I created conditional logic to select the appropriate icon based on these codes:

Arduino Code

This approach allows for easy expansion - additional weather conditions can be added by creating new bitmaps and extending the conditional logic.

Everyone loves a custom enclosure for their electronics project, and I thought the WeatherHub should have an artistic, sustainable housing made from recycled materials.

The enclosure design serves multiple purposes: protecting the electronics, providing mounting points for the displays, and creating an attractive appearance through decorative cutouts.

I started with two medium-sized cardboard boxes that were destined for recycling. The main body houses the ESP32 and multiplexer, while the front panel provides mounting locations for the three OLED displays.

Construction Steps: 1 | Cut main body box to desired dimensions

2 | Mark and cut rectangular openings for OLED displays

3 | Create decorative cutout patterns using templates

4 | Prepare mounting points for internal electronics

5 | Add cable management openings

6 | Test fit all components before final assembly

The decorative elements include swirl patterns and cat silhouettes that allow the OLED backlighting to create ambient effects. These cutouts are carefully positioned to not interfere with the structural integrity of the enclosure.

For extra strength I reinforced key areas with additional cardboard layers glued together. The display mounting areas received particular attention to ensure secure, stable mounting.

The heart of the WeatherHub's functionality lies in its ability to connect to external APIs and retrieve real-time information. This requires careful handling of HTTP requests, JSON parsing, and error management.

API Services Used: WeatherAPI.com: Provides current conditions and 2-day forecast

TimeAPI.io: Supplies current time in specified timezone

The ESP32 connects to your WiFi network using stored credentials. I recommend creating a separate IoT network for projects like this, or using a guest network to maintain security isolation.

Error handling is crucial for reliable operation. The system detects connection failures and displays appropriate status messages on the screens. If API calls fail, cached data or error messages are shown instead of crashing the system.

JSON Parsing: The Arduino_JSON library handles parsing of API responses. Weather data includes temperature, conditions, humidity, and forecast information. Time data provides current time, date, and day of week.

Data refresh occurs every 60 seconds for time information and every 10 minutes for weather data to balance accuracy with API rate limits.

The three-display layout provides comprehensive information without overwhelming the user. Each display has a specific purpose and optimized information density.

Current Weather Display (128x128):

1. Large weather icon (top-left quadrant)
2. Current temperature (large text, top-right)
3. Date information
4. Weather description
5. Rain probability
6. Min/max temperatures
7. Humidity percentage

Tomorrow's Forecast Display (128x64):

1. Smaller weather icon (left side)
2. Forecast temperature (right side)
3. Date for forecast
4. Rain probability
5. Condition description

Time Display (128x64):

1. Large time display (top, 3-line format)
2. Day of week (medium text)
3. Full date (small text)
4. System status indicator

Font sizing and positioning were carefully optimized for readability from normal viewing distances. The layout uses available screen real estate efficiently while maintaining visual hierarchy.

Text positioning calculations ensure information doesn't overlap and remains readable even with varying string lengths (e.g., different day names or weather descriptions).

Before committing to the final assembly, I wanted to ensure all components functioned correctly together. This involved systematic testing of each display, API connectivity, and error handling.

I used color-coded jumper wires to maintain organization during assembly. Each connection was labeled and documented to facilitate troubleshooting if needed.

Wiring Organization:

1. Red wires: 3.3V power connections
2. Black wires: Ground connections
3. Yellow wires: I2C SDA signals
4. Green wires: I2C SCL signals

The ESP32 was mounted inside the enclosure using standoffs to prevent short circuits. The multiplexer board was positioned for easy access to all channels while maintaining compact packaging.

Cable management became critical during final assembly. I created specific routing paths for wires to prevent interference with display mounting and to maintain the clean appearance of the finished project.

Power Management: The system draws approximately 200mA during normal operation, well within the USB power supply capability. The ESP32's built-in voltage regulation handles the 5V to 3.3V conversion for all components.

A status LED could be added to indicate power and connectivity status, though the displays themselves provide sufficient feedback about system operation.

The WeatherHub software manages multiple concurrent tasks: WiFi connectivity, API requests, JSON parsing, display updates, and error handling. The main loop coordinates these activities with appropriate timing intervals.

Key Configuration Parameters:

Before deploying the code, several configuration steps are required:

1 | Obtain free API key from WeatherAPI.com

2 | Configure location for weather data (city name or coordinates)

3 | Set appropriate timezone for time display

4 | Adjust refresh intervals based on your needs

5 | Configure display I2C addresses if different from defaults

Testing Procedure: Upload the code and monitor the serial output for connection status and API responses. Each display should initialize and show appropriate startup messages before beginning normal operation.

Weather data updates occur every 10 minutes, while time updates happen every minute. The system automatically handles daylight saving time changes and leap years through the time API.

Error Recovery: If WiFi connection is lost, the system attempts automatic reconnection. During connectivity issues, displays show status messages instead of stale data. The ESP32 performs a daily restart at 23:30 to clear any memory leaks and ensure reliable long-term operation.

API rate limiting is respected through appropriate delay intervals between requests. Free API tiers typically allow thousands of requests per month, more than sufficient for this application.

The final step transforms the functional weather station into an attractive desk accessory. The decorative elements created in PowerPoint are printed and applied to the cardboard enclosure.

Finishing Touches: Keep the decorative elements subtle but impactful. The goal is to enhance the technical functionality with artistic appeal while maintaining the sustainable/recycled aesthetic.

I created swirl patterns and silhouettes that complement the OLED backlighting. These cutouts allow light to pass through, creating ambient lighting effects that change based on display content.

The cat silhouettes add personality to the design while serving a functional purpose - they help identify the device's orientation and provide visual interest during the day when displays might be dimmed.

Presentation Setup: Position the WeatherHub where it can be easily viewed throughout the day. Ensure WiFi signal strength is adequate at the chosen location. The USB cable can be routed discretely along desk edges or through cable management systems.

Consider the viewing angle when positioning the device. The OLED displays have excellent contrast but may appear dim if viewed from extreme angles.

The WeatherHub codebase is designed for easy customization and expansion. Users can modify location settings, add additional weather parameters, or integrate with other APIs.

Basic Customizations: Change the weather location by modifying the API request URL. Multiple locations can be supported by creating additional displays or cycling through different cities.

Display layouts can be adjusted by modifying the cursor positions and text sizes in the display functions. Font sizes can be optimized for different viewing distances or personal preferences.

Advanced Modifications: Additional sensors can be integrated to show indoor temperature, humidity, or air quality alongside the outdoor weather data. The I2C multiplexer has unused channels available for expansion.

Smart home integration is possible through MQTT or HTTP webhooks. The weather data could trigger automation routines based on conditions or forecasts.

Troubleshooting: If displays don't initialize properly, check I2C connections and addresses. Use an I2C scanner sketch to verify device detection.

Network connectivity issues usually relate to WiFi credentials or signal strength. The serial monitor provides detailed connection status information.

API errors typically result from invalid keys, rate limiting, or network issues. The code includes error handling that displays status messages instead of crashing.

Future Enhancement Ideas:

1. Add weather alerts and severe weather warnings
2. Include moon phase and sunrise/sunset times
3. Integrate calendar events from Google Calendar API
4. Add touch sensors for interactive display switching
5. Include indoor air quality monitoring
6. Support for multiple weather locations
7. Historical weather data trending
8. Integration with home automation systems

Code Repository: The complete source code is available for download and modification below.

If everything has worked correctly, and all settings are configured properly, you should see current weather information, tomorrow's forecast, and accurate time display updating automatically. The WeatherHub is now ready to provide comprehensive weather information while serving as an attractive, sustainable desk accessory!

Helpful resources:

1. https://randomnerdtutorials.com/esp32-ssd1306-oled-display-arduino-ide/
2. https://randomnerdtutorials.com/esp32-http-get-post-arduino/

Buy all parts from Aliexpress with `welcome discount`. It is far the cheapes option and one could buy everything for minimum 5, maximum 10 $ :)

Please share the photos if you build your own version :D