Для меня это стал самый популярный вопрос в личку на сайте freelance.ru, я не жадный, но скажу честно — я устал отвечать всем и решил сделать статью.
Как же добавить анимацию в портфолио на freelance? Ответ на самом деле на поверхности сайта и доступен был всегда, но для внимательных.
Давайте начнем с того, зачем вообще нужна анимация?
1. Анимированное портфолио привлекает больше внимания.
2. В анимированном изображении можно донести больше информации.
3. Можно использовать как рекламу.
4. Думаю что ест и другие варианты.
Пример использования анимированного портфолио можно посмотреть у меня в аккаунте: freelance.ru/trunovtom
Я сделал все достаточно просто — разработал анимацию с эффектом пролистывания каждой работы, то есть клиент может просмотреть сверху вниз весь сайт (страницу конечно же), не заходя в работу.
Выглядит эффектно и неожиданно, когда ты просто листаешь портфолио, а тут мужик или девушка выходит прям в картинке 🙂
GIF анимацию я создавал в Photoshop из различных кадров, снимали на телефон, разбивали по кадрам, ускоряли в фотошоп и создавали GIF, НО нам так такой GIF не нужен, нам нужен формат APNG (animation PNG), он не воспроизводится на компьютере, а работает только в браузерах и о возможности его загрузить написано на самом же сайте Freelance.ru:
1. Переходим в редактирование портфолио
2. Выбираем нужную работу:
3. Читаем внимательно и загружаем изображение APNG
Теперь все готово. Изображение APNG можно загрузить только к превью работы, сама же работа не может быть анимированной. Для тех, кто дочитал до конца, небольшой лайфхак: APNG можно загружать не только к портфолио: но и в. превью профиля (большое изображение сверху в вашем профиле), отлично подходит для рекламы, есть возможность передать больше информации.
