Lin Dan x YONEX: The Memories We Shared

In the summer of 2020, legendary badminton player Lin Dan announced his retirement from the Chinese national badminton team. We were invited by monopo London to develop the tribute website, where the most remarkable memories from Lin Dan's career were collected.

Inspired by the title of Lin Dan’s autobiography - The memories we shared shall continue until the end of the world -, monopo London devised a social media campaign that invites Lin Dan fans to share the memories they have of Lin Dan’s career. The times they met him, saw him play, or were inspired by his actions. They wanted to give fans a cathartic moment. A moment for the community to unite through nostalgia.

To turn this vision into reality, our team has built a responsive HTML5 website developed in React. The entire UI, including an interactive scrolling timeline with a parallax effect used only React and CSS 3D transformations. We decided not to use WebGL or canvas in order to have more CSS-based control over the responsiveness of the dynamic layout accommodating CMS-powered content.

Besides heavily optimising browser paint and the CSS transitions, we also implemented Incremental Static Regeneration (ISR) with Next.js. Thanks to ISR, we get the benefit of server-side rendering with optimised SEO and almost instant page loading times, with the flexibility of being able to edit the website content live through a CMS.

The entire website is configurable and editable through a CMS. We have implemented a bespoke, headless solution based on Strapi and GraphQL together with Google Cloud Storage to allow for easy content creation.

To accommodate users from Chiana, we also implemented an Alibaba Cloud Object Storage Service provider and we integrated it with Strapi. This resulted in the same UX for content edition by the client while the multimedia files were transparently being uploaded to a CDN in China for ultimate loading speed.

See Lin Dan's tribute website at: thememoriesweshared.com

• Client: YONEX
• Concept, Creative Direction, Art Direction, Design, Digital production: monopo London
• Technical Direction, Development: Le Polish Bureau