A division of Johnson & Johnson, one of the world’s largest and most diversified healthcare corporations. The medical devices group designs and manufactures innovative surgical, orthopedic, and interventional solutions used by healthcare professionals in over 60 countries.
Interactive Photo Mosaic for Johnson & Johnson Medical
I built an interactive photo mosaic application for Johnson & Johnson Medical at the European Academy of Dermatology and Venereology (EADV) conference.
The idea was: let attendees take professional photos at the booth and watch them appear instantly on giant 4K mosaic displays — turning a standard exhibition setup into a fun, social experience that kept people coming back.
The Challenge
The activation needed to:
- Attract and engage dermatology professionals
- Create shareable, memorable moments
- Run smoothly on touch-enabled kiosk hardware
- Handle hundreds of photo uploads in real time
- Look great on 4K displays
- Work across multiple screen sizes (from kiosks to large video walls)
- Run offline, while still collecting analytics and syncing data later
I initially looked into AI-generated mosaics, but they weren’t ideal for a live, time-sensitive event. A custom grid-based system gave me better control, reliability, and visual consistency.
The Solution
I built a full-stack web application using FastAPI (Python) for the backend and vanilla JavaScript for the frontend, optimised for touchscreens, 4K output, and real-time updates.
Backend
- FastAPI + SQLAlchemy
- SQLite for session and offline data storage
- Background task queue for image processing
- Real-time mosaic generation and incremental updates
- Email delivery service integration
- Local caching + sync mechanism for analytics when back online
Frontend
- Responsive HTML5/CSS3 layout that scales from kiosks to large displays
- Vanilla JS for UI logic and animations
- WebRTC for capturing photos directly in-browser
- Custom virtual keyboard for touchscreen email input
- Real-time mosaic updates with smooth transitions and auto-rotation
Key Features
Live Multi-Page Mosaic
- Supports up to 350 photos per 4K page (25×14 grid)
- Rotates pages every 30 seconds
- Adds new photos instantly without interrupting the display
- Dynamically resizes for different resolutions and aspect ratios
Offline + Analytics
- Operates fully offline during the event
- All photos, sessions, and analytics stored locally
- Data syncs automatically when an internet connection is restored
Project Gallery
