Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

motion-ui-design

Resources for inspiration, lists of software, libraries and other stuff related to Motion UI design, animations and transitions.
https://github.com/fliptheweb/motion-ui-design

Last synced: 4 days ago
JSON representation

Libraries
- SVG
- HTML, CSS and JavaScript
  - Web Animation Infographics
  - Web Animation Infographics
- CSS
  - Effeckt.css
  - Bounce.js
  - Animations.css - Collection.
  - Magic animations
  - UI buttons
  - Morf
  - Awesome CSS3 animations
  - All Animation
  - CSS Animate
  - Animate.css
  - Effeckt.css
  - Bounce.js
  - Morf
  - Bounce.js
  - Bounce.js
  - Bounce.js
  - Bounce.js
  - Bounce.js
- JavaScript
  - GreenSock - performance, professional-grade animation for the modern web.
  - Impulse - performance interactions for mobile web.
  - AniJS - attributes.
  - Famo.us - performance JavaScript library for animations & interfaces.
  - Dynamics.js - based animations.
  - Popmotion
  - anime.js - Lightweight JavaScript animation library.
  - useAnimations - micro-animations icon library;
  - GreenSock - performance, professional-grade animation for the modern web.
  - Velocity.js
  - Famo.us - performance JavaScript library for animations & interfaces.
  - Processing.js
  - Mo.js
  - anime.js - Lightweight JavaScript animation library.
Software
- Video, gif, presentation
  - MtMograph summits
  - Adobe After Effects - standard animation and creative compositing app lets you design and deliver professional motion graphics and visual effects for film, TV, video and web:
  - Using After Effects for UI Animation Prototypes
  - UI Animation tutorials
  - How to Use After Effects for Web Animation Prototypes
  - 30 days of AE
  - After Effects CC Essential Training on Lynda
  - Squall
  - Apple Motion
  - Adobe Photoshop
  - 9 Photoshop UI Animation Tutorials
  - Adobe Flash
  - Apple Keynote - fidelity animations and prototypes:
  - How To Prototype UI Animations In Keynote
  - How to Use After Effects for Web Animation Prototypes
  - After Effects CC Essential Training on Lynda
  - BodyMovin
  - Squall
  - Adobe Photoshop
  - 9 Photoshop UI Animation Tutorials
  - Adobe Flash
  - Apple Keynote - fidelity animations and prototypes:
  - How To Prototype UI Animations In Keynote
  - 9 Photoshop UI Animation Tutorials
- Visual programming
  - Quartz Composer - based visual programming language for prototyping MacOS/iOS apps:
  - The 4 Minute Guide to Quartz Composer
  - Introducing Origami for QC
  - Form - based visual programming language for prototyping apps by Google.
  - Principle For Mac
  - Floid
  - Quartz Composer - based visual programming language for prototyping MacOS/iOS apps:
  - Avocado
  - Form - based visual programming language for prototyping apps by Google.
  - Principle For Mac
  - Origami
  - Floid
- HTML, CSS and JavaScript
  - Framer studio
  - Your first prototype with framer
  - Tumult Hype
  - Adobe Edge Animation
  - Prototyping UI Animation
  - Adobe Experience Design (ex-Project Comet)
  - Google web designer - based designs and motion graphics.
  - Animatron
  - Pixate
  - SpiritJS
  - Framer studio
  - Tumult Hype
  - Adobe Experience Design (ex-Project Comet)
  - Google web designer - based designs and motion graphics.
  - Animatron
  - SpiritJS
Resources for inspiration
- Sites
- Pinterest boards
- Processing and other weird, but funny stuff
  - Bees & bombs
  - PATAKK
  - dvdp
  - bigblueboo
  - Misha Kvakin
  - Bees & bombs
  - PATAKK
  - dvdp
  - bigblueboo
  - Misha Kvakin
Articles
- Processing and other weird, but funny stuff
Helpers
- HTML, CSS and JavaScript
  - easings.net
  - cubic-bezier.com - bezier visual tool.
  - csstriggers.com
  - easings.net
  - cubic-bezier.com - bezier visual tool.
  - csstriggers.com
Web animation performance
- SVG
Speeches, presentations, videos
- SVG
Newsletters, podcasts, screencasts
- SVG
  - The UI Animation Newsletter
  - Motion and meaning
  - All The Right Moves
  - The UI Animation Newsletter
  - Web Animation Weekly
  - Motion and meaning
  - UI Movement - best of the week UI animations newsletter.
Guidelines
- SVG
Books
- SVG

Programming Languages

Categories

Articles 278 Guidelines 63 Software 52 Resources for inspiration 51 Libraries 42 Speeches, presentations, videos 19 Books 13 Newsletters, podcasts, screencasts 7 Helpers 6 Web animation performance 6 License 1

Sub Categories

Processing and other weird, but funny stuff 288 SVG 117 Sites 31 HTML, CSS and JavaScript 24 Video, gif, presentation 24 CSS 18 JavaScript 14 Visual programming 12 Pinterest boards 10