15 способов развлечь пользователя, пока он ждет загрузки сайта

Автор: Алексей Цветков

Основная фишка: загадочные дымовые эффекты, которые притягивают внимание.

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

Автор: Ник Бутуришвили

Основная фишка: анимация интуитивно понятным образом показывает процесс производства продукта.

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

Автор: Виталий Силкин

Основная фишка: простая графика и красивый градиент.

Чему можно поучиться: в своей версии анимации вы можете перемещать графические элементы не только по горизонтали, но и по вертикали. Можно добавить свечение или эффект жидкости, чтобы графика выглядела динамичнее. Другими словами, простая анимация выглядит интересно и привлекательно.

Автор: Макито Ниномия

Основная фишка: яркие песочные часы привлекают внимание пользователя, а надпись «Благодарим за ожидание» создает с ним эмоциональную связь.

Чему можно поучиться: в анимацию загрузки можно добавить какой-нибудь текст, чтобы вызвать у посетителя понимание и отклик.

Автор: Лилиан Тедон

Основная фишка: сочетание разных форм, вращения и прыжков.

Чему можно поучиться: можете попробовать другие формы и добавить к ним больше динамических эффектов. Пусть объекты меняют цвет и тень.

Автор: Виталий Силкин

Основная фишка: интересные эффекты жидкости и цвета. Сочетание черного и синего цвета дает эффект свечения. Анимация завораживает и заставляет пользователя ждать дольше.

Чему можно поучиться: обратите внимание на эффекты жидкости, таяния и свечения. Они выглядят необычно и привлекают внимание.

Автор: UI8

Основная фишка: интересные 3D-эффекты и плавное погружение объектов.

Чему можно поучиться: используйте этот простой шаблон погружения для создания гибких анимаций. Интуитивно понятная 3D-технология позволяет имитировать сложные визуальные эффекты.

Автор: Родейто Праст

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

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

Автор: Бурхан Кхаважа

Основная фишка: многоэкранность, градиенты, эффекты вращения.

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

Автор: Нгуен Тран

Основная фишка: контрастные цвета, создающие крутой эффект в стиле научной фантастики.

Чему можно поучиться: используйте похожую цветовую схему и понятную полосу загрузки.

Автор: Алекс Сейлер

Основная фишка: быстрая смена цифр и вращение.

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

Автор: Алекс Сейлер

Основная фишка: прямая демонстрация загружаемого контента

Чему можно поучиться: такая анимация загрузки очень информативна. Кроме того, милые и яркие стикеры привлекают внимание. Можно заменить их фотографиями автора.

Автор: Дэнни Перри

Основная фишка: вращение разноцветных полосок.

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

Автор: Зак Рожшевски

Основная фишка: яркая комбинация разных иконок.

Чему можно поучиться: покажите самые популярные иконки вашего сайта или приложения. Можете использовать различные анимации вращения, цвета и расположение.

Автор: Грег Медериос

Основная фишка: логотип компании/продукта и эффект свечения.

Чему можно поучиться: эта анимация показывает, как создается 3D-логотип компании или продукта. Эффект подсветки захватывает внимание пользователя.

Источник.

Материалы по теме:

Ссылка дня: бесплатный сервис проверки сайта на привлекательность для пользователей

20 полезных сервисов для дизайнеров и веб-разработчиков

Как заставить пользователей читать ваш сайт: 10 советов

Что почитать, если вы хотите ориентироваться в UX