Jun 2025・still working・83 views
Green Media Lab: three-language website with a Payload portfolio
Frontend・
Headless CMS
Technologies:
Next.js
Tailwind CSS
Payload CMS
GSAP
Shadcn UI
tRPC
Vercel
Tanstack Query
Zod
Typescript
MongoDB
Resend
Internationalization
Case study
- My role
- I built the new version of the website in Next.js and Payload CMS, with the Ride On development team.
- Duration
- Started in June 2025
The problem
Green Media Lab wanted a new website in three languages, with a portfolio the team updates and orders on its own, without losing the visits coming to the old addresses.
What I did and why
- Portfolio on Payload: projects, categories and business units from the CMS, with a manual order that realigns itself when a project is moved or deleted.
- Three covers per project: square, landscape and portrait, picked by layout.
- Three languages with translated URLs: next-intl, with different paths per language.
- Redirects from the old site for addresses already indexed.
- GSAP animations on scroll and on the partner grid.
Results
- 3 languagesItalian, English and Spanish
- 3 formatsof cover for every project
- Manual orderof projects set by the team
Stack highlights
- Next.js
- Payload CMS 3
- MongoDB
- tRPC
- next-intl
- GSAP
- Resend
- Tailwind CSS
Working on something similar? Let's talk.
Get in touchThe Green Media Lab team publishes projects from the CMS and decides the order they appear in. Every project has three cover versions (square, landscape and portrait), so the grid stays tidy on every screen. Pages have translated addresses in all three languages, and old URLs redirect to the new ones so search rankings are not lost.
What I bring to an agency or a small business from this project
- A multilingual website with translated URLs and redirects from the previous site.
- A portfolio the client orders and updates on their own.
- Scroll animations with GSAP, from the partner grid to the transitions between sections.
Realized for Green Media Lab in collaboration with Ride On
Visit:
