UI Concept Mimic #01

[Guest Nickzilla]

In an attempt to learn GSAP and other web transitioning concepts, I've decided to start mimicking random UI concepts and examples. Any feedback, advice, best practices, other ways you might have approached the concept would be greatly appreciated. This is attempt number 1.

 

Concept link: https://site.uplabs.com/posts/submit-button-micro-interaction

See the Pen bwAavX by nickmuth (@nickmuth) on CodePen

[OSUblake]

I think animating the stroke width makes it look a little funky. What about doing it like this...

See the Pen f48f30b911109b133e4c273e53146c66?editors=0010 by osublake (@osublake) on CodePen

[Guest Nickzilla]

This is awesome, Blake.

[Guest Nickzilla]

Finished result.

See the Pen YGARRG by nickmuth (@nickmuth) on CodePen

[violacase]

Nice end result Nickzilla. Waiting for probe #2!