Floka Digital Agency

Frontend Application, Apr 2026. Role: Front-End Developer.

Floka is a dark, motion-heavy landing page for a digital agency, built as a single route in React and Vite. It covers the sections an agency site needs: work, services, numbers, clients, testimonials, awards, team, FAQ and articles. It is deployed on Netlify.

Highlights

18,000-point particle field whose targets are sampled from text drawn on a canvas, with mouse repulsion and spring return
Pixel ratio capped at 1.5 on the WebGL canvas, and the camera follows the pointer
Custom cursor smoothed with Framer Motion springs and a circular SVG scroll-progress button
Hover distortion built from an animated SVG feTurbulence filter
Portfolio, expertise and awards content loaded from JSON files rather than hardcoded in components

Main challenge

The page needed to feel animated end to end without turning every section into one-off code, and it needed a 3D centrepiece that stays interactive on an ordinary laptop.

How it was solved

Shared motion pieces (ParallaxImage, LiquidImage, ScrollingRuler, SpinningBadge, CustomCursor) are reused across sections. The particle scene samples target positions from text drawn on an offscreen canvas, then updates one Float32Array of positions per frame with a simple spring and a mouse repulsion radius. The canvas pixel ratio is capped at 1.5 to limit GPU work.

What shipped

Live on Netlify with all twelve content sections and the particle scene
Reusable motion components shared across hero, portfolio, FAQ, awards and fun-facts sections
Built in five days across 23 commits

Built with

React
Vite
Tailwind CSS
DaisyUI
Framer Motion
Three.js
React Three Fiber
Netlify