Анимашка⁠⁠

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

Ничего не вырисовывал, повторял для общего понимания анимации и проверки — могу ли я так. Интерфейс на букву Х😜

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

Реализуется через smart animate от кнопки. Новый фрейм, который сверху появляется, просто добавляешь на втором экране. Главное в анимации в Figma всегда следить за названием объектов, для анимации они должны совпадать!

В оригинале у чела красочное приложение умного дома. Но даже горизонтальный скролл подаётся, как что-то необычное))