WebGL с чего начать и как готовить?

Question

[Mykola Kordiak]

Доброго времени суток!

Собственно, сабж.
Как то раньше я играл с cocos2d.js и не имея малейшего понятия что и как работает воровал случайнЬІе картинки из гугла, пробуя слепить что то работающее.
Не знаю почему, но мне интересна данная тема, хоть и нет определенного задания (пока что). Главная причина: "Хочу!". Есть вариант, что дяди заказчики могут захотеть какую то особою анимацию.

Такую тему я тут уже нашел но хотел бЬІ получить более развернутЬІй ответ. В гугле есть много чего и я сразу потерялся. Все хвалят свой фреймворк/рендеринг либу. Я не знаю насколько нормально использовать их, не зная азов и нужно ли их (основЬІ) изучать вообще при таком то наборе API (напр. того же tree.js).

Моя писанина больше похожа на: хочу то - не знаю что )))
Но мне нужен совет с чего начать: из низов типа learningwebgl.com/blog/?page_id=1217 и потом с каким то пониманием дела (надеюсь, оно таки появится) двигаться дальше или наоборот - из толстяка типа ThreeJS или BabylonJS при возникновении особЬІх задач (люблю что то что не как у людей) углубляться в азЬІ.

Спасибо, что осилили столько букв (=

Answer 1

[Юрий]

Тоже пару лет назад изучал webgl, тоже было интересно (пригодилось один раз по мелочи, но не жалею ).

Поговаривают что WGL бесполезно изучать по исходникам других приложений и в этом есть доля правды. Хотя исходники пригодятся позже когда будете понимать основы.
learningwebgl мне в свое время помог, я выбрал путь изучать именно без библиотек - очень полезный опыт потом можно перенести и на десктопный openGL, хотя версии там более новые.

рекомендую такой путь.
идти по этим статьям - начинать именно с рендера треугольников - главное понять суть - как данные из js передать в видюху - как получить доступ к ним из шейдеров.

далее разобраться с матрицей трансформации - векторной арифметикой - посмотреть какие функции для векторов и матриц есть в шейдерном языке.
разобраться для чего нужны пикселные и вертексные шейдеры. Лично мне в этом плане очень сильно помогло чтение спецификации OpenGL ES 2.0 (гуглите в сети).

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

В общем тема очень интересная - много всего увлекательного впереди, но изучать нужно реально много всего, параллельно с работой уйдут месяцы.

С библиотеками же по сути можно получать результат практически сразу - но если вы делаете чтото более менее типовое.

Надеюсь помог и желаю удачи!

Answer 2

[Stalker_RED]

Если хотите основы 3D, то вот крутая, имхо, серия статей: habrahabr.ru/post/248153

Comments

[Nikolay Talanov]

В одной из частей это серии нашел ссылку на вот это blogs.msdn.com/b/davrous/archive/2013/06/13/tutori...
Вот там годноты намного больше + внутри куча ссылок на другие статьи. Они как раз отлично покрывают базисы, описанные в ответе Юрий

Answer 3

[elmander]

Скоро на курсере стартует курс по webgl, можете записаться

https://www.coursera.org/course/webgl

Comments

[Mykola Kordiak]

Да. спасибо.
Подписался, стартует через месяц.
Ждемс (-:

Answer 4

[svaa1982]

Вы уже и сами написали ответ на свой вопрос. Действительно, сначала основы, для чего изучаем уроки с learningwebgl.com. А дальше идут готовые движки (хотя никто не запрещает писать что-то своё). Скорее всего параллельно придётся освоить какой-либо инструмент 3d-моделирования. Если опыта нет, берите Блендер, по возможностям это просто монстр, а доступен бесплатно.

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