Welcome to the Loopspeed Blog

A growing collection of guides and fun stuff we've been building

#tutorial#react#gsap#tailwind

Animated Grid in Next.js: A Step-by-Step Tailwind CSS and GSAP Tutorial

A guide to mapping data into a responsive grid, animating it for desktop and mobile, and making it reusable.

Eduard Radd, Matthew Frawley •Feb 2025

#tutorial#nextjs#typescript#html canvas#gsap

Scroll-driven image sequence in React with GSAP

A step-by-step guide to creating a scroll-driven image sequence canvas in Next.js using GSAP.

Matthew Frawley •Jan 2025

#tutorial#nextjs#threejs#typescript#vertex shader#fragment shader

Build an animated scroll-controlled wave plane with React Three Fiber and custom shader material

This simple project is a great way to learn about ThreeJS shaders and how to use them in a Next.js Typescript environment.

Matthew Frawley •Jan 2025

#tutorial#nextjs#threejs#typescript#glslify#custom shader material

Configure your Next.js Typescript project for custom shader materials and glsify in React Three Fiber

Get custom React Three Fiber shader materials with glslify working in your Next.js Typescript project. Step-by-step guidance on packages, config and code.

Matthew Frawley •Jan 2025

Animated Grid in Next.js: A Step-by-Step Tailwind CSS and GSAP Tutorial

Scroll-driven image sequence in React with GSAP

Build an animated scroll-controlled wave plane with React Three Fiber and custom shader material

Configure your Next.js Typescript project for custom shader materials and glsify in React Three Fiber

Looking for an experienced team to help bring a project to life?