Как мы неожиданно сделали новую площадку для свояка - OpenQuiz

У нас есть традиция, каждую пятницу (ну почти каждую) играть в "Свояк”. Аналог "Своей игры” с НТВ, но онлайн (SI Game). Классная штука, но есть нюансы…

Нюансы:

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

Поэтому мы подумали и решили пересоздать свою игру - OpenQuiz.

Мы — это небольшая компания друзей, которая решила принять этот челендж:

Очень сеньеристый Фронтед
Студент последнего курса
Все остальные — разнорабочие (каждый вносит свой вклад, как может)

Для начала мы решили очертить границы и понять, что нам надо сделать. Прикинули структуру игры, расписали процессы и логику, решили оставить имеющиеся типы вопросов: вопрос с секретом, аукцион и т. д.

Затем сделали работоспособный прототип самого движка игры. Мы поняли, что реализовать это простым API и веб сокетами — невозможно (ладно, возможно, но очень трудоемко). Поэтому приняли решение делать свой движок на основе конечных автоматов с полной поддержкой мультиплеера. Нам это позволит в будущем делать разные режимы игры и использовать один код на сервере и на клиенте.

Авторизация

Авторизация сначала была только через Discord, но на данный момент уже реализована с помощью vk, Google и twitch. При входе сразу подтягивается имя и аватарка, которые можно изменить при желании.

Авторизация и настройки

Каталог паков

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

Создаем карточки для паков в едином стиле. Берем ключевые слова из пака и генерирования картинку.

Каталог паков

А еще есть возможность загрузить Пак из SIGame, но об этом позже.

Редактор паков

Сейчас в едином интерфейсе можно и играть, и создавать или редактировать паки.

Списались с 3 авторами, показали возможности редактора и предложили попробовать. Перенесли их паки в OpenQuiz.

Чтобы создать пак надо:

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

Создание пака

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

Игровой процесс

Если вы хотите поиграть, то один из участников создает комнату и дает на нее ссылку остальным. Когда все подключились открывается экран с первым раундом и набором тем. Участники вместо аватарки могут включить вебки.

Создание игры и загрузка пака из SI Game

Создание игры из каталога паков OpenQuiz

Механика осталась та же. Пользователь выбирает вопрос. Тот кто знает ответ нажимает правой кнопкой мыши по экрану и отвечает. На ответ стандартно дается 30 секунд.

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

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

Это наш первый полноценный релиз, о котором мы решили рассказать и поделиться нашими первыми шагами. Уже сейчас вы можете начать играть и создавать паки.

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

Присоединяйтесь, пишите фидбек или свои идеи.

Пока!