![]() ![]() ![]() They of course look great, as a matter of a fact so good that I do believe it would be difficult to purchase just one brush and leave it there - luckily Lottie London brushes are utterly affordable (more or less under £10 each), not to mention cruelty free and vegan. With more and more people consuming content through their mobile devices, and motion graphics and video proving to be increasingly more important for maximizing engagement with audiences, Lottie is just about the best solution there is for producing dynamic, high-quality, lightweight motion graphics.As you can mostly likely see, yes the Lottie London brushes are bright, colourful and a step away from the norm. The graphics were then ported over from Adobe Illustrator to After Effects using Overlord, where the final animation was completed. To get my vector graphics nice and clean, I relied heavily on the Vector First Aid plugin from Astute Graphics. The animation displays at 60 frames per second and plays everywhere, including mobile devices. Below is all the code required to generate this animation:įlatten The Curve Explainer Graphic by Jeffrey Karl ( CodePen. The entire graphic is exported to a JSON file that is 1.1MB in size. The animation was exported using the Bodymovin plugin and uses the wonderful scripts provided by. This is a slightly tongue-in-cheek explainer graphic based on the now famous (or infamous) ‘flatten the curve’ article and infographic done by The Economist. The ability to mix and match these tools and plugins means there’s more opportunity than ever to produce some remarkably detailed artwork while keeping file sizes small (i.e. There are so many tools available for creating lightweight vector graphics - or even something as simple as an animation with a transparent background. The exact code for implementation (again, using a WordPress CMS) is below: The SVG was uploaded to and hosted on my Codepen account. ![]() The second animation (just for a personal test) was exported with the Keyshape app, using their Keyshape file format. You can see the exact code that was used to implement the Lottie animation below (using a WordPress CMS): The first animation was embedded with the help of ’s web player tool. The second graphic with Tulsi Gabbard and Dan Crenshaw relied heavily on the Astute Graphics plugin suite, specifically the Width Stamp and Vector First Aid tools. Some finishing touches were added using the Keyshape App. Above is an animated campaign graphic.īoth graphics were created using Bodymovin and After Effects. The two candidates drafted for Unity 2020’s campaign were Tulsi Gabbard and Dan Crenshaw. The idea was that they would govern as a team. The second part of the campaign came when two candidates were “drafted” from the two major American political parties. The final product is a web-friendly Lottie animation. The animated logo above attempts to symbolize the desire to break the existing left-right political paradigm and build something new out of what remains. The goal was to build a genuine third party alternative while avoiding the pitfalls and criticisms that typically accompany a third party candidate. I thought this was a worthy cause and decided to volunteer some design work to the group. One of the more interesting movements to come out of it was Brett Weintstein’s Unity 2020 campaign. The 2020 presidential campaign was a highly contentious one. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |