Скринсайт — это одноэкранный сайт, который умещается в экран устройства из которого ведется просмотр сайта.
Скринсайт — это сайт у которого решена проблема распределения внимания посетителей сайта на определенных областях страницы, согласно которой больше всего внимания и соответственно просмотров достается верхней части сайта, попавшей в первый экран устройства из которого ведется просмотр сайта.
Экран — это область сайта, попадающая в компьютер, ноутбук, планшет, мобильное устройство.
Данные о посетителях взяты из другого сайта, но суть у всех обычных сайтов одна, нижние области сайта видят в несколько раз меньше всего людей.
Увидеть эту проблему можно с помощью карты скроллинга в сервисе от Яндекса — Яндекс Метрика.
То есть первый экран сайта видят больше всего посетителей.
Второй экран меньше посетителей.
Третий экран еще меньше.
Последний экран видят меньше всего посетителей.
И в обычном сайте инструмент «Карта скроллинга» позволяет выявить оптимальную длину страниц сайта и правильно разместить на них важную информацию.
И если вы покупаете рекламу, то знайте, что 66% посетителей, зашедших на сайт, не увидят ваше коммерческое предложение полностью, и уйдут.
Они не смогут оценить все преимущества и выгоды вашего продукта и уйдут ни с чем. А вы потеряете деньги.
Поэтому для увеличения количества просмотров, а также проведенном на сайте времени, используется анимация.
А именно, вся информация на сайте размещается в виде анимации (анимационного блока), который располагается в самом верху сайта, сразу отображается, сразу виден после загрузки сайта, сразу запускается и сразу начинает вовлекать пользователя на просмотр.
Сразу показывает пользователю всю информацию о продукте или услуге, на которую вы делаете главную ставку.
После завершения анимации, происходит повтор бесконечное число раз, то есть анимация зациклена.
И сайт оживает. Движения элементов привлекают вашего клиента и вовлекают в содержимое сайта.
И таким образом получается сайт в один экран, что по-английски экран – screen сайт.
На ПК, ноутбуках, планшетах и мобильных телефонах в горизонтальном расположении экрана, отображается стандартная горизонтальная (альбомная) анимация.
Но на экране смартфона в вертикальном расположении анимация становится маленькой и незаметной, так как она сжимается по ширине и сильно уменьшается.
Именно поэтому для мобильных устройств разрабатывается отдельная анимация вертикального (портретного) типа, которая включается автоматически, и которая хорошо видна.
Данный скринсайт был создан на основе графических изображений, с которых начинается описание основных разделов Газпромбанка. Так было сделано для демонстрации этому банку наших возможностей. А также для определения того, что мы сами умеем делать и какой уровень анимации можем предложить самым требовательным клиентам. Каждое изображение справа оживлялось — разрезалось на составляющие, которые приводились в движение через специальное программное обеспечение. А для максимально гармоничных движений добавлялись свои графические элементы.
Экран 1 — Демонстрация выгодного предложения по кредиту наличными
Экран 2 — Демонстрация выгодного предложения по кредитной карте
Экран 3 — Демонстрация выгодного предложения по накопительному счету
Экран 4 — Демонстрация выгодного процента по вкладу
Экран 5 — Демонстрация выгодного предложения по ипотеке
Экран 6 — Кредит на покупку автомобиля
Экран 7 — Рефинансирование кредитов
Экран 8 — Реклама подписки на информационную рассылку
Экран 9 — Призыв воспользоваться мобильным приложением
Экран 10 — Информация о инвестициях
Экран 11 — Сервис «Private Banking»
Экран 12 — Защита от мошенников
Экран 13 — Сервис «Регистрация бизнеса»
Фон скринсайта одноцветный, и он не отвлекает пользователя от изучения анимированной информации. Элементы анимируются последовательно и за счет необычных движений держат внимание клиента на себе.
Кнопку «Узнать подробнее» на которую анимация призывает нажать, можно сделать активной, то есть чтобы при клике на нее пользователю открывалась подробная информация по рекламируемой услуге. Также можно в качестве ссылки сделать кликабельным любой элемент и такая анимация станет интерактивной. (Смотрите внизу раздел «Взаимодействие с анимацией»)
Длительность:
1. Горизонтальной анимации: 2 минуты 25 секунд
2. Вертикальной анимации с соотношением сторон 1.33 (Высота / Ширина): 2 минуты 25 секунд
После первого воспроизведения, анимация зациклена на начало и начинает проигрываться заново, то есть является бесконечной.
Вертикальная анимация для мобильных устройств на первый взгляд похожа на основную горизонтальную анимацию, но ее производство занимает 70% от времени разработки основной горизонтальной анимации. Так происходит, потому что для вертикального формата нужно, во-первых, выстраивать все движения элементов заново. А, во-вторых, некоторые движения, эффектно, корректно и красиво преподносящие информацию в горизонтальном формате, не могут также справиться с этой задачей в вертикальном формате. И поэтому их нужно переделывать и адаптировать под вертикальный формат.
Размеры горизонтальной анимации:
1. Файла анимации json: 355 кб
2. Изображений, участвующих в анимации: 742 кб
Размеры вертикальной анимации:
1. Файла анимации json: 389 кб
2. Изображений, участвующих в анимации: 742 кб
Все это говорит о том, что анимация быстро загружается вместе с загрузкой страницы сайта и сразу же начинает проигрываться и выполнять заложенные в нее задачи.
Кроме просмотра анимации клиент также может взаимодействовать с анимацией кликая по различным элементам — красиво появляющимся кнопкам, картинкам, областям, открывающим новые страницы и формы подачи заявки на ваш продукт или услугу.
Такой подход еще больше усиливает связь между вашим продуктом и клиентом, а путь к заказу становится эмоциональным, вдохновляющим, коротким и быстрым.
Телеграм:
https://t.me/gve2005
Все права защищены © Copyright 2021 — 2025. УНП HA5833271