ENFR
Let’s talk
← All work Case study 06 / 07

( Publicis Live × Orange Events · Mar 2021 → May 2022 )

Live events, without the Zoom fatigue.

Role
Product Designer · Design lead
Team
3 product teams · 5 designers
Tools
Figma · Notion · Vuetify
Stack
Amazon Web Services
Voilà.live, Backstage · Video studio · Event page
Backstage · Video studio · Event page

(01) Context

During lockdown, Orange Events and Publicis Live decided to build their own streaming platform for large online events, to offer it to their clients and stop depending on third-party tools.

Three connected interfaces

  1. 01Backstage: organisers brand the event, manage attendees, moderate and control the streams
  2. 02Video studio: speakers broadcast with TV-grade controls, effects and subtitles
  3. 03Event page: viewers watch, chat and react, with a one-time login key
  4. 04One consistent product vision across all three

(02) The innovation

Watch on your TV. Chat from your phone.

With “Extended screen”, viewers scan a QR code and their phone joins the live chat while the event plays on the big screen.

  • 3 Connected interfaces
  • 5 Designers managed
  • 3 Product teams
  • 5 Interaction zones per breakpoint

How I worked

(03) My role & process

  1. 01

    Multi-user journey map

    Every touchpoint between organisers, speakers and viewers on a single map.

  2. 02

    Stories into design tasks

    Product managers wrote small user stories, and we turned them into design tasks with the developers.

  3. 03

    Lead the design team

    Five designers, with tasks assigned and tracked in a Notion Kanban updated every week.

  4. 04

    Vuetify design system

    A Material Design library adapted to the three interfaces, for faster sprints.

  5. 05

    Pair design

    Each feature designed end to end, in pairs.

  6. 06

    Test deliveries

    Checking each build and giving feedback until release.

(04) Close-ups

Extended screen

TV and phone synced with a QR code, tested on many devices and breakpoints.

Live surveys

Organisers prepare questions, send them live in one click, and speakers see the answers in real time.

(05) Key learnings

  • 01

    Designing systems

    Working on several connected streams improved my skills in large-scale system design.

  • 02

    Using an existing design system

    Starting from Material Design let the team work much faster.

  • 03

    A lot about breakpoints

    It was demanding work, and very rewarding.

Visit voila.live ↗
Next project → AXA Angel tele-consultation