Как мы создавали игру-головоломку ColBox для iOS. Будни инди-разработчика

neeksdk avatar | 12
FavoriteLoading В закладки
Как мы создавали игру-головоломку ColBox для iOS. Будни инди-разработчика

Всем привет!

«Меня зовут Андрей, и я глава компании MelMari, где мы занимаемся разработкой мобильных приложений…» – именно так я хотел бы начать эту статью о нас, но нет. Пока это только в мечтах, и моя команда состоит всего из двух человек.

Мы сами изучаем техническую документацию, программируем, рисуем, делаем презентации, анимации и многое другое.

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

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

Немного предыстории

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

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

Начали с прототипа. Рассчитывали его создать совсем быстро, так как механику игры хотели оставить прежней. Но что-то пошло не так. И мы переписали механику игры три раза!

Первая попытка: сделать пятнашки, но другие

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

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

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

Вторая попытка: сделать пятнашки со сложным полем

Мы решили не использовать поле фиксированной длины и ширины, как раньше (5х5), а сделать его разных размеров, в зависимости от наполнения и сложности уровня. Для портретной ориентации мобильных телефонов высчитали максимальный размер – 8х11.

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

Мы так увлеклись, что не заметили, как усложнили игру настолько, что мозг игрока закипал с самых первых уровней. Тут случился конфликт интересов. Мне (видимо потому что я программист) нравилась сложность и сама игра. А моему партнёру по MelMari, Анне, нет.

Мнения после Customer Development разделились примерно поровну, что добавило неопределённости и остановило проект. Я не мог продолжить программировать, так как нужны были элементы интерфейса и графические объекты. А дизайнер, в роли которого выступала Анна, отказалась рисовать, если механика игры останется прежней.

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

Третья попытка: пятнашки в одном направлении

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

Первые уровни понравились всем, и мы продолжили.

Принялись рисовать арт игры. От старого интерфейса не осталось ничего. Когда-то делали его в Photoshop, а теперь Анна решила набивать шишки в Figma. Нарисовав там пару экранов, она оказалась в восторге – очень удобно.

Экспорт изображений из Figma оказался очень удобным для меня как программиста. Вместо тонны писем с изображениями и длинными описаниями – где должны быть какие отступы, какой цвет, размер на экране – всё это было сразу видно при просмотре файла с проектом.

Вот как выглядело меню старой игры в сравнении с новым артом:


Старая версия игры


Новая версия

Затем занялся программированием. Из-за того, что мы поменяли изначальную механику, пришлось переписывать код практически с нуля. Решил написать полноценный редактор уровней, всё получилось.

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

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

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

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

Финальные штрихи: музыка и звуки

К счастью, в этот раз механика была визуально понятной, и мы решили её оставить. А ещё здесь родилась идея о функциональном отличии разных блоков.

Мы добавили уникальных свойств цветным блокам. К примеру, зелёный блок не двигается сам, но может как магнит притягивать к себе другие блоки. Синий блок меняется цветом с другими, а жёлтый летит вперёд, пока не встретит препятствие.

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

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

Когда уровни были готовы, нам предстоял новый этап – внедрение музыки и звуков. Обратились к знакомому музыканту, который с нами уже работал в одном из проектов. Но цены, которые он озвучил, оказались неподъёмными.

Решили попробовать разместить объявление на Хабре в разделе фриланса, GameDev. Описали игру, разместили фото и небольшой демо-ролик в надежде, что кто-то захочет посотрудничать. За первый же день получили около 40 откликов!

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

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

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

Вот и всё. Запустились в App Store!

Маленькими шагами мы подошли к выпуску нашей игры. Планировали выпустить версию и для iOS, и на Android. Но в итоге решили сосредоточиться на чём-то одном и оставили пока только платформу Apple.

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

Релиз состоялся вчера, 15 июля. Если вам захочется посмотреть на результаты нашего труда, или просто поддержать нас, скачивайте ColBox – fix & tap в App Store: [Бесплатно].

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

1 Звезд2 Звезды3 Звезды4 Звезды5 Звезд (9 голосов, общий рейтинг: 4.56 из 5)
undefined
iPhones.ru
Всем привет! «Меня зовут Андрей, и я глава компании MelMari, где мы занимаемся разработкой мобильных приложений…» – именно так я хотел бы начать эту статью о нас, но нет. Пока это только в мечтах, и моя команда состоит всего из двух человек. Мы сами изучаем техническую документацию, программируем, рисуем, делаем презентации, анимации и многое другое....
Прокомментировать

🙈 Комментарии 12

  1. s1oKe avatar
    s1oKe16 июля 2020
    3

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

    neeksdk avatar
    neeksdk16 июля 2020
    2

    @s1oKe, Мы дали возможность людям пройти игру совершенно бесплатно. Донатом можно воспользоваться по желанию.

    s1oKe avatar
    s1oKe16 июля 2020
    0

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

    C0nfy avatar
    C0nfy16 июля 2020
    3

    @s1oKe, игра не тянет на премиум чтобы быть платной. Делая такую игру платной, величина вероятности воооообще ничего не заработать вырастает многократно. Вот вы работая на работе, хотели бы проработать на ней полгода, а потом понять что денег вы не увидите? Уважайте чужой труд, думайте головой.
    Жадность разработчика… так смешно читать вас, нищие духом. Вам игру бесплатно и покупки на выбор, а вы еще вы3бываетесь.

  2. Dmytro Krupskyi avatar
    Dmytro Krupskyi16 июля 2020
    0

    Скачал, посмотрел, игра достаточно залипательная! Молодцы!

  3. alekseev avatar
    alekseev16 июля 2020
    0

    Ничего не понял из описания механики игры , но скачаю!

  4. target avatar
    target16 июля 2020
    0

    А я что-то не могу её найти, в поиске показывает, но открывается совсем другая игра. Не могу понять что не так?

    neeksdk avatar
    neeksdk16 июля 2020
    0

    @target, игра только вышла, пока работает только прямая ссылка:
    https://apps.apple.com/ru/app/id1492625740

    Денис Понкратов avatar
    0

    @neeksdk, ?? Спасибо! Сейчас скачаю)

  5. xava avatar
    xava17 июля 2020
    0

    20й уровень не могу пройти

    neeksdk avatar
    neeksdk17 июля 2020
    0

    @xava, 20-й уровень каждого этапа – это вызов, самый сложный уровень из всех.

    neeksdk avatar
    neeksdk17 июля 2020
    0

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

Вы должны авторизоваться или зарегистрироваться для комментирования.

Нашли орфографическую ошибку в новости?

Выделите ее мышью и нажмите Ctrl+Enter.

Как установить аватар в комментариях?

Ответ вот здесь