Client: Quick14 Studio (for Rendify) Role: Webflow Developer & GSAP Animator Pages: Home, Pricing, Work, Work Detail, Team, Demo Call Timeline: ~3 weeks Tools & Tech: Webflow, GSAP, Lenis, Swiper.js, Finsweet Client-First (Extended)

Quick14 partnered with me to develop Rendify’s marketing website — a fast, scalable Webflow build designed for a premium 3D visualization company. The focus was on creating a system-first development approach that would be easy to maintain, animation-rich, and fully responsive across devices.

We extended Finsweet’s Client-First system to create a robust design foundation tailored to Rendify’s long-term growth needs.

🎨 Color System (Reference-Only)

Although theming wasn't used, we set up a full Color Variable system to maintain clarity and scalability. It included:

Brand Colors: Primary, Secondary, Accent, Neutral variants

States: Hover, Background fills, Borders, Muted tones

Modes: Base, Invert, Grey (for reference purposes only, not in use)

This system gave structure to color usage across layouts without introducing unnecessary complexity.

🔤 Typography System

Built using a dedicated Typography mode in Webflow Variables:

Defined styles for all headings (H1–H6), paragraphs, and eyebrow text

Scaled using Typography Responsive via clamp() to maintain perfect proportions across all breakpoints

Applied globally using utility classes for maintainability and consistency

📐 Spacing & Layouts

Used Responsive mode to create fluid section margins and paddings

Introduced custom size tokens combining 4pt and 8pt grids for consistent spacing between sections and components

Entire layout adapts proportionally between breakpoints, making the experience fluid and visually balanced

We built all key pages:

Home, Pricing, Work, Work Detail, Team, and Demo Call Each was developed from scratch with pixel-perfect accuracy, fluid responsiveness, and modular structure.

✨ Animations & UX Enhancements

GSAP-powered scroll animations: Hero reveals, marquee flows, stat counters, staggered entrances

Lenis integration: Smooth scroll behavior with inertia-based UX

CSS hover animations: Lightweight effects on cards and interactive elements

Custom GSAP marquees: Seamless looping for visual motion

Counter-up effects: On-scroll animated numbers for showcasing performance

🧩 Custom Swiper Slider

Fully customized Swiper.js slider built from scratch

Adaptive layout, fluid behavior, and custom styling

Used to showcase case studies/work previews elegantly

We created a clean and scalable CMS that empowers the Rendify team:

Work CMS: Full collection for case studies with dynamic content, links, tags, and custom layout

Filter System: Implemented CMS-powered category filtering on the Work page using attributes + dynamic filtering logic

Testimonials CMS: Easily manageable testimonial slider fed by CMS

All CMS logic was built to scale with future content additions.

To ensure long-term autonomy, we delivered full documentation (via Notion), covering:

Editing static and CMS content

Adding new case studies and testimonials

Injecting GSAP animations using a no-code attribute system

Naming conventions, system structure, and variable usage

⚡ Lightning-fast performance with smooth interactions

📱 Fully fluid, responsive layout system using Variable Modes

🧱 Modular Webflow architecture ready for scale

🛠️ Animations, CMS, filters, and sliders all built natively and maintainably

🧩 Foundation-style system that sets up Rendify for long-term marketing success

This project combined the clarity of Quick14’s design direction with a deeply structured, scalable development approach. The final result? A powerful Webflow site that looks great, performs fast, and is built to grow.