Добрый день, Хабрасообщество
Эта публикация заинтересует тех, кто не равнодушен к инновациям в пользовательских интерфейсах, а также увлеченных Дополненной Реальностью (Augmented Reality).
Если рассмотреть ближе работу человеческого мозга, постараться воссоздать те задачи, которые он выполняет, в частности, те, которые мы принимаем как должное, можно убедится, насколько огромно количество производимых мозгом вычислений. Например, обнаружение движения и слежение за ним, или различие более одного объекта, их движения относительно друг друга, их скорости и расстояния между ними.
Отмечу сразу, что Kwiki The Bird и разработка подобных игр не является основным направлением деятельности нашей компании. Целью игры была проверка возможностей различных алгоритмов по определению/трекингу движений веб-камерой компьютера.
Что у нас получилось:
В игру можете поиграть здесь: http://kwikithebird.com
Маркетинг часть:
Для раскрутки игры мы выбрали платформы для распространения бесплатных инди игр – по типу kongregate. Лучшими по нашему мнению оказались: http://www.kongregate.com, http://www.gamemontage.com. Количество просмотров/игр в день публикации составило 500 человек, без дополнительных способов раскрутки.
Концепция игры:
Технология распознавания движений, алгоритмы которой существуют сейчас (ниже ссылки), достаточно сыра. Неточность трекинга. Вначале мы думали о скрытии таких неточностей оригинальной идеей игры – пьяной птички, которой сложно управлять.
Нашей задачей не было длительное время удерживать пользователя в игре. Поскольку для таких игр это невозможно, так как, управляя камерой (в большинстве случаев встроенной в верхние панели лэптопов, iMac'ов и просто стоящие на мониторе), очень быстро устают руки. А именно это ваш контроллер, находящийся постоянно в воздухе. Поэтому хотелось увидеть вирусное распространение игры среди аудитории.
Собственно это получилось, по статистике (каждый пользователь, игравший в игру, приводил своего друга, что видно из фотографий, сделанных в процессе игры).
Поэтому хочу назвать этот пункт более-менее успешным. Все-таки игры с новым интерфейсом управления, а именно веб камерой – вирусны и могут распространять сами себя.
Далее, посмотрев популярный ролик о птичке Киви, которая не умеет летать и стремится в небо, – Киви(YouTube Most Adorable video of 2006). Мы решили сделать своего рода сиквел, использовав идею о птичке киви, что должно было скрыть некоторые недостатки в технологии.
Техническая часть:
Работа дизайнера – 20 часов
1. Создание образа самого главного героя — Квики.
2. Дизайн 20 уровней игры.
3. Дизайн трофеев (по 3 на каждую подгруппу уровней — Земля, Над землей ночью, Небо, Космос). Трофеи не несут никакого особого значения, но увеличивают интерес пользователя, что, в общем-то, стимулирует продолжать игру и лететь выше.
4. «Плохие объекты», свои для каждого уровня, за поимку которых у пользователя отнимаются очки.
5. «Смертельные» враги, столкновение в которыми означает завершение игры.
Работа flash программиста (логика игры) – 40 часов
С логикой было небольшое количество переделок. Вначале был один экран и объекты просто падали сверху вниз. Мы решили добавить ощущение полета, каждый раз когда Квики съедает хороший объект он продвигается на n пикселей вверх к своей мечте, и, соответственно, когда съедает плохой, опускается вниз.
Запустив первый тест игры среди наших коллег/друзей, на удивление, мы увидели, что у многих получается управлять птичкой несмотря на недостатки технологии и разные световые условия (темная/светлая комната). И поэтому было решено добавить “смертельные объекты” на старших группах уровней:
Это Грозовая туча, самолет и НЛО, не хабранло конечно, но достаточно впечатляющее на последней подгруппе уровней – Космос.
Более того, некоторые тестеры, даже умудрялись читить, жульничать, управляя птичкой только вверху экрана и собирая все плохие/хорошие объекты, набирая максимальное количество очков.
Работа по программированию (facebook) — 20 часов
Т.к. У нас уже имелся опыт создания фейсбук-приложений, с этой игрой мы решили попробовать выйти именно на рынок (хотя это громко сказано, учитывая цели которые мы ставили перед собой) фейсбука.
Были добавлены основные аспекты:
- facebook connect для stand alone приложения (игры с сайта),
- функция автоматической публикации результатов в новостную ленту,
- Возможность просмотра активности игры прямо с сайта stand alone и кнопочка I Like, которая влияет на выдачу результатов в поиске на фейсбук, больше всего.
Работа с алгоритмами распознавания жестов – 80 часов
Здесь, пожалуй, самое интересное, чем хочется поделиться с Вами. Какие алгоритмы мы использовали, что изменяли, а главное, зачем:
Вдохновила работа Гранта Скинера и конечно Марио Клингерманна aka Quasimondo. У последнего, кстати, достаточно большое количество примеров портированных с С, openCV, во флеш, по распознаванию лиц и трекингу, а так же тому что называется NFT (Natural Feature Tracking) и трекингом цветных объектов.
Последний алгоритм в списке, но не последний для нас, а наоборот первый, который хочется отметить – это алгоритм распознавания движений Джастина Виндла.
Т.к. Птичка у нас должна летать мы должны были не только определять движение, но и делать его трекинг.
Собственно схожесть наших алгоритмов была в разделение экрана на сетку, мы усредняем цвета в рамках каждой ячейки/сегмента с регулярным интервалом. Разница в яркости в рамках каждого сегмента (от одного расчета к следующему) будет определять, действительно ли имело место движение в этой области экрана.
Проанализировав все работы, именно этот подход оказался наиболее точным для нас. Хотя, в действительности, требуется много действий получитьПиксель(), установитьПиксель(), а также преобразование этих результатов в цвет, насыщенность, яркость объектов, каждый из которых достаточно тяжел для мозга нашего компьютера – процессора. Хороший компьютер, конечно, справляется с этим легко, например iMac 3.06GHz справляется с этим на ура.
Резюмируем, как это работает во Flash:
- После того, как объект камеры создан, он прошел в класс MotionTracker, который расширяет объект Point. MotionTracker класс содержит два BitmapData объекта, один представляющий текущие данные из веб-камеры, а другой используется для хранения предыдущего кадра.
- При обновлении метод вызывается, новый кадр рисуется поверх предыдущего используя различие фильтра.
- Результаты получает ColorMatrixFilter, увеличивая контрастность изображения и сбросив темные участки (с меньшим движения) далее на задний план.
- Фильтр размытия затем применяется нами в целях дальнейшего снижения уровня шума и формировать “Участи Движения” из районов, где больше движения происходит.
- Трешхолд вызывается в результате BitmapData, фактически в результате чего сетку рядом с черными пикселями следует игнорировать, а всем светлым пикселям присваивается “движение обнаружено”.
Уровень трешхолда может быть настраиваем в настройках игры, простым ползунком который двигается от условно светлого помещения до темного.
Параметры которые составляют – это яркость, blur (размытие), контраст и интервал сегментов той самой сетки.
Планы на будущее
- Запуск вконтакте после создания второй бета-версии и устранения всех багов.
- Добавить режим игры тренировка или how to.
- Автоматическое определение активной камеры.
- Добавление больше дизайна и звуковых эффектов.
- Изменение анимации действий Квики.
- Размещение фотографий пользователя на стенах друзей в facebook, повышение sharing параметра.
- Изменение фоновой музыки :).
Благодарю за внимание.
На последок, фан видео «как играют в Квики»:
