Использование анимации в веб-дизайне

Для презентационных сайтов, рассчитанных на пользователей с качественными линиями связи, анимация в веб-дизайне просто незаменима. Но давайте попробуем разобраться в целесообразности использования анимированных картинок на сайтах информационной направленности.

Безусловно, движущиеся картинки привлекают гораздо больше внимания, чем обычные статические. В то же время, пользователь начинает хуже воспринимать информацию на странице – его основное внимание сосредоточено на объектах, находящихся в движении. Это объяснимо с биологической точки зрения, ведь периферийное зрение, остро реагирующее на движущийся предмет, зачастую спасает человеку жизнь. Сейчас этот инстинкт для нас не так важен, как это было в далеком прошлом, хотя, безусловно, полезен, особенно для водителей. Поэтому, если мы читаем текст на странице, а в углу что-то "шевелится", это нас очень отвлекает. И даже раздражает. Важно помнить: пользователь пришел на ваш веб-сайт получить информацию, а не любоваться мастерством веб-дизайнера.

Тем не менее, использование анимации в веб-дизайне в некоторых случаях не только оправданно, но и весьма полезно. Прежде чем заказать анимацию для своего сайта, следует задать себе вопрос: можно ли того же эффекта добиться другими средствами? Ниже перечислены случаи, в которых использование анимации просто незаменимо.

1. Иллюстрация переходного процесса

Если один и тот же объект может находиться в разных состояниях в разное время, процесс перехода из одного состояния в другое наилучшим образом передается с помощью анимации. Она в этом случае дает пользователю возможность отслеживать происходящие изменения визуально, а не представлять их в своем воображении. Например, таким образом можно легко проиллюстрировать простоту смены насадок на инструменте. Визуальный ряд позволит лучше донести до посетителя сайта, что смена насадок – действительно очень простое дело.

2. Смена отображаемой информации

Очень удобно использовать анимацию для отображения нескольких информационных элементов в одной и той же области экрана. Например, пояснений к карте. Когда мышь наводится на определенный участок карты, в углу экрана появляется информация, относящаяся к этому участку.

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

Важно при этом, чтобы эффект анимации проявлялся только при наведении мыши на область, а не присутствовал все время. Представьте себе, что на карте все активные области будут постоянно мигать и переливаться разноцветными огоньками. С такой картой будет очень трудно работать.

3. Отображение объемных структур

Экран компьютера дает только двумерное представление об объекте. Поэтому необходимость изображения трехмерных структур – это непростая задача. Конечно, чтобы дать пользователю полное представление о таком объекте, можно представить объект в разных проекциях. Но часто более эффективным (и эффектным) является анимированное изображение объекта, позволяющее пользователю изучить его со всех сторон. При этом движение объекта должно быть достаточно медленным – чтобы пользователь мог рассмотреть его. Лучшим вариантом, конечно, является управляемая анимация, когда пользователь сам может поворачивать объект, как ему нужно. Но это уже довольно сложная задача, выполняемая средствами флэш-программирования. Да и "вес" такой картинки будет немалым.

4. Слайд-шоу

Очень популярный в последнее время прием в веб-дизайне, позволяющий пользователю просматривать серию изображений, не перелистывая при этом веб-страницы. Как правило, слайд-шоу снабжается неким "пультом управления", который позволяет как просматривать изображения по одной картинке, так и запустить процесс непрерывного показа сменяющихся иллюстраций.

Этот прием можно отнести к анимации лишь с некоторой натяжкой.

5. Привлечение внимания

Иногда в веб-дизайне анимацию можно и нужно использовать для привлечения внимания. Если, например, мы хотим выделить в меню название страницы, на которой находится пользователь, мы можем поставить мигающую кнопку. Но "мигнуть" она должна всего несколько раз – только, чтобы обратить внимание. Впоследствии ей достаточно немного изменить цвет.

Или выплывающий текст. Если какое-то важно сообщение сделано в виде текста, "выплывающего" из-за края экрана, – это вполне разумный прием для привлечения внимания. Но важно при этом соблюдать меру. Текст должен "выплыть" только один раз лишь только для того, чтобы пользователь обратил на него внимание. В дальнейшем текст должен стоять на месте.

Плюсы и минусы флэш-анимации

Флэш – это очень мощный инструмент, делающий веб-сайты не только великолепно выглядящими, но и удобными для пользователя. Но:

  • Ни одна российская поисковая система пока не индексирует текст в флэш-роликах – значит, содержание такого флэш-сайта будет недоступно для поиска. Яндекс делает только первые шаги в этом направлении.
  • Большинство пользователей Интернета пользуются низкоскоростным модемным входом. А значит, вся эта красота вашего веб-ресурса им будет просто недоступна.
  • Вариант изготовления веб-сайта в двух версиях – обычной и флэш – обходится заказчику слишком дорого.

    Подытожим сказанное.

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

    Веб-студия DST Global (dstglobal.ru) создаст сайт с индивидуальным дизайном для вашей компании. Мы предлагаем заказ эффективного решения, которое обеспечит значительный рост продаж. При разработке учитываются характеристики целевой аудитории проекта и индивидуальные требования клиента.

    Изготовление сайта – это не только часть имиджа компании, но и очень значимое средство коммуникации с потенциальными клиентами. 

    Использование анимации в веб-дизайне
    Получить консультацию у специалистов DST
    Напишите нам прямо сейчас, наши специалисты расскажут об услугах и ответят на все ваши вопросы.
    Комментарии
    RSS
    Вам может быть интересно
    Сейчас, когда сайт имеется у каждой компании, важно выделяться на фоне конкурентов не только контентом, но уникальным дизайном. Но стоит ли так заморачиваться, если на рынке существует множество шабло...
    В этой статье — все о дизайне сайтов. Разработчики компании DST Global рас...
    Веб-дизайн — разновидность дизайна, которая ...
    Редизайн сайта – это современный метод актуализаци...
    Область веб-разработки и вариация дизайна, основно...
    Как показывает статистика, успех площадки зависит ...
    На сегодняшний день существует огромное количество...
    В наше время уже никого не удивить наличием сайта....
    Мобилизация, развитие и распространение технологий...
    Сайт — это лицо компании в сети. В перенасыщ...
    По мере развития интернет-технологий и их неотъемл...

    Новые комментарии

    Выберите наиболее подходящую схему интеграции для нужд вашей организации, учитыв...
    Спасибо за отзыв, а что думаете насчет выбора правильного интеграционного паттер...
    Интеграция приложений может быть реализована с помощью различных подходов, кажды...

    Заявка на услуги DST

    Наш специалист свяжется с вами, обсудит оптимальную стратегию сотрудничества,
    поможет сформировать бизнес требования и рассчитает стоимость услуг.

    Адрес

    Ижевск, ул. Воткинское шоссе, д. 170 Е, Технопарк Нобель, офис 1117

    8 495 1985800
    Заказать звонок

    Режим работы: Пн-Пт 10:00-19:00

    info@dstglobal.ru

    Задать вопрос по почте

    Укажите ваше имя
    Укажите ваше email
    Укажите ваше телефон