Найти тему
IceRock Broadcasts

Разработка: прототипы мини-игр в ProtoPie

16+

В блоге сервиса ProtoPie опубликовали пост про топ-15 вдохновляющих прототипов. Два из них были сделаны нашим арт-директором Женей Гребенщиковым. Женя поделился с нами историями, как появились идеи этих прототипов и как они были реализованы.

А теперь слово Жене.

Прототип Squid Game по сериалу «Игра в кальмара»

Попробовать сыграть

Я сделал прототип, вдохновившись корейским сериалом «Игра в кальмара». Сначала придумал, как могла бы выглядеть авторизация в игре, наделал всяких анимаций, постарался передать стилистику сериала в интерфейсе. После опубликовал демонстрацию вступительного ролика в «ТикТоке». Видео с демонстрацией набрало более 30 000 просмотров и более 3 000 лайков. Это вдохновило меня продолжить заниматься проектом, и на следующих выходных я придумал игровые механики для первых трех уровней.

«Красный свет — зеленый свет»

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

Сделать перебегание поля было довольно легко, нужно было только отладить сложность игры. Поэтому я начал усложнять игру и делать формулы ускорения: типа чем дольше жмешь, тем быстрее движется персонаж. Добавил ограничение максимальной скорости, чтобы было более реалистично, и реализовал постепенную остановку, по закону инерции. Потестил игру на жене и близких друзьях, понял, что 45 секунд достаточно сложно для новичков, но легко для тех, кто уже сделал 50+ забегов. В итоге тестирование и отлаживание игры заняло больше времени, чем сама реализация.

Но одному бегать как-то грустно, да и в сериале поле перебегала целая толпа игроков, поэтому я решил сделать ботов. Для внешней кастомизации добавил рандомные номера на куртки и задал разный цвет волос. Также хотелось добавить пасхалку: в сериале был дед, который дошел до последнего уровня. Поэтому я сделал персонажа с седыми волосами, который почти всегда проходит первый уровень. Самым интересным было сделать искусственный интеллект для игроков. У ботов есть различные тактики: кто-то бегает мелкими перебежками, кто-то рискует (и часто выбывает из игры).

«Сахарные соты»

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

В игре «Сахарные соты» самым сложным оказалось реализовать геометрию. Мне нужно было проверять, попадает ли точка (кончик иголки) на грань геометрической фигуры. Если с квадратом и кругом проблем особо не было, то с зонтиком и треугольником я возился очень долго. Чтобы реализовать геометрию треугольника, пришлось открывать учебники по геометрии для восьмого класса и искать способы определения, попадает ли точка в треугольник. Оказалось, что в учебнике такого нет, и это олимпиадная задача.

Кстати, сделать зонтик оказалось намного проще: здесь проверка на попадание в несколько секторов и один прямоугольник. Помимо геометрии, надо было отрегулировать сложность: если игрок долго держит иглу над леденцом, она должна расколоться. Опять куча тестов, и я столкнулся с новой проблемой: тестируя игру, я уже наловчился вырезать фигурки и в итоге усложнял игру для себя. А когда дал попробовать поиграть друзьям, они долго не могли вырезать даже что-то простое.

«Перетягивание каната»

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

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

Мини-игра Sound Wizard

Попробовать сыграть

(играть можно только с мобильных устройств)

Идея такого прототипа пришла мне в голову еще в 2020 году. Я подумал, что было бы весело сделать игру, на которую нужно орать, и дать поиграть в нее знакомым стримерам. Это был бы топовый контент. Накидал в ProtoPie демоверсию, где квадрат увеличивался в размерах в зависимости от громкости шума вокруг телефона. Тестировать такое дело дома не очень удобно: жена и ребенок в соседних комнатах. Поэтому так и «забил» на эту идею, записав ее в бэклог идей своего «Ноушена».

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

Марти: «Ты говоришь мне, что создал машину времени… из ”ДеЛориана”?»
Док Браун: «Ну я как подумал: если создавать машину времени из автомобиля, то почему бы не сделать это со стилем?»

Так появилась идея: почему бы не сделать джойстик… из «ДеЛориана». Вспомнил про свою задумку с игрой, на которую надо орать, и понял, что смогу спокойно тестить прототип, катая машинку по столу возле телефона. В итоге сделал «демку», в которой происходит калибровка уровня шума и реализовано простенькое управление: средний шум — персонаж идет, громкий шум — персонаж прыгает. Записал видео с демонстрацией прототипа — всем понравилось. Кстати, его же добавили в статью о самых вдохновляющих прототипах.

В мини-игре пользователь управляет персонажем-магом, изменяя уровень шума возле телефона: средний шум — персонаж идет, громкий шум — прыгает
В мини-игре пользователь управляет персонажем-магом, изменяя уровень шума возле телефона: средний шум — персонаж идет, громкий шум — прыгает

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

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

Хотите себе такой? Пишите нам, всё обсудим.

Также ищите нас в соцсетях: ВКонтакте и Телеграм.