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
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]](https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/ea716479-1ffd-428f-b5cd-9faaaae67478/1*lY-o0qXsz_PN2rR8pxA5BQ/w=640,quality=90,fit=scale-down)
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
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
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
Framer Motion: Production-Ready Animation Library for React
Framer Motion is a production-ready React animation and gesture library.
www.framer.com
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
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
Para criar animações
Phase - Animação para designers de produtos
A Phase está trazendo animação fácil e colaborativa para designers de produtos.
www.phase.com
Lottie Creator is a web-based animation tool
Lottie Creator is designed to create ultra-lightweight, highly customizable and interactive animations for web, apps and social. Supercharged with AI-based Motion Copilot.
lottiefiles.com
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
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
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
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
Me recomenda um curso
Aprenda - Torne-se especialista
Encontre tutoriais passo a passo e documentação técnica para dominar a Phase.
www.phase.com
Portuguese Motion Course | Phase
Explore Portuguese Motion Course space in Phase
community.phase.com
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
