Я решил заняться изучением анимации интерфейсов и начал с Invisio Studio. Это что-то вроде Principle, но подходит для Windows.
Я не буду касаться того, как делать анимацию в InVisio, я лишь расскажу, как можно «экспортировать» то, что вы сделали.
Экспорта в InVisio в формате видео или гиф — нет. Вы можете только дать ссылку для просмотра. Такую ссылку не вставишь в Dribble. Там нужно либо видео, либо гиф.
Я начал с видео, и ничем хорошим это не кончилось. На windows я пользовался программами Loom и Bandicam.
Loom выводит низкое качество и не показывает полупрозрачные элементы.
Bandicam уже выводит качество выше, но всё равно что-то не так. Видны пикслели.
Я решил скачать программу для gif — ScreenToGif и решил попробовать с ней. Спойлер — мне понравился результат.
Результат с ScreenToGif
Про запись я говорить не буду, изучите сами.
Dribbble для обложки берёт первый кадр вашего видео или гиф. Важно выставить конечный кадр в самое начало. Иначе в сетке Dribbble у вас будет просто фон. С конечным кадром в начале у нас будет виден дизайн, который может привлечь пользователей к просмотру.
[изображение сетки дрибла, на первом скине фиолетвый квадрат, на втором анимация, сделать исскуственно]
Как поставить кадр в начало
После окончания записи гифки у вас появится экран редактирования. Внизу располагается раскадровка. Можно удалить или клонировать кадры. Перемещаться по ней можно горизонтальным скроллом.
[изображение тайминга кадров]
Идём в конец раскадровки, кликаем на последний кадр и нажимаем ctrl+c.
Перемещаемся в начало, кликаем на первый кадр и нажимаете ctrl+v.
[изображение выделенного первого кадра в тайминге]
Если он вставится после первого кадра с фоновым цветом — просто удаляем первый кадр, чтобы наш кадр с результатом переместился влево.
Готово!
Экспорт
Для начала нужно попасть в окно экспорта. Кликаем на Файл → Сохранить как.
[изображение экспорта в панели]
После этого справа появиться панелью.
[изображение Параметры кодировщика]
За качество отвечает «Параметры кодировщика». Надо перетянуть ползунок влево. Ниже параметры по желанию.
Внизу кнопка сохранить. После экспорта можно вставить эту гиф в дрибл.
