В погоне за оригинальностью дизайнеры придумывают разные способы, чтобы заинтересовать и удержать посетителя. Одним их таких способов является анимация. Она придает уникальность любому интерфейсу. Будь то мобильное приложение или веб-ресурс.
Скажите нет своему страху, возьмите лист бумаги и карандаш и начните рисовать. Нарисуйте фигуру. Возьмите второй, и нарисуйте еще одну. Затем третью. Короче говоря сделайте раскадровку анимации.
Затем перейдите к цифровым инструментам рисования. Проделайте всю работу также. Уже не так страшно, правда?
Некоторые инструменты, которые можно использовать для этого:
- Lottie;
- Adobe Animate;
- After Effects;
- Sketch;
- Origami;
- Principle;
Представляем несколько советов, для качественного использования анимации в интерфейсах:
- Добавляйте анимацию, только туда, где это нужно. Не стоит превращать все в фильм. Используйте ее к примеру при переходе на другую страницу, ожидая загрузку или в качестве подсказки к совершению определенного действия.
- Анимации применяются для лучшей передачи происходящего и донесения этой информации визуально. Наиболее простой пример — индикатор выполнения. Он показывает, что что-то происходит или загружается и насколько продвинулся этот процесс. Если не будет отображена визуальная реакция, пользователь может не до конца понять выполнено ли его действие и происходит ли что-то вообще.
- Важно соблюдать правильность пространственной информации. Если элемент пользовательского интерфейса (кнопка), соответствующая анимации находится в левом верхнем углу, анимация должна быть слева. И наоборот.
- Управляйте вниманием пользователя. Анимация – ключ к успеху. Так заложено природой, что мы невольно обращаем внимание на движущиеся предметы. Однако всего в меру. Не переборщите с анимациями, всегда задумывайтесь, для чего они и как они могут улучшить интерфейс.
- Сохраняйте понравившиеся публикации. Смотрите на них снова и снова, запоминайте. Учитесь.
По материалам: www.webdesguru.com