JellyLens logo

JellyLens

JellyLens is a secondhand lens shop homepage designed with animations and an interactive mini-game to educate users.
Tools and Tech:
  • Blender
  • Webflow
  • WebGL Fluid Enhanced
  • ChatGPT
  • GSAP

Live Version

Hover Animation

The hover animation uses WebGL Fluid Enhanced, blending with the branding for a unified experience.

Guess That Lens!

Built with ChatGPT, JavaScript, and Google Sheets, this feature allows for easy uploading of lens information. The Webflow layout enabled a focus on visual design while ChatGPT handled development logic, ensuring efficient project management.

The mini-game simplifies data uploads, allowing users to showcase unique shots with underrated lenses. This solution enhances user engagement and education.

JellyLens - lens spreadsheet
The list of lenses was generated by ChatGPT, I sourced the images using Flickr (3 example images per lens)

Iconography

Line-based icons complement the minimalist logo, reinforcing the brand's visual identity.

JellyLens - icons

Scroll Animations

Inspired by Apple's use of scrolling product animations on their site, I used a Sketchfab camera model to create a Blender animation. GSAP scroll animations trigger this, adding a modern touch to the site.

PENTAX MX-1 CAMERA

← Back

More Web Experiences

BBS RS: 3D E-Commerce →Printspo →

Like what you see?

Get in touch →