в веб-дизайне
внимание
Привлекаем
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
цвет
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
Способы привлечения внимания
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
размер
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
Способы привлечения внимания
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
местоположение
Способы привлечения внимания
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
анимация
текст
текст
текст
текст
текст
текст
текст
текст
цвет
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
текст
Способы привлечения внимания
в веб-дизайне
Анимация
Анимация — это переход состояния объекта из одного в другое за определенный промежуток времени.
Общие данные
Функциональное взаимодействие
  • открытие pop-up окон
  • эффекты наведения на кнопки
  • раскрывание списков
  • смена состояния иконок
  • смена внешнего вида курсора при наведении на объекты
Задача: помочь пользователю отличить нефункциональные объекты от функциональных, с которыми он может как-то взаимодействовать.
Анимация, которая показывает взаимодействие пользователя с объектами интерфейса.
Цели анимации
Кнопка-обманщица 😈
Нажми! Я кнопка 😊
Ссылка стандартная
Чтобы пользователь остался на сайте
Загрузочные анимации помогают уменьшить восприятие времени ожидания, пока загружается страница или контент. Он развлекает и отвлекает пользователя во время ожидания, создавая положительное восприятие времени ожидания, а также информирует пользователя о статусе загрузки
Прелоадер
Пожалуйста останься!!!
Цели анимации
Нажми!
Привлечение внимания
Анимация и интерактивные элементы помогают выделить важные части сайта, привлекая внимание пользователей к ключевым сообщениям, кнопкам или предложениям. Плавное появление или исчезновение элементов, изменение цвета и мерцание помогают сосредоточить внимание пользователя на ключевых элементах страницы.
Цели анимации
Нажми!
И сюда тоже..
И сюда нажми!
Красота... настроение... тренды... понты
Анимация погружает пользователя в проект, делает сайт живее, динамичнее, интереснее.

Различные сценарии и рисунки анимации применяются исходя из стилистики, цели сайта и типа контента.
Цели анимации
Нажми!
И сюда тоже..
И сюда нажми!
за внимание
Спасибо