João Pedro Back to portfolio
Digital product design Case study · 01

ModaLisboa Lisbon Fashion Week

01 / Overview

A fashion platform designed as a living system.

ModaLisboa brings runway shows, emerging designers, talks, exhibitions, livestreams and editorial content together across multiple moments in time.

I designed the information architecture and digital product structure for a platform capable of adapting before, during and after every edition. The goal was to make a complex live event feel immediate to visitors and manageable to the editorial team behind it.

Role
Digital Product Designer
Focus
UX systems · Information architecture · Editorial workflow
Platform
Responsive web · CMS
MODALISBOALisboa · PortugalMenu +
LISBOA
FASHION
WEEK
LIVESANGUE NOVO
18:30 · NOW
63
EDITION

02 / The challenge

One platform.
Many moving parts.

The challenge was not simply to design pages. It was to create a coherent system for an ecosystem of programmes, content and live experiences—without letting its operational complexity reach the audience.

Moda
Lisboa
Fashion shows Livestreams Registrations Exhibitions Designers News Talks Archive

03 / Designing for time

The website changes
when the event does.

Each state changes the homepage hierarchy, navigation, livestream prominence, registration flows and editorial priorities. Select a phase to see the system respond.

MODALISBOACOMING NEXT · 63MENU
New edition

The city
is getting
ready.

Primary action

Explore the programme ↗
ProgrammeDesigner line-upRegistrations

What changes

  • Homepage composition
  • Navigation visibility
  • Designer ordering
  • Registration logic
  • Editorial priority
  • Archive access

04 / Modular homepage

Flexible for editors.
Consistent for audiences.

The homepage was designed as a kit of reusable content blocks. Editors could reorder, schedule, reuse or hide modules without redesigning the page for each phase.

Reusable block libraryBlocks move as editorial priorities change
modalisboa.pt / edition 63Layout 01 · Live
01 · Hero / LiveSANGUE
NOVO
LIVE 18:30
02 · ScheduleNOW

18:30 Sangue Novo
20:00 Luís Carvalho
21:30 Constança Entrudo

03 · EditorialStories from
behind the runway

05 / Dynamic behaviour

Editorial intent,
translated into rules.

Live schedule data and editorial conditions shape what people see, creating a platform that feels current without demanding constant manual intervention.

SignalSystem responseUser outcome
Show is liveSurface stream in heroWatch immediately ↗
Registration fullClose booking actionJoin waiting list ↗
Next show in 30 minReorder designer carouselMeet the designer ↗
Edition has endedSwitch to recap modeExplore the archive ↗

06 / Information architecture

Distinct programmes.
One clear structure.

A consistent navigation and URL model connected every programme while leaving room for each to maintain its own identity and content behaviour.

modalisboa.ptACTIVE EDITION → 63
/designersprofiles · collections · schedule
/programmessangue novo · workstation · checkpoint
/livestream · schedule · replay
/storiesnews · interviews · features
/editionscurrent · past · programme

07 / Editorial & CMS

From managing pages to orchestrating content.

The content model separated reusable information from where it appeared. A designer, event or article could be prepared once, related to an edition, scheduled, and surfaced across multiple contexts.

01 / Reusable contentPrepared once
EntityDesignerProfile · Collection
EntityEventTime · Venue · Capacity
EntityStoryAuthor · Topic · Media
Editorial contextEdition 6312–15 October
  1. 01Relate
  2. 02Schedule
  3. 03Prioritise
  4. 04Publish
02 / Digital surfacesPublished where needed
Surface 01HomepageEditorial priority
Surface 02ProgrammeTime and venue
Surface 03LiveNow and next
Surface 04ArchivePast editions

08 / Design principles

A system built
to keep moving.

  1. 01

    Flexibility

    Adapt rapidly during a live cultural event.

  2. 02

    Reusability

    Reduce duplicated work through shared structures.

  3. 03

    Temporal awareness

    Respond to the evolving lifecycle of each edition.

  4. 04

    Scalability

    Support future editions without rebuilding the platform.

  5. 05

    Editorial clarity

    Make operational complexity easier to manage.

09 / Reflection

Designing the relationships, not just the screens.

This project marked a shift in my practice—from visual design toward systems-oriented product thinking.

Coming from architecture, the parallels felt natural. Physical and digital systems both demand hierarchy, sequencing and adaptability across many layers. Here, that thinking helped turn a live event into a digital ecosystem that could change without losing its structure.

Product designUX systemsInformation architectureCMS designContent strategyState-based UX
Back to portfolio