Night Transit
Cobalt night, acid wayfinding and modular motion translate Berlin after dark into a legible product system.
Open participant product
Night Transit, end to end
One identity and a complete participant product contract: foundations, components, patterns, navigation, states, journeys, direct pages, accessibility, and portability.
Selected and only theme56 participant/public pages46 registered UI items
Identity
The Match / Quest wordmark stands alone in product chrome. The two-pin heart appears only as a dark symbol on the acid app icon.
Night Transit foundation
No alternative themes remain. Cobalt night carries the system; acid and signal pink identify direction and action.
Typography
Compressed display type and coded labels create energy; body text stays quiet around consequence.
Display · fluid 48–88
Meet face to face, not in a feed
Page title · fluid 36–60
What comes next
Body · 16–19
Thoughtfully hosted evenings where conversation comes first and every post-event choice remains private.
Transit label · 10–13
Friday · Kreuzberg · 19:30
Primitives
Controls keep a 44px minimum target, visible focus, explicit hierarchy, native semantics, and no color-only state.
Primary actionSecondary actionQuiet actionIcon buttonText fieldText areaSelectCheckboxRadioSwitchTabsFilter chipBadgeProgressSkeletonTooltipToastDialogSheet
Domain objects
Objects carry identity, status, authority, context, and one valid next action; they are never interchangeable generic cards.
Lea WinterKreuzberg
Sophie WeberNeukölln
Mara KleinWedding
Jonas MalikFriedrichshainProduct patterns
Repeated semantic workflows are owned once and composed differently for participant phone and desktop contexts.
Feedback choice
Would you meet Sophie again?
One private choice; a reveal only when it is mutual.
Owned object
Open tickets Ticket wallet
Confirmed, waitlisted, and attended places stay reachable from Home.
Public header
Owned pattern · responsive · keyboard specified
Public footer
Owned pattern · responsive · keyboard specified
Desktop rail
Owned pattern · responsive · keyboard specified
Mobile bottom navigation
Owned pattern · responsive · keyboard specified
Workspace switcher
Owned pattern · responsive · keyboard specified
Page heading
Owned pattern · responsive · keyboard specified
Filter toolbar
Owned pattern · responsive · keyboard specified
Booking inspector
Owned pattern · responsive · keyboard specified
Task queue
Owned pattern · responsive · keyboard specified
State rail
Owned pattern · responsive · keyboard specified
Timeline
Owned pattern · responsive · keyboard specified
Participant conversation
Owned pattern · responsive · keyboard specified
Feedback choice flow
Owned pattern · responsive · keyboard specified
Match reveal dialog
Owned pattern · responsive · keyboard specified
Destructive action
Owned pattern · responsive · keyboard specified
System states
Ten canonical states cover waiting, absence, interruption, authority, consequence, and recovery.
Keeping the useful context
Known information remains while authoritative details refresh.
Nothing here yet
The reason and next useful path stay visible.
The action did not complete
Current state is refreshed before a safe retry.
Connection interrupted
Saved details and drafts remain; mutation waits.
Authoritative confirmation
The resulting object and next action are ready.
Consequence before action
Authority, impact, confirmation, and recovery are explicit.
Responsive contract
Mobile and desktop share state and intent while composing navigation and work for their context.
ConcernPhoneDesktop
NavigationBottom destinations + compact role contextPersistent role rail + workspace switcher
TransactionsSingular, thumb-reachable actionTask and authoritative context side by side
OperationsPriority queue then drill-downDense list, decision, and context workspace
MessagesList or full-screen threadThread with agreement/profile context
Participant journey
Nine connected stages expose every necessary participant function without requiring the legacy page structure.
- 01Open stage
Discover
Public proposition, event search, filters, save, organizer context
- 02Open stage
Access
Register, verify, sign in, recover, resume intended task
- 03Open stage
Prepare
Profile wizard, photos, phone, preferences, public preview
- 04Open stage
Book
Free or paid checkout, waitlist, 3DS, cancellation and refund terms
- 05Open stage
Attend
Ticket wallet, QR, manual code, check-in and offline fallback
- 06Open stage
Choose
Eligible co-attendees, private like/pass, draft, deadline and retry
- 07Open stage
Match
Pending and mutual state, shared event, compatibility context
- 08Open stage
Talk safely
Mutual conversation, reconnect, files, report and block
- 09Open stage
Control
Notifications, security, privacy, GDPR, subscriptions and appeals
Feature coverage
Every customer-facing feature family is assigned to concrete Night Transit screens and explicit system states; participant areas are the current parity priority.
Public acquisition
Landing, public information, localization, consent, legal, contact, newsletter, PWA, and offline.
Identity
Registration, sign-in, verification, recovery, session expiry, applications, and role switching.
Participant profile
Wizard, photos, phone, preferences, personality, public profile, validation, and visibility.
Ticket and attendance
Ticket lifecycle, QR, manual check-in, event-scoped outcomes, and offline fallback.
Post-event
Eligibility, feedback, privacy, deadlines, compatibility, pending choices, and mutual matches.
Conversation and safety
Mutual chat, realtime states, attachments, report, block, unblock, and appeals.
Account
Home, activity, notifications, settings, security, GDPR, subscription context, and status states.
Organizer operations
Application, payout, events, publishing, media, live operations, analytics, and revenue.
Venue sourcing
Venue directory, details, places, direct requests, proposals, interests, and organizer trust.
Venue operations
Onboarding, inventory, availability, blocked dates, booking decisions, calendar, payout, and revenue.
Business collaboration
Canonical agreement, negotiation, relationship-scoped chat, audit history, and handoff.
Participant page registry
The original public, access, and participant surface plus focused person and thread drill-downs resolve to static Night Transit entry points.
/ · navigatedMeet in person. Match after./about · navigatedAbout MatchQuest/activity · navigatedActivity/auth/forgot-password · focusedRecover access/auth/organizer-signup · focusedApply as an organizer/auth/reset-password · focusedChoose a new password/auth/signin · focusedWelcome back/auth/signup · focusedCreate your account/auth/venue-owner-signup · focusedRegister a venue business/auth/verify-email · focusedVerify your email/blocked-users · navigatedBlocked users/contact · navigatedContact MatchQuest/dashboard · navigatedWhat comes next/events/kiez-after-dark/checkin · navigatedEvent check-in/events/kiez-after-dark · navigatedKiez after dark/events/kiez-after-dark/purchase · navigatedComplete your booking/events/create · navigatedCreate an event/events · navigatedFind an event/events/saved · navigatedSaved events/feedback/ceramics-after-work · focusedPrivate post-event choices/for-organizers · navigatedHost events people remember/for-venues · navigatedPut your venue on the map/impressum · navigatedImprint/links · navigatedMatchQuest links/matches · navigatedPeople you both chose/messages · navigatedMessages/messages/jonas-malik · navigatedJonas Malik/messages/sophie-weber · navigatedSophie Weber/my-tickets/mq-84k2 · navigatedKiez after dark ticket/my-tickets · navigatedMy tickets/newsletter/confirm · focusedConfirm your newsletter/newsletter/for-organizers · focusedOrganizer field notes/newsletter/for-participants · focusedBetter ways to meet/newsletter/for-venues · focusedVenue partnership notes/newsletter · focusedStay in the loop/newsletter/unsubscribe · focusedNewsletter preferences/notifications · navigatedNotifications/offline · navigatedYou are offline/organizers/studio-nord · navigatedStudio Nord/privacy · navigatedPrivacy/profile/sophie-weber · navigatedSophie Weber/profile/jonas-malik · navigatedJonas Malik/profile/mara-klein · navigatedMara Klein/profile/connections · navigatedConnections/profile/dating-preferences · navigatedDating preferences/profile/edit · navigatedEdit profile/profile · navigatedYour profile/profile/phone-verification · navigatedVerify your phone/profile/photo-upload · navigatedChoose your profile photo/profile/security · navigatedSecurity/profile/settings · navigatedSettings/profile/settings/privacy · navigatedPrivacy and your data/profile/wizard · focusedComplete your profile/subscriptions · navigatedPlans and beta access/support/appeal · focusedAppeal an account decision/terms · navigatedTerms
Quality contract
Accessibility, localization, no-network honesty, portability, ownership, and automated route coverage are part of the system—not post-design cleanup.
WCAG 2.2 AA
Landmarks, labels, visible focus, 44px targets, keyboard completion, reduced motion, and no color-only meaning.
EN · DE · PL
Expansion-safe composition, deterministic dates and money, and localized state or action semantics.
Local and honest
No production API calls, remote assets, or mock success after an error.
Portable contract
Serializable view models, semantic intents, JSON tokens, and framework-independent lifecycle rules.