Разработка браузерной игры: разрушение

[FumarMata]

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

Что я умею: php, mysql, css2, html4, javascript (элементы для вёрстки), jQuery.
Трогал:
CSS3 - трогал по мелочам
HTML5 - пользовался, требовалось сделать сжатие изображения до загрузки

Никогда не разрабатывал игр, всегда работал в команде по серверной части.

Самые важные вопросы
1) Создание элементов базируясь на изображениях с прозрачным фоном (к примеру PNG)
Мне важно, чтобы к примеру при выстреле попадание было именно в персонажа, а не в прямоугольную область размера изображения. Это возможно?
Пример:


2) Разрушаемая карта
Объекты по которым будут передвигаться персонажи требуется реализовать разрушаемыми, они должны состоять из изображений. Хотелось бы реализовать частичное разрушение. Это возможно?
Пример:


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

Основная цель: изучение новой отросли

[Naive]

1 и 2 возможны при помощи холста(canvas, HTML5) (ИЕ9+)
других вариантов не вижу

[FumarMata]

Возможно, но как обнаружить края загруженного файла из PNG с прозрачным фоном я так и не нашёл.

[blackstrip]

Имхо, изображения должны быть вторичны, они отображают процесс игры пользователю. На первом месте должны быть некие данные, двумерные массивы или ч/б картинки и т.д. типа "карта поверхности", "ч/б маска прозрачности картинки".

По попаданию в картинку с прозрачным фоном: придется сначала высчитать конкретную точку картинки, в которой в данный момент находится пуля. А потом подсмотреть маску (которая вполне может быть отдельным служебным файлом), и уточнить есть ли там "тело" гарфилда или еще нет (пуля вне гарфилда).

Аналогично и с землей. Если разрушение всмысле протирания сфер в картинке (как в 2d worms от взрыва гранаты), то тоже можно хранить где-то маску текущего состояния земли. И если персонажи должны ходить именно по ней - то всегда придется высчитывать с учетом этой маски где у нее самый верхний неразрушенный слой, и туда опускать персонажа (если только что взорвалось и у него под ногами земля пропала). А также каким-то образом прорисовывать землю с учетом продырявленных зон (и, следовательно, продырявленной маски). А также высчитывать сам взрыв (дырявить маску карты, потом отрисовывать новую землю, потом пересчитывать позицию персонажа и опускать его).

Не знаю, насколько это все быстро будет работать в JS при такой работе с графикой, и какого удастся достичь FPS)

[nerv]

канвас

Не знаю, насколько это все быстро будет работать в JS при такой работе с графикой, и какого удастся достичь FPS)

если правильно делать, должно быть быстро

http://www.createjs.com/#!/EaselJS/demos/spritesheet
http://www.createjs.com/#!/EaselJS/demos/cache

Если не знаешь алгебру, геометрию, тригонометрию, физику (школа), лучше даже не начинать Или писать что-нибудь попроще. А для серьезных игр потребуются доп. знания.

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

Остальное blackstrip расписал

[Naive]

Не знаю, насколько это все быстро будет работать в JS при такой работе с графикой, и какого удастся достичь FPS)

canvas очень быстр, особенно в ИЕ9+ (самому удивительно), как-то конвертил 3д-модель (10к+ полигонов) в двумерный холст, при вращении фпс был от 65 (ИЕ9) до 17 (сафари). Правда у меня комп домашний довольно мощный, на рабочем не проверял.
webGL еще быстрее, но там придется больше работать на c#, с библиотекой openGL, мне она никак не дается на достаточном уровне=)
на gl выводил модель около 500к полигонов, при вращении в ФФ давало фпс 5-10, на рабочем компе (видяха говно), у дизайнеров летало =)
а да, webGL сильно снижает круг используемых браузеров.

И судя по соседнему посту, ты не прислушался к этому:

Имхо, изображения должны быть вторичны, они отображают процесс игры пользователю. На первом месте должны быть некие данные, двумерные массивы или ч/б картинки и т.д. типа "карта поверхности", "ч/б маска прозрачности картинки".

[nerv]

как-то конвертил 3д-модель (10к+ полигонов) в двумерный холст, при вращении фпс был от 65 (ИЕ9) до 17 (сафари)

есть "на посмотреть"?

[Naive]

Сообщение от nerv

есть "на посмотреть"?

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

[Пепел Феникса]

webGL еще быстрее, но там придется больше работать на c#, с библиотекой openGL, мне она никак не дается на достаточном уровне=)

откуда там шарп то? О_о

[Naive]

Сообщение от Пепел Феникса

откуда там шарп то? О_о

Да, пардон, мне просто попадались рендеры на шарпе только