SVG in game development
0 likes613 views
Документ обсуждает использование SVG в разработке компьютерных игр, включая его преимущества и недостатки. Автор описывает различные аспекты интеграции SVG в игры, такие как кроссплатформенность, производительность и взаимодействие с графикой. В заключение подчеркивается, что SVG может быть эффективно использован в жанрах с низкой анимацией и не требовательных к мощностям мобильных устройств.
SVG in game development
- 1. SVG в разработке компьютерных игр: быть или не быть Юрийчук Павел BoosterMedia Ciklum
- 2. О себе В Сиклуме с 2011 года в качестве Front end Mobile games developer Опыт разработки: Flex/Actionscript/Javascript Прошлое: Casino games Текущее: Casual Games Контакты: Skype: pavlo.yuriychuck Email: pluccky@gmail.com Facebook Twitter
- 3. Теперешнее - Casual Games
- 4. Прошлое - Casino games
- 5. О чем наше представление ● Игрушка ● Примеры того что можно сделать ● Какие есть альтернативы ● О ролях в проекте: действующие лица марлезонского балета ● О надеждах поговорим или почему же SVG ● А что же может он ●
- 6. И еще немного ● О граблях ● О кросс-платформенности ● О скорости ● О природе R&D ● О бытие, или где стоит использовать SVG
- 7. Вступление. Задача ● Dress-up игра с большим количеством экранов и элементов user interface Много графики ● ● Хорошо бы сократить время и трудоресурсы на обработку графических ресурсов Есть версия игры на flash ● Мало времени на подгонку элементов и верстку ● HTML5 – целевая платформа iOS & Android ●
- 8. Как он выглядит ● Игрушки! – Стрелялка – Логика – ТворениеСергеяПажинтова – Пасьянс – УчимгеографиюСША
- 9. Альтернативы ● Рендерить FXG в Canvas ● Bitmap graphics ● Велосипеды
- 10. Вступление. Действующие лица Художник “золотые руки” ● Флешер тимлид ● Менеджер. Просто менеджер. ● ● Программист с флексовым прошлым и джаваскриптовым настоящим
- 11. Акт первый. Надежды ● SVG Создан в 2001 году ● Поддерживается почти всеми браузерами ● Экспорт поддерживается многими редакторами векторной графики ● Хорошая интеграция с ECMAScript / JavaScript ● Пользовательский интерфейс можно использовать сразу после того, как его нарисовал художник!
- 12. Акт второй. Поиски ● Как встроить SVG в DOM: HTML5 Canvas Object − In-line SVG − ● Как загрузить сам SVG: AJAX request, response type == xml − ● Как пользоваться: Интерактивность, игра жеж − −Прогулки по воде или как найти нужный тег документе
- 13. Лирическое отступление #1 ● Что предлагает SVG – DOM GetElementByTagName, GetElementById(?), getAttrbuteNS/setAttrbuteNS, childNodes – JavaScript events – SMIL, JS animation, – CSS ;) ● Что есть в Flash – UI tree, SetProperty/getProperty – Flash Events – Animation, keyFrames, transitions, paths, movie clip – CSS, Flex only ;)
- 15. Акт четвертый. Кросс- платформенность ● Не все операции внедрены одинаково, некторых вообще нет, смотри акт грабли. ● Inline SVG только в андроиде и в десктоп-браузерах ● IOS хорошо работает с Canvas ●
- 16. Акт пятый. Быстрее ● Пробовали сжимать SVG в ZIP и распаковывать JavaScript – Удобно – Канонично ● Грузить все элементы одним SVG а потом резать на мелкие кусочки ● Сжимать SVG на стороне сервера mod_deflateилиmod_gzip
- 17. Акт шестой. Прерванный полет R&D ● Bitmap быстрее ● CANVG поддерживает ограниченный набор SVG инструкций, сложные рисунки с трансформациями градиентов – не рисует ● IOS крешится при попытке распаковать 20kb zip, андроид и десктопные браузеры – как часы
- 18. Заключение. Где же все таки стоит использовать SVG ● Интерактивные карты, не флеш, но кое что может ● Карточные игры ● Тетрис ● Настольные игры – монополия ● Общеедлянихвсех: – Мало анимации и она не интенсивная – Не мобильные браузеры – медленная отрисовка и грузит процессор – Не критично время загрузки ресурсов ●