Пошаговая анимация в Tilda Publishing
ฝัง
- เผยแพร่เมื่อ 11 ก.ย. 2024
- Видеообзор новой функции конструктора сайтов Tilda Publishing.
tilda.cc/ru/lp...
Пошаговая анимация - это создание сценариев движения элементов на странице. Текст, картинки, объекты могут по скроллу, по клику или при наведении менять положение, двигаться по траектории, менять размер, прозрачность и угол поворота.
Инструмент для анимации по шагам появился в Zero Block - редакторе для веб-дизайна, встроенном внутри конструктора. Редактор работает на всех планах, включая бесплатный.
Страница с демонстрацией возможностей:
tilda.cc/ru/lp...
![โฮ่ง! (SUGOI) - LYKN [ OFFICIAL MV ]](http://i.ytimg.com/vi/nFp4zjAARFs/mqdefault.jpg)
Тильда чемпион. 2 месяца как разрабатываю коммерческие сайты на тильде и постоянно вижу новые введения и обновления. Спасибо за прекрасный конструктор! Ещё бы хотелось видеть разного рода расширения для Интернет-магазинов. Тогда конструктор будет почти универсален.
Это же просто праздник какой-то!!!)))
Hxbzhdbd
Ребята из Тильды, вы огонь! Браво
Большое спасибо за видео! Недавно начала осваивать Тильду. Интуитивный интерфейс - 100% о вас. Я видела сайты с подобной анимацией, и диву давалась - как же ее сделать? А оказывается, все так легко! После просмотра аж руки зачесались, пойду пробовать. Вы крутые
Спасибо, это очень оживило мой сайт!
Оч круто, но было бы еще круче, если бы вы сделали такие же, различные варианты, уже собранные, как при выборе блоков. То есть чтобы можно было туда вписать текст, картинки, любой контент, и он уже по готовому работал :) Так то да, можно квадраты заставить по странице летать, но к чему это привязать, я не пойму пока :)
Ма-ла-дцы!
Вот этого реально не хватало по сравнению с Редимагом. Теперь на уровне. Еще раз: МАЛАДЦЫ!
Супер, большое спасибо за видео.!!!!
Никита так просто и понятно объясняет. Я новичок в Тильде и сразу всё понял.
Tilda стала на уровень выше!
Если наш русский продукт, то почему не руссифицирована.?
Это очень крутая штука! Правда интересен вариант с мобильной версией))
Молодцы ребята с Тильды, душа радуется вашей платформе)
Никита, Вы стопроцентный миллионер. Купите пожалуйста микрофон для улучшения качества роликов! Вы и Ваш сервис великолепны, но плохой звук портит безупречное качество!
Суперский апгрэйд!) будем практиковаться, спасибо!!)
Большое спасибо , очень полезное видео ! ! !
Сайт просто чудесно выглядит)
спасибо! увидев анимацию, сразу перенесли сайт к вам))
Отлично!Спасибо!
Блин, только недавно увидел этот проект. Это просто супер, буду фигачить сайты.)
вау офигенные эффекты
Было бы неплохо, если бы можно было анимации еще и комбинировать. Например мне надо,что бы объект появлялся при по скролле, потом покачивался в блоке On screen и потом при дальнейшем скроле исчезал
Супер круто !
Потрясная функция!! Не терпится попробовать
Спасибо за тильду
Круто)) Спасибо Вам за эту прекрасную возможность))))))))!!!!!!!!
Спасибо, очень полезное видео!
Но со звуком у вас явные проблемы)
очень круто! спасибо за вашу работу!
Выглядит очень круто!!
Молодцы, вы -крутые!!
Тильда это гениально
А как применить на мобильных устройствах?
1) Зайти в ZeroBlok
2) Редактировать блок
3) Перейти на мобильную версию.
4) В Settings выделить блок где хотим включить анимацию и найти вкладку Mobile Animation ( находиться снизу)
5) Нажать SWITCH ON.
6) SAVE и CLOSE
Выглядит очень круто 😃
Прелестно
Только появление из прозрачности все равно не работает корректно, так как первы кадр быстро проявляется сам объект...
точно
@@user-sf1sf4fy3u вы не нашли как это исправить? )
кстати сейчас анимация в мобильных версиях работает. просто надо перейти на вид экрана - планшет и в разделе анимация нажать на "Swinch on" и будет счастье. Вот буквально вчера сообщили. Уже опробовал. Все работает
Такой вопрос: Сделал анимацию где часть блоков спускается сверху в центр экрана, а часть блоков наоборот, снизу в центр. При нажатии на плей при редактировании - все работает. Но когда публикую страницу, те блоки которые должны идти снизу в центр вообще не показывает, что только не пробовал. Может быть подскажете?😞😞😞
Здравствуйте
Затрудняемся помочь в рамках комментариев на TH-cam.
Создайте, пожалуйста, обращение в нашу службу поддержки. Это можно сделать на странице tilda.cc/tickets или написать на почту support@tilda.cc
В обращении подробно опишите задачу/ проблему, укажите ссылку на опубликованную страницу сайта и прикрепите полноэкранные скриншоты, которые помогут понять задачу/ проблему и дать максимально точный ответ.
круто
Спасибо!
Спасибо! Топ!
Класс, очень полезное видео)) Спасибо 💖
Это очень круто! Спасибо!
Но скажу не только про анимацию. Стал делать письма для рассылки, и не хватает модулей, сильно, сделайте нулевой блок что ли, или добавьте пожалуйста ещё блоков для писем, в частности шапка. Спасибо!
Данил, блоки для писем намеренно сделаны такими лаконичными, так как почтовые программы ведут себя непредсказуемо. И чтобы письмо точно выглядело хорошо и могло быть прочитано, мы используем минимальное оформление.
Было бы классно если можно было бы накладывать страницу на zero block. Чтобы они как бы слоями были.
Если я вас правильно поняла, то это возможно. Посмотрите, пожалуйста, например, в этой статье tilda.education/articles-design-thinking-great-questions некоторые элементы из Zero Block накладываются на стандартные блоки. Если это то, что нужно, напишите, пожалуйста, в поддержку, ребята подскажут, как это сделать
Тильда - бомба! Скажите пожалуйста, как же анимацию для других разрешений настроить, а то пока только в максимальном разрешении можно анимацию делать?
;) спасибо.
да, анимация только в десктопной версии: для мобильных анимация избыточна и ухудшает пользовательский опыт
Tilda Publishing Russia Даже базовая будет ухудшать UX?
да, для мобильных лучше позаботиться о том, чтобы телефон был кликабельным (при нажатии можно было сразу позвонить), чтобы шрифт был достаточно крупным и хорошо читался, чтобы была понятной навигация, а картинки не были тяжелыми и сайт быстро загружался
Спасибо, Вашу позицию понял. По поводу не кликабельных телефонов в мобильной версии - за такое вообще расстреливать надо! :)
Ну не так жестко, конечно, но определенно стоит об этом не забывать :-)
Как по горизонту выровнять контент, есть ли сетка какая, линия для горизонта?
тэээкс, куда душу сдавать чтоб так научиться?
белллииссииимооо!!
Анимация возможна только в отношении одного элементов элемента? Скажите пожалуйста!
Добрый день! Анимацию можно создать для нескольких элементов.
А можно ли как-нибудь посмотреть на сайт, который показали в начале?
Здравствуйте! Ссылка есть в описании под видео.
tilda.cc/ru/lp/step-by-step-animation/
@@TildaPublishing Огромное спасибо) Еще вопрос, можно ли найти данный сайт у вас а качестве шаблона посредством поиска через ID? Недавно перешла на Тильду и хочется в конкретно примере пощупать все фишки с анимацией)
Подскажите в мобильной версии это не работает?
Здравствуйте. В представленной в начале странице фиксированный элемент "Good vibes only" не работает как показано в видео. И пытаюсь в своем сайте сделать такую фичу, тоже не выходит.
Здравствуйте!
Напишите, пожалуйста, обращение в нашу службу поддержки. Это можно сделать на странице tilda.cc/tickets или написать на почту team@tilda.cc
В обращении подробно опишите проблему, укажите ссылку на опубликованную страницу вашего сайта и прикрепите полноэкранные скриншоты, которые помогут понять проблему и дать максимально точный ответ.
скажите, а анимация в мобильной версии не доступна? мне по скролу анимация нужна..
есть какие-либо советы по редактированию страницы с телефона? Подскажите пожалуста
Добрый день! Мы рекомендуем для настройки анимации использовать компьютер.
Теперь во фри плане нет кнопок loop и test в продвинутой анимации? хотела попробовать, но её даже нельзя проиграть, как базовую
Сейчас дополнительно перепроверили, нет. На Free есть возможность воспроизводить и зацикливать анимацию по-прежнему
Если у вас возникли трудности, создайте, пожалуйста, обращение в нашу службу поддержки. Это можно сделать на странице tilda.cc/tickets или написав на почту support@tilda.cc
В обращении подробно опишите проблему, укажите ссылку на опубликованную страницу вашего сайта и прикрепите полноэкранные скриншоты, которые помогут увидеть проблему и максимально оперативно помочь
Как сделать чтобы при наведении текст был другим цветом? Допустим
из черного в синий
Привет.
А как открыть дополнительно страничку для предпросмотра? У меня есть возможность просмотреть только путем "Опубликовать" после каждого сохранения..
Здравствуйте! Посмотрите, пожалуйста, эту инструкцию - answers.tilda.cc/ru/a/mobile/
а можно к примеру сделать, чтобы на одном проекте было несколько ID шаблонов анимаций а не одна(К примеру: Параллакс эффект к движ миши и появления изображения при наведении на текст)? И как это сделать?
Здравствуйте, Владислав
К сожалению, не уверены, что правильно вас понимаем.
Вы могли бы описать чуть подробнее?
Чтобы мы смогли дать более точный ответ, отправьте, пожалуйста, подробное описание вопроса, ссылку на опубликованную страницу вашего сайта на team@tilda.cc или через виджет в правом нижнем углу в личном кабинете Tilda.
С Уважением,
Tilda Team
Как увеличить размер в пикселях. Нужно кнопку с 3px до 193px в 3500% увеличивать. Такое себе удовольстве.
Также анимация увеличения идет от центра. А как поставить, чтобы шла слева?
Здравствуйте, Даниил
Не уверены, что правильно вас пониманием
Увеличение работает только из середины, вы могли бы отправить ссылку на референс - увеличение не из центра?
Задать можно только в процентах действительно, вы можете установить для параметра scale в пошаговой анимации нужное вам значение в процентах
С Уважением,
Tilda Team
👍
А можно это использовать в выпадающем мобильном меню?
К сожалению, готового решения для использования пошаговой анимации в блоках из библиотеки нет. Видео касается только Zero Block.
Почему при анимации из прозрачности, элемент когда обновишь страницу сначала мигнёт а потом уже уйдёт в прозрачность?
Создайте, пожалуйста, обращение в нашу службу поддержки. Это можно сделать на странице tilda.cc/tickets или написать на почту support@tilda.cc
В обращении опишите проблему, укажите ссылку на опубликованную страницу сайта и прикрепите полноэкранные скриншоты, которые помогут понять проблему и дать максимально точный ответ.
не понимаю, как добавить это в проект, в статью
Всё классно в зеро боке но, не хватает знание английского. Хотелось бы перевод на русском)
Добавьте пожалуйста возможность перемещать работу с фигмы в Тильда - как на Framer
Спасибо за предложение
Обязательно учтём его при планировании будущих обновлений
Меня одного интересует то, что как это работает со стороны кода...
То есть больше не нужны веб программисты?
А как же с гугл аналитик и это тоже работает?
Стоит исходить из целей и задач всё-таки, однозначного ответа нет, к сожалению
@@TildaPublishing а если я соберу сайт сначала в фигме а потом перенесу его в Тильда, он будет работать как любой другой сайт с помощью программиста
Да, всё верно
Вы можете:
- Использовать готовые блоки из библиотеки Тильды
- Создавать собственные в zero-block (встроенный графический редактор в Тильде)
- Создавать блоки с помощью стороннего кода, добавляя его в блок t123 из категории «другое»
как вставить анимированный логотип, чтобы он занимал не более 5% в блоке и находился с краю блока?
Здравствуйте! К сожалению, мы не можем вам подсказать точные настройки анимации. Вы можете создать свою анимацию, используя учебник - tilda.education/web-animation-course
Как сделать из формы изогнутую линию?
Не уверены, что правильно понимаем задачу
Создайте, пожалуйста, обращение в нашу службу поддержки. Это можно сделать на странице tilda.cc/tickets или написать на почту support@tilda.cc
В обращении подробно опишите задачу, прикрепите полноэкранные скриншоты, которые помогут понять задачу и дать максимально точный ответ.
Пожелание человеку за кадром: говорите пожалуйста по чётче, в некоторых моментах тяжело разобрать речь, тихо и невнятно. Тем более материал новый, важно каждое слово.
Спасибо за обратную связь, будем внимательнее подходить к звуку
Подскажите пожалуйста как сделать умирающий текст в тильде.может есть такой урок?
Не уверены, что правильно вас понимаем.
Вы могли бы, пожалуйста, прислать ссылку на страницу с примером или описать вашу идею подробнее?
@@TildaPublishing я имела ввиду мигающий
@@TildaPublishing я скину вам ссылку чуть позже
@@TildaPublishing thisisprojekt.com/?ref=tilda.cc/ru/madeontilda/
@@TildaPublishing пожалуйста скажите как сделать такой текст?
Скажите, пожалуйста, на мобильных устройствах будет ли проблема с загружаемостью анимации?
Вы основатель такой крутой платформы, а микрофон у вас поршивый :(
Фигма в 100 раз круче
Есть у кого-нибудь примеры реально круто собранных страниц с этим блоком?
ship.step-by-step-demo.tilda.ws/
solar-system.step-by-step-demo.tilda.ws/
wild.step-by-step-demo.tilda.ws/
background.step-by-step-demo.tilda.ws/
texttwist.step-by-step-demo.tilda.ws/
swinton.step-by-step-demo.tilda.ws/
transparency.step-by-step-demo.tilda.ws/
text.step-by-step-demo.tilda.ws/
pingpong.step-by-step-demo.tilda.ws/
fly.step-by-step-demo.tilda.ws/
shapes.step-by-step-demo.tilda.ws/
Страницы можно использовать как темплейты - то есть создать в своем аккаунте и посмотреть настройки
На счет темплейтов- круто!))) По-больше бы их!
Нашёл следующие баги:
1. Невозможно настроить стартовый шаг в соответствии с инструкцией. То есть из невидимого состояния в видимое. Где-то вы наговнокодили.
2. Кроме того, последний шаг нельзя зафиксировать (хотя кнопка есть).
3. Выравнивание двух объектов относительно друг друга тоже не работает. Всё криво и косо.
В общем, пока продукт сырой.
время 0:49
Кто сделает мне такую анимацию за деньги ?
Я могу.
Сделайте все на русском языке