Сучасна диджитал-освіта для дітей — безоплатне заняття в GoITeens ×
Mazda CX 30
×

Доклад на тему партикл эффектов в JS

Підписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті

Привет.

Занимаюсь разработкой редактора партикл эффектов NeutrinoParticles. Сейчас вошел в публичную бету. Основной упор делаю на экспорт сделанных эффектов в HTML5 (2d canvas). Хотелось бы сделать доклад на эту тему (не без корыстной цели попиариться). Доклад будет содержать анализ проблем и варианты их решения с помощью вышеупомянутой тулзы.

Так вот вопрос вот в чем: как организовываются нынче подобные мероприятия? Добавляешь событие в календарь DOU, смотришь сколько народу хочет прийти и подбираешь соответствующий митингрум? Или может есть конторы, которые дают доступ к своим помещениям, только расскажи что-нибудь интересное и стоящее?

Если тема интересна, то сайт проекта: neutrinoparticles.com

Спасибо.

👍ПодобаєтьсяСподобалось0
До обраногоВ обраному0
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Зарегистрировался докладчиком на Lviv GameDev Conference 2016 ( gamedev.lviv.ua ). В раздел GaveDev Tech.

Cудя по тому, что я только что прочитал про D3 — это принципиально разные вещи с абсолютно разными задачами. Мне даже тяжело найти пересечение между этими инструментами, кроме того, что вместе со словом D3 иногда встречается слово particles.

ну если мне нада анимацию или графики в жс то я иду и выбираю какой нибудь из Д3 . По вашему видео я увидел только какуюто петлю по которой движутся звездочки, или шарики или даже не петлю а ломанную линию — но нафига мне такое может быть нада ?

Там видео со звуком, где я рассказываю подробно о том для чего нужен редактор и что сейчас происходит на экране.
www.youtube.com/watch?v=jQ-t8Qx21Nw

Там видео на русском. Сайт на русском пока не готов.

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

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

а можно мне как то побыстрому взять лого компании (текс в пнг), кинуть его в редактор и сделать чтобы по краю лого бегали бенгальские огоньки ?

Угу. Но нужно подучиться работать с редактором. Если я правильно представляю, то такой эффект минут 20-30 займёт сделать. Выложите лого — будет время сделаю, только в галерею себе тоже положу. Мне пример — вам радость :)

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

Спасибо. Создание туториалов по эффектам — в планах. Но для начала — общие уроки по принципам работы. Резко прыгать в пекло действительно не хочется, потому сейчас хочется в малых объемах пройти тест и пофиксить всё, что можно.

не нада боятся, если пытаться пофиксить все что можна — никогда не выкатить релиза

Вы так спрашиваете, как будто впервые слышите про particles system.

Д3 используется для манипуляции свг (обычно.), частицы это всегда растровая графика

Простите, но так и не понял практического применения Вашему решению. делать патиклсы на 2d canvas — это очень непрактичное решение, так как на 500+ патиклах канвас 2d начнет умирать.

Было бы логично использовать Webgl рендерер, как это уже реализовано в treejs и pixijs, кроме того математику намного удобнее программировать, а не «визуально перетягивать», так как все нюансы вы всеравно не учтете. про профильные продукты Abode, пожалуй промолчу

Текущий экпортёр сделан именно для проектов на 2d canvas. Таких проектов сейчас большинство, т.к. webgl до сих пор нормально не поддерживается на мобильных. Как только webgl станет на ноги, дело 2-х недель сделать дополнительный таргет для webgl, т.к. редактор заточен под треугольники.

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

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

Чтобы не быть голословным, вот пример эффекта, где симулируются 600 пузырей, при этом используется достаточно сложные мат. расчеты для турбулентности. На экран они не все попадают: где-то 400-500.

neutrinoparticles.com/blog/2015/12/01/bubbles

На десктопе у себя я тормозов не вижу.

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

Спасибо. Дело в том, что принцип работы редактора очень отличается от тех, что есть на рынке, потому оставить привычный процесс разработки эффектов практически невозможно. А вот заинтегрировать в том же виде, в каком он сейчас есть — это уже более реально. Я буду рассматривать все возможные варианты.

Есть такое приложение — Periscope, позволяет делать вилео стримы. Пользователи могут смотреть Вас онлайн и писать вопросы. Удобная штука, попробуйте)

Вебинар — это интересная идея, спасибо.

А разве браузеры не выводят JS из использования?

Как раз наоборот — вводят. Это флэш с джавой — выводят.

Крутая штука)

1. Хотелось бы экспорт в С++ (или метаописание для любого скриптового языка), и чтоб оно дёргало интерфейсы из движка.
2. Как сделать такой GUI (интерактивная блоксхема, сплайны)? Это какая-то библиотека для qt?
3. Чего-то кажется, что формулы проще задавать руками в скрипте, чем блоками типа «а/b». И читалось бы быстрее, чем отслеживание связей на схеме.
4. Добавить 3D
5. Freeware для некоммерческого использования))))

Спасибо.
1. Сам люблю С++ и проект начинал с целью сделать либу ++, но жизнь вокруг изменилась с тех времен и JS сейчас стал более актуальным для партиклов. А экспорт в ++ будет обязательно. Экспорт будет только в готовые исходники, которые можно скомпилить под что угодно. Никаких дополнительных бинарных либ.
2. Нет. Всё писано руками. Задача черезчур специфичная, требующая модификации в самых неожиданных местах, потому стороннее — не вариант.
3. Блок Expression позволяет написать любое мат. выражение + там еще есть поддержка основных функций, типа abs, modf, vec2(x, y), vec3(x, y, z). Также можно добавлять входы и задавать им типы. Это покрывает большинство задач с выражениями. Ну и задача была — сделать редактор, которым не только программеры могут пользоваться, но и аниматоры-художники, потому код — не вариант.
4. Обязательно будет. Все партиклы и так в 3д. Перспектива тоже работает. Нужен будет просмотр с поворотом камеры + набор тулзов для 3д (типа путей). Всему своё время.
5. Отследить где комерческое использование, а где нет — это крайне тяжело. Именно с целью контролировать процесс я перевёл экспорт на удаленный сервер. Но, будут обязательно способы бесплатно получить экспортпаки. Типа, напиши небольшой абзац на специализированном форуме про редактор — получи 2 пака :) Напиши ревью в блоге — 5 паков, сделай тьюториал по эффекту — 10 паков. Подумаю еще над халявой для студентов.

Я вот этот момент не понимаю «и JS сейчас стал более актуальным для партиклов».

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

Эта актуальность исключительно в перспективе популярности редактора и скорости финансовой отдачи. JS сейчас испытывает нехватку инстументов для создания эффектов и девелоперы мучаются вставляя низкокачественные кадровые анимации, при этом игры получаются огромного размеры, а качество — посредственное.
Можно было бы сделать сразу экспорт и под все остальные платформы, но тогда БЕТА была бы очень болезненной, т.к. любое изменение занимало бы огромное кол-во времени на разработку и тесты.

Скажу чесно — посмотрел только примеры. Впечатлился :) Плюсик вам в карму :)

Підписатись на коментарі