Анимация в Figma // экран Landing Page //

[@murpurpur]

Я столько видео посмотрела в поиске подобного урока... Ваш урок самый лучший, спасибо!

[@dinero228true]

видео топ, легко анимировать для тех кто только начинает

[@ИгорьОнисенко-ч9й]

Оч хорошо и понятно. И не размазано на 140 минут. Спасибо тебе огромное. Подписался + колокольчик и т.д.

[@ТатьянаСтегний-ж3ы]

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

[@ВАСИЛИЙТЕГЗА-н6ю]

Классные уроки по анимации. Как это применить? Записывать видео с экрана, а потом вставлять видео? Или другим способом? Или ответ есть в одном из уроков, если есть то в каком именно?

[@frmrtn5378]

почему здесь так мало просмотров.. это очень круто!❤

[@design_HUB]

Спасибо)) Мало потому что еще не многим попалось на глаза))

[@onorinamuench7469]

Очень круто! Благодарю!

[@ЛидияЗахарова-ф3н]

господи спасибо тебе я кучу посмотрела видео а ваши просто бомба просты понятные. я так рада))))) я наконец то сделала анимацию

[@ayazkhanissabaev3402]

Спасибо ❤

[@aleksandrova_oleksandra]

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

[@Kylikovpavel]

Интересно 👍

[@АннаГолубева-т2с]

Спасибо большое, так круто и просто . оч ждем ещеееее

[@AlmiraKarim-s7i]

СПАСИБО

[@nnmmoo410]

спасибо!🎉

[@didartulepbergenov5699]

Максим, отличное видео! Спасибо большое за туториал! Я хочу допилить вашу идею анимации, но не знаю как реализовать. Можете пожалуйста подсказать, если не сложно. Анимация такая же, но в конце иллюстрацию каким-то анимационным эффектом заменить на другую иллюстрацию. Как это можно и правильно реализовать?

[@design_HUB]

попробуйте добавить ещё один экран, но уже с другим изображением, переход поставьте или смарт анимацию или растворение... Не разберетесь- пишите в Телеграм))

[@marinastockaya9727]

🔥 очень круто получилось! Спасибо за доходчивое пояснение к работе.

[@design_HUB]

Спасибо)) Здорово что разобрались))

[@ИринаКотова-ы2ъ]

Спасибо за видеоурок! Кайф от такого качественного контента!

[@kubrys1962]

Большое СПАСИБО! Кратко и доходчиво 💯

[@konstantinche102]

Симпатичная анимация, спасибо. Музычка понравилась) Подписался

[@Dalmatov777Aleks]

Классно супер

[@azarjst]

ОТЛИЧНЫЙ УРОК!

[@natalilegkodimova3411]

Классно,коротко и ясно.

[@ЭммаМальцева-п9е]

Классно! Спасибо!

[@thequeenmyself916]

Так, вопрос наверно вам смешным покажется, но всё же: если я сделала анимацию маленькую на 3 фрейма и помещаю ее на основной экран, мне нужно эти три фрейма обернуть в компонент или просто первый фрейм на экран поместить?

[@design_HUB]

В компонент

[@thequeenmyself916]

сделала и анима к сожалению перестала работать( @@design_HUB

[@nastroudamus]

лучший

[@AizzaWoW]

😇

[@GrammSovesti]

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

[@design_HUB]

Если вы верстаете, то и код для анимации прописываете вы. Если верстает другой человек, то ваша основная задача показать как это должно выглядеть тому кто верстает (анимация, ссылка, видео...)

[@GrammSovesti]

Благодарю! @@design_HUB

[@ОльгаКулиш-ш2п]

Спасибо за качественный контент 🔥

[@Achkasovvasya]

Отличное видео, спасибо!

[@simon_ololo]

Очень понравилось! Спасибо)

[@design_HUB]

Спасибо за обратную связь))

[@ayazkhanissabaev3402]

Какие размеры выбирать для загрузки в тильду ?

[@design_HUB]

Размеры чего?

[@DiKiyZVER]

Очень круто

[@I_oveart]

Урок классный, но у меня какой-то баг случается, когда плашка, во время анимации примагничивается к левому полю, то плашка становится непрозрачной...... не пойму, что не так, всё по уроку делала....

[@design_HUB]

Уже все получилось)) Причина было в том, что на разных фреймах был выставлен разный скролл в настройках прототипа (вертикальный и горизонтальный)

[@runaruni898]

cool💥

[@abd.lina1]

Очень классная работа)

[@design_HUB]

Спасибо)

[@Vit_Army]

как сохранить себе потом эту анимацию

[@camdenhobby3940]

Это анимация только в фигме. Вы делаете дизайнерское решение , а версиальщик должен все слепть сам от html css js ? Или есть возможность данной анимации выдернуть код из фигмы ?

[@kremlebot399]

Есть плагины для вывода кода из фигмы, однако не знаю насколько хорошо он сейчас работает, в последний раз пользовалась пол года назад и нужен был статичный лендинг, так что больших проблем не возникло (с учётом, что уже в фигме ты использовал автолаут, а то некоторые дизайнеры на него забивают). Вообще многие недооценивают плагины, считая что те только красивеньких шрифтов и палитр могут подабавлять)

[@helgasheretovich5989]

Спасибо!!!

[@design_HUB]

Рад стараться)))

[@АлинаМарахонова]

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

[@design_HUB]

Возможно выпало из фрейма

[@2nzzz]

TOP!

[@bakitamina]

очень классно, а для чего анимации делать в фигме, если сайт будет делаться все равно допустим на тильде?

[@design_HUB]

Спасибо за комментарий! Анимации в Фигма делают для разных целей. С анимацией вы можете продемонстрировать высококачественный прототип своего будущего сайта, протестировать при помощи потенциальных пользователей. Некоторые анимации есть возможность экспортировать в гиф формате. Иногда аниамации нужны для презентаций, которые так же достаточно удобно демонстрировать в фигма. Ну то что в верстку анимацию не скопировать, это факт

[@bakitamina]

@@design_HUB спасибо за ответ!

[@СветланаТрошкова-м2и]

Отличный урок, что все лайков жалеют?

[@design_HUB]

Спасибо) Не знаю, может кнопка тяжело нажимается))

[@НаталияЗасименко]

Круто

[@design_HUB]

Спасибо)

[@ilkinheydarzade8492]

А можно вопрос. А что написать чтобы скачать такую картинку

[@design_HUB]

unsplash.com/photos/pymraRrUNx0 - посмотрите какие теги под изображением написано, по ним ищите

[@hor1qay157]

а где искать такие же прикольные картинки,хз как по другому назвать,как у тебя справа треугольник?

[@design_HUB]

такие изображения можно искать на стоках. Загрузи себе PDF файл там есть перечень стоков - bit.ly/3U5FJbs А конкретно это изображения загружено с плагина Unsplash в Figma

[@АсалиА]

@@design_HUB А что вы писали в ансплеше? У меня пнг картинки не входит

[@design_HUB]

png нужно сделать самому. Уберите фон любым удобным способом. В этом видео я говорил о способах kzbin.info/www/bejne/h5ewepmhjLecm8U

[@aboba5422]

amazing

[@flesh3041]

У меня почему-то не доступен after delay. Что делать?

[@design_HUB]

На какой стадии? Может от объекта уже создан переход, посмотрите на панеле справа в прототипе... Пройдите еще раз путь по шагам)

[@flesh3041]

@@design_HUB Я разобрался уже, но с градиентом почему-то проблемы. В фигме градиент светлый. а когда запускаю анимацию в прототипе, он не светлый, а более тёмный

[@ВероникаКотлярова-ь1о]

Как сохранить это себе анимацией?

[@design_HUB]

Запись экрана

[@almazzhumabayev939]

как это потом экспортировать?

[@design_HUB]

куда и с какой целью вы хотите это экспортировать?

[@andriy-kos]

Можна потім якось зберегти цю анімацію як MP4?

[@design_HUB]

Найпростіший варіант-зробити запис экрану.

[@andriy-kos]

@@design_HUB теж про це подумав, що правда треба велику роздільну здатність, щоб не втратити якість для певних завдань

[@design_HUB]

Це точно. А можете взагалі экспортувати в After Effects і там налаштувати анімацію, якість не втратите)

[@КсенияТимошенкова-ь5ж]

а как скачать эту анимацию?

[@design_HUB]

Записать экран в прототипе) самое простое решение

[@sergeykolesnikov2815]

Привет! Крутой урок! У меня почему-то во время воспроизведения цвета градиента меняются на другие совсем( Почему так?

[@design_HUB]

Привет! Поделись со мной проектом figma в телеграм. Будем разбираться)

[@alexlisouski4069]

какой смысл от этой панели со стеклом?🌚 если показать ссылку, то это можно сделать проще без этой дополнительной панели

[@norbertberg8785]

Сделайте пожалуйста курсы на русском, я, например, еще не купил,потому что не понимаю на Украинском.

[@design_HUB]

Курс на русском

[@mymoon2508]

Как сделать чтобы у меня картинка проплыла вверх по экрану после нажатия на кнопку?

[@design_HUB]

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

[@МастурБист-п7н]

Не получаются никак анимации.... Видно края обрезанных картинок и текст куда-то плывет, хоть расположен на одинаковых расстояниях во всех вариантах... А урок отличный

[@design_HUB]

Если хочешь, поделись со мной макетом в фигма (пришли в Телеграм) - помогу разобраться