Filmstaden / Odeon Norway — Scaling a cinema platform across markets through design systems and product UX
Filmstaden is Sweden's leading cinema brand, operating in parallel under Odeon in Norway. I led UX/UI work across web and mobile — spanning booking flows, seat selection, membership, design systems, and marketing surfaces for both markets.
Client
Filmstaden / Odeon Norway
Year
September 2022–Present
Role
UX/UI Lead, Design Systems, Product UX
Scope
Web, mobile app, booking flows, design systems, marketing assets
Context
Filmstaden's digital product covers web, mobile app, booking, membership, content discovery, and marketing surfaces. Running the same platform across two markets — Sweden and Norway — means every design decision needs to hold for both brands, both audiences, and both content contexts.
The work involves multiple internal stakeholders: product, development, marketing, editorial, loyalty, and sales — each with their own priorities and constraints.
The challenge
New features, campaigns, and product improvements had to fit into an existing ecosystem without creating inconsistency. The challenge wasn't designing new screens — it was making improvements that held across contexts, teams, and markets without fragmenting the system further.
"At scale, design quality depends on the decisions you don't see — patterns that prevent inconsistency rather than fix it."
My role
- Led UX/UI work across booking, membership, campaign, and mobile app product areas
- Designed and refined seat selection patterns including availability states and edge cases
- Maintained and extended design system components to support both Filmstaden and Odeon Norway
- Built high-fidelity prototypes for stakeholder alignment and development handoff
- Collaborated with product owners, developers, and stakeholders across loyalty, sales, marketing, and digital
Approach
Understand the product area before proposing
Reviewed existing flows, prior design decisions, technical constraints, and stakeholder goals before suggesting changes — avoiding solutions that optimised locally at the cost of the wider system.
Identify where the pattern breaks, not just where it looks off
Mapped friction points at the interaction level — where the visual hierarchy was unclear, where states were missing, where the same concept was solved differently in different parts of the product.
Design for the system, not the screen
Every solution was designed to work beyond a single context — tested across booking, membership, and campaign surfaces, and verified to hold for both Filmstaden and Odeon Norway.
Prototype to align, not just to test
High-fidelity prototypes were used as the primary discussion artifact with product, development, and stakeholders — making behaviour concrete and decisions easier to make.
Hand off in a way that survives implementation
Prepared designs with clear component definitions, state documentation, and edge case coverage — reducing the gap between what was designed and what was built.
Key workstreams
Booking and seat selection
Seat selection patterns, availability states, and edge cases — including limited adjacent seating, accessible seating, and sold-out handling across web and mobile.
Design system evolution
Maintaining and extending reusable component patterns to support consistency across web and mobile, and to accommodate both Filmstaden and Odeon Norway market needs.
Member and account experiences
Logged-in journeys covering loyalty status, ticket history, saved payment methods, and account management interactions.
Content and campaign surfaces
Flexible content modules and campaign components designed to support editorial, promotional, and commercial needs across web and app channels.
Mobile app communication
App store assets, presentation mockups, and product communication visuals supporting launches, updates, and stakeholder alignment.
Key product decisions
Decision
Cross-market components over market-specific builds
Rather than designing separate component sets for Filmstaden and Odeon Norway, I maintained a shared component layer with market-level theming. This reduced duplication and made improvements to one market benefit both.
Decision
Seat selection as a state system, not a visual problem
Reframing seat selection around states — available, selected, unavailable, accessible, limited adjacency — rather than visual styling meant edge cases were handled by the pattern rather than solved ad hoc each time.
Decision
Prototypes as the primary alignment tool
Using high-fidelity Figma prototypes — not static screens — as the basis for stakeholder and development conversations reduced misinterpretation of intent and surface-level feedback on static layouts.
Decision
Booking flow as a component sequence, not a fixed screen set
Designing the booking journey as an ordered set of reusable components, rather than a fixed series of screens, made it significantly easier to adapt the flow for new showtime types, promotional variations, and market-specific requirements.
Key screens
Booking journey
Movie discovery through to checkout — designed as a sequence of reusable components to support variation without creating a new set of screens each time.
Seat selector
A state-based approach to seat selection: available, selected, unavailable, accessible, and limited-adjacency — each handled by the pattern rather than as visual exceptions.
Design system components
Shared components supporting both Filmstaden and Odeon Norway through a common structure with market-level theming applied at the token level.
Member experience
Logged-in account and loyalty surfaces — covering ticket history, membership status, and account management in a consistent interaction pattern.
Campaign and content modules
Flexible content components designed to handle editorial, promotional, and commercial content without requiring custom layout work for each campaign.
Mobile app surfaces
App store visuals and product communication assets designed to communicate key product moments clearly across stakeholder and public-facing contexts.
Impact
More consistent product patterns
A shared component approach reduced visual inconsistency across booking, membership, and content surfaces — and reduced the design effort required for new features.
Faster alignment across teams
Prototype-based conversations with product, development, and marketing stakeholders reduced ambiguity about intended behaviour and cut back-and-forth on intent.
Scalable across markets
Design decisions made at the system level — rather than screen level — made it easier to apply patterns across Filmstaden and Odeon Norway without diverging the codebase.
Booking flow adaptability
Component-based booking design made it easier to accommodate new showtime formats, promotional variations, and market-specific checkout requirements over time.
Reflection
Filmstaden reinforced something I've come to believe strongly: in a multi-team, multi-market product, the most important design decisions are the ones you make at the system level — not at the screen level.
The interfaces that hold up over time aren't the ones that look the most polished at launch. They're the ones built on patterns clear enough that the next designer — or the next feature — doesn't need to invent a new solution from scratch.
Interested in working together?
I'm available for new product design engagements.