Bringing The

Bringing The

Bringing The

Esplanade’s

Esplanade’s

Esplanade’s

Past to Life

Past to Life

Past to Life

2020

Client:

Esplanade

HUGE inc

The Esplanade, Singapore’s national performing arts centre, is home to nearly 30 years of performances. While its iconic architecture celebrates the creativity it champions, the organization sought a new digital platform to reflect this rich legacy.

The Esplanade, Singapore’s national performing arts centre, is home to nearly 30 years of performances. While its iconic architecture celebrates the creativity it champions, the organization sought a new digital platform to reflect this rich legacy.

The Esplanade, Singapore’s national performing arts centre, is home to nearly 30 years of performances. While its iconic architecture celebrates the creativity it champions, the organization sought a new digital platform to reflect this rich legacy.

Overview

Duration

2 months

2 months

2 months

Team

Carrie Ho Lester Choy Isa Pinheiro Hugh Connelly

Carrie Ho Lester Choy Isa Pinheiro Hugh Connelly

Carrie Ho Lester Choy Isa Pinheiro Hugh Connelly

Services

Lottie Animation
After Effects
Art Direction

Lottie Animation
After Effects
Art Direction

Lottie Animation
After Effects
Art Direction

Tools

Web Digital

Web Digital

Web Digital

The key challenge was to design a website that not only showcased decades of artistic endeavors but also engaged visitors, inviting them to discover and explore the world of art and culture seamlessly.


Goal:



Create an engaging digital experience that spotlights The Esplanade’s extensive history, while making it accessible and inspiring. We aimed to connect users with the archive of performances through intuitive, dynamic, and visually compelling storytelling—ultimately democratizing creativity and fostering a deeper connection between audiences and the arts.


What i did:



As part of the team, I focused on conceptualizing and prototyping a user experience that integrated motion design to guide visitors through time. Key responsibilities included:

  • Concept Development: Crafted a thematic narrative that allowed users to ‘travel’ through The Esplanade’s history.

  • Motion Design & Visual Storytelling: Incorporated animated transitions and parallax scrolling to create an immersive timeline visualization of 30 years’ worth of performances.

  • Information Architecture: Organized content to help users discover performances by genre, delve deeper into content features, and easily browse through the chronological archive.

  • User Interaction Models: Explored navigational patterns, including an interactive bento box grid for articles and dynamic timeline controls that made browsing intuitive and engaging.


Results:



Immersive Timeline Visualization: Users could seamlessly scroll through decades of performances, visually experiencing The Esplanade’s evolution over time.

  • Intuitive Content Discovery: A genre-based discovery system allowed visitors to find performances aligned with their interests, deepening their engagement.

  • Dynamic Navigation Elements: Parallax scrolling interactions and a flexible grid layout provided intuitive ways to browse various content types, from artist features to in-depth articles.


What I Could Do Better

User Testing & Refinement: Conduct more in-depth usability tests with diverse audience groups to ensure the navigation patterns and visual storytelling resonate with all visitors.
  • Accessibility Considerations: Further optimize the experience for all users, including those with visual and auditory challenges, by incorporating accessible color contrasts, ARIA labels, and multimedia captions.

  • Performance Optimization: Review and refine animations, loading times, and overall site performance to create a smoother, faster experience—particularly on mobile devices.

  • Personalized Recommendations: Introduce tailored recommendations, enabling the system to highlight performances or content based on users’ viewing history and interests.

The key challenge was to design a website that not only showcased decades of artistic endeavors but also engaged visitors, inviting them to discover and explore the world of art and culture seamlessly.


Goal:



Create an engaging digital experience that spotlights The Esplanade’s extensive history, while making it accessible and inspiring. We aimed to connect users with the archive of performances through intuitive, dynamic, and visually compelling storytelling—ultimately democratizing creativity and fostering a deeper connection between audiences and the arts.


What i did:



As part of the team, I focused on conceptualizing and prototyping a user experience that integrated motion design to guide visitors through time. Key responsibilities included:

  • Concept Development: Crafted a thematic narrative that allowed users to ‘travel’ through The Esplanade’s history.

  • Motion Design & Visual Storytelling: Incorporated animated transitions and parallax scrolling to create an immersive timeline visualization of 30 years’ worth of performances.

  • Information Architecture: Organized content to help users discover performances by genre, delve deeper into content features, and easily browse through the chronological archive.

  • User Interaction Models: Explored navigational patterns, including an interactive bento box grid for articles and dynamic timeline controls that made browsing intuitive and engaging.


Results:



Immersive Timeline Visualization: Users could seamlessly scroll through decades of performances, visually experiencing The Esplanade’s evolution over time.

  • Intuitive Content Discovery: A genre-based discovery system allowed visitors to find performances aligned with their interests, deepening their engagement.

  • Dynamic Navigation Elements: Parallax scrolling interactions and a flexible grid layout provided intuitive ways to browse various content types, from artist features to in-depth articles.


What I Could Do Better

User Testing & Refinement: Conduct more in-depth usability tests with diverse audience groups to ensure the navigation patterns and visual storytelling resonate with all visitors.
  • Accessibility Considerations: Further optimize the experience for all users, including those with visual and auditory challenges, by incorporating accessible color contrasts, ARIA labels, and multimedia captions.

  • Performance Optimization: Review and refine animations, loading times, and overall site performance to create a smoother, faster experience—particularly on mobile devices.

  • Personalized Recommendations: Introduce tailored recommendations, enabling the system to highlight performances or content based on users’ viewing history and interests.