Taubman Architecture Ball - Renaissance Installation

i. Context

Fresh off EECS 485, I volunteered as a developer and designer for Taubman College’s annual celebration, the Taubman Architecture Ball. The committee wanted its first digital installation. The year’s theme was the renaissance. Our group believed that AI felt like a new renaissance of its own, so we designed a nighttime, AI-inflected experience where guest sentiment shaped the visuals in real time.

I built the web application guests interacted with. Partner Jack Bernard used TouchDesigner and Python to interpret sentiment and drive the display. The web app captured inputs, streamed them to our pipeline, and the installation responded on site. Students engaged, asked questions, and a lot of new attendees were impressed that the installation reacted to the event’s mood.

ii. System Design

We built the app with Next.js and TypeScript, using TailwindCSS to keep the design clean and responsive. The main goal was to make it simple for guests to open the site on their phones and quickly share how they were feeling. The interface was lightweight and dark-themed to match the nighttime “renaissance” vibe of the event.

Behind the scenes, Firebase handled most of the heavy lifting. Every time someone submitted a reaction, it was written straight into Firestore, which let us see updates in real time without running a custom server. TouchDesigner was hooked up to listen to those database changes, and my partner Jack used Python scripts to score the sentiment and translate it into visuals projected around the venue.

We relied on Firebase Authentication and Firestore rules to keep things safe and to make sure only valid submissions got through. Combined with HTTPS and some input checks, the setup was secure enough for a public event but still light enough to run smoothly all night. The end result was a system where a guest’s mood could turn into color and motion on the walls within seconds.

iii. Implementation Notes

• Firebase backend services: used Firestore and Authentication to securely store submissions and manage user sessions, removing the need for a custom server and letting the Next.js app stay lightweight while still handling real-time updates.
• Socket bridge: a small Node relay broadcasted sanitized payloads. TouchDesigner connected as a client and consumed messages with a stable schema.
• State and retries: optimistic UI for some snappy feedback, with auto-retry on transient failures and a graceful offline banner if connectivity dipped (just in case).
• Styling: TailwindCSS with a dark palette, subtle animations, and large tap targets for crowded floor conditions.

The result was a great! A resilient pipeline that kept latency low and the visuals responsive to the crowd’s mood. The TAB-goers could see the installation evolve as the night progressed, which fit the renaissance theme and the AI motif, which we found to be very exciting!

iv. On-Site Deployment and Response

We tested the full loop before doors opened and monitored error rates during the event. The installation drew steady participation (from naturally guided experiences), and the committee received positive feedback on how the display felt timely and personal. The flow held up without manual restarts, and sentiment shifts were visible on the projection within seconds.

Figure: Attendee is naturally guided to scanning QR code

Figure: Attendee interacting with the app

Figure: Late-night crowd and ambient visuals overhead