Как создать анимацию интерфейса с полупрозрачным курсором?

Question

[nanashi2160]

Добрый день, ребята!
Никак не могу найти туториал, где показывают как сделать анимацию приложения с курсором. Как здесь, в самом начале: https://www.youtube.com/watch?v=0yMyMDJe3YQ
Кто-нибудь знает, как создаются такие анимации?

Answer 1

[Shultc]

Первое что приходит в голову: открываете версию своего приложения в браузере через Device Toolbar (Chrome даст курсор)

И включаете запись экрана. Дальше поверх видео накладываете корпус телефона. Готово.

Второй вариант: Делать всё с нуля, в том же After Effects. Займёт это неоправданно много времени.

Третий вариант: Если у вас программа специализированна под определённую платформу, и нет веб-версии, то нужно уже смотреть варианты именно для этой платформы.

Answer 2

[figure04]

Скорее всего автор ролика использовал какую-то программу для прототипирования. Например, Framer. В нем есть функция Preview, там используется именно такой курсор.

Еще один вариант: Principle. Там в превью также используется подобный курсор.
В последнем можно записать видео или сделать гиф с курсором или без.