Animação

Criando Usabilidade com Motion: O Manifesto do UX em Movimento

O seguinte manifesto representa minha resposta à questão - "Sendo um UX ou UI Designer, como que eu sei quando e onde implementar o motion para suportar a usabilidade?" Ao longo dos últimos 5 anos tive o privilégio de treinar e orientar os UX e UI designers em mais de 40 países, incluindo centenas das grandes marcas e agências de design através de workshops e tutoriais sobre UI Animation.

medium.com

Criando Usabilidade com Motion: O Manifesto do UX em Movimento

Princípios básicos do motion design da Disney x o digital [Parte 01]

Recentemente iniciei um curso sobre animações, o Pixar in a box , uma parceria entre Khan Academy e Pixar. Logo no começo deste, podemos notar que ele alimentará tanto designers, como programadores, pois parte nos traz conceitos e demonstrações, parte exemplifica motion design em matemática.

brasil.uxdesign.cc

Princípios básicos do motion design da Disney x o digital [Parte 01]

Enhancing User Experience With CSS Animations by Stéphanie Walter - UX designer & Mobile Expert.

Today I speak at Shift Remote about how CSS animations can enhance your user experience. With CSS and JS progress, implementing animations on websites has never been easier. But how do we make sure that our CSS animations and transitions will be meaningful to our users?

stephaniewalter.design

Enhancing User Experience With CSS Animations by Stéphanie Walter - UX designer & Mobile Expert.

Bibliotecas

LottieFiles - Free animation files built for Lottie

Get Started for free Loved by Designers & Engineers from Discover thousands of free animations for your products Most loved animators this week Test an Animation Salih Abdul Karim, Lead Motion Designer Get the Plugin Edit an animation Barrett Johnson, Product Marketing Eddy Gann, Product Designer Lottie Animation High quality (60 frames/sec) with interactivity and more...

www.lottiefiles.com

Lottie

Easily add high-quality animation to any native app. Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images. Get Started Learn more › We currently support solids, shape layers, masks, alpha mattes, trim paths, and dash patterns.

airbnb.design

Drawer - Premium UI assets & Lottie animations

High-quality digital resources for startup owners, designers & developers.

drawer.design

Drawer - Premium UI assets & Lottie animations

Animated Icons - 500 Free Icons

Everyone loves pages that pop with personality. Add visual interest to web and mobile user interfaces with our pack of 500 animated icons. Get them in multiple formats-download GIF, JSON (Lottie) and After Effects. These motion graphics are all free for a link, so go ahead and download animations to polish your checkout experience, media interactions, or social sharing.

icons8.com

Royalty-Free GIFs, GIF Icons and Animated ClipArt GIF - Cliply

Grab their attention with Royalty-Free Stock Animated GIF designed for personal and commercial use! Copyright Free ClipArt and Icons.

cliply.co

Royalty-Free GIFs, GIF Icons and Animated ClipArt GIF - Cliply

Framer Motion: Production-Ready Animation Library for React

Framer Motion is a production-ready React animation and gesture library.

www.framer.com

Framer Motion: Production-Ready Animation Library for React

A micro-animations library

Animated icons in Lottie Framework and for immediate implementation to your apps or websites.

useanimations.com

Potlab Icons - Animated SVG icons for web projects

Animated SVG icons for web projects. Get CSS, SVG code then easily customize the animated icons.

potlabicons.com

Potlab Icons - Animated SVG icons for web projects

loading.io - Your SVG + GIF + PNG Ajax Loading Icons and Animation Generator

loading.io is now loading ... Ajax Loader, Animated Icons, Live Background ... in GIF / SVG / APNG / CSS ! go Pro to unlock all fonts Animate what you need. Text, Patterns, or Backgrounds. all icons are also available in static form released under loading.io BY license.

loading.io

Rive - Build interactive motion graphics that run anywhere

Complex designer-developer handoff is a thing of the past. Build functional graphics with motion and interactivity that run in products, apps, sites, and games.

rive.app

Rive - Build interactive motion graphics that run anywhere

Para criar animações

SVG Animation Creator - No Coding Skills Required | SVGator

Discover the ultimate SVG animation creator at SVGator. Import, animate, and export SVG without any coding skills. Sign up for a free 14-day trial today!

www.svgator.com

SVG Animation Creator - No Coding Skills Required | SVGator

Haiku | Software is more than code.

Whether you design, code, or manage - Haiku's toolsfor teams help you create, together. Get started Our Products Open-source design token framework. Radically reduce the cost of delivering a consistent visual identity across your company's apps & websites. Learn more Create powerful timeline animations using Sketch, Figma, or Illustrator - Implement instantly in any iOS, Android, or Web codebase.

www.haiku.ai

Prototipação interativa

ProtoPie: the interactive digital prototyping tool

Eduardo Sonnino,Senior Designer, Microsoft "We've tried countless prototyping tools and ProtoPie is hands down the most flexible and powerful tool that fits perfectly into any team's workflow. No matter which tools or platform are being used, we can import our design assets in seconds and make awesome code-free prototypes in minutes."

www.protopie.io

ProtoPie: the interactive digital prototyping tool

Pra você criar protótipos interativos de alta fidelidade

Principle

Principle makes it easy to design animated and interactive user interfaces. Whether you're designing the flow of a multi-screen app, or new interactions and animations, Principle helps you create designs that look and feel amazing.

principleformac.com

Mesma coisa, mas pra quem usa a stack Sketch/Mac

Me recomenda um curso

Conectando interfaces e movimento

Abertura de Novas Vagas 07 de Setembro Início da Próxima Turma: 06 de Outubro Primavera 2020 Saber animar muitos sabem... porém animar para interfaces, isso é para poucos. O UX Motion Design trata da animação voltada para a Experiência do Usuário.

uxmotiondesign.com

Curso pago voltado para Motion Design