Warning: file_get_contents(http://vimeo.com/api/v2/video/606352602.json): Failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/customer/www/vertwebsolutions.com/public_html/wp-content/plugins/ut-shortcodes/shortcodes/video.php on line 1628
Why Animating Your Content Creates More User Engagement
Lets start with the basics.
An social media post accompanied by a photo is ten times more likely to get engagement. Because our brains respond so quickly to images and color in comparison to other types of information.
So taking it a step further and animating your image will also increase engagement.
The reasoning being that transitional animations allow our brains to easily connect processes or identify new pieces of information. One of the best examples of a transitional interface is a load screen icon –it keeps moving to let users know that the website hasn’t stopped processing their request.
Quick Stats Related B2B Marketing
• Infographics are the fourth most used type of content marketing. (HubSpot)
• Infographics have had the biggest increase in usage among B2B marketers in the last four years — now at 67%. (Content Marketing Institute)
• People following directions with text and illustrations do 323% better than people following directions without illustrations.
• Interactive content gains twice as much engagement as static content.
• 45% of B2B buyers say interactive content is among their top three preferred content types.
• Visual content, such as GIFs or online quizzes with images, is 40x more likely to be shared on social networks.
• 88% of marketers say interactive content sets them apart from their competitors.
• 70% of marketers agree that interactive content easily converts site visitors.
• 91% of buyers search for more interactive content.
Simple ways to make your post more engaging.
1. Create interactive charts and graphs to show data
If your client has a of customer or service related data this is a perfect way to display that to the audience. This is a simple and effective ways to impress your readers. SVG’s are easily interactive, animated and can be used with any type of data
2. Logo’s or Banners
Why not let your audience have fun and let them click to show the evolutions of your brand or animate product banners where they can click and have additional features popup.
3. Creating Outlines
Line drawings are common way designers use SVG’s in projects. You can create diagrams, workflows or even the products themselves that is easier for the audience to understand. Line drawings can tell a story about your product or brand, below is an example of Leica Microsystems..
Animated SVG’s, What Are They & Why You Should Use Them in WeChat
What Are SVG’s? Lets start here with technical explanation… “Scalable Vector Graphics (SVG) is an Extensible Markup Language (XML)-based vector image format for two-dimensional graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999.” From Wikipedia
And now a less technical explanation…A Scalable Vector Graphic (SVG) is a unique type of image format. Unlike other image formats (jpg, png, etc) , SVGs don’t rely on unique pixels to make up the images you see. By using SVGs, you get images that can scale up to any resolution, which comes in handy for web design and other use cases (no likes a blurry, pixelated image), in our case WeChat Official Account Articles
Just a couple of examples of SVG animation in WeChat articles:
Example from Manner Coffee X AllBirds
Warning: file_get_contents(http://vimeo.com/api/v2/video/606171560.json): Failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/customer/www/vertwebsolutions.com/public_html/wp-content/plugins/ut-shortcodes/shortcodes/video.php on line 1628
Warning: file_get_contents(http://vimeo.com/api/v2/video/606353298.json): Failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/customer/www/vertwebsolutions.com/public_html/wp-content/plugins/ut-shortcodes/shortcodes/video.php on line 1628
Different from SVG, A Lottie is a JSON-based animation file format that enables designers to display animations on any platform as easily as shipping static assets. They are small files that work on any device and can scale up or down without pixelation.
Below are some simple example of Lottie Animations which seem to be gaining some steam in web design world.
A Lottie is a JSON-based animation file format that enables designers to ship animations on any platform as easily as shipping static assets. They are small files that work on any device and can scale up or down without pixelation.
A Lottie animation can play your animation on web or mobile devices while still maintaining a nice high quality. It can also have smart settings that can allow for your animation to be interactive.
