L o a d i n g
Back to Portfolio Digital Agency Website

Criohub Solutions — Digital Agency Website

A multi-page marketing site for a Bangalore-based digital agency — services, portfolio and company background, with a smooth-scrolling, GSAP-driven single-page feel across every section.

HTML5 / CSS3 Bootstrap 5 GSAP ScrollSmoother Matter.js Formspree

8

Service Landing Pages

ScrollSmoother

+ Pinned Sections

Matter.js

Physics Interaction

Full SEO

Every Page
Walkthrough

Homepage & Inner Pages

Key Features

What The Site Does

Scroll-Driven Motion System

Smooth scroll, pinned sections, parallax and marquee effects via GSAP.

Filterable Portfolio Grid

Client-side category tabs (Branding, Website, Social Media, Package Design).

Physics-Based Interaction

A custom throwable element built with Matter.js.

Custom Animated Cursor

Dual-element cursor + follower with hover-reveal interactions.

WhatsApp + Lottie CTA

Floating click-to-chat button rendered with a Lottie animation.

Full-Site SEO

Unique titles, descriptions, keywords and Open Graph/Twitter tags on every page.

Technology

Stack & Integrations

Frontend
HTML5 Bootstrap 5 jQuery Animate.css
Motion
GSAP (ScrollTrigger, ScrollSmoother, SplitText, Flip) Swiper.js Matter.js
UI
Magnific Popup MeanMenu
Integrations
Formspree WhatsApp Click-to-Chat LottieFiles
Architecture

How It's Built

Criohub is a static, client-rendered multi-page site where every page loads a shared vendor bundle plus one main style.css and a single main.js that registers GSAP plugins and initialises every interactive module on load — smooth scrolling, section pinning, reveal/parallax animations, Swiper sliders, lightboxes, the mobile menu and animated counters. All content is hard-coded in HTML; the only outbound request is the contact form's POST to Formspree.

gsap.matchMedia() scopes the heavier motion effects to larger screens so the site stays responsive-friendly, and the portfolio filter is implemented from scratch with data attributes rather than a plugin. It's a genuinely substantial motion layer — over 2,000 lines in main.js — built entirely without a framework or build step.