LiveMe5ive - Brand & Visual Design Agency
Client
LiveMe5ive S.r.l.
Role
Framer Developer
Duration
1 month
Scope
Framer Developement • CMS integration • Migration
Translating the Design
The initial design created for the website didn’t fully reflect the agency’s identity. So, we went through a redesign to better align the website with their spirit and core values.
LiveMe5ive is an outstanding visual and branding agency, with a team full of creatives and great designers. They were already doing great work, but the website needed a robust and scalable CMS capable of dynamically changing the design based on the selected item, along with several custom code solutions to achieve the desired visual effects.
Building the CMS
In this phase, I built a robust solution by integrating multiple collections and custom fields to handle large amounts of images, videos, and GIFs.
Combined with conditional logic, this approach allowed me to create a fully scalable and customizable front-end system, where designers could control and adapt the visual presentation directly through the CMS.
Testing the Overall Experience
The testing phase was one of the most intense parts of the project.
I presented and explained the system to the designers, guiding them through how to use and manage the CMS. The goal was to make sure they could confidently use the system and maintain full control over future items added to the website.
Connecting the dots
Once the system was approved by the stakeholders and fellow designers, we moved on to the custom code implementation.
This included the glass navigation, the orbit interaction, and the back button that preserves the user’s scroll position.
I achieved these results through iterative testing and vibecoding, translating specific design requests into reusable and customizable code. This allowed the design team to further adjust and refine the interactions according to their needs and visual direction.
Migrating
The old website was built as a React project, so for the migration I was able to work from the URL list provided by the previous development team.
From there, I developed a redirect strategy using wildcards — an exciting Framer feature I was keen to put to use.
Since many of the old URLs no longer existed in the new website, I used wildcard redirects to cover large groups of URLs at once, saving both time and space in the redirect panel.
This allowed us to preserve the existing URL structure where needed and minimize the potential SEO impact of the migration.