Share Posted January 26, 2021 Hello friends, Does anyone know how Simon here created the photos effect for the sample projects? https://simondaufresne.com/ Simon, if you are here, you are an absolute legend bro Best, Ahmed Link to comment Share on other sites More sharing options...
Share Posted January 26, 2021 Canvas, probably with WebGL. It could have been Three.JS, Babylon or even hand-coded without a library. 1 Link to comment Share on other sites More sharing options...
Share Posted January 26, 2021 Hey Ahmed and welcome to the GreenSock forums. That site definitely uses GSAP and WebGL. I wrote a kind of intro to using WebGL on regular web pages which might help your understanding. 1 Link to comment Share on other sites More sharing options...
Author Share Posted January 26, 2021 @ZachSaucier Thanks so much, actually my team is looking to dig deeper in this area, essentially what we are building is a `cool new shopping experience` we come from long experience in ecommerce and want to blend that with webGL and GSAP. Is there other areas you recommend us to explore beside Curtain JS? Thanks so much Ahmed Link to comment Share on other sites More sharing options...
Share Posted January 26, 2021 You can do the same sort of thing with any tools that render WebGL (Pixi, Three, OGL, etc.). I used curtains because it's relatively lightweight for doing some image effects and handles the syncing with other DOM elements for you but keeps you from having to write that yourself. The main thing that you'll have to spend time learning is how to write fragment and vertex shaders. 1 Link to comment Share on other sites More sharing options...
Author Share Posted January 26, 2021 Awesome, Thanks so much. Link to comment Share on other sites More sharing options...
Share Posted January 27, 2021 Have a look a codrops.com. There you can find many examples like the one you posted. It's an extremely helpful website with good code examples and explanations. https://tympanus.net/Development/HorizontalSmoothScrollLayout/index2.html 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now