Создание простой lottie анимации для сайта.

на выходе что должно быть: HTML5, GIF, mp4?

Эльчин Г. 25 августа 2022

на выходе lottie файл в формате json.

В примере не какого морфинга нет. Обычное движение элементов по пути. Кроме этого это видео а не html элемент. А если сделать 500 элементов движения по пути, то у вас компьютер не откроет эту страницу.

Кроме этого если делать так как вы описали при скролле то у вас там один экран всего, а не 2,3,4 для скролла.

Эльчин Г. 25 августа 2022

Внимательно прочитайте задание.
1. Пример в фигме это иллюстрация первого и последнего фрейма.  Морфинг предполагался к элементам, а не полоске. Это и так понятно.
2. Пример сайта, относится, к анимации движения полосок связи между элементами. В задании об этом сказано.
3. это не видео формат, а анимация lottie. Разница огромная. Если вы не знаете по какому принципу она анимируется в вэб странице при скролле, сначала изучите вопрос, а потом пишите свое мнение.
4. Экран скролла вас интересовать не должен, я его могу растянуть, так, как захочу.  Элемент будет зафиксирован и воспроизведен во время прокрутки. Я мог этого и не писать, если уж на пошло.
4. 

Движения полосок это и есть анимация motion path.

Вы себе представляете что такое  морфирование ? это трансформация одного элемента в другой. Имитация соединения тут не причем.

Я  всегда подсказываю людям.  В большинстве случаем клиент знает что он хочет  но не знает как это правильно описать.

Эльчин Г. 25 августа 2022

Я занимался After Effects более 2х лет.  Прекрасно понимаю что такое морфинг. Перечитайте Ваш первый комментарий и сравните с тем, что Вы написали сейчас. 

Я написал дословно "Можно попробовать сделать что-то наподобие морфинга."  Даже если придраться к этому слову могу сказать: при большом желании можно трансформировать иконки, подлежащие исчезновению в оставшиеся. Была бы фантазия и умение. 

Задание предельно простое и не требует комментариев по типу " А если сделать 500 элементов движения по пути, то у вас компьютер не откроет эту страницу.  Кроме этого если делать так как вы описали при скролле то у вас там один экран всего, а не 2,3,4 для скролла."  Это говорит либо о том, что вы не совсем вникли в суть задания, либо плохо разбираетесь в том, как работает lottie анимация.

Это не подсказка клиенту с Вашей стороны. Больше вводит в заблуждение, особенно если заказчик не знаком с тонкостями. Пишите по существу, а не так, чтобы блеснуть знаниями, которых в этой конкретной проблематике у вас видимо нет.