Зерокодинг и создание цифрового квеста
Вдохновленный тайным сообществом «Цикада 3301» и моей страстью к головоломкам, я решил создать уникальный «цифровой квест» для своей второй половинки.
Воплощение этого кейса, пропитанного атмосферой таинственности, прошло без единой строчки кода, используя чат-бота, технологию синтеза речи, веб-сайт, приложение-викторину, текстовые изображения и даже телефон с автоответчиком.
В данной статье раскрывается процесс создания персонального проекта, основанного на совокупности готовых решений бескодовой разработки.
Пользовательский путь (сценарий)
Квест начался с того, что на мобильный телефон поступило загадочное сообщение от анонимного отправителя. Сообщение было приглашением принять участие в интеллектуальном квесте и содержало адрес чат-бота, с которого запускался цикл головоломок.
После перехода по ссылке и ввода стандартной команды «/start» последовало знакомство с чат-ботом, ставшим проводником в цифровом квесте. Для повышения антуража, используя технологию «синтеза речи» перед каждой новой загадкой бот отправлял аудио-файл с какими-либо разъяснениями. Пример его голоса можно послушать ниже:
Вместе с приветственным аудио-файлом в чат была отправлена первая головоломка с текстовым изображением.
Набор, казалось бы, хаотичных символов на черном фоне был раскрашен в цвета недавно сделанной фотографии. Изучив изображение внимательнее, можно было увидеть повторяющуюся последовательность:
«здEыs`‑skrыеы/каkieto‑bукBы‑иlи/цiфРы: И/И/А/С/О/?/Д/Я/Ф/?/А/М→»
Последовательность букв «И/И/А/С/О/?/Д/Я/Ф/?/А/М» была месяцами года (с июня по май) с пропуском двух месяцев - Ноябрь (Н) и Март (М).
Правильным ответом служило сообщение: <НМ> или <Ноябрь и март> или <Ноябрь+Март>и т.п. отправленное в чат-бот.Отправка правильной последовательности символов в чат-бот служила триггером для открытия новой загадки.
Далее следовала целая серия заданий с использованием чат-бота, а последнее из них содержало зловещее изображение девочки из известного хоррора.
8. Шифр в нижней части изображения – это шрифт Брайля (предназначенный для письма и чтения незрячими и плохо видящим людям). Однако сложность заключалась в том, что за шеститочечной комбинацией скрывались не буквы, а цифры, на что указывала мрачная «девочка из Звонка».
9. Найдя в открытых интернет-источниках систему математических обозначений по Брайлю, можно было довольно быстро конвертировать тактильный шрифт в последовательный набор цифр телефонного номера.
10. Позвонив по указанному номеру телефона (уже неактивен), срабатывал автоответчик и вместо сигнала зуммера (гудков) знакомый синтезированный голос поздравил с успешным прохождением первой части квеста и поведал новую загадку.
Новая загадка вела в офф-лайн, где за картиной в гостиной нужно было отыскать конверт. Внутри конверта находился пазл, представленный в виде разрезанного на несколько частей QR-кода.
Пазл из QR-кода Правильно собрав QR-код и наведя на него камеру смартфона, отображалась ссылка ведущая на веб-сайт.
На сайте находился приветственный баннер, за которым следовала зашифрованная страница.
Вход на веб-сайт и пример ключа книжного шифра Паролем для входа на зашифрованную страницу служило ключ-слово из книжного шифра в первой части квеста (загадок чат-бота).
При вводе верного пароля открывался доступ к викторине, состоявшей из 10 вопросов и с 4-мя вариантами ответа, ограниченных по времени.
Викторина с вопросами Для успешного прохождения викторины необходимо было правильно ответить на все 10 вопросов в течение 2 минут. В случае неправильного ответа, приходилось пробовать снова.
В конечном итоге, ответив верно на все вопросы за отведенное время, открывался финальный слайд, на котором (в моем случае) была фотография пустого багажника нашего автомобиля.
Конечно, можно было и дальше продолжать цепочку квестовых заданий, но чтобы сохранить интерес, я решил, что этот этап будет заключительным. И вот, в реальности, в багажнике автомобиля ожидал победный приз - комплект зимней резины.
Реализация проекта
Чат-бот для telegram
Как можно догадаться по заголовку статьи, чат-бот был создан при помощи конструктора. Существует обширный выбор графических конструкторов ботов, включая как платные, так и бесплатные, а также частично бесплатные. Некоторые из них перечислялись в этой статье, я же использовал бесплатный сервис «Puzzlebot», так как уже работал с ним ранее.
Синтез речи
Синтез речи — это создание звука на основе текста (более подробно про эту технологию можно прочесть здесь).
Сам чат-бот, разумеется, не синтезировал текст, а только отправлял предварительно созданные аудиофайлы. Для преобразования текста в речь с использованием голоса в стилистике видеообращений «Anonymous» я использовал сервис «Freetts».
Текстовое изображение
Для создания изображений, состоящих из символов, букв, цифр, знаков и прочих элементов ASCII-графики отлично подошел сервис «Text-image». Его преимущество заключалось в том, что можно было не только преобразовать готовое изображение в набор случайных символов, но и задать последовательность, а также количество этих символов.
QR-код
На данный момент существует огромное количество сервисов для генерации QR-кодов, и можно воспользоваться любым из них. Однако, в моем случае, QR-код был разрезан на несколько частей и для того, чтобы облегчить сборку этого паззла, в центр QR-кода было вставлено небольшое изображение.
Web-сайт
Сайт был спроектирован через конструктор, чем-то напоминающий конструктор для создания чат-бота. Конструкторов сайтов довольно большее количество, например «Tilda», «Unit», «Sitebox», с некоторыми из них можно ознакомится подробнее в этой статье. Я предпочел использовать «WIX», так как ранее уже имел опыт работы с ним.
Викторина на сайте
Использовался готовый шаблон викторин «Fyrebox», который легко вставляется в конструктор сайтов «WIX» с помощью функции «Добавить приложение». Этот шаблон викторин позволяет задавать нужное количество вопросов, указывать варианты ответов, устанавливать время прохождения и определять процент правильных ответов. После завершения викторины пользователь может быть автоматически перенаправлен по новой ссылке, что особенно удобно для подобных квестовых заданий.
Телефон с автоответчиком
Этот элемент на пользовательском пути заставил меня приложить немало поисковых усилий. Хотя он не связан с зерокодингом, он придал квесту особую таинственность и загадочность. Для реализации я получил городской номер телефона в одной коммерческой компании. Одно из преимуществ заключалось в том, что в их личном кабинете была функция установки голосового приветствия или музыки для входящих вызовов. Таким образом, при звонке на всегда выключенный номер телефона автоматически воспроизводилось заранее записанное аудио-сообщение длиной около 60-ти секунд, созданное с помощью технологии синтеза речи.
А что по ценам?
Чат-бот для telegram – бесплатно.
Синтез речи – бесплатно.
Текстовое изображение – бесплатно.
QR-код – бесплатно.
WEB-сайт – бесплатно.
Викторина на сайте – бесплатно.
Телефон с автоответчиком – 99 рублей за подключение + 350 рублей тариф за месяц. Можно обойтись без него.
Время на подготовку – бесценно.
Итого: 449 рублей. Если исключить телефон с автоответчиком = бесплатно.
Выводы
Если воспользоваться фантазией и творческим потенциалом, то Зерокодинг (Zero-code, No-code и Low-code), как подход к разработке информационных решений без написания кода, способен создавать яркие впечатления и незабываемые моменты для наших близких.
В моем случае супруга была в восторге от пройденного квеста и наслаждалась каждым шагом своего цифрового путешествия.
Полный перечень всех используемых в квесте загадок и шифров, а также инструкцию по реализации данного проекта можно посмотреть здесь