Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Ответ
 
Опции темы
Старый 01.01.2014, 23:33   #1
FumarMata
Новичок
Джуниор
 
Регистрация: 01.01.2014
Сообщений: 3
По умолчанию Разработка браузерной игры: разрушение

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

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

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

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



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



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

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

Последний раз редактировалось FumarMata; 01.01.2014 в 23:54.
FumarMata вне форума Ответить с цитированием
Старый 02.01.2014, 09:51   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

1 и 2 возможны при помощи холста(canvas, HTML5) (ИЕ9+)
других вариантов не вижу
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 03.01.2014, 22:26   #3
FumarMata
Новичок
Джуниор
 
Регистрация: 01.01.2014
Сообщений: 3
По умолчанию

Возможно, но как обнаружить края загруженного файла из PNG с прозрачным фоном я так и не нашёл.
FumarMata вне форума Ответить с цитированием
Старый 04.01.2014, 01:01   #4
blackstrip
Форумчанин
 
Аватар для blackstrip
 
Регистрация: 21.01.2012
Сообщений: 197
По умолчанию

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

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

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

Не знаю, насколько это все быстро будет работать в JS при такой работе с графикой, и какого удастся достичь FPS)
blackstrip вне форума Ответить с цитированием
Старый 04.01.2014, 13:46   #5
nerv
Форумчанин
 
Аватар для nerv
 
Регистрация: 26.04.2010
Сообщений: 450
По умолчанию

канвас

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

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

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

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

Остальное blackstrip расписал
Тишина – самый громкий звук
nerv вне форума Ответить с цитированием
Старый 09.01.2014, 17:20   #6
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

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

И судя по соседнему посту, ты не прислушался к этому:
Цитата:
Имхо, изображения должны быть вторичны, они отображают процесс игры пользователю. На первом месте должны быть некие данные, двумерные массивы или ч/б картинки и т.д. типа "карта поверхности", "ч/б маска прозрачности картинки".
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 09.01.2014, 21:39   #7
nerv
Форумчанин
 
Аватар для nerv
 
Регистрация: 26.04.2010
Сообщений: 450
По умолчанию

Цитата:
как-то конвертил 3д-модель (10к+ полигонов) в двумерный холст, при вращении фпс был от 65 (ИЕ9) до 17 (сафари)
есть "на посмотреть"?
Тишина – самый громкий звук
nerv вне форума Ответить с цитированием
Старый 10.01.2014, 15:08   #8
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от nerv Посмотреть сообщение
есть "на посмотреть"?
нет, к сожалению... честно не знаю, где сейчас можно те наработки найти =)
в любом случае модель коммерческая
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 10.01.2014, 20:38   #9
Пепел Феникса
Старожил
 
Аватар для Пепел Феникса
 
Регистрация: 28.01.2009
Сообщений: 21,003
По умолчанию

Цитата:
webGL еще быстрее, но там придется больше работать на c#, с библиотекой openGL, мне она никак не дается на достаточном уровне=)
откуда там шарп то? О_о
Хорошо поставленный вопрос это уже половина ответа. | Каков вопрос, таков ответ.
Программа делает то что написал программист, а не то что он хотел.
Функции/утилиты ждут в параметрах то что им надо, а не то что вы хотите.
Пепел Феникса вне форума Ответить с цитированием
Старый 11.01.2014, 13:35   #10
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от Пепел Феникса Посмотреть сообщение
откуда там шарп то? О_о
Да, пардон, мне просто попадались рендеры на шарпе только
Alar, верни репу!
Naive вне форума Ответить с цитированием
Ответ

Здесь нужно купить рекламу за 20 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru
Без учёта ботов - 20000 человек в день, 350000 в месяц.

Опции темы


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Разработка браузерной он-лайн игры на флэш vatman Фриланс 0 23.11.2011 11:46
Разработка браузерной MMORTS Vasilenko Фриланс 2 05.07.2010 07:28
Разработка Браузерной MMORPG игры advantixx Gamedev - cоздание игр: Unity, OpenGL, DirectX 5 12.06.2010 16:55
Создание браузерной игры fak47 Gamedev - cоздание игр: Unity, OpenGL, DirectX 6 15.02.2010 18:01