Интерактивное 3D - это не просто, а очень просто

Доброе время суток. Меня зовут Михаил Юрьевич Куркубет, мне 31 год. С графикой и видео связался 8 лет назад. Было несколько больших перерывов, ессно по уважительной причине (лень было). Надеюсь, что больше не будет.

В творческой жизни каждого трехмерщика приходит время, когда ему ужас как сильно начинает хотеться сделать свои сцены интерактивными, то бишь наваять что-нить типа игры, на худой конец игрушечки или уж на совсем худой конец послушного узла Тора, который бы подчинялся нашим командам. )) Я не стал исключением. В 2001 году почувствовал острую необходимость сделать что-нить интерактивное, но, к сожалению, тогда производительность компьютеров была совсем не та, что теперь, и я не получил ожидаемого результата. И вот спустя время, когда мощности настольных ПК достигли невиданных из 2001 года высот, я снова решил воплотить свои старые желания в жизнь.

Итак, начнем. В этом уроке я вам попытаюсь объяснить принцип создания интерактивной 3D графики. Основную работу (домашнее задание) вам придется сделать самостоятельно, подглядывая в исходники. Все что нам понадобится – это 3D Studio MAX (я использовал седьмую версию) и Macromedia Director (я использовал MX 2004). В общем-то подойдет любая программа трехмерного моделирования, у которой есть возможность экспорта в формат Shockwave 3d. Модели и анимацию мы будем создавать в 3д максе, а органы управления приделывать в Macromedia Director.

Чтобы разжечь в вас аппетит и показать, что интерактивное 3д – это не просто, а очень просто, смастерим очень простой проект. Создайте в максе фигуру Torus Knot с такими параметрами: Base Curve / Radius = 50 см, Cross Section / Radius = 20 см. Назовем его MyTorus (очень важно в максе обзывать объекты понятными именами, именно по этим именам мы будем обращаться к ним в Macromedia Director при написании скриптов). Теперь экспортируем его в формат, который поймет Macromedia Director, а именно в shockwave 3d. Сделаем активным окно Front (когда импортируем файл в директор, то исходный вид у нас будет из этого окна, можно сделать активным любое другое окно, главное, чтобы наш объект был в нем виден в тот момент, когда будем экспортировать, можно использовать и камеры). Выбираем меню File / Export, из раскрывающегося списка форматов выбираем Shockwave 3d Scene Export (*. w3d). Вколачиваем название Torus (для данного примера нужно именно это название) и щелкаем по кнопке Сохранить. Появится меню настроек экспорта, оставляем там все по умолчанию и жмем Export. Файл готов для импорта в Macromedia Director.

Запускаем Macromedia Director, при открытии выбираем Create New / Director file .

При беглом осмотре видим, что он похож на видеоредактор. Нумерация кадров, дорожки, окно для превью того, что на них находится, и т.д.. Для начала нам понадобятся всего два окна – Stage и Score. Чтобы их открыть \ закрыть выполните соответствующие команды из меню Window .

Импортируем наш файл с 3D сценой в Macromedia Director.

В поле Cast : Internal окна Score щелкните правой кнопкой и в открывшемся меню выберите Import.

Указываем файл Torus.W3D, жмем Import. Наш узелок Тора появился в Cast : Internal. Хватаем его и перетаскиваем на одну из дорожек в окне Score . Узелок появился в окне просмотра Stage. По умолчанию разрешение проекта 640х480, а файл с объектом мы импортировали 320х240. Чтобы подогнать его по размеру, просто хватайте мышкой уголки рамки и перетаскивайте их, ессно, объект должен быть выделен. ShockWave3d - это векторный формат, и разрешение сцены зависит только от мощности вашего процессора и видеокарты.

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

Напишем наш первый скрипт.

В Macromedia Director есть свой язык программирования – Lingo (Macromedia Director понимает java, что, конечно же, очень порадует тех у кого есть опыт программирования для WEB). Наш первый скрипт будет – фрэйм скрипт, т.e. скрипт, закрепленный за определенным кадром (будет исполняться когда ползунок дойдет до этого кадра). Щелкаем два раза на дорожке скриптов в 10 кадре.

Откроется окно для написания скрипта. В нем мы пишем скрипт такой, как на рисунке. Это скрипт зацикливания кадра. Cкрипт при выходе из кадра отправляет ползунок обратно в этот же кадр. Визуально мы этого не увидим, но на програмном уровне именно так и происходит.

Пришло время оживить наш кубик. Для этого нам придется написать спрайт-скрипт, т.е. скрипт, закрепленный за определенным спрайтом (спрайт это объект расположенный на дорожке, т.е как только мы перетащили нашу сцену на дорожку, она стала спрайтом). Для этого правой кнопкой щелкнем по спрайту (дорожке), где расположена сцена с кубиком, и выберем Script .

В открывшемся окне удаляем то, что там есть, и пишем то, что видим на картинке.

Этот скрипт должен по нажатию клавиши Z двигать наш кубик влево. Урок рассчитан на тех, кто программированием не занимался до сего момента вообще, поэтому подробно разберем, что мы тут написали.

on enterFrame me – событие, которое произойдет при входе в кадр.
If keyPressed ("z") then - ставится условие, если будет нажата клавиша Z, далее указываем, что произойдет, если Z нажмут.
member("Torus").model("MyTorus").translate(-2,0,0) – в библиотеке элементов Cast internal мы обращаемся к элементу с именем Torus (это наша сцена, которую мы импортировали из макса), в нем мы обращаемся к модели с именем MyTorus и просим ее подвинуться на 2 единицы влево.
Последние две строки закрывают условие и сам скрипт. И такое дело происходит каждый раз при входе в кадр, а так как работает скрипт зацикливания, то все эти события происходят постоянно.


Сейчас попробуем, работает ли наш скрипт. Нажимаем клавишу Rewind , а затем Play в окне Stage .

Ползунок побежал по дорожке... добежал до 10 кадра... замер... ждет нажатия на клавишу Z... нажимаем на Z ……….. О чудо, моделька начала двигаться влево!!! Но что это, мы от радости так долго жали на Z, что она и вовсе уехала из поля видимости. Чтобы её вернуть у нас есть два способа, написать скрипт, чтобы она могла двигаться вправо, или скрипт, сбрасывающий параметры сцены (возвращать ее в состояние, которое было при импорте). Т.к. двигать модель мы уже умеем, напишем скрипт для сброса параметров. Добавляем в наш скрипт следующее:

if keyPressed ("q") then
member("Torus").resetWorld ( )
end if

Теперь по нажатию клавиши Q, наш узелок вернется на место. В конечном итоге скрипт выглядит так:

on enterFrame me
if keyPressed ("z") then
member ("Torus").model("MyTorus").translate(- 2,0,0)
end if
if keyPressed("c") then
member ("Torus").model ("MyTorus").translate(2,0,0)
end if
if keyPressed ("d") then
member ("Torus").model("MyTorus").translate(0,2,0)
end if
if keyPressed ("x") then
member ("Torus").model("MyTorus").translate(0,- 2,0)
end if
if keyPressed ("s") then
member ("Torus").model("MyTorus").rotate(0,2,0)
end if
if keyPressed ("a") then
member ("Torus").model("MyTorus").rotate(0,- 2,0)
end if
if keyPressed ("q") then
member("Torus").resetWorld( )
end if
end

Этот скрипт позволяет нашему кубику передвигаться по двум осям и поворачиваться. Теперь мы точно знаем, что интерактивное 3Д - это не просто, а очень просто. Теперь надо дать нашему проекту дорогу в жизнь, т.е. в интернет. Меню File / Publish Settings ставим галочки около Shockwave File (DCR), HTML, Preview after publishing, остальные убираем. Жмем Publish, создается страничка с расположенным на ней проектом.

Основная часть урока завершена, вам предстоит самое главное. Создать что-нить похожее вот на это. Потыкайте в нем мышкой, понажимайте D , Z , X , C, P. И если все сделаете правильно в честь успешного решения задачи, заиграет отрывок из некогда популярной песни (для просмотра вам необходимо установить ShockWave Player, например отсюда www.macromedia.com):

Простенький тренажёрчик по сборке виртуальной, но жутко мощной графстанции. Описывать процесс создания всего проекта я не буду, скажу лишь, что в этом проекте был использован иной способ анимации некоторых объектов, нежели в примере с кубиком. Здесь анимированы объекты в максе, а в Директоре настроено управление воспроизведением этой анимации.

Описание некоторых особенностей.

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

1. Начнем с того, что при экспорте в shockwave3d из макса у объектов сохраняются текстурные координаты, т.е. затекстурив объект в максе в Macromedia Directorе, вы его увидите с текстурой. Но иногда наблюдается глюк. Если применен материал Мульти сабобжект, бывает что перепутываются ID материалов и в Macromedia Director моделька выглядит не так, как хотелось бы. Чтобы устранить это, нужно найти глючный ID и просто назначить материалы, минуя его.

2. Macromedia Director не понимает клоны объектов, созданные в максе, т.е. он просто их не видит. В окне превью их будет видно, но обратиться с помощью Lingo вы к ним не сможете. Чтобы такого не случилось, вам нужно клонировать в максе не сам объект, а его подобъекты. Т.е. заходите на уровень поликов или элементов, выделяете нужное, копируете и делаете детач, получается объект, которым можно управлять в Macromedia Director. Так же, если вы в максе прилинковали один объект к другому, то в Macromedia Director прилинкованным объектом тоже будет невозможно управлять. При необходимости объекты можно прилинковать в самом Macromedia Director при помощи скрипта.

3. Macromedia Director понимает максовскую анимацию, но управлять ей с помощью Lingo можно, только обойдя некоторые глюки. Например, по нажатию клавиши вы хотите воспроизвести половину анимации, а по нажатии другой клавиши вторую, может получиться такой эффект: выполняется первая половина, а вместо второй половины выполняется весь цикл анимации. Все это происходит лишь при первом воспроизведении анимации, при повторных воспроизведениях все работает нормально. По-умному я это побороть не смог, поэтому за кадром воспроизвожу всю анимацию сцены один раз, а в это время юзеру показываю заставку типа Загрузка… .

4. Работа с камерами на языке Lingo слабовата, поэтому, если вы вместо нашего узла Тора захотите подвигать камеру, то лучше вам в максе сделать объект и прилинковать камеру к нему, а в Macromedia Director управлять движениями объекта, камера, ессно, будет двигаться вместе с ним.

5. Технология shockwave изначально разрабатывалась для использования в Internet, и это ее огромный плюс, свои проекты вы сможете выложить на обзор широкой общественности. Но у этой технологии есть ограничения. В версии для сети не работают некоторые полезные функции мыши, осутствует печать из самого проекта, не работают функции API . Поэтому можете забыть про использование этих функций для использования в Internet .

6. В Macromedia Director можно импортировать мп3 файлы, но упаковать проект для работы в Интернет вы не сможете, будет выходить ошибка (по крайней мере, так происходит в той версии программы, которую испльзовал я). Поэтому их нужно конвертировать в ShockWaveAudio. Это можно сделать прямо в Директоре, в меню Xtras/Convert WAV to SWA .

7. Если вы создаете в максе анимацию костями или biped (ваши глаза вас не подводят, Macromedia Director действительно понимает такие объекты и даже модификаторы Skin и Phisique), то вам необходимо сгруппировать ваш набор костей с той оболочкой, которую он должен шевелить. Иначе работать не будет.

Пора давать домашнее задание. Оно будет следующим, возьмите исходники (Macromedia Director, 3D MAX), в них все с комментариями, поэтому разобраться будет нетрудно. Поковыряйтесь в них и сделайте что-нить по-настоящему стоящее. Что у меня получилось после трехдневной возни, вы уже видели. Вот собсно и все. Надеюсь информация из этого урока будет вам полезна. Пока.

585 0 850 15
39
2006-03-23
Весьма интересно! в крайнем случае мне....
2006-03-24
Чет все выглядит не так как надо. Шоквэйв ролик не отображается. Кто нить видит комп на столе, вместо заставки шоквэйв плэйера? Господа админы помогайте, у меня урок отображается не так как должен. Вот тут отображается все нормально. http://micb.narod.ru/Comp/Comp.htm
2006-03-24
у меня тоже это также не работает... а то работает... А так, весьма интересный урок.
2006-03-24
Раз интересный, что ж не голосуем? 700 человек посмотрели страницу, а голос всего один.
2006-03-24
Все хорошо! Да вот только Macromedia Director EXE-не делает! Так что урок только для Web - мастеров.
2006-03-24
Оценок мало потому что дождаться пока че-нить покажется нереально.
2006-03-24
Автору большое спасибо!!!
2006-03-24
Grover Как это не делает, ставишь в паблишь сетингс галку напротив exe, и будет тебе exe.
2006-03-24
SmartTeapot Файлик весит 240 килобайт, по диал ап 49.2 грузится 3-4 минуты. До этого были неполадки с загрузкой ролика, но спасибо админам уже все наладили. Просто обновите страничку и все наладится )).
2006-03-24
хм.., плагин шок-машины в моей опере отсутствует, но верю на слово, должно быть интересно выглядит ))
2006-03-24
А мне нельзя голосовать!Можно было бы, проголосовал бы!
2006-03-26
Leshiy Действительно, посмотрел на макромедии шоквэйв плагни для броузера только под IE есть. Вот незадача. :(( Maxon04 А вы зарегистрируйтесь и сможете проголосовать.
2006-03-26
отличный урок, Автор РЕСПЕКТ. высший бал от меня обеспечен... отличное приложение для мультимедиа презентаций. я ещё не выполнял урок, но видно что написан грамотно... вобщем спасибо.
2006-03-26
надо будет обязательно попробовать ))) это первый урок, который я залпом прочитал до конца, не отрываясь даже на то, чтобы открыть макс или установить шоквейв ))))) обязательно попробую. Сразу же вопрос... где можно будет нарыть побольше скриптов, есть ли учебники и можно ли выложить на всеобщее обозрение номер ISQ автора, и разрешено ли будет его беспокоить по возникающим вопросам? )))))) очень клёвый урок. Где тут голосовать нада???
2006-03-27
Рад что урок оказался полезен или хотя бы интересен. Night Skylord Аськи нет. Мыло вот micB@mail.ru, чем смогу помогу, опыта пока немного. Пользовался в основном хелпом. Учебники встречал только на английском. Неплохой форум здесь http://prodirector.ru/, кое-что можно утянуть здесь http://www.625-net.ru/doc/director/books.htm
2006-03-29
)))) Конкуренты не дремлют, кто то определенно поставил единицу, видимо один из претендентов. Ну успехов ему в этом нетрудном деле.
2006-03-30
весьма интересно..... жаль что финального результата так и недовелось увидеть:-(
2006-03-30
Ovod-av А почему не довелось, опять что то не открывается?
2006-03-30
Для тех у кого обзиратель не IE, для тех кому в лом ставить шоквэйв плэйер, для тех кто не верит что можно сделать exe, для тех у кого ролик просто не хочет по неизвестным причинам показывать. Вот здесь можно стянуть архив с экзешником и посмотреть его локально на своей машине. Размер ~ 2.5Mb http://micb.narod.ru/Comp/Comp.rar
2006-03-30
отличный урок. и очень актуальный. Редко можно встретить такие.
2006-04-09
хороший урок. жаль, голосовать не имею права :)
2006-04-12
+4 суммарных балла =) интересно было бы увидеть комментарии тех, кто ставит единицы за этот урок... успехов, Михаил ;)
2006-04-17
На самом деле Macromedia Shockwave 3d это дурацкая, сложная и геморная технология и нет смысла городить этот огород. Я не понимаю что вы писаете кипятком от этого урока? Что, никто не знает таких технологий интерактивного 3Д как Viewpoint или Cult3D ??? К примеру viewpoint намного красивее (поддерживает лайтмап, световые эффекты, текстуры и бамп, анимацию, морфинг-анимацию и даже работает с MacromediaFlash), понятнее для изучения (не надо никаких дурацких скриптов, удобный интерфейс) и грузится быстрее, причем в любом браузере. Кому интересно можете зайти на сайт viewpoint.ru и убедится в этом.
2006-04-18
Alteste Ага, скриптов там не надо, если хочешь сделать что бы у тебя кубик туда сюда двигался, а если делать че нить поинтереснее, без программирования не обойтись. В шоквэйве простые вещи тоже можно делать без скриптов, есть куча готовых тригеров и элементов управления, но цель урока - объяснить принципы работы со скриптами для управления 3д. Шоквэйв 3д тож поддерживает флэш, не удивительно ведь разработчик то отдин и тот же, причем поддерживает так, что только держись, полная интеграция. Лайт мап и остальные сложные красивости шоквэйв тоже поддерживает. Морфинг - не видел ни одной игры где бы анимация осуществлялась морфингом, везде она делается костями, иначе ни один комп такое дело не потянет. А дурацкая и сложная она лишь для тех кто в ней разбираться не хочет. Скорость загрузки напрямую зависит от размера файла, количества текстур и их разрешения. Если вы такой профи, не могли бы ознакомить общественность со своими творениями где используются перечисленные вами красивости? То бишь раз уж обосрали эту технологию, докажите что можете сделать лучше. Конструктивную критику пожалуйста.
2006-04-18
вопрос к уважаемому Alteste... возможно ли, используя Viewpoint или Cult3D, сделать что-то похожее на http://director-online.com/havok/demos/demo-cardemo.html и http://director-online.com/havok/demos/demo-pool.html ???
2006-04-20
Михаил Конечно, скрипты - это дело необходимое, и во viewpoint тоже свой набор команд (которые пишутся, кстати, в блокноте). Там можно сделать любую интерактивную сцену (перемещать и крутить объекты, включать/выключать анимации, скрывать объекты, менять текстуру и многое др.). Главное то, что человек, желающий видеть свое 3Д-творение в и-нет броузере, может легко это осуществить не заморачиваясь на скрипты, а просто нажав в 3Dmax File->Export->viewpointformat и усе! Далее уже может усложнять сцену как захочет в вьювпоинт билдере. На счет красоты - после вьювпоинт плохо становится, глядя на шоквэйв 3д. Смотрится просто убого! Не нашел ни одной красивой сцены. И какого фига тормозит страница с загруженой сценой, когда я ее мотаю вверх/вниз. Неоправданно. dlg На счет реактора не знаю, допускаю что есть. Не проверял. Но игры во вьювпоинт технологии делают. Кто хочет посмотреть, что такое Viewpoint милости прошу на мой сайт: http://northpoly.viewpoint.ru/ Там нужно будет для просмотра скачать viewpointMediaPlayer ~4mb там же найдете. Сайт я немного забросил, т.к. одному не потянуть. Что делают профессионалы: http://www.viewpoint.com/pub/TheStudio/gallery.html Русский портал: http://www.viewpoint.ru/ - там есть все для самостоятельного изучения технологии (3dmax exporter, builder, player) Технология бесплатная.
2006-04-21
Alteste Это конечно хорошо что во вьюпоинте в браузер встраиваются элементарные элементы управления, такое же дело есть и VRML. Только по мне это детские игрушки. Настроить элементы управления подобные вьюпоинтовским - пара минут в директоре, они там все есть в стандартных триггерах. Скрипты можно писать в скрипт эдиторе, можно писать в блокноте, потом загружать их. Можно на родном языке, можно на ява скрипт, а ява скрипт - это ого-го. Полная интеграция с HTML, ASP, а через них и с любыми базами данных. Я не пишу игры, в основное рабочее время я занимаюсь разработкой виртуальных тренажеров по нефтяному технологическому оборудованию для дистанционного обучения, в организации где 100 тыс. сотрудников, филиалы раскиданы по всей России. Боюсь что вьюпоинт врядли подходит под данные требования. К тому же все те красивости которые вы приписываете вьюпоинту, требуют недюжих машинных ресурсов, не думаю что лайт мапа и бамп будут с достойным фпс крутиться на P4 - 1000 Мгц при разерешении хотя бы 800-600. То что страничка при прокрутке тормозит - это конечно не хорошо, но возможно что это лично моя ошибка в одном из скриптов, потому как до этого не приходилось располагать такой элемент по среди текста, все время использовал для это отдельную страничку. Вообще в любой технологии можно найти изъян.
2006-04-24
Да все там тянет и ничего не тормозит (25тыс треанглов с лайтмап и бамп на Р4 без проблем, проверь). В общем ладно, спорить больше не буду, хороший урок, мне понравился. Да, кинь линк посмотреть, что там за нефтяной тренажер, интересно. ЗЫ: а к тебе нельзя устроится 100 001 сотрудником в компанию?
2006-04-24
Alteste П - 4 понятие растяжимое. Тренажер в интранете, так скать для внутренних нужд 100000 юзеров :) из глобы его не видно. На счет устроиться - не знаю, могу дать телефон отдела кадров, только жить в Сургут придется ехать. Спорить тож больше не буду.
2006-09-11
Интересно - попробую.
2006-09-12
Может не актуально, но интересно.
2006-09-12
Думаю на практике вряд ли пригодиться.
2007-06-26
Что-то не получается у меня этот урок. Во-первых в 9-ом MAXe нет экспорта в шоквэйв. Ну, с этим я справился сохранив в *.3ds и конвертнув через 3D exploration. А дальше никак. В смысле в Director все импортируется нормально, но управления спрайтом нет. При запуске debugger говорит: [img]D:/Director.jpg[/img] Что делать. Подскажите?!
2007-06-26
И письмо написать не получается :-(, как картинку то вставить?
2007-06-27
Все проблемы решил установив 3D Max 6.0
2007-06-28
[b]Дмитрий Гололобов [/b] Возможно при конвертировании в одна из программ изменила имена, поэтому скрипт не работал. Кстати в майке 8.5 тоже убрали экспортер в шоквэйв. Я теперь почти в трансе. :(
2007-08-05
Вообще то из Макса экспортировать нужно в формат [b]w3d[/b], а в директоре его импортировать
2007-08-14
[b]юджин пет[/b] Разве в уроке написано что то другое ? ;)
2007-08-22
Я и сам сейчас смотрю, что то не то ляпнул, наверное перепутал Максы 9 с 8. В 8 же есть экспорт, а 9 я ещё не ставил, поэтому не знаю
RENDER.RU