Cassie Evans
17.4K posts
Cassie Evans
@cassiecodes
🫖 cosycore devrel @GreenSock. creative tinkerer. 💜 cassiecodes on discord
Brighton, England Katılım Temmuz 2016
1.8K Takip Edilen34.9K Takipçiler
Glad you enjoyed it, Henry!
Check out the full episode from @CodeTV_Dev, @webflow, and @greensock here: youtube.com/watch?v=Is7PCA…
YouTube
English
@ericvanholtz @codetv_dev Oh my god Eric this is the best.
I would install this browser extension.
English
I built Loading Today ✨
A cozy OS-inspired escape for the @codetv_dev Hackathon that shows how much of the day has “loaded” so far with calming visuals, ambient sounds, and playful interactions.
Select the CodeTV theme and watch the Web Dev Challenge episode in the TV app!
Jason Lengstorf@jlengstorf
animation is fun. community activities are fun. winning stuff is fun to celebrate the launch of the latest Web Dev Challenge, @codetv_dev cooked up a hackathon with @webflow & @greensock that's fun ×3 build an animated landing page & you could win! (details in thread)
English
This was my favourite bit -
I remembered an OG demo from the old tweenMax days using delauney triangulation to smash a canvas - from @zadvorsky
codepen.io/zadvorsky/pen/…
Adapted it to use HTML2Canvas, which is fun to mess about with while we wait for HTML *in* canvas to land.
English
Feeling inspired to make something fun?
Join our hackathon, you can win some GSAP swag, a sick patch from the keyframers and a Webflow keyboard.
(It's all about the greensocks though let's be real)
webflow.com/codetv
English
Filming a @codetv_dev episode with @jlengstorf & his mega crew was such a treat.
Jealous of @iljavaneck, @codebydennis, @shshaw, @DavidKPiano & Henry having all the fun, so I had a play with the hackathon site
Deploy the @greensock powered @astrodotbuild rocket to @webflow 🚀
GSAP@greensock
It's just the greatest landing page ever. How long could that take to build? Four hours?... Watch @iljavaneck, @codebydennis, @shshaw, @DavidKPiano and Henry Desroches race the clock in the latest episode of @codetv_dev's Web Dev Challenge Feeling inspired? Join our hackathon and win some swag! Build with @astrodotbuild, animate with @greensock and deploy to @webflow cloud. - You have until July 31st to build a page that breaks the internet. youtube.com/watch?v=Is7PCA…
English
Breaking the internet was the most fun though -
I remembered an old but amazing demo from OG GSAP whizz @zadvorsky showing off delauney triangulation
Adapted it to use HTML2Canvas, which is hella good fun to play with while we wait for HTML in canvas.
codepen.io/zadvorsky/pen/…
English
It was such a treat getting to film a @codetv_dev episode, but I was pretty jealous of @shshaw, @DavidKPiano, @iljavaneck, @codebydennis and Henry having all the fun on the day.
Glad I got to mess about with the hackathon page.
Deploy @astrodotbuild to @webflow Cloud 🚀
GSAP@greensock
It's just the greatest landing page ever. How long could that take to build? Four hours?... Watch @iljavaneck, @codebydennis, @shshaw, @DavidKPiano and Henry Desroches race the clock in the latest episode of @codetv_dev's Web Dev Challenge Feeling inspired? Join our hackathon and win some swag! Build with @astrodotbuild, animate with @greensock and deploy to @webflow cloud. - You have until July 31st to build a page that breaks the internet. youtube.com/watch?v=Is7PCA…
English
@Anemolito 100% - tech twitter was an island in a sea of toxic waste.
I still stay to boost GSAP community folks - bluesky and mastodon lean very USA/UK and I find most of the rest of the world are still here. I want to see what they're making. Even if it's swimming in bots and nazi's now
English
Yeah and to be fair our space used to be the odd one out
Since forever when I told a friend that I use twitter they responded with the most disgusted face posible because they saw twitter as a very horrible and toxic place (which is very true for most). It was hard for them to wrap their head around tech twitter being so educational, supportive and profesional. They literally wouldnt believe me😂
English
I'm so bored of the "watch me scroll someone else's site for clicks" brigade.
No, Claude didn't do that. You didn't do that. @NoomoAgency did and this is really getting old.
Bring back shame, why aren't people ashamed anymore?
FHILY👑@Oluwaphilemon1
How I built with Claude 👇 1. Prompt: "Build a storytelling website where each scroll section reveals a new chapter with fluid color transitions" 2. Use Three.js for the painted texture background that reacts to cursor 3. Prompt: "Add GSAP ScrollTrigger so each section animates in as a cinematic scene" 4. Use Lenis.js for that buttery smooth scroll that premium sites have
English
English
@Oluwaphilemon1 how many passes did it take before the reaction felt natural and not laggy?
English
How I built with Claude 👇
1. Prompt: "Build a storytelling website where each scroll section reveals a new chapter with fluid color transitions"
2. Use Three.js for the painted texture background that reacts to cursor
3. Prompt: "Add GSAP ScrollTrigger so each section animates in as a cinematic scene"
4. Use Lenis.js for that buttery smooth scroll that premium sites have
FHILY👑@Oluwaphilemon1
NEW: Anthropic will reportedly launch “Claude Fable” later today — a Mythos-class model. polymarket.com/event/claude-m…
English
English
@Oluwaphilemon1 Three.js background reacting to cursor plus GSAP scroll animations in a few prompts is insane. How many iterations did it take before it looked like that?
English
@Anemolito Social has really died a bit of a death hasn't it, I remember when it tech twitter used to be so educational and supportive
English
@cassiecodes The other day I made short about a site that was fairly complex. Tried to give some guidance into one of the effects as simple as I could. 0 views
Saw someone else on twitter just a straight recording of the site get 5k likes. And i’m like “whats the point of the effort”
English
@Oluwaphilemon1 Mate this is getting so boring now, why don't you actually give it a go and make your own site, it's fun, you might learn something.
English
@cassiecodes @edo_lunardi That totally makes sense, you are always so insightful! Thanks for always bringing the knowledge Cassie
@greensock should hire you or smthing like, Oh wait…
English
Quick creative dev tip:
Use gsap Scrolltrigger, it's just that good.
In this site, they use the pin variable that sticks the element to the top of the screen and keeps it there until the animation is finished.
In this case, the animation is horizontal so it creates this ilussion of change of scroll directio.
Really nice site @PlasticCreative
English
@Anemolito @edo_lunardi So yeah, flexibility and reliablity is the answer.
There's a difference between a developer setting up a sticky section with care and understanding of the limitations, and making a tool that is meant to "just work" across different DOM structures and challenges
English
@Anemolito @edo_lunardi Also as you say, working through a variety of different animation challenges. There's a need for lifecycle hooks and getting a 0-1 progress for scrubbing/tying it to animation reliably.
Ultimately though, sticky is still great, people use it with with GSAP all the time.
English