Smart Fu - Digital Door Guardian
Traditional Chinese Fu into an Interactive Visitor Notification System
Final Result
Door Guardian - FU is an interactive door decoration inspired by the traditional Chinese Fu (福 character and door guardian culture).
Most of the time it behaves like a quiet decorative object. The 7.3 inch color ePaper display shows Fu artwork, seasonal posters, or personalized graphics with a paper-like calmness. When a visitor arrives, they do not need to press a loud doorbell. They touch the small sensor near the decoration, the OLED greets them with " Hello My Friend"
At the same time, the touch device sends a WiFi message to a local Node.js server. The web dashboard shows a visitor notification, and the ePaper display switches to a visitor poster. In that moment, the traditional Fu is "awakened" and becomes a digital door guardian.
The finished project combines:
- Chinese cultural heritage
- digital fabrication
- custom electronics
- embedded programming
- WiFi communication
- a web dashboard
- physical interaction
- ePaper visual output
The result is not a commercial smart doorbell. I see it more as a small calm-technology object: useful when someone arrives, quiet when nothing is happening, and still recognizable as a cultural decoration.
Why I Made It
Growing up in China, Fu has always been part of my memory of home. Every Spring Festival, my family would write or hang a Fu decoration on the front door. It symbolized good fortune, welcome, and protection. Traditionally, Chinese households also placed Door Guardians at the entrance to watch over the home and greet visitors.



Last year, I hand-wrote a large Fu character with ink on special paper.



I liked it a lot, but after one year the color had faded. That made me ask a very simple question:
How to make a Fu that does not fade?
At first, this sounded like only a material problem: replace paper with LEDs or a screen. But the more I worked through Fab Academy, the more I realized the interesting part was not only the display. It was the relationship between the object, the door, the person inside, and the visitor outside.
I often work with headphones on, in that focused state I can easily miss someone knocking at the door. I wanted a gentle way for visitors to announce themselves without adding a loud, technical-looking doorbell.
So my question became:
Could a traditional Fu decoration still carry the feeling of welcome and protection, while also becoming useful in modern daily life?
These references shaped the project visually and emotionally. The round Fu, my handwritten Fu, and the square door decoration each carried a different feeling: festival, memory, and threshold. I wanted the final object to keep that feeling instead of becoming only a gadget with a Chinese character attached to it.
Concept Development
My first idea was much simpler: a smart Fu decoration that could display the character, time, and weather. I also imagined a pull-ring interaction, like an old lamp. One pull could show time, another pull could show weather.
This early concept was useful because it gave me a visual direction, but it was not yet a strong interaction. It felt like an indoor information object. The turning point came after conversations with instructors and friends. The repeated question was:
What if it could interact with visitors?
That question moved the project back to the door, where Fu already belongs. Instead of asking the object to show many types of information, I focused on one meaningful moment: someone arrives, touches the Fu, and the home becomes aware of them.
The project evolved in spirals:
- Decorative Fu object: focus on the traditional symbol and visual identity.
- Smart Fu display: add a digital screen and poster logic.
- Interactive Fu: add touch as the visitor input.
- Door Guardian: connect the outside touch to an indoor notification.
- Two-board system: separate visitor interaction from ePaper display control.
- Networked dashboard: let the web interface monitor device state and manually switch posters.
Each spiral made the project less like a decorative screen and more like an interaction system.
System Overview
The final system has three connected modules.
Module 1 - Visitor Interaction
This module sits near the entrance and is handled by a XIAO ESP32-C3.
It includes:
- custom XIAO ESP32-C3 board
- Grove touch sensor connected to
D2 - 128 x 128 Grove OLED display
- WiFi connection to the local server
The OLED shows WELCOME, TOUCH ME, and the WiFi/IP status. When touched, it displays Hello / My Friend for two seconds and sends an HTTP POST request to the server.
For the test part, I used Hello Alison instead.
Module 2 - Network Hub
A local Node.js Express server acts as the communication hub.
It provides:
GET /api/statusfor the web dashboard and S3 boardPOST /api/statusfor touch events and poster changesPOST /api/resetto return to poster 1- static hosting for the dashboard and poster images
- online/offline tracking for the C3 and S3 devices
When the C3 sends status=coming, the server changes currentPoster to 3, records lastEvent as touch, and updates the dashboard state.
Module 3 - Ambient Display
The main Fu display uses:
- EE04 ePaper driver board
- 7.3 inch Spectra 6 color ePaper display
- three prepared poster bitmap arrays
The EE04(XIAO ESP32 S3 Sense inside of it) polls the server every five seconds using GET /api/status?device=s3. It only refreshes the ePaper when the poster ID changes. This state-lock behavior matters because ePaper refresh is slow and repeated refreshes can reduce the life of the display.
Interaction Flow
flowchart LR
A[Visitor touches sensor] --> B[XIAO ESP32-C3]
B --> C[OLED shows Hello / My Friend]
B --> D[POST status=coming]
D --> E[Node.js server]
E --> F[Web dashboard toast alert]
E --> G[currentPoster = 3]
G --> H[EE04 polls status]
H --> I[7.3 inch ePaper switches to visitor poster]
The same server also supports manual poster selection from the dashboard. This helped during debugging because I could test the S3 and ePaper without touching the C3 every time.
Poster and Interface Design
The ePaper display normally shows Fu-style artwork. I prepared three poster states:
- Poster 1: calm Fu blessing poster
- Poster 2: alternate festive Fu poster
- Poster 3: visitor notification poster



The dashboard: I used a warm orange-red palette, rounded cards, poster thumbnails, device status pills, and a toast notification. The most important thing is that it shows the system state clearly:
- which poster is active
- whether the C3 touch board is online
- whether the S3 display board is online
- whether the last event came from touch, web control, or reset
Physical Design
From Flat Decoration to Real Object
The physical object began as a simple diamond-shaped Fu display. I wanted the overall silhouette to feel familiar, close to the square decorations that are often rotated 45 degrees and pasted on doors.
The first physical questions were simple but stubborn:
- How big should the ePaper opening be?
- Where should the OLED and touch sensor live?
- How can the structure hang vertically?
- How can I still access the electronics after assembly?
- How can the front look decorative while the back remains serviceable?
The answers did not arrive in one design. They arrived through repeated misfits.
Laser-Cut Frame Iterations
The front frame was laser-cut from plywood. It includes:
- a central opening for the ePaper display
- finger-joint style edge slots
- holes for hanging or mounting
- a diamond-shaped Fu decoration proportion
The first version ignored real assembly tolerances. It looked correct on screen, but the parts could not fit together.
The second version introduced directional panels, but many pieces looked visually identical after cutting. I kept assembling them incorrectly. That failure was not dramatic, but it was very annoying, and it taught me that orientation markings are part of design, not an afterthought.
Eventually I added clearer assembly references and made several cut versions before getting an acceptable fit.
CAD and Holders
For the internal parts, I designed and printed multiple custom holders:
- ePaper holder
- OLED holder
- touch sensor holder
- decorative cloud-pattern support
At first, I designed the holders almost like small boxes for a table setup. Then I realized the final object had to stand vertically on a door or wall. That changed everything. Gravity, cable routing, display orientation, and screw positions all became more important.
In total I printed six versions of the ePaper holder, several OLED support revisions, and several touch sensor support tests.
Rear Support and Mechanical Integration
One of the biggest mechanical challenges was connecting the wooden front panel with the 3D-printed internal structure. Glue alone felt too fragile and too final. If something failed, I wanted to be able to open or repair the object.
During molding and casting week, I made a decorative ruyi cloud pattern. Later, that cloud-pattern box gave me a better idea for the rear support. I reused the visual language of the cloud as a structural element behind the display.
The support included four screw mounting points. By drilling matching holes in the wooden panel, I could fasten the ePaper enclosure mechanically instead of depending completely on glue.
This was one of the moments where a weekly assignment came back into the final project in an unexpected way. A decorative experiment became a structural answer.
Electronics Development
First PCB: Learning the Base
My PCB work started before the final interaction was fully defined. The first board was closer to an environmental sensing and Hello World board. It helped me practice:
- schematic design in KiCad
- footprints and routing
- ERC and DRC checks
- trace width decisions
- milling and soldering
- testing with LED and button code
The first board successfully collected temperature and humidity data, and the onboard indicator LED worked. That gave me confidence that I could move beyond a breadboard demo.
But the board was not perfect. One revision had a missing ground connection, so the LED never illuminated. At first I looked at the code, the resistor, and the LED orientation. Eventually the real problem was simpler and deeper: the net was not connected. That mistake made me much more careful about checking every ground and power path before fabrication. And the second try is perfect:
Thrid PCB: Matching the Final Interaction
As the project changed from environmental sensing to visitor interaction, the original PCB architecture no longer matched the needs. I redesigned the board so the XIAO ESP32-C3 could expose the pins needed for:
- touch sensor input
- OLED display connection
- WiFi communication
- future expansion
This was a good example of Fab Academy iteration. The first board was not a waste; it taught me the method. The final project board designed more neat and useful:
Embedded Programming
C3 Touch Sender
The C3 firmware has four main jobs:
- Connect to the 2.4 GHz WiFi network.
- Show an idle screen on the OLED.
- Detect touch on
D2. - Send
POST /api/statuswithstatus=coming.
I added debounce and cooldown timing so one long touch does not create many repeated events. The OLED gives immediate feedback to the visitor, while the WiFi request triggers the rest of the system.
The touch logic also carries lessons from input device week. With the DHT11 sensor, I spent a lot of time chasing problems caused by wrong GND wiring, loose jumper wires, and pin confusion. For the final touch sensor I tried to debug more calmly: check pinout, check power, check ground, print values, then add the network layer.
EE04 ePaper Controller
The EE04 firmware polls the server every five seconds. If the poster ID changes, it updates the display. If the ID is the same, it does nothing.
That sounds simple, but the ePaper was the hardest debugging part of the final system.
The first display examples worked, so I assumed poster switching would be straightforward. It was not. The display could show one poster, then hang during the second update. The board looked like it was repeatedly failing WiFi, but the real root cause was deeper: the ED2208 ePaper controller did not wake reliably after the library's sleep/update cycle.
I tried changing wake macros and reinitializing the display. The reliable solution was to bypass the problematic library update/sleep path and manually send the SPI command sequence:
0x04 power on
0x10 send image data with color mapping
0x12 refresh display
I also kept the display awake instead of putting it into deep sleep, and disconnected WiFi during the display push to avoid conflicts during the refresh.
This was the technical knot of the project. It also changed my respect for ePaper. It looks quiet from the outside, but the refresh pipeline is very specific.
Node.js Server
The server is the bridge between the two microcontrollers and the browser. It stores one shared state object:
currentPoster
lastEvent
lastEventTime
devices.c3
devices.s3
The important server behavior is:
- C3 touch event sets
currentPoster = 3 - web poster click sets
currentPoster = 1,2, or3 - reset returns to poster 1
- S3 identifies itself with
?device=s3 - devices are marked offline if they have not been seen recently
This local-server approach kept the system inspectable. I could open the browser, check JSON responses, and see whether the bug was in the C3, server, dashboard, or S3.
Fabrication and Weekly Spirals
This final project is really a bundle of smaller weekly lessons. Some weeks contributed a finished part. Other weeks contributed a failure pattern that I recognized later.
Computer-Aided Design
In CAD week, I explored Fu compositions in Inkscape and Onshape. I learned that a clean vector drawing is not only for appearance. It affects laser cutting, 3D printing, and later image preparation. The Fu character became the visual identity, the display composition, and the logic of the touch interaction.
3D Printing
In 3D printing week, I learned that a shape can look connected on screen but still fail as a physical object. A Fu print separated because the strokes were not structurally connected. Adding a continuous backing layer made it printable. This lesson returned when I designed display holders: visual parts need structural continuity.
Input and Output Devices
The input week taught me to debug sensors physically before blaming code. The output week taught me that a screen lighting up is not the same as a screen working correctly. I saw noisy OLED output, LCD issues, and display library problems before reaching the final ePaper system.
Those frustrations became useful habits:
- test the smallest working example first
- confirm the board and pin definitions
- use Serial Monitor before guessing
- add one system layer at a time
Networking
Networking week gave me the basic architecture for the final project: one device sends or exposes a state, another device or browser reads it. The most practical lesson was that ESP32 boards need 2.4 GHz WiFi. When the board is trying to connect to the wrong network band, it can look broken even when the code is fine.
Molding and Casting
Molding and casting gave the project both a design language and a cautionary story. I designed ruyi cloud patterns and a circular Fu mold. I also made a very clear chemistry mistake: I poured silicone without adding curing agent. Later I repeated a similar mistake with resin hardener.
That sounds unrelated to a networked door guardian, but the lesson is the same: some systems have essential pairings. Silicone needs catalyst. Resin needs hardener. Electronics need ground. WiFi needs the right band. ePaper needs the right refresh sequence.
Main Failures and Fixes
Laser Cutting Tolerance
The first frame could not be assembled. I had designed the pieces as if the material and laser cut were mathematically perfect. They were not. I adjusted the fit and kept testing with physical parts.
Assembly Orientation
Several wooden panels looked almost identical after cutting. I repeatedly assembled them in the wrong direction. The fix was to add clearer orientation references and treat assembly guidance as part of the design.
Missing Ground
One PCB revision had a missing ground connection. The LED did not work because the electrical path did not exist. This was a quiet failure, but an important one.
Touch and OLED Integration
The touch sensor and OLED worked well separately on XIAO Extension Board, but failed to worked together using dupont thread. I had to confirm the pin behavior, also the OLED font sizes that need actually fit the 128 x 128 screen. At one point WELCOME was too large and the last letter was cut off.
ePaper Second Refresh
The ePaper display could show an image once, then hang on later refreshes. The final fix was not cosmetic. I changed the control approach by manually pushing data and refresh commands instead of relying on the library sleep/wake cycle.
Dashboard Repeated Toast
The web dashboard kept showing the visitor toast even when there was no new touch. The fix was to compare the current event with the previous known event and only animate on transition.
Mechanical Integration
Many holders fit their own components but failed when installed in the full object. This was the difference between designing a part and designing an assembly. Cable routing, screw access, display orientation, and vertical mounting only became obvious when everything was together.
What I Designed and Made
I designed and fabricated:
- the interaction concept and visitor flow
- the Fu poster graphics for the ePaper display
- the laser-cut wooden front frame
- the ePaper holder and rear support structure
- OLED and touch sensor supports
- a custom ESP32-C3 PCB workflow
- the C3 touch/OLED/WiFi firmware
- the S3 ePaper poster-switching firmware
- the Node.js server and API
- the browser dashboard
- image conversion workflow for the ePaper posters
The project uses existing modules where that made sense, especially for the ePaper driver and sensor hardware, but the system integration, enclosure, interaction logic, dashboard, and final behavior were designed for this project.
Materials and Components
Main electronics:
- Seeed Studio XIAO ESP32-C3
- Custom PCB for the C3 interaction board
- Normal touch sensor
- Grove 128 x 128 OLED display
- Seeed EE04 ePaper driver board
- 7.3 inch Spectra 6 color ePaper display
- Jumper wires, headers, screws, and USB power
Fabrication materials:
- plywood for the laser-cut frame
- PLA filament for holders and support parts
- resin and silicone from molding/casting experiments
- screws for the mechanical mounting points
Software:
- Arduino IDE / Arduino toolchain
- KiCad
- Inkscape
- Onshape
- Node.js
- Express
- Tailwind CSS
- Python image conversion script
- Seeed ePaper / display libraries
Evaluation
The final system was evaluated by testing the full interaction loop:
- Start the local Node.js server.
- Open the dashboard in the browser.
- Power the S3 ePaper board and confirm poster 1 appears.
- Power the C3 touch board and confirm the OLED idle screen appears.
- Touch the sensor.
- Confirm the OLED shows
Hello / My Friend. - Confirm the server receives the event.
- Confirm the dashboard shows the visitor toast.
- Confirm the ePaper switches to poster 3.
- Use the dashboard reset button to return to poster 1.
The full loop works. It is still a prototype, but it proves the central idea: a visitor can interact with a culturally familiar object, and the object can quietly notify the inside system.
What works well:
- touch event triggers the network flow
- OLED gives immediate local feedback
- dashboard can switch posters manually
- S3 updates the ePaper only when the poster state changes
- device status is visible on the dashboard
- the physical frame communicates the Fu decoration idea
What still needs improvement:
- the internal wiring could be cleaner and more robust
- the enclosure could use a more polished rear cover
- the touch area should be better integrated into the visual design
- the ePaper refresh remains slow, so interaction timing must respect it
- the server currently runs locally, not as a long-term deployed service
- WiFi credentials are still hardcoded in the prototype firmware
Bill of Materials
This is the approximate final-project BOM. Exact prices depend on supplier and local stock.
| Item | Quantity | Purpose |
|---|---|---|
| XIAO ESP32-C3 | 1 | Touch sensing and WiFi event sender |
| XIAO ESP32-S3 Plus | 1 | ePaper display controller |
| Custom PCB | 1 | Main C3 interaction board |
| Grove touch sensor | 1 | Visitor input |
| Grove 128 x 128 OLED | 1 | Local visitor feedback |
| EE04 ePaper driver board | 1 | Driver for 7.3 inch ePaper |
| 7.3 inch Spectra 6 ePaper display | 1 | Main ambient Fu display |
| Plywood sheet | 1 | Laser-cut front frame |
| PLA filament | As needed | 3D-printed holders and supports |
| Screws / headers / wires | As needed | Mechanical and electrical assembly |
| USB power / power bank | 1-2 | Prototype power |
Project Files
Paths below are repository-relative. In GitLab, open a file and use Download or Raw, or clone the repo to get everything.
Final implementation files:
| What | Link |
|---|---|
| C3 touch sender firmware | c3_touch_sender.ino |
| S3 ePaper poster firmware | EE04_S3_Poster.ino |
| S3 driver configuration | driver.h |
| Poster bitmap arrays | images.h |
| Node.js server | server.js |
| Web dashboard | static/img/interface/index.html |
| Poster conversion script | convert.py |
| Windows quick-launch script | start_server.bat |
| Serial debug helper | read_serial.py |
| Earlier touch/OLED test | helloalison-touchsuccess531.ino |
| 7.3 inch ePaper bitmap example | Bitmap_07inch30.ino |
| Fu box frame v5.0 (SVG) | FU BOX 5.0.svg |
| Fu box frame v5.0 (DXF) | FU BOX 5.0.dxf |
| Round Fu mold positive (STL) | 圆形福-3D图.stl |
Related weekly documentation:
Final presentation assets:
- Summary slide (
presentation.png) - Presentation video (
presentation.mp4) - Final project compressed video (MP4)
- Final project compressed poster (PNG)
Implications and Future Development
This project makes me think differently about smart home objects. Many smart devices begin from function and then try to look domestic afterward. Door Guardian - FU begins from a domestic and cultural object, then asks what kind of function belongs there.
Possible future directions:
- stronger enclosure and cable management
- battery power or a safer permanent power design
- more seasonal Fu poster sets
- a mobile notification option
- integration with a soft indoor light
- better weather/time poster modes
- a more hidden touch area inside the Fu surface
- AI-generated festival greetings or visitor messages
The most important future improvement would be making the system feel even less like separate modules. In the final prototype, I can still see the seams between wood, holder, board, display, and dashboard. The next version should feel more like one object.
Final Reflection
At the beginning, I thought I was making a smart Fu decoration. By the end, I understood the project more as a conversation between culture and technology.
The Fu character carries memory, blessing, and welcome. The touch sensor gives it a small ritual. The OLED answers the visitor immediately. The server carries the message indoors. The ePaper display changes slowly, almost like a paper sign being replaced. The dashboard makes the invisible network visible.
I also learned that interaction is not only about adding sensors. It is deciding what should happen, when it should happen, how strongly it should respond, and what feeling the response should create. I did not want the visitor to feel like they were pressing a machine button. I wanted the action to feel gentle: touching a Fu, sending a greeting, waking the guardian.
The hardest parts were not always the most impressive-looking parts. A missing ground, a wrong WiFi band, a too-large OLED font, a repeated toast, and an ePaper sleep problem each stopped the project in a different way. At the time, these mistakes felt like delays. Looking back, they are the actual structure of the project. Each failure forced the next spiral.
Door Guardian - FU is still a prototype, but it represents the kind of maker I want to become: someone who can connect personal culture, physical form, electronics, and software into one object that feels meaningful, not only functional.