Проектирование Canvas App для SberPortal


Для корректной работы Canvas App на SberPortal следуйте нашим рекомендациям по взаимодействию с устройством.

Сенсорный экран

SberPortal обладает сенсорным экраном. Поэтому смартап должен правильно реагировать на каждое прикосновение пользователя.

Скролл

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

  • плавный скролл по мере движения пальцем;
  • скролл в 4 направлениях (вверх, вниз, влево, вправо);
  • остановка скролла в любом месте при отпускании пальца с экрана.

Фокус

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

SberPortal не поддерживает установку фокуса на элемент с последующим выделением текста.

Свайпы

У пользователей SberPortal появляется дополнительный способ взаимодействия со смартапом — через свайпы (определенные движения по экрану). Для корректной работы смартапа предусмотрите следующие свайпы:

  • по экрану слева направо — возврат пользователя на предыдущий экран;
  • по экрану сверху вниз — команда закрытия смартапа.

Реализовать свайпы для SberPortal вы можете любым удобным для вас методом и инструментом.

Медиаресурсы

Аудио и видео

Смартапы для SberPortal поддерживают автоматическое воспроизведение аудио и видео. То есть звуковая дорожка может воспроизводиться в любой момент без дополнительных нажатий на элементы интерфейса. Автовоспроизведение реализуется за счет метода autoplay().

Камера

Пользователи SberPortal могут использовать встроенную камеру и взаимодействовать с устройством через жесты. Однако для внешних смартапов доступ к камере SberPortal по методу getUserMedia() пока не предусмотрен.

Картинки

Canvas App на SberPortal не имеет ограничений по статическим ресурсам. Например, вы можете отображать в смартапе картинки с любого веб-сайта. Главное, чтобы ваш контент соответствовал требованиям модерации.

Хранение данных

Хранение данных в браузере через localStorage временно не поддерживается.

Характеристики SberPortal

Для корректной разработки Canvas App для SberPortal рекомендуем также ознакомиться со следующим материалом:

Заметили ошибку?

Выделите текст и нажмите Ctrl + Enter, чтобы сообщить нам о ней