A digital passport web app for the IBTSS 2026 Pre-Conference Workshop on AI in Higher Education. Participants register, visit workshop stations, scan QR codes to collect stamps, receive resources by email, and share a completion passport to LinkedIn.
Overview
IBTSS 2026 AI Learning Passport is a digital passport web app built for the IBTSS 2026 Pre-Conference Workshop, "AI in Higher Education: From Challenge to Opportunity," at Fort Hays State University. Participants register once, visit three AI workshop stations, collect a stamp at each by scanning a QR code, and finish with a shareable completion passport they can post to LinkedIn.
Demo Video
The Problem
Conference workshops with multiple hands-on stations have no easy way to track participant engagement or reward completion. Paper passports get lost, spreadsheets require manual check-ins, and there's no natural way for participants to receive follow-up resources or show off that they completed the workshop afterward.
The Solution
The passport gives each participant a persistent, personal record of their progress through the workshop, tied to real-time station check-ins and automated follow-up.
- Persistent Digital Passport is created on registration and lives at a unique, shareable URL (
/passport/[uuid]) that participants can revisit at any time to see their progress. - QR Code Stamp Collection lets each of the 3 stations display its own dedicated QR code; scanning it records a stamp against the participant's email, with duplicate scans handled gracefully via an "Already Collected" state.
- Automatic Email Delivery sends station-specific resources immediately after each stamp, and a separate completion email once all 3 stations are done.
- Visual Passport View renders a navy passport cover with a gold emblem and three stamp slots that fill in with color-coded, animated ink stamps as stations are completed, backed by a live progress bar.
- LinkedIn Share Flow unlocks after all 3 stamps are collected, letting participants add a personal reflection, preview the post in real time, and share directly via LinkedIn's share API.
My Contributions
I designed and built the entire application solo, from the Supabase schema (passports, stamps, station records with row-level security) through the Next.js App Router frontend. This included the registration flow, the per-station QR code generation and admin display pages, the stamp collection and deduplication logic, Resend-based transactional email delivery for both per-station resources and the completion email, the animated passport UI with progress tracking, and the LinkedIn share flow with real-time post preview.