Добавляем GIF в портфолио Freelance.ru

Для меня это стал самый популярный вопрос в личку на сайте freelance.ru, я не жадный, но скажу честно - я устал отвечать всем и решил сделать статью.

Как же добавить анимацию в портфолио на freelance? Ответ на самом деле на поверхности сайта и доступен был всегда, но для внимательных.

Давайте начнем с того, зачем вообще нужна анимация?

1. Анимированное портфолио привлекает больше внимания.
2. В анимированном изображении можно донести больше информации.
3. Можно использовать как рекламу.
4. Думаю что ест и другие варианты.

Пример использования анимированного портфолио можно посмотреть у меня в аккаутне:

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

Так же есть пример использования анимации с моим небольшим развлечением:
_______________________________________

_______________________________________

Выглядит эффектно и неожиданно, когда ты просто листаешь портфолио, а тут мужик или девушка выходит прям в картинке :)

GIF анимацию я создавал в Photoshop из различных кадров, снимали на телефон, разбивали по кадрам, ускоряли в фотошоп и создавали GIF, НО нам так такой GIF не нужен, нам нужен формат APNG (animation PNG), он не воспроизводится на компьютере, а работает только в браузерах и о возможности его загрузить написано на самом же сайте Freelance.ru:
1. Переходим в редактирование портфолио
_______________________________________

_______________________________________
2. Выбираем нужную работу:
_______________________________________

_______________________________________
3. Читаем внимательно и загружаем изображение APNG
_______________________________________

_______________________________________
Теперь все готово. Изображение APNG можно загрузить только к превью работы, сама же работа не может быть анимированной.
Для тех, кто дочитал до конца, небольшой лайфхак: APNG можно загружать не только к портфолио: но и в. превью профиля (большое изображение сверху в вашем профиле), отлично подходит для рекламы, есть возможность передать больше информации.
_______________________________________

_______________________________________
Делюсь - не жалко. Прошу поставить лайк данному посту - если он вам был полезен! Всем добра.