От эскиза до релиза: как нарисовать игру для AppStore, в которую хочется играть еще и еще

Процесс разработки графики игры Road Story стал для нас увлекательным квестом с интересными заданиями и неожиданными поворотами сюжета. Мы расскажем, как создавалась художественная часть игры этап за этапом и покажем, что из этого получилось. Поехали.

«Игрок – пилот перекрестка, регулировщик в будущем. Игровая карта – перекресток. Машина, выезжающая на перекресток, отдает управление пилоту и он должен пропускать машины, избегая столкновений как можно дольше» - так один из руководителей инди-студии “Smartphoneware” Сергей Симковский объяснил нам идею игры. Ага, то есть хочешь город без пробок – на, пробуй! Разруливаешь нерегулируемый перекресток, ускоряя или приостанавливая машины, за это получаешь очки, бонусные машины и другие вкусняшки. Настоящий таймкиллер с повторяющимся геймплеем, что-то вроде волка с яйцами (игру «Ну, погоди!» помним?). Тут разобрались, переходим к стилю.

Немного предыстории. Для ребят из Smartphoneware мы в свое время нарисовали Cybernarium, там все было по-взрослому – киберпанк и si-fi.

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

Сначала мы вертели и крутили ракурс – хотелось, чтобы игра хорошо смотрелась на любых картах, но при этом не выродилась в плоское 2D. Остановились на виде сверху, который и объем передает и универсален для всех карт. Стали рисовать улицу и пытаться вписать текст в городской пейзаж, сначала в виде зданий:

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

Получилось интереснее. Стали добавлять цвет.

Заказчик одобрил стиль. Правда сказал, что изображение получается слишком резким. Да, и грязь на дороге «как в Одессе после 1го апреля». Поэтому смягчили линии и переходы, добавили градиентов. Сменили черную «кладбищенскую» оградку.

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

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

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

Первая идея - концепция плоского комикса, нарисованного на листах.

Заказчик доволен. Этот концепт идет в альфа-версию, и также (та-да-дам) не выходит в свет. Да, да, так бывает в процессе рождения игры: делается кусок клевой работы, принимается… А потом выбрасывается.

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

Итак, всплакнув, мы принялись за новые эскизы. Теперь заказчик хотел видеть блочную систему интерфейса, достаточно простую и понятную, однако эффектную. Мы предложили несколько на выбор:

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

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

Идем дальше. Игровые локации, или в нашем случае - карты-перекрестки. Они все разные, ну понятно, чтобы разнообразить геймплей. Ну а мы должны сделать так, чтобы не надоедало и радовало глаз – внести отличия графически. Мы пошли по пути разных географических широт: где-то тропики, где-то густой лес, а где-то осень и дело к зиме идет.

Потом были машинки, ну тут уж мы наигрались. Хотелось сделать так, чтобы маленький пацаненок на них смотрел и говорил "Ва-а-у-у-у!". Много думали над цветами, надо ж сделать не только красиво, но и «играбельно». Слишком большая гамма очень сильно отвлекает, а при быстрой игре быстрее реагируешь на цвет, чем на форму.

И на десерт, так сказать, last but not the least – иконка. Это – наше любимое, потому мы хотели, чтобы получилось жгуче. По опыту знаем, что удачная иконка очень влияет на количество скачек. Есть даже примеры, когда на AppStore игры покупаются просто по иконке, не видя остального. Потому нарисовали заказчику сразу 2 набора для тестирования (сюрпрЫз!).

Кстати, мы не стали дожидаться тестирования в полевых условиях и провели опрос сами. По его результатам уже наметился явный лидер - одна из иконок нравится на 32% большему количеству людей. Есть варианты, какая? Можете проверить себя и принять участие в опросе.

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

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

По ходу также пришло ощущение, что игре недостает персонализации. Так родилась финальная идея статичной иллюстрации - девушка на фоне игрового перекрестка в реальной перспективе.

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

Но такой она стала позже. А сначала были трансформации сродни фотографиям с сайта косметолога из серии «До и После»:

Конечно, это еще не все. Были еще разные диалоговые окна, кнопки, ачивки, уровни. Много-много тестирований и переделок, дорисовок и перерисовок. И, наконец, состоялся релиз.

Ура, ура, ура, недавно, RoadStory увидела свет и теперь вы сами можете увидеть и пощупать ее, а также поделиться своими впечатлениями с нами и со своими друзьями:

https://itunes.apple.com/app/id675087827

https://play.google.com/store/apps/details?id=com.smartphoneware.rs

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

Скачивайте и наслаждайтесь!

P.S.:

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