Interactive Shaders: Revolutionizing Human Interface Design

Interactive Shaders: Revolutionizing Human Interface DesignInteractive Shaders: Revolutionizing Human Interface Design

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

John Torres

• Apr 21

The shaders project is an expressive and interactive set of panels. The goal is to highlight the posibilities of human interface interaction in a way that feels less disjointed.

John Torres

• Apr 21

The shaders project is an expressive and interactive set of panels. The goal is to highlight the posibilities of human interface interaction in a way that feels less disjointed.

Completed work

UI Design Web Design Framer

Sisi Guo

• Apr 20

Built with Paper for the #PaperChallenge.

I designed a series of immersive shader effects in Paper, then used Cursor to implement them as a React site. The concept: vertically stacked chips as site navigation, each one revealing a different animated shader as a full background on hover.

Paper lets designers create WebGL shader effects visually, then exports them directly as React components. Cursor handled the implementation. The whole thing came together on a rainy Sunday afternoon.

This unlocks something real for designers. Complex, performant visual effects that used to require a specialist are now part of the design workflow.

Bravo, Paper.

paperchallenge

Sidi Mohammed Taleb

• Apr 20

Loving the outcome of this !! Feels so satisfying

Ashikur Rahman

pro

• Apr 19

ShaderRevealFX is a visually rich Framer component that uses shader-style animations to reveal or transition content with fluid distortion, blending, or wave effects.