Chakana Studio Website
A custom Webflow build for an Emmy-nominated animation studio focused on showcasing high-quality motion work, with scroll-snap interactions and optimized Lottie animations.
Content
Overview
The Challenge
Our Approach
Technologies & Tools
Capabilities
About This Project
Chakana Studio is a New York based animation and post-production studio that collaborates with digital artists globally and accompanies clients from concept development through final edit. Co-founded by Jeffrey Carrillo (Creative Director) and Mishell Cárdenas (Lead Animator and Producer), the studio operates between New York and the Andes, with a body of work that earned a nomination at the 64th Annual New York EMMY Awards in 2021 for a public service announcement produced in collaboration with eContent.
When Chakana approached Menta, they needed a website where the work itself would carry the experience. The brief from their internal design team called for a visually intensive site capable of hosting a substantial volume of animations, videos, and 2D motion pieces without degrading quality or page performance. The home section in particular required a precisely controlled scroll behavior to frame each project sequentially.
Menta delivered a focused web development engagement implementing Chakana's existing visual direction in Webflow, with three core technical builds: an optimized multimedia pipeline balancing file weight and quality across video, Lottie, and GIF formats; a custom desktop scroll-snap interaction on the home section; and an After Effects to Lottie production pipeline rebuilt without plugin dependencies to guarantee clean export.
The Challenge
CHALLENGE 1
Multimedia Volume Without Quality Loss
Chakana's portfolio relies on visual fidelity, but their library of 2D animations and motion graphics meant the site had to handle a large volume of video, Lottie, and GIF assets while maintaining acceptable load times. Without careful asset optimization, the site would have either compromised the animations Chakana is known for or compromised the user experience through long load times.
CHALLENGE 2
Desktop Scroll-Snap on the Home Section
The home section called for a section-by-section presentation where each block snaps fully into view as the user scrolls, with no partial states between sections. Webflow does not include this behavior natively, and implementing it without conflicting with the natural scroll behavior on tablet and mobile required a deliberate technical approach.
CHALLENGE 3
After Effects to Lottie Export with Plugin Dependencies
Several of Chakana's source animations were built in After Effects using third-party plugins. These plugins are not compatible with Bodymovin, the standard Lottie export tool, which meant the animations could not be exported cleanly without rebuilding portions of them at the source.
Our Approach
Solution 1
Optimized Multi-Format Export Pipeline
Each asset was processed through repeated export tests across formats and compression settings until the right balance between visual fidelity and file weight was found. Lottie files were favored where possible for their lightweight nature, GIFs were reserved for short loops, and full video used selectively. The result is a site that loads at acceptable speeds while preserving the quality the studio's reputation depends on.
Solution 2
CSS Scroll-Snap Targeted to Desktop
Custom code was introduced to apply scroll-snap behavior exclusively on desktop viewports. The home section content was structured to accommodate this constrained layout, while tablet and mobile breakpoints retained natural scrolling. The result preserved the intended cinematic presentation on desktop without forcing a layout that would degrade on smaller screens.
Solution 3
Plugin-Free Animation Rebuild
Working with Chakana, the affected animations were revised directly in After Effects to replace plugin-based effects with native After Effects techniques that export cleanly to Lottie. This kept the animation work consistent across the site and avoided the workaround of falling back to video or GIF for sequences that benefited from Lottie's lightweight rendering.
Technologies & Tools
Every project requires the right tools. Here's what powered this implementation.
Webflow
Figma
Lottie
Adobe Creative Suite
Get started
Ready to stop leaving deals on the table?
60
+
Projects delivered
9
+
Countries
Webflow Certified Partner
Awards Honoree
We follow a structured two-meeting process. An honest assessment of your current digital presence and a clear path forward. That's it.
Typical response time: Within 12 business hours