Note: This section of the site is under heavy construction, tread carefully.

Bookmarks tagged with “animation”

180 bookmarks by garrettc


SVG spinners

A collection of 24 x 24 dp SVG spinners.

Bookmarked on #




Charlie the Unicorn - YouTube

Charlie and friends go to the mysterious Candy Mountain.

Bookmarked on #


Manim

A community maintained Python library for creating mathematical animations.

Bookmarked on #



SVG Loaders

Loading icons and small animations built with pure SVG.

Bookmarked on #


Text Chat Animator

Create realistic text chat animations that simulate messaging apps.

Bookmarked on #



myPhysicsLab

Animations of physics principles.

Bookmarked on #


Burds

"... just a bunch of burds, jumpin' around"

Bookmarked on #



Character Design References

An extensive collection of model sheets and other reference art for animated movies and television series.

Bookmarked on #


MoMG: GiF GALLeRY

A collection of nearly 100,000 gifs.

Bookmarked on #


Physics Simulations and Artwork

Physics simulations and artwork along with some Mathematica code

Bookmarked on #



pocketverse

Generate a random solar system.

Bookmarked on #


Respecting Users’ Motion Preferences

"The prefers-reduced-motion media query has excellent support in all modern browsers going back a couple of years. In this article, Michelle Barker explains why there’s no reason not to use it today to make your sites more accessible."

Bookmarked on #


Maiahi Bot (@maiahibot) / Twitter

Tag it in a Tweet containing an image, and it will reply with a version of the same image turned into a little animation which sings the Maiahi song.

Bookmarked on #



Internal Combustion Engine

"The invention of the internal combustion engine in the 19th century has revolutionized transportation over land, water, and air. Despite their omnipresence in modern day, the operation of an engine may be cryptic. Over the course of this article I’d like to explain the functionality of all the basic engine parts shown in the demonstration below."

Bookmarked on #


Swipey image grids.

SVG isn't just useful for illustrative animation. It's hella handy for UI too.

Bookmarked on #



Exploring @property and its Animating Powers

In-depth look at a new CSS feature that unlocks some incredible animation potential in CSS.

Bookmarked on #


PixiJS

"PixiJS is a rendering library that will allow you to create rich, interactive graphics, cross platform applications, and games without having to dive into the WebGL API or deal with browser and device compatibility. PixiJS has full WebGL support and seamlessly falls back to HTML5's canvas if needed."

Bookmarked on #



BBC Motion Graphics Archive

"The BBC Motion Graphics Archive is a showcase of the history and development of motion graphics across the BBC and includes examples of opening titles, promotion trailers, stings, idents and programme content sequences. We have so far worked closely with around 150 BBC graphic designers who have shared invaluable knowledge of the techniques used to create the works over the years."

Bookmarked on #



15+ Best Link Styles CSS (Anchor Text CSS)

"We have compiled a list of amazing Link styles CSS that is compatible with modern sites and devices and can be used for various designs, fliers and sites."

Bookmarked on #



Keyframes.app | CSS Toolbox

Keyframes gives you a visual timeline to help you create, view, and run animations without having to go back and forth between your browser and editor.

Bookmarked on #


How fast should your UI animations be?

"Good animation timing is more of an art than a science. Thinking in terms of a range instead of one set duration value will serve you much better in your design work."

Bookmarked on #


Enhancing User Experience With CSS Animations

"How to build CSS animations and transitions in your interfaces that are inclusive, accesible and will enhance your users' experience."

Bookmarked on #


Ghost In The Shell

A deep dive into the many worlds of Ghost in the Shell, and a guide to exploring them.

Bookmarked on #



Keyframes.app | CSS Toolbox

"Dead simple visual tools to help you generate CSS for your projects."

Bookmarked on #


cables

Cables is a tool for creating beautiful interactive content. With an easy to navigate interface and real time visuals, it allows for rapid prototyping and fast adjustments. You are provided with a set of operators, such as mathematical functions, shapes, materials and post processing effects. Connect these to each other with virtual cables to create the experience you have in mind.

Bookmarked on #


How They Fit Together: Transform, Translate, Rotate, Scale, and Offset

"The transform property and its friends became more powerful through the addition of the new individual transform properties (translate, rotate, scale) and the offset properties (as a part of CSS Motion Path). All effectively provide a transformation for your element, and all have to follow specific rules to know how those transformations apply."

Bookmarked on #



Japan World Cup - YouTube

Who will win ? dunk store https://dunkeyscastle.com/

Bookmarked on #


507 Mechanical Movements

Five Hundred and Seven Mechanical Movements, now Animated for the Internet.

Bookmarked on #


Animated Knots

Animated Knots is the world's leading site for learning how to tie knots of any kind. From Boating Knots, Fishing Knots and Climbing Knots to how to tie a Tie, or even Surgical Knots — we’ve got it covered.

Bookmarked on #


New in Firefox 66: animating CSS Grid

"One feature that has recently landed is the animation of CSS Grid."

Bookmarked on #


Fading out siblings on hover in CSS

This is a nifty technique using :hover and pointer-events to fade out sibling elements of a hovered element.

Bookmarked on #



Kitbull | Pixar SparkShorts - YouTube

Kitbull, directed by Rosana Sullivan and produced by Kathryn Hendrickson, reveals an unlikely connection that sparks between two creatures: a fiercely independent stray kitten and a pit bull. Together, they experience friendship for the first time.

Bookmarked on #


Gradians and Turns: the quiet heroes of CSS angles

"Degrees and radians are the angle units we all know and hate, but two lesser-known units are often much easier: turns and gradians"

Bookmarked on #


The Many Ways to Change an SVG Fill on Hover (and When to Use Them)

"SVG is a great format for icons. Vector formats look crisp and razor sharp, no matter the size or device — and we get tons of design control when using them inline. SVG also gives us another powerful feature: the ability to manipulate their properties with CSS. As a result, we can make quick and simple interactions where it used to take crafty CSS tricks or swapping out entire image files. Those interactions include changing color on hover states. It sounds like such a straightforward thing here in 2019, but there are actually a few totally valid ways to go about it — which only demonstrates the awesome powers of SVG more."

Bookmarked on #


A Fistful of Woolongs - A Cowboy Bebop Retrospective - YouTube

20 years after its debut, Cowboy Bebop still stands as one of the greatest anime series of all time. In this video I take a look at its rocky road to release and the lasting impact it's had on the industry in the decades following.

Bookmarked on #


Spider-Man Into the Spider-Verse Analysis: It's All About Art – /Film

"Really cool perceptive piece by the scintillating @SidizenKane 🙏🏾💥🔥👊🏾 via @slashfilm"

Bookmarked on #