Lightnews — Scholar-powered news

Chris Gannon @chrisgannon.bsky.social · 29d

Glass Sakura 🌸

@splinetool.bsky.social

#3D #interactive #web

3

Chris Gannon @chrisgannon.bsky.social · Aug 20

Glad you enjoyed it 🙂✌️

2

Chris Gannon @chrisgannon.bsky.social · Aug 20

If you’re interested, my talk at @pixelpioneers.co in Bristol in June on 2D and 3D #animation is available to watch here 🙂
youtu.be/2xLKrHZ44qk?...

2D and 3D Animation using JavaScript Greensock & Spline - Chris Gannon - Pixel Pioneers 2025

YouTube video by Pixel Pioneers

youtu.be

3

Chris Gannon @chrisgannon.bsky.social · Jul 22

Glass Balloon Slider

#ux #ui #3D #glass

1 4

Chris Gannon @chrisgannon.bsky.social · Jul 22

Globules loader

#motiondesign #3d #web
@splinetool.bsky.social

1

Chris Gannon @chrisgannon.bsky.social · Jul 16

Playing with Layer blur and buttons in Hana

#ui #ux #interactive #motiondesign

@splinetool.bsky.social

1

Chris Gannon @chrisgannon.bsky.social · Jul 14

Glass Lights

1

Chris Gannon @chrisgannon.bsky.social · Jul 13

Glass Blur Toggle
#ui #ux #glass #component
@splinetool.bsky.social

4

Chris Gannon @chrisgannon.bsky.social · Jul 13

Playing around in Hana from @splinetool.bsky.social
#interactive #motiondesign

1

Chris Gannon @chrisgannon.bsky.social · Jul 10

1

Chris Gannon @chrisgannon.bsky.social · Jul 10

It's super hot today so don't forget to drink water!
#ux #ui #javascript #svg #water #weather

2

Chris Gannon @chrisgannon.bsky.social · Jul 9

Fun #UI toggle for #Wimbledon fans!

1 4

Chris Gannon @chrisgannon.bsky.social · Jul 2

Ok I fixed it. The dotted path I was using was in the <DEFS> tag and was being displayed in the SVG via a <USE> tag which iOS didn't like. When I use the original path it works.

2

Chris Gannon @chrisgannon.bsky.social · Jul 2

I need help!
Just delivered a project to a client that uses dashed lines in SVG whose attribute strokeDashoffset is animating giving the 'marching ants' vibe. Due to an iOS bug, this doesn't work on iOS. Anyone know a work-around? #javascript #ios #svg

1 1 1

Reposted by Chris Gannon

Oliver Lindberg @oliverlindberg.com · Jul 2

For his @pixelpioneers.co Bristol talk on animating in 2D and 3D, @chrisgannon.bsky.social created this beautiful animation. Thanks for doing this, Chris! 😍

The words 'Pixel Pioneers' animated to give the impression they're made out of liquid, or under water, with some colour circles around it.

1 1 3

Chris Gannon @chrisgannon.bsky.social · Jul 2

It was a pleasure and thanks for inviting me 😀

1

Chris Gannon @chrisgannon.bsky.social · Jul 2

Another client interactive measurement tool that asks ‘How freely can you express yourself?’
I made this before the stepped slider and coding the dynamic bounce height was tricky!
#ux #ui #measure #performance #animation

4

Chris Gannon @chrisgannon.bsky.social · Jul 1

Good idea!

Chris Gannon @chrisgannon.bsky.social · Jun 30

Updated version looks much better

1 1

Chris Gannon @chrisgannon.bsky.social · Jun 30

WIP of a client’s #ux measurement tool asking ‘How are you coping out?’
#design #ui #animation

4

Chris Gannon @chrisgannon.bsky.social · Jun 28

Sneak peek at a WIP client project. This interactive component asks ‘How burnt out are you?’

#ui #interactive #motiondesign

1 3

Reposted by Chris Gannon

Andy Davies @andydavies.me · Jun 20

Loving @chrisgannon.bsky.social’s talk

We need more conference talks that explore whimsical stuff like animation on the web and show us the art of what’s possible

#PixelPioneers

Slide showing a fried egg in a pan that acts as on / off toggle

2 1 10

Chris Gannon @chrisgannon.bsky.social · Jun 21

Thanks Andy!

1

Chris Gannon @chrisgannon.bsky.social · Jun 20

If you want to code along with me at 2:30 @pixelpioneers.co you can grab the Balloon Slider pen and fork it at codepen.io/chrisgannon 🫡

Chris Gannon @chrisgannon.bsky.social · Jun 19

I’ll be doing doing a live code demo in @codepen.io and @splinetool.bsky.social at @pixelpioneers.co in Bristol tomorrow. Make sure you have an account if you want to follow along 🤓🙂

2