This chapter details the technical and conceptual evolution of the Connect project, from its initial ideation to the final tested prototype. It outlines the design choices, system architecture, and iterative development required to transform a standard metro carriage into an interactive, collaborative canvas that challenges digital isolation.

It covers:

• Ideation & Concept: The transition from identifying the core problem of digital passivity to defining the metaphors and the two-phase interactive solution (real-time ambient light tracking and delayed asynchronous voice messaging).
• Design: The visual and experiential design principles, focusing on invisible technology, dynamic color-blending algorithms, and the minimalist user interface of the web platform.
• Structure: The physical framework of the project, encompassing structural drafts, material selection, detailed technical drawings, and 3D models with stress analysis.
• Smart System: The core technological architecture, detailing the hardware integration of touch sensors and RGB LEDs, alongside the software use cases, platform selection, and component diagrams.
• Packaging: The conceptualization, technical drawings, and structural analysis of the installation's packaging.
• Prototype: A comprehensive breakdown of the modifications made during the physical build, documenting necessary adaptations in structure, updated hardware schematics, and software code flowcharts.
• Tests & Results: The validation of the system through rigorous hardware functionality checks (Pass/Fail) and software testing, including performance metrics and System Usability Scale (SUS) evaluations.
• Summary: Concluding reflections on the development and testing phases, bridging the technical outcomes to the final project conclusions.

Our ideation process began by collecting the main friction points of current digital habits and identifying a broader problem in today’s society: isolation, passivity, and a lack of real-world feedback. In today’s society, digital technology often leads to isolation rather than connection. Many people spend a large amount of time consuming content alone on their smartphones or computers, interacting more with screens than with each other. Social media and digital platforms often promote passive consumption, comparison, and distraction, which can negatively affect mental well-being and reduce opportunities for genuine self-expression. Instead of encouraging creativity and real-life interaction, technology frequently replaces physical social experiences with shallow virtual ones. As a result, people often feel more disconnected, less creative, and less involved in their communities.

We then developed several metaphors for the connection.

• The City's Veins: The metro network acts as the circulatory system of Porto.
• Human Energy: The passengers' interactions provide the heartbeat and rhythm.
• Mirrored Networks: The LED light trails on the ceiling visually reflect the actual metro lines of the city.
• Flowing Connection: Distributing life, emotion, and stories throughout the underground.

From this process, our final direction emerged. We focused on the handrail as the main point of interaction because it is a universal and necessary point of contact in a moving train. We moved away from screen-based interaction and instead turned to ambient media. The idea was to create a “visual echo” of a person’s presence. We realized that by blending colors on the ceiling, we could visually represent the “melting” of social barriers.

Phase 1:


On the metro, you touch a handrail. The handrail is a tube that contains a sensor and a light. The spot where you touch the pole lights up in a color: your color. Your color then travels visibly through the pole up to the ceiling of the metro. On the ceiling of the metro there are LEDs. Your color appears on the ceiling through these LEDs. If another person touches a different pole, their color also appears on the ceiling, and your colors blend together.

Phase 2:

Near the exit doors, there is a QR code that creates a bridge from the visual interaction to a more personal level. After scanning it, a minimalist webpage opens with two main options: “Send” or “Read” If a passenger chooses the sending option, they are prompted with a reflective question such as “What is an experience you learned a lot from, and why?” encouraging them to write a short message with their story or a piece of personal advice. Alternatively, the “Read” option allows passengers to explore a message previously left by other travelers. An important detail is the accompanying note asking users to send or read the messages only after leaving the train. This intentional delay ensures that passengers remain present during the ride and enjoy the shared physical experience, rather than immediately retreating back into their smartphones. This extension continues the idea of connection between strangers and creates a deeper human exchange, while still keeping the focus on the shared space of the metro.

In our design, we focus on making the technology invisible and the experience intuitive. During the ride, no smartphones or similar devices are required: simply holding the handles turns the metro journey into an adventure.

At the heart of the visual design is the interactive color mixing.

• Individual Identity: Each handrail (or each user) is assigned a specific color upon initial contact.
• Dynamic Convergence: As soon as multiple people touch different poles, the light streams on the ceiling migrate toward one another.
• Blending Algorithms: When two colors meet (e.g., blue and red), a new mixed color (violet) is created at the intersection. The more people participate, the more complex and vibrant the visual ecosystem on the ceiling becomes. This visually symbolizes how the presence of each individual alters the collective whole.

User Interface for the Message Page

The following Figur shows the 4 main screens of our web application. Screen one is the start screen, it includes the logo a two buttons to decide between “Send Message” and “Read Message”. In the second screen the people can type their messages and publish them. In screen three they can see their own published message, and the last screen shows the message of another person.


The web interface, accessible via QR code, is designed in a minimalist style. After scanning the QR code, users are redirected to the web application's landing page. The CONNECT logo takes center stage here, accompanied by two clickable buttons that lead to the subsequent sections. Within the app, users can choose between composing a message for others or viewing messages written by the community. Our primary focus was to keep the application as simple as possible; we wanted to ensure that both young and old users can navigate it effortlessly. By eliminating the need for logins or complex navigation, we’ve made the experience accessible and time-efficient for everyone.

Figures 2, 3, and 4 present the evolution of the structural design across successive iterations. Each version reflects an increase in geometric precision, component integration, and manufacturability, progressing from early conceptual layouts to a fully defined enclosure suitable for system integration.

The transition from preliminary sketches to detailed structural drawings (see Figure 4) marked a key milestone in the project. At this stage, the spatial constraints of all subsystems were clearly defined, including the placement of electronic components, routing of wiring, and mounting strategy. This enabled the development of a specialized Bill of Materials (BoM), as presented in Table 1, where component selection was directly informed by mechanical, environmental, and regulatory requirements.

Three primary constraints shaped the structural design: enclosure material selection and regulatory compliance, integration of communication hardware within a constrained geometry, and accommodation of power distribution components.

Enclosure Material and Regulatory Complianc

The enclosure design aims to ensure compatibility with metro environments, where safety requirements are critical. In particular, EN 45545-2 imposes strict constraints on material flammability and smoke emission. Initial concepts considered PLA due to its accessibility for rapid prototyping. However, due to its poor fire resistance, it is not suitable for real deployment. For this reason, the design considers Polyamide (PA) Rail as a future implementation material, as it meets railway fire safety standards. At the current prototype stage, this requirement is addressed conceptually, with the enclosure geometry designed to be compatible with such materials, while fabrication remains focused on accessible prototyping methods.

Mechanical Integration and Mounting

The structural design defines the placement and fixation of internal components, including PCBs, sensors, and power elements. Mounting points are incorporated to allow secure attachment of the PCBs using standard fastening methods (e.g., screws and standoffs), ensuring mechanical stability under vibration and movement conditions typical of public transport environments. The enclosure also considers accessibility for assembly and maintenance, allowing access to connectors and internal components without requiring complete disassembly.

Wiring and Internal Layout Considerations

Although detailed cable routing is not fully defined at this stage, the structural design accounts for basic wiring requirements. Dedicated entry and exit points for cables are considered, along with internal space allocation for routing. Particular attention is given to the separation of power and signal lines, in order to reduce potential electrical interference and improve system reliability. These considerations will guide future iterations of the design, where detailed routing and harnessing will be implemented.

Thermal and Environmental Considerations

The system includes components such as DC-DC converters and LED drivers, which generate heat during operation. At this stage, thermal management is addressed through basic passive strategies, including spacing between components and the potential inclusion of ventilation openings in the enclosure. Environmental protection (e.g., against dust and humidity) is considered at a conceptual level, with the enclosure intended to evolve toward a more sealed and robust design in future iterations.

The BoM presented in Table 1 reflects the current stage of the design, combining prototyping components with elements selected based on future deployment requirements.

While some components (such as enclosure materials) are specified with industrial standards in mind, others are selected to support rapid prototyping and testing. This hybrid approach allows validation of system functionality while maintaining a clear path toward a more robust, deployment-ready solution.

(iv) 3D model with load and stress analysis; (v) colour palette.

Hardware

Figure 5 presents the black box diagram, which includes all the major systems that will be used for our Smart System.

• Sensors: We use touch sensors integrated into the handrails. Unlike traditional buttons, these respond to the natural grip passengers use to stabilize themselves.
• LED Integration: RGB LED strips are installed along the connections of the handles and distributed across the ceiling panels. If necessary, a screen may also be mounted on the ceiling of the metro car to provide additional possibilities beyond the light strips, such as creating a changing environment with lighting adapted to the time of day. The placement and structure of the LEDs are clear and organized, allowing passengers to follow “their light” and trace the connection to other people.

Tables 2 and 3 presents a electricity consumption of our hardware. Usage of interrupt based architecture and deep sleep modes decreases power consumption of installation significantly when not used, which helps to keep the system sustainable.

The hardware implementation is realized through two dedicated PCB designs: the Sensor Node PCB and the Central Node PCB.

1. Sensor Node PCB

The Sensor Node PCB integrates all the components required for local sensing, processing, and communication. To convert physical pressure into data, the circuit utilizes a Velostat sensing interface in a voltage divider configuration. The detailed electrical connections are illustrated in the Sensor Node Schematic (Figure 6).

The node includes an ESP32-C3 Microcontroller (Wemos C3 Mini) and an MCP2551 CAN Transceiver. A 10kΩ potentiometer is included to allow manual calibration of the sensor's sensitivity range. To ensure network versatility, the PCB includes a selectable jumper for the 120 Ω termination resistor. This allows the same PCB design to be used at any position in the bus, enabling termination only on the physical end-nodes of the network to prevent signal reflections. As shown in Figure 7, the PCB is designed to be embedded directly into a box that would be attached to the handrail structure for minimal visual impact and high mechanical robustness.

Each Sensor Node PCB operates as an autonomous unit within the distributed system, transmitting processed sensor data through the CAN bus network to the Central Node.

2. Central Node PCB

The Central Node PCB acts as the main coordination unit. It is responsible for aggregating data from all sensor nodes and generating the corresponding visual output. The integration of the processing unit with the lighting infrastructure is detailed in the Central Node Schematic (Figure 8).

As shown in Figure 9, this PCB consolidates communication and actuation. It features a dedicated WS2812B LED Control port with a 330Ω resistor (R1) in series to protect the data line and ensure signal integrity.

This board processes all incoming CAN messages and translates them into real-time visual feedback through the LED infrastructure, ensuring synchronization between multiple sensor inputs.

Technical Implementation Details

A critical aspect of the design is the voltage compatibility between the ESP32-C3 (3.3 V) and the MCP2551 (5V). While the transceiver requires 5V to meet CAN standards, the ESP32-C3 GPIOs are not 5V tolerant. To address this, both schematics implement a voltage divider on the RX line, using a 1kΩ resistor in series and a 2kΩ resistor to ground. This scales the signal from the MCP2551 down to approximately 3.3V, ensuring safe operation. The TX line is driven directly at 3.3V, which the MCP2551 identifies as a valid logic “high.”

To ensure reliable data transmission within the electromagnetically noisy environment of a metro car, the system employs:

• Differential Signaling: Utilizing CAN High and CAN Low lines for high immunity to interference.

• Bus Termination: High-speed CAN networks require a 120 Ω resistor at both ends of the main bus to match characteristic impedance. By including a jumper on the Sensor Node PCB, the system can be easily configured during installation. Only the nodes at the extreme ends of the metro car's wiring will have the jumper closed, while intermediate nodes remain unterminated to maintain signal quality.

Software

The software architecture of the Connect and Share project facilitates real-time interaction and asynchronous digital connection across two distinct modes of use.

I. Use Cases and User Stories

Real-time Ambient Interaction operates through the smart device installed in the carriage. When passengers grip the handrail, sensors detect resistance changes via Velostat and the ESP32 triggers a corresponding color trail on the ceiling LED matrix. When data streams from multiple users intersect, the software executes color-blending algorithms to merge the inputs into a shared visual response.

Asynchronous Connection is mediated through a web application. Passengers scan a QR code to access a web interface, where the application fetches audio files from a cloud database for playback. The same interface allows users to record microphone input, which is then compressed and uploaded to a central repository for others to access.

II. Selection of Development Platforms

Platform selection (see Table 4) was guided by two priorities: low-latency hardware control and cross-platform accessibility.

III. Component Diagram

Figure 10 depicts the frontend flow of the Connect web interface. Starting from a QR code scan, the browser fetches and renders the website. The user is then presented with two interaction options: writing a message, which is transmitted to the backend, or reading a message, which triggers a random message fetch and displays it on screen.

Figure 11 illustrates the backend flow. IIncoming Hypertext Transfer Protocol (HTTP) requests are routed based on method: GET requests retrieve a randomly selected stored message and return HTTP 200, while POST requests pass the submitted content through a Machine Learning (ML) / Artificial Intelligence (AI) moderation check. Content flagged as harmful is rejected with HTTP 400; clean content is saved to the database and confirmed with HTTP 200.

Figure 12 shows the firmware logic running on the two ESP32-C3 nodes. The upper flow covers the sensor node: it enters deep sleep after setup and wakes on a touch interrupt, transmits the event over CAN bus, then resets and loops. The lower flow covers the actuator node: it similarly sleeps until a CAN bus data frame is received, drives the LED strip, and resets. Both nodes share the same interrupt-driven sleep cycle structure.

Present and explain the: (i) initial packaging drafts; (ii) detailed drawings; (iii) 3D model with load and stress analysis, if applicable.

Refer main changes in relation to the designed solution.

Detail and explain any changes made in relation to the designed solution, including structural downscaling, different materials, parts, etc.

Detail and explain any change made in relation to the designed solution. In case there are changes regarding the hardware, present the detailed schematics of the prototype.

Detail and explain any changes made in relation to the designed solution, including different software components, tools, platforms, etc.

The code developed for the prototype (smart device and apps) is described here using code flowcharts.

Below we can find in Table 5 the complete log for the validation phase. Each requirement must be marked as Pass (P) or Fail (F) based on the methodologies described in Tests..

Software tests comprise: (i) functional tests regarding the identified use cases / user stories; (ii) performance tests regarding exchanged data volume, load and runtime (these tests are usually repeated 10 times to determine the average and standard deviation results); (iii) usability tests according to the System Usability Scale.

This chapter documents the comprehensive lifecycle of the Connect project, tracing its evolution from initial conceptualization to a fully realized and validated prototype. The development process was driven by the goal of transforming a standard metro carriage into a collaborative, interactive canvas designed to counteract digital isolation.

The phase began with Ideation and Design, where the core problem of digital passivity was translated into a two-phase interactive solution: real-time ambient light tracking and asynchronous voice messaging. This conceptual foundation was supported by a Smart System architecture, integrating touch-sensitive hardware with custom color-blending algorithms.

To move from theory to reality, the Structure stage utilized detailed 3D modeling and analysis to ensure physical viability. Iterative adjustments were made to hardware schematics and software flowcharts to optimize performance.

Having detailed the technical execution and rigorous testing of the system, the following section synthesizes these results to provide final reflections on the project's impact and future potential.