Smart ePaper display for Home Assistant

Never in a million years did I think I’d be tinkering with Home Assistant. SwitchBot insisted I try their integration, and SeeedStudio told me they have the best ePaper display for HomeAssistant. Left with no other options, I had to give it a go. Recently, I started capturing data from my solar array and the XIAO 7.5″ ePaper Panel feels like the perfect device for visualising that information. I still barely know what I’m doing in Home Assistant, so what could possibly go wrong?

Introducing SeeedStudio XIAO 7.5″ ePaper Panel

The star of this project is the XIAO 7.5″ ePaper Panel. It’s powered by ESP32-C3 RISC-V, XIAO development board connected to an ePaper (resolution: 800×480px), equipped with a battery for wireless operation. Please note that SeeedStudio sent me one of their early prototypes, and my device is wrapped in a 3d printed enclosure. The final product will have a much nicer finish.

SeeedStudio is known for its XIAO series, a development board with a minimal footprint featuring microcontrollers like ESP32, RP2040, and nRF52840. These USB-C-enabled boards are perfect to start any IoT project, and XIAO 7.5″ ePaper Panel showcases how easy it is to build a standalone device using the range of Seeed’s modules.

Clad in a thin bezel, XIAO 7.5″ ePaper Panel features a single USB-C connector (from XIAO ESP32-C3 board) responsible for programming and charging the device. At the back, a kick stand keeps the panel vertical and hides access to the RESET and BOOT buttons. At the bottom edge, the smart display features an ON/OFF toggle.

Thanks to the ESP32-C3, XIAO 7.5″ ePaper Panel connects to 2.4GHz WiFi and offers Bluetooth support. The bistable, monochrome ePaper uses SPI to talk to the controller and offers a 0.34s partial refresh rate and 3.5s to refresh the full screen. Thanks to the 2000mAh Rechargeable LiPo inside the device can stay cable-free for up to 3 months, as long as you power manage the Xiao board appropriately. In my testing, it lasted about 3-4h when connected to WiFi without sleep policies and screen refresh rate set to 30 seconds.

Using XIAO 7.5″ ePaper Panel in Home Assistant

There are many uses for the XIAO 7.5″ ePaper Panel, but I’m keen on the Home Assistant integration. It’s an excellent way to display data that doesn’t require frequent updates, and the battery saving that comes from the usage of the Paper display makes the dashboard portable.

SeeedStudio demonstrated how to take advantage of ESPHome – ESP-oriented firmware that is well supported by Home Assistant and offers great integrations that require minimal coding experience. I’ll go with that, .yaml configurations are the bare bones of automation in Home Assistant, and it gives me an excellent opportunity to learn about it more.

Since SeeedStudio has a pretty decent tutorial on how to set up the XIAO board in ESPhome builder in Home Assistant, I’m not going to re-invent that, I will recap and clarify some steps to solidify the knowledge in your and my brains.

XIAO 7.5″ ePaper Panel ESPHome-ready

After adding the ESPHome plug-in to Home Assistant, we have to prep the XIAO 7.5″ ePaper Panel to be used with ESPHome firmware. There is more than one way of doing it, but as I run my Home Assistant on Super6C cluster away from my desk, I found the following to be the least problematic.

Without enabling HTTPS support in Home Assistant (complicated setup), I could use my desktop PC to flash initial ESPHome files and configure the WiFi of the XIAO 7.5″ ePaper Panel. This had to be done in web browser mode while the panel was connected to my computer via USB.

Flashing initial files, then adding a new device in the ESPHome builder (ESP32-C3) would result in the .yaml file generated, featuring WiFi credentials and ESPHome key for the integration (save that if you want your device to be part of HA).

Harvesting solar data

There are many ways to measure the solar power generation and grid use in your home automation. I will return to my setup in detail in another tutorial. In my case, I’m using Shelly 3EM to submit the data via Shelly integration in Home Assistant. After setting up my Energy Dashboard, I could see all the fancy graphs of how my electricity is being used.

There is so much more data, you could display than the typical energy dashboard presents in Home Assistant, so the individual configuration of what you’d like to see on your XIAO 7.5″ ePaper Panel is down to your imagination and .yaml configuration.

Energy consumption dashboard

As I cannot simply display HA dashboard on XIAO 7.5″ ePaper Panel, I had to decide what features I want to be present on my ePaper display and how I would like the layout to look. I started with examples from the SeeedStudio tutorial to confirm that everything is working as expected, and I can send the data from Home Assistant to my smart display.

My next step was to select all the datapoints I want to display on my little display, then import them as text/numerical values to confirm that everything is working as expected. This was one of the more

Home Assistant changes

There is more than one way to skin the cat, as they say, but in my case, I used Home Assistant helpers to collect and process some data for my display. If you want to use my project as a template (or as is), take a closer look at the ESPHome .yaml file shared at the end of the article. I did my best to describe it in the comments. It’s important that you name your sensors/helpers in HA the same way I have, or trace all changes in the file to reflect your HA naming convention.

Weather as fonts

To display a fancy icon on my XIAO 7.5″ ePaper Panel, I needed to upload extra fonts, define the characters and map conditions to icons available to me. In my project I used the following fonts:

• gfonts://Inter@700
• Roboto-Regular.ttf
• NotoEmoji-VariableFont_wght.ttf

Search for them online, and use an Add-on called File Editor to upload fonts to the ESPHome folder:

The configuration .yaml will take care of everything else for you. As long as you have weather available in your Home Assistant, that is. Note that some fonts don’t have all icons/emojis, so you have to specify special glyphs in the font section of the file.

Day/Date

It turns out that setting up the date and day was a little more complicated than I expected. In the end, I created a small template for configuration.yaml that uses HA to grab these for me and store them with exposed variables:

template:
  - sensor:
     name: "Current Date"
     unique_id: current_date
     state: "{{ now().strftime('%Y-%m-%d') }}"
     icon: mdi:calendar
  - sensor:
     name: "Current Day of Week"
     unique_id: current_day_of_week
     state: "{{ now().strftime('%A') }}"
     icon: mdi:calendar-week

To use that, I created two helpers in HA that inherit the data when set (sensor.current_date, sensor.current_day_of_week). If you are going to change the name of these, you’ll have to update the entries in ESPHome .yaml. I used a shortcut and defined time on my dashboard using just ESPHome option.

Usage/Cost bar chart

Bar graphs are not available in ESPHome, so I had to fake one. A bunch of cleverly formatted squares pretended to be a bar chart, and a system of helpers created in HA, brings the cost/usage data to my XIAO 7.5″ ePaper Panel.

I created helpers for an Electricity Meter, and seven helpers to represent each day (input numbers), added one with a standing charge and tariff cost. These are filled with data based on HA automation I added to automations.yaml using File Editor:

alias: "Update Weekly Energy Record"
trigger:
  - platform: time
    at: "23:59:00"  # Or any time after your energy resets
condition: []
action:
  - variables:
      weekday: "{{ now().weekday() }}"  # 0 = Monday, 6 = Sunday
  - choose:
      - conditions: "{{ weekday == 0 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_monday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 1 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_tuesday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 2 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_wednesday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 3 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_thursday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 4 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_friday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 5 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_saturday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
      - conditions: "{{ weekday == 6 }}"
        sequence:
          - service: input_number.set_value
            data:
              entity_id: input_number.grid_energy_sunday
              value: "{{ states('sensor.energy_grid_meter') | float }}"
mode: single

The ESPHome .yaml file takes care of the values for me and calculates the power consumption, cost and size of the bars. You can set your standing charge, energy price per 1kWh in HA directly, and even track changes of these over time. At some point, I may see if I can highlight the day of the week that we are currently on, but that’s a future me problem.

Usage chart

Thankfully, ESPHome comes with support for simple charts, and I was able to use the sensor data to plot the solar power generation, solar prediction (very hour) and grid consumption. As XIAO 7.5″ ePaper Panel is black and white, I set different thincknesses for each line, and added dashed line for preditions to distinguish one from another.

I also defined the size and grid density of the chart to stay within my max historical readouts. You can change these if your lines often stray outside of the display area. To keep my labels organised, I defined variables responsible for chart origin, which helps with moving everything together when playing with layouts.

Hours of aligment

I couldn’t find really good tools for checking what things would look like on my dashboard. I spent some time tweaking the layout, flashing the firmware and noting the edits I have to make in the next build. You could try this small UI builder to help you out a little, unfortunately it doesn’t support 800×480 resolution. If you have some great tools for this, I’m all ears!

Wishing for more?

This dashboard is good enough, but I know for sure my journey with the XIAO 7.5″ ePaper Panel is not stopping there. I already saw the options of adding additional pages to the display to detail even more information about my smart home.

The XIAO 7.5″ ePaper Panel doesn’t have any buttons that can be used to interact with the dashboard, but that doesn’t have to stay that way. After all the XIAO module only uses a couple of pins to populate the SPI interface, leaving other pins available for tinkering. There is absolutely nothing stopping me (other than having time and the knowledge) from adding extra buttons, built-in temperature sensors and more.

ESPHome already have an extended library of devices that could be connected to the XIAO board inside, and my XIAO 7.5″ ePaper Panel enclosure is 3D printed, with the enclosure files being available online for print and modification.

Final thoughts

I had a really good time creating this dashboard for my Home Assistant instance. It shows the data I care about, and the dashboard can be modified at any time without much effort. XIAO 7.5″ ePaper Panel is a perfect device to turn into something like that. Check out the SeeedStudio page and let me know if you are getting one for yourself! Let me know in this Reddit thread what changes you would introduce to the dashboard. I may add the best ideas to my To-Do list.

🆓📈💵 – See the transparency note for details.