mirror of
https://github.com/MarshalX/telegram-crawler.git
synced 2024-11-24 08:16:34 +01:00
263 lines
19 KiB
HTML
263 lines
19 KiB
HTML
<!DOCTYPE html>
|
||
<html class="">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>Animated Stickers Done Right</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta property="og:title" content="Animated Stickers Done Right">
|
||
<meta property="og:image" content="https://telegram.org/file/464001154/1/7GPPe2Yjums.71766/5a39af4670f27356ad">
|
||
<meta property="og:site_name" content="Telegram">
|
||
<meta property="og:description" content="We launched stickers back in January 2015. Since then, the Telegram sticker format has been adopted by other apps to reach a total of 2 billion people. Today we're introducing a new format for animated stickers.">
|
||
|
||
<meta property="article:published_time" content="2019-07-06T16:20:32+00:00"><meta name="twitter:card" content="summary_large_image" /><meta name="twitter:image" content="https://telegram.org/file/464001154/1/7GPPe2Yjums.71766/5a39af4670f27356ad" />
|
||
<meta property="fb:app_id" content="254098051407226">
|
||
<meta property="vk:app_id" content="3782569">
|
||
<meta name="apple-itunes-app" content="app-id=686449807">
|
||
<meta name="telegram:channel" content="@telegram">
|
||
<link rel="canonical" href="https://telegram.org/blog/animated-stickers" />
|
||
<link rel="icon" type="image/svg+xml" href="/img/website_icon.svg?4">
|
||
<link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon.png">
|
||
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
|
||
<link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">
|
||
<link rel="alternate icon" href="/img/favicon.ico" type="image/x-icon" />
|
||
<link href="/css/bootstrap.min.css?3" rel="stylesheet">
|
||
|
||
<link href="/css/telegram.css?236" rel="stylesheet" media="screen">
|
||
</head>
|
||
<body class="preload">
|
||
<div id="fb-root"></div>
|
||
<div class="tl_page_wrap">
|
||
<div class="tl_page_head navbar navbar-static-top navbar navbar-tg">
|
||
<div class="navbar-inner">
|
||
<div class="container clearfix">
|
||
<ul class="nav navbar-nav navbar-right"><li class="dropdown top_lang_select"><a class="dropdown-toggle" onclick="return dropdownClick(this, event)" href="#"><i class="dev_top_lang_icon"></i>EN <b class="minicaret"></b></a>
|
||
<ul class="dropdown-menu"><li class="chosen "><a href="?setln=en">English</a></li><li class="long "><a href="?setln=id">Bahasa Indonesia</a></li><li class="long "><a href="?setln=ms">Bahasa Melayu</a></li><li class=""><a href="?setln=de">Deutsch</a></li><li class=""><a href="?setln=es">Español</a></li><li class=""><a href="?setln=fr">Français</a></li><li class=""><a href="?setln=it">Italiano</a></li><li class=""><a href="?setln=nl">Nederlands</a></li><li class=""><a href="?setln=uz">O‘zbek</a></li><li class=""><a href="?setln=pl">Polski</a></li><li class="long "><a href="?setln=pt-br">Português (Brasil)</a></li><li class=""><a href="?setln=tr">Türkçe</a></li><li class=""><a href="?setln=be">Беларуская</a></li><li class=""><a href="?setln=ru">Русский</a></li><li class=""><a href="?setln=uk">Українська</a></li><li class=""><a href="?setln=ar">العربية</a></li><li class=""><a href="?setln=fa">فارسی</a></li><li class=""><a href="?setln=ko">한국어</a></li></ul></li><li class="navbar-twitter hidden-xs"><a href="https://twitter.com/telegram" target="_blank" data-track="Follow/Twitter" onclick="trackDlClick(this, event)"><i class="icon icon-twitter"></i> Twitter</a></li></ul>
|
||
<ul class="nav navbar-nav">
|
||
<li class=""><a href="/">Home</a></li>
|
||
<li class=""><a href="/faq">FAQ</a></li>
|
||
<li class=""><a href="/apps">Apps</a></li>
|
||
<li class="hidden-xs "><a href="//core.telegram.org/api">API</a></li>
|
||
<li class="hidden-xs "><a href="//core.telegram.org/mtproto">Protocol</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="container clearfix tl_page_container ">
|
||
<div class="tl_page">
|
||
<div class="tl_contest_page_wrap">
|
||
<div class="tl_blog_side_blog"><div class="side_blog_wrap">
|
||
<div class="side_blog">
|
||
<a href="/blog" class="side_blog_header">Recent News</a>
|
||
<div class="side_blog_entries">
|
||
<a href="/blog/new-saved-messages-and-9-more" class="side_blog_entry">
|
||
<div class="side_blog_date">Jan 31</div>
|
||
<div class="side_blog_title">Saved Messages 2.0, One-Time Voice Messages and 8 More Features</div>
|
||
</a><a href="/blog/calls-and-bots" class="side_blog_entry">
|
||
<div class="side_blog_date">Dec 31</div>
|
||
<div class="side_blog_title">Colorful Calls, Thanos Snap Effect, and Better Bots</div>
|
||
</a><a href="/blog/posts-in-stories-and-more" class="side_blog_entry">
|
||
<div class="side_blog_date">Dec 23</div>
|
||
<div class="side_blog_title">Channel Appearance, Posts in Stories and More</div>
|
||
</a><a href="/blog/similar-channels" class="side_blog_entry">
|
||
<div class="side_blog_date">Nov 30</div>
|
||
<div class="side_blog_title">Similar Channels, Reposting Stories, and 9 More Features</div>
|
||
</a><a href="/blog/giveaways" class="side_blog_entry">
|
||
<div class="side_blog_date">Nov 6</div>
|
||
<div class="side_blog_title">Giveaways in Channels and Free Premium</div>
|
||
</a><a href="/blog/reply-revolution" class="side_blog_entry">
|
||
<div class="side_blog_date">Oct 28</div>
|
||
<div class="side_blog_title">Replies 2.0, Adjustable Link Previews, Name Colors and More</div>
|
||
</a><a href="/blog/channel-stories" class="side_blog_entry">
|
||
<div class="side_blog_date">Sep 22</div>
|
||
<div class="side_blog_title">Stories in Channels, View-Once Media and More</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div></div>
|
||
<div id="dev_page_content_wrap" class=" ">
|
||
<div class="dev_page_bread_crumbs"></div>
|
||
<h1 id="dev_page_title">Animated Stickers Done Right</h1>
|
||
|
||
<div id="dev_page_content"><div class="blog_side_image_wrap">
|
||
<img src="/file/464001521/1/6li3qwayWto.24904/1d3d0efd640a61e4fe" class="blog_side_image"/>
|
||
</div>
|
||
|
||
<div class="blog_wide_image">
|
||
<a href="/file/464001776/1/OT3p5F-BpWc.201999/cf29b6606b9abd380a" target="_blank"><img src="/file/464001154/1/7GPPe2Yjums.71766/5a39af4670f27356ad" srcset="/file/464001776/1/OT3p5F-BpWc.201999/cf29b6606b9abd380a, 1200w" title="Archaeologists say that Telegram has supported stickers since the dawn of time but for the first time in history, you can watch them move. BTW, the gizmo in this picture is called a 'Praxinoscope'." alt="Cover Image"/></a>
|
||
</div>
|
||
|
||
<p>We launched <a href="https://telegram.org/blog/stickers">stickers</a> back in January <strong>2015</strong>. Since then, the Telegram sticker format has been adopted by other apps to reach a total of <strong>2 billion</strong> people. Today we're introducing a <strong>new format</strong> for <strong>animated stickers</strong>.</p>
|
||
<p>We asked ourselves: Can animated stickers have <strong>higher quality</strong> than static ones while taking <strong>less</strong> bandwidth? The answer turned out to be <em>YES</em> (but only after we told developers they'd get moving cat pictures).</p>
|
||
<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001273/1/AQspRFqKbUw.37605/a10ec56c664f124170" style="max-width: 400px;" title="Each animated sticker takes ~20-30 Kilobytes. If you find a floppy disk in the attic, you might fit up to twelve dozen animated stickers on it (and since you're retro enough to own a floppy disk, you might as well call twelve dozens a 'gross')." alt="Animated Telegram stickers in a chat and in the sticker panel">
|
||
<source src="/file/464001660/1/9pDnhhfdD4k.6301287.mp4/d533e8529b7fdccaa1" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
|
||
<!--<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001444/1/jbKsH5zv9jY.37315/5b9bf1ccd45efe548b" style="max-width: 400px;" title="Each animated sticker takes ~20-30 Kilobytes. If you find a floppy disk in the attic, you might fit up to twelve dozen animated stickers on it (and since you're retro enough to own a floppy disk, you might as well call twelve dozens a 'gross')." alt="TITLE">
|
||
<source src="/file/464001733/1/GKYJRff_YZ4.5384562.mp4/fef6ee3f08f9b6a1b5" type="video/mp4">
|
||
</video>
|
||
</div>-->
|
||
|
||
<h4><a class="anchor" name="smooth-animations-tiny-size" href="#smooth-animations-tiny-size"><i class="anchor-icon"></i></a>Smooth Animations, Tiny Size</h4>
|
||
<p>Telegram engineers experimented with vector graphics, packaging methods and forbidden magic to create the Lottie-based <strong>.TGS</strong> format, in which each sticker takes up about <strong>20-30 Kilobytes</strong> – <strong>six times</strong> smaller than the average photo.</p>
|
||
<p>Thanks to various optimizations, animated stickers consume <strong>less battery</strong> than GIFs and run at a smooth <strong>60 frames per second</strong>. If a picture is worth a thousand words, that's <strong>180,000</strong> words per sticker.</p>
|
||
<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001390/1/Nu0FRcUOOuc.32923/91c686c4b5ecb1f302" style="max-width: 400px;" title="Due to their small size, animated stickers will load instantly on any connection, so you can watch this cat in a tie while you await your rescue from a desert island." alt="Cat showing off muscles">
|
||
<source src="/file/464001497/1/2QKiFWOvlpQ.1246528.mp4/f2fac7a125f20dd801" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
|
||
<!--<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001663/1/VAdeeeaGydw.25311/07c380850bbae4309e" style="max-width: 400px;" title="Due to their small size, animated stickers will load instantly on any connection, so you can watch this cuddly cavy while you await your rescue from a desert island." alt="Applauding guinnea pig">
|
||
<source src="/file/464001666/1/h0xohkjiaJw.469399.mp4/4ff6651bd25543ec16" type="video/mp4">
|
||
</video>
|
||
</div>-->
|
||
|
||
<h4><a class="anchor" name="open-platform" href="#open-platform"><i class="anchor-icon"></i></a>Open Platform</h4>
|
||
<p>Naturally, animated stickers are a <strong>free platform</strong>. All artists are welcome to <strong>create</strong> new sets and <strong>share</strong> them with Telegram users.</p>
|
||
<p>Like its static predecessor, the Telegram animated sticker format is likely to become the new industry standard in messaging. Check out <a href="https://core.telegram.org/animated_stickers">this quick guide</a> to get started.</p>
|
||
<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001549/1/q2NNoVCmotM.23854/f5ece7783dc87a99fa" style="max-width: 400px;" title="Keep a close eye on all your animated stickers while you're working on a set. Our artists are still hunting one of the cherries that managed to escape." alt="A winking panda">
|
||
<source src="/file/464001595/1/eYxg2Qp-zVw.738457.mp4/c550733c78bf39b1a1" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
|
||
<h4><a class="anchor" name="starter-packs" href="#starter-packs"><i class="anchor-icon"></i></a>Starter Packs</h4>
|
||
<div>
|
||
|
||
To get your conversations moving right away, our artists have created a <a href="https://t.me/addstickers/Bunnyta" target="_blank">few</a> <a href="https://t.me/addstickers/OfficeTurkey" target="_blank">sample</a> <a href="https://t.me/addstickers/ResistanceDog" target="_blank">sets</a> ranging from <a href="https://t.me/addstickers/MelieTheCavy" target="_blank">Rambunctious Rodents</a> to <a href="https://t.me/addstickers/TheFoods" target="_blank">Sentient Snacks</a>. You can find more animated sticker sets in the 'Trending' section of your sticker panel. <img class="emoji" src="//telegram.org/img/emoji/40/F09F94A5.png" width="20" height="20" alt="🔥" />
|
||
|
||
<br><br></div>
|
||
|
||
<p>As always, the fastest way to find a sticker that fits your mood is to type in a <strong>relevant emoji</strong> – Telegram will immediately suggest matching stickers.</p>
|
||
<div class="blog_video_player_wrap" style="max-width: 400px; margin: 20px auto 20px;">
|
||
<video class="blog_video_player tl_blog_vid_autoplay" onclick="videoTogglePlay(this)" autoplay loop controls muted poster="/file/464001623/1/L4rZ1qTMJlU.29105/914f53e58c12155ea1" style="max-width: 400px;" title="We ran out of ideas for clandestine desktop-only jokes. Let's just hope you never find this alt-text." alt="Sticker selected and sent from emoji suggestions">
|
||
<source src="/file/464001338/1/lqWbVCVvaQc.3938267.mp4/1970a4c6dfc896b462" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
|
||
<p>Keep an eye out for new animated stickers – and our next update.</p>
|
||
<div><br></div>
|
||
|
||
<p><em>July 6, 2019<br>The Telegram Team</em></p>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="tl_main_share clearfix">
|
||
<a href="https://t.me/share/url?url=https%3A%2F%2Ftelegram.org%2Fblog%2Fanimated-stickers&text=Introducing%20ultra-lightweight%2C%20super-smooth%20animated%20stickers%20for%20those%20who%20like%20to%20move%20it." class="tl_telegram_share_btn" id="tl_telegram_share_btn" data-text="Introducing ultra-lightweight, super-smooth animated stickers for those who like to move it." data-url="https://telegram.org/blog/animated-stickers"><i class="tl_telegram_share_icon"></i><span class="tl_telegram_share_label" target="_blank">Forward</span></a>
|
||
<a href="https://twitter.com/share" class="tl_twitter_share_btn" id="tl_twitter_share_btn" data-text="Introducing ultra-lightweight, super-smooth animated stickers for those who like to move it." data-url="https://telegram.org/blog/animated-stickers" data-via="Telegram">Tweet <span class="tl_twitter_share_cnt"></span></a>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="tl_main_recent_news_wrap tlb_other_news_wrap tl_blog_list_page_wrap">
|
||
<h3 class="tl_main_recent_news_header">
|
||
<a href="/blog">Other News</a>
|
||
</h3>
|
||
<div class="tl_main_recent_news_cards clearfix">
|
||
<a class="dev_blog_card_link_wrap" href="/blog/new-saved-messages-and-9-more"><div class="dev_blog_card_wrap">
|
||
<img class="dev_blog_card_image" src="https://telegram.org/file/400780400296/1/9NHuUm1khJE.300782/913468ac6a12d3161d" />
|
||
<div class="dev_blog_card_alltext_wrap">
|
||
<h4 class="dev_blog_card_title">Saved Messages 2.0, One-Time Voice Messages and 8 More Features</h4>
|
||
<div class="dev_blog_card_lead">Throughout January, we added 10 new features to Telegram – including upgraded Saved Messages, one-time voice and video messages that delete…</div>
|
||
</div>
|
||
<div class="dev_blog_card_date">Jan 31, 2024</div>
|
||
</div></a><a class="dev_blog_card_link_wrap" href="/blog/calls-and-bots"><div class="dev_blog_card_wrap">
|
||
<img class="dev_blog_card_image" src="https://telegram.org/file/400780400149/1/BSY3rQYfUhs.332063/6b257c0dc671d7be2c" />
|
||
<div class="dev_blog_card_alltext_wrap">
|
||
<h4 class="dev_blog_card_title">Colorful Calls, Thanos Snap Effect, and an Epic Update for Bots</h4>
|
||
<div class="dev_blog_card_lead">Telegram's 10th update of 2023 adds improved calls with a colorful new design that use less of your phone's battery, a new vaporize effect…</div>
|
||
</div>
|
||
<div class="dev_blog_card_date">Dec 31, 2023</div>
|
||
</div></a><a class="dev_blog_card_link_wrap" href="/blog/posts-in-stories-and-more"><div class="dev_blog_card_wrap">
|
||
<img class="dev_blog_card_image" src="https://telegram.org/file/400780400793/2/VkvuurAxFVg.277684/e7d479017cc416a63a" />
|
||
<div class="dev_blog_card_alltext_wrap">
|
||
<h4 class="dev_blog_card_title">Channel Appearance, Posts in Stories and More</h4>
|
||
<div class="dev_blog_card_lead">In Telegram's Christmas update, channels can set wallpapers, emoji statuses and profile logos, users can repost channel messages to stories…</div>
|
||
</div>
|
||
<div class="dev_blog_card_date">Dec 23, 2023</div>
|
||
</div></a><a class="dev_blog_card_link_wrap" href="/blog/similar-channels"><div class="dev_blog_card_wrap">
|
||
<img class="dev_blog_card_image" src="https://telegram.org/file/400780400090/1/RprIYMnvOUg.277465/d9f6381d8e3088a8f7" />
|
||
<div class="dev_blog_card_alltext_wrap">
|
||
<h4 class="dev_blog_card_title">Similar Channels, Reposting Stories, and 9 More Features</h4>
|
||
<div class="dev_blog_card_lead">Today's update lets you find more channels on similar topics, repost stories from friends and channels, and add video messages to stories.…</div>
|
||
</div>
|
||
<div class="dev_blog_card_date">Nov 30, 2023</div>
|
||
</div></a>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="footer_wrap">
|
||
<div class="footer_columns_wrap footer_desktop">
|
||
<div class="footer_column footer_column_telegram">
|
||
<h5>Telegram</h5>
|
||
<div class="footer_telegram_description"></div>
|
||
Telegram is a cloud-based mobile and desktop messaging app with a focus on security and speed.
|
||
</div>
|
||
|
||
<div class="footer_column">
|
||
<h5><a href="/faq">About</a></h5>
|
||
<ul>
|
||
<li><a href="/faq">FAQ</a></li>
|
||
<li><a href="/privacy">Privacy</a></li>
|
||
<li><a href="/press">Press</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="/apps#mobile-apps">Mobile Apps</a></h5>
|
||
<ul>
|
||
<li><a href="/dl/ios">iPhone/iPad</a></li>
|
||
<li><a href="/android">Android</a></li>
|
||
<li><a href="/dl/web">Mobile Web</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="/apps#desktop-apps">Desktop Apps</a></h5>
|
||
<ul>
|
||
<li><a href="//desktop.telegram.org/">PC/Mac/Linux</a></li>
|
||
<li><a href="//macos.telegram.org/">macOS</a></li>
|
||
<li><a href="/dl/web">Web-browser</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="footer_column footer_column_platform">
|
||
<h5><a href="//core.telegram.org/">Platform</a></h5>
|
||
<ul>
|
||
<li><a href="//core.telegram.org/api">API</a></li>
|
||
<li><a href="//translations.telegram.org/">Translations</a></li>
|
||
<li><a href="//instantview.telegram.org/">Instant View</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="footer_columns_wrap footer_mobile">
|
||
<div class="footer_column">
|
||
<h5><a href="/faq">About</a></h5>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="/blog">Blog</a></h5>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="/apps">Apps</a></h5>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="//core.telegram.org/">Platform</a></h5>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="/press">Press</a></h5>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="/js/main.js?47"></script>
|
||
|
||
<script>initScrollVideos(true);
|
||
twitterCustomShareInit();
|
||
blogSideImageInit();
|
||
backToTopInit("Go up");
|
||
removePreloadInit();
|
||
</script>
|
||
</body>
|
||
</html>
|
||
|