Примеры
Ниже я буду добавлять примеры анимаций и интересных решений, которые выполняю на различных сайтах или встретил у коллег, чтоб вы представляли возможности платформы Tilda.
Если это возможно, то лучше смотреть на компьютере или ноутбуке, т.к. тогда вы увидите весь спектр того, что я умею.
При наведении мышкой на текст, он из белого превращается в контурный. Работает только для компьютеров и ноутбуков (там, где присутствует мышь)
По наведению мышки (Hover)
Наведи мышкой
текст с контуром
Эффект планированлся на учебном сайте магазина стульев, но не вошел в окончательный вариант
Кликни пальцем на текст, он из белого превращается в контурный. Работает только для телефонов и планшетов без мыши
текст
с контуром
с контуром
По клику (Click)
Кликни пальцем
Эффект планированлся на учебном сайте магазина стульев, но не вошел в окончательный вариант
Кнопка, меняющая форму
Кнопка
По наведению мыши
Наведи мышкой
При наведении мышкой на кнопку, она меняет свою форму. Работает только для компьютеров и ноутбуков (там, где присутствует мышь)
Эффект применен на учебном сайте магазина стульев.
Кнопка, меняющая
форму
форму
Кнопка
По клику
При клике пальцем на кнопку, она меняет свою форму. Работает только для телефонов и планшетов без мыши
Кликни пальцем
Эффект применен на учебном сайте магазина стульев.
Бегущая строка / Волна
Block on screen
При появлении блока на экране анимация включается на бегущей строке и волне.
Эффект применен на учебном сайте магазина стульев.
Бегущая строка привлекает внимание, используй её
Бегущая строка привлекает внимание, используй её
Бегущая строка привлекает внимание, используй её
Бегущая строка привлекает внимание, используй её
Бегущая строка / Волна
Elevent on screen
При появлении элемента на экране анимация включается на бегущей строке и волне.
Эффект применен на учебном сайте магазина стульев.
Бегущая строка
Бегущая строка
Бегущая строка
Бегущая строка
Бегущая строка
Бегущая строка
Бегущая строка
Волна
Волна
Появление фото
по движению мыши
по движению мыши
По наведению мыши
Крути мышкой
При наведении мышкой на пустое поле появляются фотографии. Работает только для компьютеров и ноутбуков (там, где присутствует мышь)
Эффект применен на сайте для блогера
Толкающиеся черные дыры
Block on screen
При появлении блока на экране анимация включается и дыры толкаются
Эффект взят на просторах интернета
Толкающиеся черные дыры
Block on screen
При появлении блока на экране анимация включается и дыры толкаются
Эффект взят на просторах интернета
Анимация за буквами
Element on screen
При появлении элемента на экране анимация за буквами включается. Под буквами может быть видео, как на этом сайте
Анимация
за буквами
за буквами
Element on screen
При появлении элемента на экране анимация за буквами включается. Под буквами может быть видео, как на этом сайте
Выдвигающиеся полоски
По наведению мышки (Hover)
При наведении мышкой на область, будет выдвигаться белая полоса
Повторен урок Тильды
ДИЗАЙН
Скрытый текст про дизайн
и прочее
и прочее
ДИЗАЙН
Скрытый текст про фото
и прочее
и прочее
ФОТО
ФОТО
Выдвигающиеся полоски
По наведению мышки (Hover)
При клике на область близ текстов "Дизайн" и "Фото", будет выдвигаться белая полоса
Повторен урок Тильды
ДИЗАЙН
Скрытый текст про дизайн
и прочее
и прочее
ДИЗАЙН
Скрытый текст про фото
и прочее
и прочее
ФОТО
ФОТО
Щелкни мышкой
Выдвигающиеся
полоски
полоски
Наезд пальмы
Анимация по скроллу
Эффект показал Макс Куратов
При скролле листья пальмы надвигаются создавая эффект движения
ВАСЯ
Валера
лучший
