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

Все исходники добыл на стоках. Сделал по итогу 2 версии анимации. Сначала сделал черно-белую анимацию - белое на темном фоне. Но потом заказчик предложил раскрасить всё это. Вот этот вариант и публикую здесь. Кстати он лучше смотрится на темном фоне.

Была задача скопировать видеоанимацию, реализовать ее в SVG. Не люблю такие задачи, но тем не менее они довольно часты.

Копирование «1-в-1» - это двойная, или даже тройная по трудозатратам работа. Сначала разбираешь «по косточкам» пример, с протоколированием тайминга. Потом собираешь с нуля копию в svg. И третья, финальная стадия - максимально точная подгонка готовой анимации под оригинал.

Анимация прелоадера для интернет-магазина азиатской кухни. Посмотрите его с начала, перед тем как анимация войдет в цикл, кликнув по заголовку. Проблема загрузчиков сродни порнофильмам - их никто не досматривает до конца. Тут немного наоборот, не все увидели начало.

Анимация загрузчика для интернет магазина звуковых систем автомобилей. Нужен был жесткий бас!

Тут я думаю все ясно без слов. И к слову удобно: сразу можно понять сколько времени занимает загрузка сайта или подключение к сервису. Но на всю видимую простоту, мне как аниматору пришлось изобрести метод реализации. В svg не все так просто с некоторыми видами анимации, как в видео. Профессия аниматора сродни профессии фокусника в умении дурачить своего зрителя. Вот тут анимированы, помимо стрелки, только 4 куба. Вы их видите?

Простейший анимированный загрузчик для интернет-магазина рыболовных принадлежностей. Исходник со стоков и несколько минут работы.