{"id":47238,"date":"2018-05-18T10:46:08","date_gmt":"2018-05-18T13:46:08","guid":{"rendered":"https:\/\/newblog.creatopy.com\/blog\/?p=47238"},"modified":"2023-07-24T14:16:04","modified_gmt":"2023-07-24T11:16:04","slug":"animated-gif-examples","status":"publish","type":"post","link":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/animated-gif-examples\/","title":{"rendered":"Email Marketing Inspiration: 15 Animated GIF Examples"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Are you on the hunt for some inspiration to build your next email? <\/span><span style=\"font-weight: 400;\">You couldn&#8217;t have found a better place to start. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Join me on a five-minute reading journey as I present you 15 animated GIF examples and break down the steps of the creation process. <\/span><\/p>\n<p><!--more--><\/p>\n<p><span style=\"font-weight: 400;\">You can (and you will) start creating an animated GIF for your email today, as soon as you finish reading this article. Believe me.<a href=\"https:\/\/app.creatopy.com\/auth\/create-account?internal_source=internal&amp;internal_medium=Blog&amp;internal_campaign=BlogContentCTA\" target=\"_blank\" rel=\"noopener\"><img fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-70342 size-full\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png\" alt=\"\" width=\"700\" height=\"90\" srcset=\"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png 700w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-600x77.png 600w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-150x19.png 150w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a><\/span><\/p>\n<h2>A GIF Can Make Your Email Look Less Stiff<\/h2>\n<p><span style=\"font-weight: 400;\">Email marketing has been around for over 30 years, and it&#8217;s here to stay. However, if we want to stay on top, we need to continually improve our emails and find ways to surprise our contacts.<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/sprinklefest.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"800\" height=\"600\"><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">As marketers, we want our sales emails to stand out in the inbox, engage the customers, and motivate them to take specific actions like filling a form, buying a product, or attending an event. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">There are many ways of looking at improving our company emails. One of them is including badass content. Impressive visuals that invite people on a journey to our websites through the simple click of a mouse. Let me tell you a secret: using GIFs in email marketing can help you get attention, engagement, and conversions.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Here&#8217;s a brief list of the benefits a small thing as a<\/span>\u00a0<span style=\"font-weight: 400;\">GIF in email marketing <\/span><span style=\"font-weight: 400;\">can bring to your company:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">GIFs work on any device. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">They have increased reader engagement.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">GIFs are supported by all major email clients. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">They provide higher email click-through rates. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">GIFs make emails look more professional, which in turn increases your customers&#8217; trust. <\/span><\/li>\n<\/ul>\n<h2><strong>15 Examples of Animated GIFs in Email Marketing<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">If you&#8217;re wondering how to make an animated GIF, here&#8217;s a list of animated GIF examples I&#8217;ve put together for you. You&#8217;ll find a detailed explanation of the process for each GIF so that you can better understand how it&#8217;s done and help you create one for yourself as soon as you finish reading this post.<\/span><\/p>\n<p>Here&#8217;s a step by step video on how to <a href=\"https:\/\/www.creatopy.com\/create\/gif-ads\/\" target=\"_blank\" rel=\"noopener\">create an amazing animated GIF<\/a> for your email marketing campaigns with Creatopy:<\/p>\n<h2><strong>1. Chewy&#8217;s cute little kitty moving its whiskers in delight<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Chewy, an online pet food store, sent a sales email to promote their 4 most popular cat food brands. In it, they featured this sweet animated GIF. So touching! As a cat owner, I can testify: watching a cat&#8217;s facial expressions is heart-melting. So, good job, Chewy, for finding this great insight!<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Chewy-pet-food-online-store.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"640\" height=\"492\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">If you&#8217;d like to create a similar GIF to surprise your customers, here&#8217;s how: <\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create a beautiful visual with your main object\/person\/animal. Create additional features (whiskers, hands, pieces of clothes, etc.) that you can use as moving parts to make it look alive.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate this slide and just change the position of the whiskers\/hands\/legs\/clothes. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download in GIF or MP4 format. That&#8217;s it.<\/span><\/li>\n<\/ol>\n<h2><strong>2. Netflix&#8217;s email announcement for the upcoming season of House of Cards<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Netflix&#8217;s emails can be as cool as their movies. Here&#8217;s a brilliant GIF announcing the next season of their popular series, House of Cards. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Can you feel the chills running down your spine when Francis Underwood looks you in the eyes? What on Earth is he up to this time?!<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/house-of-cards.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"800\" height=\"600\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">How to create a similar GIF:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create a YouTube account (in case you don&#8217;t already have one) and upload the video you want to use for your email GIF. Make sure the video has no more than 10-15 seconds. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create a <\/span><a href=\"https:\/\/app.creatopy.com\/auth\/login\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Creatopy account <\/span><\/a><span style=\"font-weight: 400;\">(in case you don&#8217;t already have one) and click on &#8220;Create.&#8221; <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Picture your GIF already in your email. This will help you to decide which format size you&#8217;d like to use. You can go for a header GIF banner (728 x 90), a rectangle (336 x 280), or a large rectangle format (1200 x 900). <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">After you choose the size, click on Elements &gt; Widgets &gt; YouTube video. Then, click on the Settings icon, and add the YouTube&#8217;s video URL in the box.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Pull and stretch your video to fit your banner size or adjust it. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Add a shape over the video if you want to hide a part of it and to create a beautiful background for your logo and text.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Add your logo.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Add some text. If you want to create the same kind of animations Netflix used for their GIF, add two or three textboxes and organize them to fade in and fade out at different timings. Thanks to Creatopy&#8217;s Timeline, you can easily set your texts chronologically and <a href=\"https:\/\/newblog.creatopy.com\/blog\/easy-to-create-animation-effects-for-ads\/\">create animation effects<\/a> like fade in, fade out, blow, bounce, roll down, roll up, etc.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">After you&#8217;re done, you can<\/span><span style=\"font-weight: 400;\"> download the file in GIF format. Choose the high-quality option to make sure it looks as good as possible.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">And you&#8217;re done.<\/span><\/li>\n<\/ol>\n<h2><strong>3. MailChimp&#8217;s automation feature promo email<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">MailChimp found a suggestive way to present its new automation feature to its customers: a GIF made of moving shapes that build the word &#8220;Automation,&#8221; letter by letter. If you feel intimidated already, don&#8217;t. You, too, can create a cute GIF like this.<\/span><\/p>\n<p><img decoding=\"async\" class=\"size-full wp-image-47303 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Automation.gif\" alt=\"animated gif emails\" width=\"1024\" height=\"512\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Here&#8217;s how: <\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create your first slide and add your logo and your first shape. Add an animation effect to the shape. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide and add one more shape (different than the first one, different color) and its animation.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the second slide and add another shape with a different animation. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the third slide and add a new shape and an animation effect for it. Make sure you combine different shapes. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slides and add shapes until you finish building a word. <\/span><\/li>\n<\/ol>\n<h2><strong>4. Creatopy&#8217;s Timeline feature promo email<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">When we launched the Timeline feature, we thought it would be nice to show people how it works before they tried it out for themselves in the Creatopy editor. So we made this GIF.<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Animations-creatopy.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"736\" height=\"760\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">You can make a GIF like this one by recording 10-20 seconds of a scene you choose and then just save it as a GIF. <\/span><\/p>\n<h2><strong>5. Loft&#8217;s flash sale<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">This original GIF makes our eyes roll in wonder. Ka-Ching. Ka-Ching. Ka-Ching.<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Loft-flash-sale.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"580\" height=\"845\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">Here&#8217;s how to create a similar GIF:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Design the main layout, add three rectangular shapes, and put three objects inside each rectangle. Animate your objects using the slide up effect.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, delete the three objects, and add three other objects. Then slide them up.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide again, delete the objects you&#8217;ve added to the second slide, and add three new objects. Animate these as well, sliding them up. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download once you&#8217;re happy with the results.<\/span><\/li>\n<\/ol>\n<h2><strong>6. Bigfish.tv&#8217;s email invitation to the company&#8217;s party<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">When we think of parties, we think of music, dance, lots of people and fun. And alcohol.. (but that&#8217;s just between you and me).\u00a0<\/span>This is exactly the insight behind Bigfish.tv&#8217;s creative process.<\/p>\n<p>They wanted to introduce people into the atmosphere of the party right from the moment they clicked the email. So they came up with this animated GIF, using flashing splashes of color and small little people dancing their hearts out.<\/p>\n<p>And a lady looking forward to the event, of course. You can tell she cannot wait for the party to happen by the way she blinks. Blink. Cannot wait. Blink.<\/p>\n<p><img decoding=\"async\" class=\"size-full wp-image-47307 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/bigfish-party_dribble.gif\" alt=\"animated emails\" width=\"800\" height=\"600\" \/><\/p>\n<p><span style=\"font-weight: 400;\">How to create a similar GIF:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create your main layout. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate your slide and add a splash of color. Let&#8217;s say the color is pink. Then add an animation effect. Go for a fade or a soft blur. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, delete the splash, and add a new one. Choose white as a color. Choose your animation effect. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, delete the splash, and small blue dots. Don&#8217;t forget to choose your animation effect.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Now how do you make the people dance? Go back to each slide and add the people. Start with the first one. Add the people with their hands down.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Go to the second slide, delete the people, and add new ones with their hands above their shoulders.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Go to the third slide, delete the people again, and add new figurines with their hands up. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download.<\/span><\/li>\n<\/ol>\n<h2><strong>7. Mountain Khakis&#8217; Memorial Day sale<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">I&#8217;ve got more animated GIF examples for you, so grab an ice tea and hang in there with me. This clothing brand for mountain lovers found a simple but effective way to communicate their Memorial Day discount. Learn how you can create a similar GIF below:<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Mountain-Khakis.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"640\" height=\"476\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create your first slide, add your text.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, delete the text, and add new words. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download. That&#8217;s it.<a href=\"https:\/\/app.creatopy.com\/auth\/create-account?internal_source=internal&amp;internal_medium=Blog&amp;internal_campaign=BlogContentCTA\" target=\"_blank\" rel=\"noopener\"><img fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-70342 size-full\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png\" alt=\"\" width=\"700\" height=\"90\" srcset=\"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png 700w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-600x77.png 600w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-150x19.png 150w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a><\/span><\/li>\n<\/ol>\n<h2 style=\"text-align: left;\"><strong>8. Halloween Newsletter from Last Craft Designs<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Time for a spooky GIF. But first, I must warn you: this one is so easy to create you&#8217;ll be outraged.<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Last-craft-designs-1.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"640\" height=\"476\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">How to make a GIF following this model:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create your visual and add your text. Choose grey as the primary text color.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide and change the color of the first word from grey to orange.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, change the color of the first word back to grey, and the color of the second word to red.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide, change the color of the second word back to grey. Both words (first and second) should be grey at this time. Change the color of the third word to white. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download. <\/span><\/li>\n<\/ol>\n<h2 style=\"text-align: left;\"><strong>9. Sittercity&#8217;s astronaut GIF ad<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Sittercity, an online babysitter booking agency in the US, sent this cute GIF to their customers to emphasize how hard it is for parents to find a babysitter for their children. No problem, here, Houston! We&#8217;ve found our way!<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-47308 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/astronautsitterpreviewdribbble.gif\" alt=\"gifs in email marketing\" width=\"800\" height=\"600\" \/><\/p>\n<p><span style=\"font-weight: 400;\">How to create a cute GIF like this:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create your visual, add all the elements of the composition.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Duplicate the slide. Change the position of the main characters in the story. Add some additional elements like stars, clouds, and animate them using the fade-in effect.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download.<\/span><\/li>\n<\/ol>\n<h2><strong>10. Design a Glow&#8217;s promo email for a USB design box<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Less is more. Here&#8217;s an example of a minimum design effort and a great result.<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/usb-gift-unwrapping.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"700\" height=\"467\"><\/video><\/figure>\n<p><span style=\"font-weight: 400;\">Create one for yourself:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Take pictures of your objects in various positions. If you want to follow this example, that is to take an object out of a box, take photos of the object at different stages when you take it out of the box, and put it on the table. <\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create a slide for each picture.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Add text on whichever slide you want.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Play and download.<\/span><\/li>\n<\/ol>\n<h2><strong>Animated GIFs Created in Creatopy:<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">And now, I&#8217;d like you to have a look at these animated GIF examples created in Creatopy.<\/span><\/p>\n<p>By the way, did I tell you that we now have the <a href=\"https:\/\/help.bannersnack.com\/hc\/en-us\/articles\/360015043499-Using-the-Giphy-Widget\" target=\"_blank\" rel=\"noopener\">GIPHY Widget integration<\/a>? This means that you can use any element from the GIPHY library in your designs, and edit it just like you would with a video.<\/p>\n<h2><strong>11. Clothes promotion<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Here&#8217;s an adorable four frame GIF banner that instantly grabs your attention and transports you to the pink world of women&#8217;s clothes promotions. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">What makes this banner so special is the animation created with Creatopy&#8217;s Magic Animator tool. See how the gifts pop up in the third frame?<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-47316 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Pink-Friday-GIF-for-article-2.gif\" alt=\"gifs emails\" width=\"728\" height=\"90\" \/><\/p>\n<p>&nbsp;<\/p>\n<h2><strong>12. EVO TV<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">A TV provider in Croatia created this GIF to send their customers an exclusive offer email. I love the way the popcorn pops and dances all around. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">This kind of GIF is so easy to create! They used 3 different pictures of the popcorn and animated them to dance, spreading the popcorn all over the layout. Kind of inviting, isn&#8217;t it? I suddenly feel the urge to watch a good movie. <\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-47254\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Copy-of-EVOTV-FB-05-18-Videoteka.gif\" alt=\"animated emails\" width=\"1200\" height=\"630\" \/><\/p>\n<h2><strong>13. Wedding invitations<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">You can even create an animated email to invite your friends and family to your wedding. Everyone will be surprised! Here&#8217;s an example: 4 animated frames, flowers blooming all around, and a short text with the event&#8217;s details. <\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-47311 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Wedding-Optimized.gif\" alt=\"gifs in emails marketing\" width=\"851\" height=\"315\" \/><\/p>\n<h2><strong>14. NGO motivational emails<\/strong><\/h2>\n<p>Or if you&#8217;re an NGO concerned about the health of the people living in big cities, you can send out a motivational animated email on Picnic Day. Using Creatopy&#8217;s templates, ready-made elements, and animation effects, you can create a stunning GIF like this one below.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-47312 aligncenter\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Nature-Optimized.gif\" alt=\"animated gifs in email marketing\" width=\"851\" height=\"315\" \/><\/p>\n<h2><strong>15. Tourism emails<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">The possibilities to create animated GIFs with Creatopy are endless. Look at this one, for example. There are only 2 frames, but the animated text and sliding effects make it totally memorable. Wouldn&#8217;t you agree? \u00a0<\/span><\/p>\n<figure class=\"wp-block-video\"><video src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/05\/Travel-to-an-island.mp4\" autoplay=\"autoplay\" loop=\"loop\" muted=\"\" controls=\"controls\" width=\"700\" height=\"525\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/video><\/figure>\n<h2><strong>Create a State-of-the-Art GIF in Minutes with Creatopy<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">If you feel inspired by these 15 animated GIF examples and would like to go ahead and make a creative GIF for your next email marketing campaign, you can create a free account with Creatopy and start designing your custom GIF right now. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can choose your preferred size format, upload your pictures, or choose one from our vast stock database. Also, you can add your logo and products and use animation effects to make them come alive. <\/span>Before you start, you may want to learn about the technical details of an animated GIF.<\/p>\n<p>So, read on about the ideal size, how to insert a GIF in an email, and check out the list of email clients that support GIFs.<\/p>\n<h2><strong>What&#8217;s the Ideal Size of GIFs in Emails?<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Animated GIF sizes can get quite large if there are too many frames. The more frames you add, the bigger the file gets. For email, it&#8217;s better to refrain yourself and stick with 4 to 5 frames. Don&#8217;t worry, you can create awesome GIFs even with 2 frames!<\/span><\/p>\n<p>While the ideal size of a GIF for email marketing is 400 kb, you can aim to keep it under 1MB.<\/p>\n<p><span style=\"font-weight: 400;\">What&#8217;s bigger than 1MB will either have a hard time uploading, or the email will be blocked by the mail client. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Keep in mind that people check their mail on their phones too, so keep it as small as possible! <\/span><\/p>\n<h2><strong>How to Insert a GIF into an Email<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">After you have optimized your GIF, you&#8217;ll want to include it in your email. This is easy. You can add your GIF in the email just the way you would upload an image, because after all, GIF is only another image file. \u00a0<\/span><\/p>\n<h2><strong>Email Client Support<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Animated GIFs work well in all major webmail, desktop, and mobile clients with a few exceptions. <\/span><span style=\"font-weight: 400;\">The exceptions are Microsoft Outlook 2007, 2010, and 2013. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Here&#8217;s the entire list of email clients:<\/span><\/p>\n<table style=\"width: 625px;\">\n<tbody>\n<tr style=\"height: 42px;\">\n<td style=\"width: 207.043px; height: 42px;\"><strong>Desktop Clients<\/strong><\/td>\n<td style=\"width: 206.957px; height: 42px;\"><b>Webmail Clients<\/b><\/td>\n<td style=\"width: 250px; height: 42px;\"><b>Mobile Clients<\/b><\/td>\n<\/tr>\n<tr style=\"height: 36px;\">\n<td style=\"width: 207.043px; height: 36px;\"><span style=\"font-weight: 400;\">Lotus Notes (6, 7, 8.5)<\/span><\/td>\n<td style=\"width: 206.957px; height: 36px;\"><span style=\"font-weight: 400;\">Gmail<\/span><\/td>\n<td style=\"width: 250px; height: 36px;\">iOS Mail<\/td>\n<\/tr>\n<tr style=\"height: 34.3096px;\">\n<td style=\"width: 207.043px; height: 34.3096px;\"><span style=\"font-weight: 400;\">Outlook 2000-2003<\/span><\/td>\n<td style=\"width: 206.957px; height: 34.3096px;\"><span style=\"font-weight: 400;\">G Suite<\/span><\/td>\n<td style=\"width: 250px; height: 34.3096px;\">Android (Default)<\/td>\n<\/tr>\n<tr style=\"height: 45px;\">\n<td style=\"width: 207.043px; height: 45px;\"><span style=\"font-weight: 400;\">Outlook 2007-2013<\/span><\/td>\n<td style=\"width: 206.957px; height: 45px;\"><span style=\"font-weight: 400;\">Yahoo! Mail<\/span><\/td>\n<td style=\"width: 250px; height: 45px;\">Android (Gmail)<\/td>\n<\/tr>\n<tr style=\"height: 34px;\">\n<td style=\"width: 207.043px; height: 34px;\"><span style=\"font-weight: 400;\">Outlook for Mac<\/span><\/td>\n<td style=\"width: 206.957px; height: 34px;\"><span style=\"font-weight: 400;\">AOL<\/span><\/td>\n<td style=\"width: 250px; height: 34px;\">Android (Gmail IMAP)<\/td>\n<\/tr>\n<tr style=\"height: 55px;\">\n<td style=\"width: 207.043px; height: 55px;\"><span style=\"font-weight: 400;\">Apple Mail<\/span><\/td>\n<td style=\"width: 206.957px; height: 55px;\"><span style=\"font-weight: 400;\">Outlook.com<\/span><\/td>\n<td style=\"width: 250px; height: 55px;\">Blackberry<\/td>\n<\/tr>\n<tr style=\"height: 55px;\">\n<td style=\"width: 207.043px; height: 55px;\"><span style=\"font-weight: 400;\">Windows 10 Mail<\/span><\/td>\n<td style=\"width: 206.957px; height: 55px;\"><span style=\"font-weight: 400;\">Comcast<\/span><\/td>\n<td style=\"width: 250px; height: 55px;\"><\/td>\n<\/tr>\n<tr style=\"height: 38px;\">\n<td style=\"width: 207.043px; height: 38px;\"><\/td>\n<td style=\"width: 206.957px; height: 38px;\"><span style=\"font-weight: 400;\">Orange.fr<\/span><\/td>\n<td style=\"width: 250px; height: 38px;\"><\/td>\n<\/tr>\n<tr style=\"height: 19px;\">\n<td style=\"width: 207.043px; height: 19px;\"><\/td>\n<td style=\"width: 206.957px; height: 19px;\"><span style=\"font-weight: 400;\">SFR.fr<\/span><\/td>\n<td style=\"width: 250px; height: 19px;\"><\/td>\n<\/tr>\n<tr style=\"height: 4px;\">\n<td style=\"width: 207.043px; height: 4px;\"><\/td>\n<td style=\"width: 206.957px; height: 4px;\"><span style=\"font-weight: 400;\">GMX.de<\/span><\/td>\n<td style=\"width: 250px; height: 4px;\"><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<table style=\"height: 121px; width: 620px;\">\n<tbody>\n<tr style=\"height: 37px;\">\n<td style=\"width: 192.401px; height: 37px;\"><\/td>\n<td style=\"width: 192.599px; height: 37px;\">Web.de<\/td>\n<td style=\"width: 229px; height: 37px;\"><\/td>\n<\/tr>\n<tr style=\"height: 34px;\">\n<td style=\"width: 192.401px; height: 34px;\"><\/td>\n<td style=\"width: 192.599px; height: 34px;\">T-Online.de<\/td>\n<td style=\"width: 229px; height: 34px;\"><\/td>\n<\/tr>\n<tr style=\"height: 37px;\">\n<td style=\"width: 192.401px; height: 37px;\"><\/td>\n<td style=\"width: 192.599px; height: 37px;\">Freenet.de<\/td>\n<td style=\"width: 229px; height: 37px;\"><\/td>\n<\/tr>\n<tr style=\"height: 36.8545px;\">\n<td style=\"width: 192.401px; height: 36.8545px;\"><\/td>\n<td style=\"width: 192.599px; height: 36.8545px;\">Mail.ru<\/td>\n<td style=\"width: 229px; height: 36.8545px;\"><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><b>\u00a0<\/b><\/p>\n<p><span style=\"font-weight: 400;\">Source of email clients list <\/span><a href=\"https:\/\/www.litmus.com\/blog\/a-guide-to-animated-gifs-in-email\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">here<\/span><\/a>.<\/p>\n<p><span style=\"font-weight: 400;\">I hope you&#8217;ve found enough inspiration here to get started with animated GIFs. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">For more tips and information on how to create unique visuals for your promotional campaigns, keep an eye on our blog. We&#8217;ve got freshly served blog posts every week.<a href=\"https:\/\/app.creatopy.com\/auth\/create-account?internal_source=internal&amp;internal_medium=Blog&amp;internal_campaign=BlogContentCTA\" target=\"_blank\" rel=\"noopener\"><img fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-70342 size-full\" src=\"https:\/\/newblog.creatopy.com\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png\" alt=\"\" width=\"700\" height=\"90\" srcset=\"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns.png 700w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-600x77.png 600w, https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-content\/uploads\/2018\/07\/create-and-launch-ad-campaigns-150x19.png 150w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Are you on the hunt for some inspiration to build your next email? You couldn&#8217;t have found a better place to start. Join me on a five-minute reading journey as I present you 15 animated GIF examples and break down the steps of the creation process. You can (and you<\/p>\n","protected":false},"author":181,"featured_media":47271,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[3328,3984],"tags":[],"acf":[],"_links":{"self":[{"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/posts\/47238"}],"collection":[{"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/users\/181"}],"replies":[{"embeddable":true,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/comments?post=47238"}],"version-history":[{"count":22,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/posts\/47238\/revisions"}],"predecessor-version":[{"id":82243,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/posts\/47238\/revisions\/82243"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/media\/47271"}],"wp:attachment":[{"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/media?parent=47238"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/categories?post=47238"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/creatopydevelopmentblog.kinsta.cloud\/blog\/wp-json\/wp\/v2\/tags?post=47238"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}