Какие стикеры в телеграмме анимированные по нажатию
Перейти к содержимому

Какие стикеры в телеграмме анимированные по нажатию

  • автор:

Видеостикеры, улучшенные реакции и другие нововведения

В новой версии Telegram появились видеостикеры, которые легко сделать из обычных видеофайлов, более компактные анимации и дополнительные эмодзи для реакций, кнопка для перехода к непросмотренным реакциям, а также быстрая навигация по недавно открытым чатам и другие нововведения.

Видеостикеры

Векторные анимированные стикеры в Telegram отличаются непревзойденным качеством и занимают не более 30 Кб на стикер. Однако для создания таких наборов требуются технические знания и специализированные программы вроде Adobe Illustrator.

С сегодняшнего дня в Telegram появляется более демократичный формат видеостикеров. Теперь кто угодно может сделать качественные анимированные стикеры из обычных видеозаписей, используя практически любой видеоредактор.

Для создания новых наборов достаточно написать боту @stickers и следовать его инструкциям. Вы также можете установить новые стикеры, созданные другими пользователями.

Более подробная информация о создании стикеров собрана в этом документе.

Разработчики могут создавать собственные приложения для создания и переноса стикеров в Telegram с помощью Sticker Import API.

Улучшенные реакции

Анимации при отправке реакций стали компактнее. Чтобы отправить более масштабную анимацию, достаточно удерживать пальцем эмодзи в меню реакций.

Как и интерактивные эмодзи, реакции теперь синхронизируются для отправителя и получателя – анимация запустится одновременно для всех участников беседы.

Реакции используются не только для выражения эмоций, но и для обратной связи. Новая кнопка ♡ позволит быстро просмотреть все новые реакции к Вашим сообщениям.

Новые реакции и интерактивные эмодзи

В этом обновлении появились 5 новых эмодзи в списке доступных реакций – . Эти эмодзи можно также использовать и как интерактивные эмодзи – просто отправьте один из них отдельным сообщением и нажмите на анимированную версию.

Переход к недавно открытым чатам

Вы можете быстро вернуться в нужный чат после того, как несколько раз перешли в другие чаты по ссылкам или с помощью функции Перейти к следующему непрочитанному каналу. Чтобы выбрать, в какой чат вернуться, удерживайте пальцем кнопку «Назад». В списке будут те чаты, в которые Вы переходили из пересланных сообщений, по ссылкам, коротким адресам, из профилей и так далее.

Другие исправления и улучшения

В январе наши разработчики посвятили две недели исправлениям известных неполадок — например, улучшено качество звонков, добавлена поддержка переводов при быстром просмотре веб-страниц (а также перевод поля О себе на iOS), добавлена возможность отправлять сообщения без звука через меню Поделиться – и множество других улучшений.

В приложение для iOS добавлены новые анимации иконок в нижней панели при переключении между разделами.

На этом на сегодня всё, другим нововведениям придётся подождать до февраля.

31 января 2022
Команда Telegram

Как создать простые и анимированные стикеры в Telegram: простая инструкция

Одна из особенностей Telegram — это большой выбор стикеров, которые можно использовать в переписке. Пользователи их очень уважают, а некоторые даже коллекционируют. Создать собственный стикерпак с любыми изображениями или фотографиями не так сложно. Редакция ZOOM.CNews рассказывает, как сделать стикеры для Telegram – простые и анимированные, и как сохранить их в мессенджере.

Автор Любовь Баскова

Как создать простые и анимированные стикеры в Telegram: простая инструкция

Как создать простые и анимированные стикеры в Telegram: простая инструкция
Дата публикации: 16.06.2023

Чтобы создать статичные стикеры, вам понадобятся базовые навыки работы в графическом редакторе, например, Adobe Photoshop или программах вроде Pixlr и PaintShop. Для анимированных наклеек потребуется уже векторный редактор наподобие GIMP, Муске, Inkscape, а также навыки создания анимации.

В нашей инструкции мы подразумеваем, что изображения для стикеров уже готовы или хотя бы продуманы, а вам необходимо непосредственно загрузить и сохранить в Telegram весь стикерпак. Разбираем пошагово весь процесс добавления статичных и движущихся стикеров в мессенджер.

1. Запустите специальный бот в Telegram

Для загрузки стикеров в Telegram предусмотрен официальный бот Stickers. Его просто найти: введите в поисковой строке в мессенджере адрес @Stickers и откройте бот, отмеченный голубой галочкой.

Теперь нажмите внизу экрана кнопку «Запустить» и начните диалог с роботом.

В этом боте вы сможете не только сделать свой стикерпак, но и впоследствии дополнять и менять его содержимое или просматривать статистику его использования. Можете добавить его в отдельную папку, чтобы не потерять. Как это сделать, а также как использовать другие полезные функции Telegram, читайте в этой статье.

2. Отправьте команду для создания стикера

Бот Stickers предлагает большое количество команд: создание масок – статичных наклеек для фотографий, которые вы отправляете в мессенджере; простых и анимированных стикерпаков; добавление новых стикеров в набор, их редактирование и изменение порядка в наборе, а также удаление.

Для создания нового набора стикеров вам понадобится одна из двух команд:

  • /newpack — для простых картинок,
  • /newanimated — для анимированных.

Команду можно отправить в чат вручную или выбрать из меню в нижней левой части экрана.

После этого бот предложит придумать название для вашего стикерпака, а затем – загрузить изображения или анимацию в нужном формате.

3. Загрузите стикеры

Для создания обычных стикеров вам потребуется графический редактор с возможностью создания файлов с прозрачным фоном наподобие Adobe Photoshop. В нем нужно подготовить изображения для стикеров, которые будут соответствовать базовым требованиям Telegram:

  • Формат PNG или WEBP c прозрачным фоном.
  • Одна из сторон холста имеет размер 512 пикселей, вторая – 512 пикселей или меньше. Изображение нужно аккуратно вписать в холст так, чтобы оно не выходило за его пределы.
  • Не содержат материалы, защищенные авторским правом.

Готовый стикер нужно отправить боту Stickers, но не в виде фотографии, а как файл. Для этого нажмите на скрепку в нижнем левом углу чата, затем выберите нужную картинку и в открывшемся окне уберите галочку напротив пункта «Сжать изображение». Так картинка сохранит исходное качество.

Загружать стикеры рекомендуется в браузерной версии или приложении Telegram для десктопа, но опыт пользователей говорит о том, что сделать все это можно и с мобильного устройства.

А вот при создании и загрузке анимированных стикеров есть еще один важный нюанс: кроме любого подходящего векторного редактора вам понадобится программа Adobe After Effects.

Дело в том, что Telegram использует для анимации уникальный формат TGS, который сжимает изображение до 30–64 Кбайт. Это необходимо, чтобы пользователи могли быстро подгружать себе стикеры и отправлять их в переписке. И превратить вашу картинку в анимацию для Telegram можно только в Adobe After Effects и лишь при помощи специального плагина Bodymovin, который и экспортирует файлы в формат TGS. Плагин устанавливается по ссылке, которую вам покажет бот Stickers после ввода команды /newanimated и выбора названия для набора стикеров.

Анимированная наклейка также должна соответствовать требованиям Telegram:

  • Размер холста 512х512 пикселей.
  • Продолжительность анимации не более 3 секунд.
  • Частота — 60 кадров в секунду.
  • Объект на стикере при движении не должен выходить за пределы холста.
  • Анимация должна быть зациклена.

Также для стикеров нельзя использовать некоторые функции Adobe After Effects, например, «Маски» или «3D-слои». Если вы планируете обрабатывать свои анимированные рисунки в этом редакторе, то сначала лучше уточнить полный список запретов. Сделать это можно, опять же, через бот Stickers, который покажет вам ссылку на страницу с полным списком правил после ввода команды /newanimated.

После экспорта файла в формат TGS точно так же по инструкции выше загрузите его в бот Stickers и переходите к следующему шагу.

4. Привяжите эмодзи

После того, как стикер добавлен, выберите эмодзи, который будет с ним ассоциироваться. Можно привязать к одному стикеру несколько смайлов, хотя программа настоятельно рекомендует выбрать только один.

Когда будет готов первый стикер, вы можете, следуя схеме выше, добавить в набор еще несколько картинок. Если у вас пока не готов весь стикерпак, то залить новые наклейки можно и позднее – это тоже делается так, как описано выше.

5. Сохраните стикерпак

Как только вы отправили все нужные наклейки боту, наберите команду /publish для сохранения набора. Теперь от публикации вас отделяют всего два шага.

Первое – создайте иконку для стикерпака, когда приложение предложит это сделать. Подойдет только файл в формате PNG или WEBP размером 100х100 пикселей. Например, можно уменьшить размер любого из стикеров в пакете, чтобы использовать его для превью.

Однако этот шаг вполне можно пропустить, отправив команду /skip. В этом случае в качестве иконки будет демонстрироваться первый стикер в наборе.

И второе – придумайте короткое название для набора. Да, вы уже придумывали его для стикеров в самом начале, но теперь бот попросит вас сделать это снова: для использования имени в ссылке на стикерпак, которая выглядит следующим образом:

https://t.me/addstickers/ваше название

По ссылке смогут перейти другие пользователи, чтобы добавить ваш стикерпак.

Название должно быть на латинице, оно может содержать строчные и прописные буквы, а также нижнее подчеркивание.

Готово, стикеры опубликованы! Теперь вы можете использовать их в переписке, отправить ссылку своим контактам или поделиться ей в социальных сетях.

6. Управляйте своими стикерами

После публикации стикерпаком можно управлять: добавлять новые наклейки, заменять их или назначенные эмодзи, расширять свой набор стикеров и даже просматривать статистику по нему. Все эти опции доступны в том же боте Stickers.

  • Если вам нужно добавить дополнительные стикеры в уже имеющийся пакет, то можно набрать команду /addsticker или выбрать соответствующий пункт в меню бота в левом нижнем углу диалога.
  • Для редактирования смайлов используется команда /editsticker – она дает возможность назначить для стикеров другие эмодзи.
  • Если же вы решили обновить какое-то изображение, отправьте команду /replacesticker, затем выберите стикер, который хотите заменить, и загрузите новую картинку.
  • Еще один инструмент редактирования — /ordersticker — меняет порядок стикеров в наборе.
  • По команде /setpackicon можно загрузить в бот иконку для стикерпака, если вы пропустили этот шаг ранее.
  • Для удаления из набора отдельного стикера стоит использовать команду /delsticker.
  • А можно и вовсе избавиться от стикерпака – для этого отправьте в чат слово /delpack.

При этом вы увидите перемены в своем наборе сразу, а в течение получаса изменения заметят все пользователи, которые загрузили себе ваш стикерпак.

Кроме того, вы можете следить за популярностью стикеров. Например, команда /packusagetop показывает, сколько всего человек добавили себе ваши стикеры и использует их в переписке.

Бот позволяет узнать и более детальную статистику: по команде /packstats он покажет, сколько раз пользователи установили, отправили кому-то или удалили ваш стикерпак; а с помощью кода /stats выдаст данные о том, сколько раз была использована определенная наклейка.

Создание анимированных стикеров в Telegram

Анимированные стикеры используют свой собственный формат изображения, известный как TGS, работать с которым на момент написания статьи могут только десктопные приложения от Adobe, а именно After Effects и Illustrator, поэтому понадобится их загрузить и установить.

Для первого нам потребуется специальный плагин, а также средство его установки.

  1. Нужное дополнение для After Effects называется Bodymovin-TG и получить его можно в официальном GitHub-репозитории разработчика по вышеуказанной ссылке.
  2. После загрузки страницы найдите блок с последним релизом плагина (обычно он идёт первым в списке), затем отыщите в нём ссылку с именем bodymovin-tg.zxp и кликните по ней. как сделать анимированные стикеры в телеграм-1Сохраните загруженный файл в любом удобном месте. как сделать анимированные стикеры в телеграм-2
  3. Теперь нам нужно установить средство инсталляции плагинов к Афтер Эффектс. Оно называется ZXPInstaller, официальный ресурс находится по ссылке ниже. Для скачивания требуемой версии воспользуйтесь кнопкой «Download for Windows». Перейти на официальный сайт ZXPInstallerкак сделать анимированные стикеры в телеграм-3Как и в случае с самим плагином, сохраните инсталлятор на компьютер. как сделать анимированные стикеры в телеграм-4
  4. Теперь задействуем установщик: откройте папку, куда его сохранили, и запустите исполняемый файл. как сделать анимированные стикеры в телеграм-5Инсталляция происходит без участия пользователя. Если вы в процессе заметили какую-то ошибку, причина, скорее всего, в неправильной установке Adobe After Effects, поскольку менеджер плагинов проверяет его наличие в системе. как сделать анимированные стикеры в телеграм-6
  5. После установки средства добавления дополнений перетащите в его главное окно файл bodymovin-tg.zxp. как сделать анимированные стикеры в телеграм-7Подождите, пока операция будет произведена, а после соответствующего уведомления от утилиты перезапустите After Effects, если он в это время открыт. как сделать анимированные стикеры в телеграм-8

Шаг 2: Создание стикеров

Для анимации в формате TGS почти обязательным условием является векторная графика, поэтому нам и нужен Адоби Иллюстратор.

  1. Если вы обладаете достаточными художественными навыками, можете нарисовать нужные изображения с нуля, благо Adobe Illustrator достаточно дружелюбен к новичкам. Подробнее: Учимся рисовать в Adobe Illustratorкак сделать анимированные стикеры в телеграм-9
  2. Мы же воспользуемся более простым решением — функцией под названием «трассировка», которая предназначена для перевода растрового изображения в векторное. Первым делом подготовьте исходники будущих стикеров и сохраните их в какую-нибудь подходящую папку. Далее откройте Иллюстратор и выберите «Открыть». как сделать анимированные стикеры в телеграм-10Посредством интерфейса «Проводника» перейдите к целевому каталогу и запустите импорт изображения. как сделать анимированные стикеры в телеграм-11
  3. После загрузки объекта в приложение выделите его одиночным нажатием по рабочему пространству левой кнопкой мыши, затем найдите на панели инструментов справа блок «Быстрые действия», где нажмите «Трассировка изображения». как сделать анимированные стикеры в телеграм-12В меню далее выберите «Фотография высокой точности». как сделать анимированные стикеры в телеграм-13
  4. В зависимости от сложности используемого исходника процесс трассировки может длиться до минуты. По его окончании в меню быстрых действий выберите «Разобрать». как сделать анимированные стикеры в телеграм-14На изображении появится перечень объектов, которые распознала программа. Далее воспользуйтесь кнопкой «Разгруппировать». как сделать анимированные стикеры в телеграм-15Преображение будущего стикера готово. Если наблюдаете на объектах искажения либо их больше, чем требуется, используйте инструменты Иллюстратора для решения этих проблем. Так, объединить контуры можно посредством соответствующей панели справа.

Важно! Техническое требование к анимированным стикерам – не превышать объём в 64 килобайта, поэтому обязательно удалите лишние объекты или проведите их слияние!

как сделать анимированные стикеры в телеграм-16
После того как изображение будет готово, сохраните его, воспользовавшись пунктами «Файл»«Сохранить как». как сделать анимированные стикеры в телеграм-17Выберите папку, куда желаете поместить проект, и убедитесь, что формат задан как «Adobe Illustrator (*.AI)», после чего нажмите «Сохранить». как сделать анимированные стикеры в телеграм-18Далее будут запущены параметры настройки сохранения. Здесь нужно убедиться, что активна опция «Создать PDF-совместимый файл», после чего нажать «ОК». как сделать анимированные стикеры в телеграм-19

Шаг 3: Анимирование стикера

Теперь переходим к самой ответственной части – превращении стикера в анимированный.

как сделать анимированные стикеры в телеграм-20

  1. Запустите Adobe After Effects и в его главном меню выберите пункты «Композиция»«Новая композиция». Настройки будущей анимации задайте следующим образом:
    • «Ширина» и «Высота» – 512 на 512 пикселей;
    • «Частота кадров» – 30 либо 60, последнее предпочтительнее;
    • «Длительность» – 3 секунды;
    • «Цвет фона» – желательно белый.

Остальные параметры можно оставить по умолчанию. Проверьте, правильно ли всё введено, затем нажмите «ОК».

Важно! Частота кадров для всех стикеров должна быть одинаковой: в один набор нельзя поместить анимации 30 и 60 кадр/сек!

как сделать анимированные стикеры в телеграм-21

  • Далее перетащите в рабочую область (отмечена на скриншоте) созданное на предыдущем этапе векторное изображение. как сделать анимированные стикеры в телеграм-22Параметры импорта – «Композиция», «Выбор слоя», «Размер документа». как сделать анимированные стикеры в телеграм-23
  • После импорта убедитесь, что изображение занимает всю рабочую область, затем кликните по нему правой кнопкой мыши (ПКМ) и выберите пункты «Создать»«Создать фигуры из векторного слоя». как сделать анимированные стикеры в телеграм-24
  • На панели источников появится новый слой с именем «Кривые *название файла*». Слой ниже, из которого и создавался предыдущий, можно удалить: выделите его единичным нажатием левой кнопки мыши (ЛКМ) и нажмите на клавиатуре Del. как сделать анимированные стикеры в телеграм-25
  • Собственно анимирование в Адоби Афтер Эффектс заслуживает отдельной статьи, поэтому далее мы ограничимся базовым примером в виде движения картинки по полотну. Нажмите на стрелочку возле слоя с кривыми и кликните в появившемся меню «Преобразовать». как сделать анимированные стикеры в телеграм-26Откройте и это меню, затем поставьте галочку в пункте «Положение», задав таким образом первый кадр будущей анимации. как сделать анимированные стикеры в телеграм-27
  • Теперь переходим к таймлайну – это правая часть нижней рабочей области. Синяя стрелка на ней – текущее местоположение. Наведите на неё курсор, зажмите ЛКМ и перетяните стрелку немного вправо. как сделать анимированные стикеры в телеграм-28
  • Сейчас нужно задать опорные точки будущей анимации: перейдите к области композиции (там, где находится картинка), наведите курсор на изображение, зажмите ЛКМ и перетащите его в требуемом направлении – это будет стартовой позицией анимации. как сделать анимированные стикеры в телеграм-29Далее переместитесь по таймлайну вправо для создания следующей опорной точки и снова перетяните картинку. как сделать анимированные стикеры в телеграм-30
  • Повторяйте действия шагов 6-7 для создания как минимум восьми точек – это допустимый нижний предел для приятной глазу анимации. как сделать анимированные стикеры в телеграм-31Чтобы проверить результат, воспользуйтесь в меню справа разделом «Предпросмотр»: раскройте его, затем нажмите на кнопку начала воспроизведения. как сделать анимированные стикеры в телеграм-32
  • После получения подходящего результата его понадобится экспортировать в нужном формате – откройте пункт «Окно», где выберите «Расширения»«Bodymovin for Telegram Stickers». как сделать анимированные стикеры в телеграм-33Откроется отдельная панель управления экспортом. Первым делом выберите созданную композицию (отметка в левой части соответствующей строки), после чего кликните по трём точкам. как сделать анимированные стикеры в телеграм-34Посредством «Проводника» выберите папку, куда желаете сохранить итоговый стикер. как сделать анимированные стикеры в телеграм-35Далее щёлкните «Render». как сделать анимированные стикеры в телеграм-36Если всё сделано правильно и лимит в 64 Кб не превышен, рендеринг завершится успешно, о чём программа вас и уведомит. Для продолжения нажмите «Done» и закройте окно плагина. как сделать анимированные стикеры в телеграм-37В выбранной ранее папке должен появиться файл с расширением TGS. как сделать анимированные стикеры в телеграм-38

    Шаг 4: Импорт стикеров в Telegram

    Для создания своего набора стикеров в Телеграме предусмотрен отдельный бот – @Stickers, который позволяет добавить и анимацию.

    1. Загружать стикеры удобнее всего с десктопного клиента, которым мы и воспользуемся. Запустите приложение, введите в поиске название требуемого бота и выберите результат, отмеченный на скриншоте ниже. как сделать анимированные стикеры в телеграм-39
    2. Выполните команду /start для начала работы с ботом. как сделать анимированные стикеры в телеграм-40
    3. Появится список доступных команд и вариаций, кликните в нём по ссылке /newanimated. как сделать анимированные стикеры в телеграм-41
    4. Введите название будущего набора (можно использовать как русские, так и английские буквы, но последние предпочтительнее). как сделать анимированные стикеры в телеграм-42
    5. Теперь можно добавить к созданному паку первый стикер, просто перетащив файл из папки в диалог с ботом. как сделать анимированные стикеры в телеграм-43Появится окно предпросмотра – проверьте, как ведёт себя анимация, затем нажмите «Отправить». как сделать анимированные стикеры в телеграм-44
    6. Далее откройте панель смайлов и выберите тот, которому должен отвечать добавленный стикер. как сделать анимированные стикеры в телеграм-45Проверьте, подходит ли он вам, затем щёлкните «Отправить». как сделать анимированные стикеры в телеграм-46
    7. Бот предложит добавить ещё стикеров – процедура идентична описанной в предыдущем шаге. Когда набор будет готов, нажмите на ссылку «/publish». как сделать анимированные стикеры в телеграм-47Далее укажите пак, к которому будет добавлен стикер. как сделать анимированные стикеры в телеграм-48Можете задать и иконку (основное изображение пака), процедура аналогична добавлению стикера. Если это не требуется, пропустите данный шаг вводом команды /skip. как сделать анимированные стикеры в телеграм-49
    8. Последний шаг – создание ссылки для того, чтобы стикерпаком можно было поделиться с другими пользователями. Её уже нужно вводить исключительно английскими буквами. как сделать анимированные стикеры в телеграм-50
    9. Готово – бот уведомит вас о том, что набор опубликован и доступен всем желающим пользователям.

    как сделать анимированные стикеры в телеграм-51

    Публикация является самым простым этапом создания анимированных стикеров, поскольку почти все требуемые процедуры выполняются автоматически.

    Инструкция: как сделать анимированные стикеры в Telegram

    Поэтапно разберемся во всех нюансах при разработке такого стикера. Начиная с программного обеспечения и заканчивая публикацией в Telegram.

    Так что же из себя представляет этот анимированный стикер?
    Это собственный формат Telegram — .tgs, который основан на технологии lottie.
    Lottie — это движок от Airbnb, который позволяет проигрывать анимации на основе json, созданного с помощью плагина Bodymovin для Adobe After Effects. Такой же плагин существует и для стикеров Telegram и называется аналогично — Bodymovin-TG.

    Этап 1 — Подготовка инструментов
    Что необходимо

    • Adobe Illustrator или другой векторный графический редактор.
    • Adobe After Effects + плагин Bodymovin-TG.

    Как установить Bodymovin-TG

    Скачиваем с сайта разработчика плагин bodymovin-tg.zxp необходимый для экспорта анимации в формат .tgs.

    Для установки потребуется ZXPInstaller — приложение для установки расширений для Adobe.

    Приложение доступно и на Mac OS

    Открываем ZXPInstaller и переносим плагин в окно программы.

    Так же можно кликнуть и выбрать файл из всплывающего окна проводника.
    Настройка Bodymovin-TG

    Открываем Adobe After Effects и заходим в раздел настроек — «сценарии и выражения».

    Ставим галочку напротив «Разрешить сценариям выполнять запись файлов и осуществлять доступ к сети».

    Этап 2 — Создание стикера
    Создание и настройка документа

    Открываем Adobe Illustrator и выбираем в строке меню «файл» -> «новый».

    Во всплывающем окне задаем параметр 512 на 512 пикселей, исходя из требований к размеру стикера.

    Рисование стикера

    Для рисования векторного стикера потребуются определенные навыки и знания основных инструментов, поэтому рекомендуется ознакомится с базовыми принципами рисования на сайте Adobe.

    Изображение на стикере не должно выходить за края холста.

    Существует альтернативный способ (Трассировка) с помощью которого любая картинка превращается в векторную. Будет очень полезно, для быстрого переноса своих растровых изображений в вектор.

    Трассировка изображения

    В качестве примера возьмем изображение стикера из интернета.
    Импортируем изображение в рабочую среду Adobe Illustrator (перенос в окно программы изображения). И проводим указанные действия из видео:

    1. Трассировка изображения. («Окно» -> «Трассировка изображения»)
    2. Разобрать. («Объект» -> «Трассировка изображения» -> «Разобрать»)
    3. Разгруппировать. («Объект» -> «Разгруппировать»)

    Более подробно о «Трассировке изображения» читайте на сайте Adobe.

    Трассировка прошла успешно, но алгоритм не всегда точно угадывает форму объекта за элементом. С помощью встроенных инструментов можно устранить эти недостатки.

    Сохранение стикера

    Выбираем в строке меню «файл» -> «Сохранить как». Сохраняемый тип файла .ai. Во всплывающем окне ставим галочку напротив «Создать PDF-совместимый файл».

    Этап 3 — Анимация и экспорт в After Effects
    Технические требования к анимации

    Размер анимированного стикера не должен превышать 64 КБ , если стикер перейдет эту отметку, экспорт (Bodymovin-TG) завершится ошибкой. Исправить ошибку возможно лишь урезанием качества стикера — удаление векторных элементов. Следите за тем, чтобы в анимации не было слишком много векторных объектов.

    Анимация должна быть цикличной , то есть первый кадр анимации должен совпадать с последним кадром.

    У этих кадров одинаковое значение «положение».

    Использование этих функций в Adobe After Effects приведет к критическим ошибкам при экспорте стикера:

    Masks, Mattes, Layer Effects, Images, Solids, Texts, 3D Layers, Merge Paths, Star Shapes, Gradient Strokes, Repeaters, Time Stretching, Time Remapping, Auto-Oriented Layers

    Создание и настройка композиции

    Открываем Adobe After Effects и выбираем в строке меню «композиция» -> «Новая композиция».

    Во всплывающем окне «Настройки композиции» указываем параметры стикера с учетом официальных требований к анимированным стикерам, такие как:

    • Размер — 512 на 512 пикселей.
    • Частота кадров — 30 или 60 кадров в секунду. Выбор частоты будет влиять на количество кадров в проекте. Лучше всего выбрать 60 — это обеспечивает большее пространство для анимации.
    • Длительность — 3 секунды.

    Для удобства можно сохранить шаблоны настроек для 60 и 30 кадров соответственно
    Импорт стикера в After Effects

    Переносим файл со стикером в рабочую среду Adobe After Effects.

    Кликаем правой кнопкой по стикеру, выбираем «создать фигуры из векторного слоя».

    После создания векторного слоя, можно удалить слой Sticker.ai, который в дальнейшем не потребуется
    Анимация в After Effects

    Для примера произведем анимацию 3 элементов в стикере.

    Разберем подробнее, как анимировать данные элементы в After Effects:

    1. Изменение положения

    Раскрываем слой «Кривые Sticker» и находим группу с необходимым объектом, быстрее всего это можно сделать кликнув по элементу в окне предпросмотра.

    Выбираем пункт «Положение» и активируем его нажав на значок секундомера. После двигаем временную шкалу чуть вперед и передвигаем объект с помощью мыши или вручную, изменяя численное значение «Положение«.

    2. Изменение масштаба

    Аналогично (1) пункту, за исключением того, что теперь изменять нужно масштаб , а не положение.

    3. Изменение контура

    Выбираем пункт «Контур» и активируем его нажав на значок секундомера.
    Для создания такой анимации потребуется тянуть за «синий квадратик», изменяя тем самым форму объекта и постепенно довести её до требуемого состояния.

    Экспорт стикера Bodymovin-TG

    Выбираем пункт «Расширения» и находим там плагин Bodymovin.

    Отмечаем композицию и выбираем место сохранения нажатием на «троеточие».
    После нажимаем на кнопку Render.
    Если всё пройдет удачно, в выбранном вами месте появится файл .tgs.

    Этап 4 — Публикация в Telegram

    Открываем Telegram и находим в поиске бота @Stickers.
    Для начала работы с ним отправляем команду /start.

    У всех стикеров в наборе должна быть одинаковая частота кадров. Иначе придется делать два разных пака — для 30 и 60 кадров в секунду.

    Отправляем команду /newanimated. После выбираем название и получаем следующую инструкцию:

    Спасибо! Теперь отправьте мне, пожалуйста, будущий анимированный стикер — файл в формате TGS, созданный с помощью плагина Bodymovin-TG для Adobe After Effects.

    Рекомендуем загружать изображения через десктопное приложение.

    Stickers, бот

    Следующий шаг отправить смайл, который соответствует анимированному стикеру. Заканчиваем создание набора командой /publish, если больше нет стикеров для добавления. В дальнейшем через бота можно будет дополнительно добавить новых стикеров.

    Бот Stickers предложит выбрать иконку для анимированных стикеров. Её нужно создать отдельно, но проще всего написать команду /skip, чтобы первый стикер показывался в качестве иконки.

  • Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *