Skip to content

Изменение попапов на посещение

Смотри: Попапы на посещение

Обновление существующих попапов

  1. Заходим в Firebase Console - Remote Config
  2. Нажимаем редактировать на engage_app_start_popups Pasted image 20240131185748
  3. Открываем редактор Pasted image 20240131185842
  4. Редактируем
    1. Меняем попапы
    2. Проверяем, что все ок
    3. Сохраняем Pasted image 20240131185945
    4. Сохраняем в правом меню тоже! Pasted image 20240131190115
  5. Нужно опубликовать изменения Pasted image 20240131190210

Создание новых попапов

Чтобы добавить новый попап, нужно в список вставить новый объект

Картинки

Для новых попапов нужно загрузить картинки Есть два пути:

  1. Загрузить через разработчика - Предпочтительно
  2. Настроить ссылки вручную в конфигурации попапа - Advanced

Шаблон

  • count - кол-во запусков, на которое покажется попап
  • action - действие, может быть ссылка или форма - #Действия
  • image - картинка - #Картинки
  • locales - фильтр по локали, попап покажется только для языков из списка
json
{
  "count": 5,
  "title": "Заголовок",
  "description": "Описание",
  "action": {
    "type": "link",
    "url": "https://online.artforintrovert.ru/app-pro-courses?utm_source=app&utm_medium=popup&utm_campaign=launch&utm_content=115",
    "text": "Выбрать профессию"
  },
  "locales": [
    "ru"
  ]
},

Картинки

Сейчас картики добавляем через разработку

Для разработчика нужно подготовить архив с изображениями и отправить в ЛС или mobile-public

Изображения должны быть в темной и светлой теме для каждого попапа. То есть для одного попапа минимум 2 изображения

В итоге изображения автоматически подтянутся в приложении без ручного ввода ссылок в JSON

Формат названия изображения

{count}_dark@3x.png, {count}_light@3x.png, где

  • n - значение count из конфигурации попапа
  • dark - темная тема
  • light - светлая тема
  • 3x - масштаб изображения, смотри "Масштаб и Экспорт - Figma" ниже

Примеры

  • 5_light@3x.png
  • 5_dark@3x.png
  • 15_light@3x.png
  • 15_dark@3x.png

Масштаб и Экспорт - Figma

Изображения из фигмы должны быть экспортированы в 3x масштабе с суффиксом @3x

Pasted image 20240306004832

Добавление изображений вручную - Advanced

Одно изображение на обе темы

  • "type": "default"
  • "asset": "<ссылка>" - Нужно положить ссылку до картинки

Пример

json
{
    "count": 5,
    "title": "Заголовок",
    "description": "Описание",
    "action": {
        "type": "link",
        "url": "<ссылка>",
        "text": "Выбрать профессию"
    },
    "image": {
        "type": "default",
  "asset": "https://art-for-introvert-static.s3.eu-north-1.amazonaws.com/mobile/app_start_popups/custom/кастомная-картинка@3x.png"
    },
    "locales": [
        "ru"
    ]
},

Изображения зависимые от темы - светлая/темная

Пример

json
{
    "count": 5,
    "title": "Заголовок",
    "description": "Описание",
    "action": {
        "type": "link",
        "url": "<ссылка>",
        "text": "Выбрать профессию"
    },
    "image": {
  "type": "themed",
  "light": {
   "type": "default",
   "asset": "https://art-for-introvert-static.s3.eu-north-1.amazonaws.com/mobile/app_start_popups/custom/кастомная-картинка-светлая@3x.png"
  },
  "dark": {
   "type": "default",
   "asset": "https://art-for-introvert-static.s3.eu-north-1.amazonaws.com/mobile/app_start_popups/custom/кастомная-картинка-темная@3x.png"
  }
 },
    "locales": [
        "ru"
    ]
},

Действия

В попапе при тапе на желтую кнопку будет совершен переход по ссылке из конфигурации

  • url - Обязательно - ссылка
  • text - Обязательно - текст кнопки
json
"action": {
    "type": "link",
    "url": "<ссылка>",
    "text": "<текст кнопки>"
}

Form - Форма для заполнения номера

В попапе будет показана форма для заполнения номера

  • reason - Необязательно, формируется автоматически из настроек попапа
  • text - Обязательно - текст кнопки
json
"action": {
  "type": "form",
  "reason": "<идентификатор формы>",
  "text": "<текст кнопки>"
}

Проверка финального json'а перед публикацией

Для проверки есть схема для валидации финального Json

  1. Открыть по этой ссылке JSON Schema Validator
  2. Вставить весь json с попапами в левое поле
  3. Если всё окей то справа появится зеленое сообщение Pasted image 20240201225145
  4. Можно публиковать изменения

Авторы

The avatar of contributor named as melvspace melvspace

История