Проектирование Canvas App для средних экранов
Для корректной работы Canvas App на SberPortal следуйте нашим рекомендациям по взаимодействию с устройством.
Сенсорный экран
SberPortal обладает сенсорным экраном. Поэтому смартап должен правильно реагировать на каждое прикосновение пользователя.
Скролл
Чтобы пользователь мог нажать на экран и вести по нему пальцем, реализуйте следующие возможности:
- плавный скролл по мере движения пальцем;
- скролл в 4 направлениях (вверх, вниз, влево, вправо);
- остановка скролла в любом месте при отпускании пальца с экрана.
Фокус
Когда пользователь нажимает на какой-то элемент смартапа, важно показать, что этот элемент был выбран. Вы можете продемонстрировать это, например, через анимацию.
SberPortal не поддерживает установку фокуса на элемент с последующим выделением текста.
Свайпы
У пользователей SberPortal появляется дополнительный способ взаимодействия со смартапом — через свайпы (определенные движения по экрану). Для корректной работы смартапа предусмотрите следующие свайпы:
- по экрану слева направо — возврат пользователя на предыдущий экран;
- по экрану сверху вниз — команда закрытия смартапа.
Реализовать свайпы для SberPortal вы можете любым удобным для вас методом и инструментом.
Медиаресурсы
Аудио и видео
Смартапы для SberPortal поддерживают автоматическое воспроизведение аудио и видео. То есть звуковая дорожка может воспроизводиться в любой момент без дополнительных нажатий на элементы интерфейса. Автовоспроизведение реализуется за счет метода autoplay() (английский язык).
Камера
Пользователи SberPortal могут использовать встроенную камеру и взаимодействовать с устройством через жесты. Однако для внешних смартапов доступ к камере SberPortal по методу getUserMedia() пока не предусмотрен.
Картинки
Canvas App на SberPortal не имеет ограничений по статическим ресурсам. Например, вы можете отображать в смартапе картинки с любого веб-сайта. Главное, чтобы ваш контент соответствовал требованиям модерации.
Хранение данных
Хранение данных в браузере через localStorage временно не поддерживается.
Характеристики SberPortal
Для корректной разработки Canvas App для SberPortal рекомендуем также ознакомиться со следующим материалом: