Генератор интерактивных модулей: «Найдите пару»

«Найдите пару» — игра, знакомая каждому из нас с детства. Найти пару одинаковых картинок, открывая их по очереди, — довольно увлекательное и умеренно сложное задание, которое можно использовать, чтобы разнообразить свои email-рассылки. Мы добавили ее в свой генератор интерактивных модулей, и теперь самое время разобраться, как можно быстро сгенерировать игру для писем.

Как можно использовать игру «Найдите пару» в письмах

Правила игры довольно просты. Получателю нужно будет искать пары одинаковых картинок, пока не будут найдены все из них. Поскольку в игру можно добавлять любые картинки, эта механика хорошо впишется в письма любой индустрии, желающей сделать свои рассылки более увлекательными.

Добавьте игру в письмо «Найдите пару», а наградой за ее успешное прохождение может служить промокод, скидка или любое другое вознаграждение, которое вы сочтете достаточно ценным для своей аудитории.

Например, Yakaboo создала интерактивный челлендж с 10-секундным лимитом времени, используя игру «Найдите пару». У игроков было неограниченное количество попыток, что подогревало их желание разблокировать скидку 20% на покупку книг в этом магазине.

(Источник: Письмо от Yakaboo)

(Источник: Письмо от Promodo for Shiny&Diski)

Как сгенерировать интерактивный модуль «Найдите пару»

Простота создания игровых шаблонов является краеугольным камнем нашего генератора, поэтому давайте наглядно покажем каждый простой шаг создания игры «Найдите пару».

Шаг 1. Выберите количество клеток

Для начала нужно определиться с количеством клеток в игре, от этого будет зависеть уровень ее сложности и число картинок, которые необходимо будет добавить в дальнейшем.

Шаг 2. Добавьте изображения клеток

Поскольку игра основана на картинках, пары которых нужно подобрать, вашей главной задачей в генераторе будет добавление собственных изображений. Просто вставьте ссылку на картинку, и она автоматически добавится в игру.

Важно отметить: загружаемое изображение должно быть в формате PNG, JPG или GIF. Кроме того, вес загружаемого файла не должен превышать 3 МБ, а размеры не должны быть больше 4000 × 4000 пикселей.

Шаг 3. Составьте сообщения о совпадении для интерактивного HTML

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

• сообщение, которое получатель увидит, если соберет правильную пару; 
• кнопку, чтобы подтвердить правильность найденной пары; 
• «Сообщение о прогрессе» с текстом и кнопку для продолжения игры;
• сообщение для неправильной пары;
• кнопку для продолжения игры после того, как была найдена неправильная пара.

В HTML-версии игры сообщения будут выглядеть следующим образом:

Шаг 4. Поработайте над окном завершения

Любая игра рано или поздно заканчивается, поэтому необходимо добавить «Окно завершения» в игру «Найдите пару».

Вы можете написать любое сообщение — обычно это промокод на следующую покупку, добавить эмодзи прямо из генератора и выбрать место, где будет отображаться сообщение (после игры или попап).

Шаг 5. Создайте текстовую версию

Еще один важный аспект — создание фолбэка. Не все почтовые клиенты поддерживают AMP и HTML, поэтому для таких пользователей нужно подготовить отдельную версию текста, которую они увидят в своей почте. В случае с игрой «Найдите пару» достаточно просто сразу выдать награду, в то время как в других почтовых клиентах получателям придется побороться за нее в игре.

Шаг 6. Оформите дизайн игры

Основа игры готова, так что пришло время настроить ее оформление. Мы предоставляем несколько инструментов, чтобы видоизменить игру, а затем добавить ее в письмо.

Превью клеток

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

Важно отметить: загружаемое изображение должно быть в формате PNG, JPG или GIF. Кроме того, вес загружаемого файла не должен превышать 3 МБ, а размеры не должны быть больше 4000 × 4000 пикселей.

Сообщения о совпадении

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

• цвета текста кнопок;
• цвета фона кнопок;
• радиус границы.

Шаг 7. Скачайте и добавьте игру в письмо

Наш генератор выдаст вам модуль с игрой, содержащий следующее:

• AMP-версию письма. Она работает в Gmail, Yahoo и FairEmail;
• интерактивный фолбэк. Он работает на всех устройствах и в почтовых клиентах, поддерживающих HTML5 и CSS3. Он также работает в Apple Mail и Samsung Email; 
• текстовую резервную версию. Она работает в почтовых клиентах, которые не поддерживают HTML5 и CSS3, например в некоторых приложениях Outlook.

Использование AMP и интерактивного HTML-фолбэка позволит охватить 92% аудитории, поскольку они смогут взаимодействовать с интерактивной частью этой игры. Текстовый фолбэк позволит вам предоставить оставшимся 8% аудитории, использующим почтовые сервисы, которые не могут работать с интерактивным контентом, промокод или иную награду, за которую другие будут соревноваться в процессе игры.

Непосредственно внедрение игры также довольно простое и не занимает много времени. Мы подробно описали процесс в нашем первом мануале «Как создавать интерактивный контент без проблем с кодом». Перейдите по ссылке на эту статью и найдите Шаг 6, где мы подробно описываем каждый шаг.

В завершение

Очередное дополнение к нашему генератору интерактивных модулей пополнило ряды ваших возможностей по созданию писем еще одним игровым шаблоном. Игра «Найдите пару» позволяет вашим получателям выиграть различные подарки в интерактивной и веселой форме, делая письма еще более захватывающими и желанными.

Кроме того, игра доступна 92% аудитории благодаря совместимости с большинством почтовых клиентов. Таким образом, это полезное дополнение, которое повысит эффективность ваших рассылок. Мы продолжаем добавлять различные механики в свой генератор, чтобы предоставить вам легкий доступ к различным развлекательным играм для email-рассылок. Следите за новостями, чтобы не пропустить новые игры.