Kineon: corporate website with GSAP animations
Case study
- My role
- I built the front end of the website.
- Duration
- Started in March 2026
The problem
Kineon wanted a striking website to present robots and automation lines, with rich animations on desktop that would not weigh down smartphones.
What I did and why
- Three-layer parallax on the opening image, active only when there is a mouse.
- Separate images for mobile and desktop.
- Product tabs with an animated indicator under the active tab and PDF brochures.
- Dropdown mobile menu that finishes its animation before scrolling to the chosen section.
- No CMS: content lives in the code, because it rarely changes.
Results
- 5 sectionson a single page
- 3 layersof parallax on the opening image
- Mobilededicated images and effects
Stack highlights
- Next.js 16
- React 19
- GSAP
- Tailwind CSS 4
- Embla Carousel
- Radix UI
Working on something similar? Let's talk.
Get in touchThe website tells the company's story in five sections: who they are, what they do, the products, the industries they work in and the contacts. The robot image at the top moves on three layers following the pointer, but only on desktop: on smartphones there is a dedicated image and no heavy effects. Products are browsed through animated tabs, and those with a brochure can be downloaded as a PDF.
I wrote about how I built the animations in the post Multi-layer animations and advanced interactions with GSAP.
What I bring to an agency or a small business from this project
- Front-end development on an existing design, with animations true to the visual design.
- Effects designed for the device: rich with a mouse, light on a phone.
- A static, fast website when content rarely changes and a CMS isn't needed.
Realized for Kineon in collaboration with Alybi di Proglio Alice
