Есть такая модель поведения в интернет-магазинах, когда покупатели ищут не просто товары, а товары определенного бренда.

Здесь алфавит выведен в главное меню. При наведении появляется выпадающий список с названиями.

Еще она примечательная штука.

Туда же добавили ссылками основные категории. Причем сделано так, что сразу очевидно назначение средств, которые появятся при переходе по ссылке.

Необычное решение по использованию анимации на первом экране. Сразу бросается в глаза. Такой сайт выделяется среди аналогов.

Причем это не стоковое видео, а реальный сотрудник.

Дальше на фото ее можно встретить неоднократно.

А вот в этом примере достаточно распространенная ошибка.

Она возникает, когда в угоду дизайну забывают про базовые принципы управления вниманием.

Повернутый экран в сторону от контента уводит взгляд от него вправо.

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

Насколько это эффективно вопрос дискуссионный.

Но как минимум необычно.

В этом интернет-магазине предлагают возможность добавлять изображения к товарам прямо на самом сайте.

Это одновременно упрощает его обслуживание. И позволяет расширить список уникальных фотографий.

Что в свою очередь оказывает влияние на продвижение в поисковых системах.

Интересное решение по появлению первого слайда на экране с эффектом рисования.

Выглядит очень эффектно.

Очередной пример, когда ради "красивой картинки" уничтожают его юзабилити.

В данном случае это неудачное расположения списка с болями клиентов.

Люди читают слева направо и сверху вниз.

Здесь создатели предлагают пойти нестандартным путем и воспринимать пункты сверху налево.

Из-за этого их становится сложно воспринимать и они, как продающий элемент, перестают работать.

При проектировании сайта стоит проработать вопрос с тем, как должен перемещаться взгляд посетителя по странице.

При клике на соответствующий пункт появляется анимация, показывающая связь между элементами.

Любопытное решение, которое позволяет представить наглядно этапы работы.

Единственное, что немного не докрутили. Здесь было бы уместнее сделать стрелку, а не просто закрашиваемую линию.

Забавное решение на странице контактов.

Правда, не до конца понятна идея. Возможно, задумывалось сделать так, как будто персонаж летит на землю.

Если мы не ошиблись, то стоит отметить - это ни разу не очевидно. Возможно у вас есть идеи ;-)

Напоследок пример 404 страницы западного сервиса по покупке автомобилей (напомним, на нее попадает человек когда, например, решил перейти на несуществующую страницу сайта).

Узнаете игру с динозавром, которая появляется когда, пропадает интернет?

Вольный перевод:

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