Papervision3D Tutorial #4 : Primitives (기본도형)

안녕하세요 마린즈입니다.
3편에서 만든 기본클래스를 활용하여, 기본도형들을 화면에 만들어보도록 하겠습니다

Papervision3D Tutorial #3 : Bootstrap 클래스 만들기

안녕하세요 마린즈입니다.
아이리스가 시작하기전에 시간이 남아서, 추가적으로 글을 써봅니다~ ^^
4번째 포스팅에서는 3차원 Dimension에 대한 설명을 드릴 예정입니다.

일단 3D환경을 구축하기 위해, 가장 기초가 되는 Class를 하나 만들어보겠습니다.
지금부터 만들 Class는 Main.as에서 상속을 받아, 보다 보기좋게, 코드의 재사용성을 위해
만드는 것입니다. (Main클래스에서 정의해도 무관하기는 하나, 프로젝트를 만들때마다 만들려면 좀 피곤하겠죠?)



PV_Base.as 내용

위의 소스에서 유심히 봐야할 부분은 화면을 구성하기 위해 존재하는 요소들입니다.
어떤 Method가 어떻게 작동하는지도 중요하지만, 그보다 3D라는 공간을 구성하고, 표현하기 위해
어떠한 것들이 필요한지 알아보도록 합시다.

1. Element for 3D Environment

(1) Viewport
(2) Scene
(3) Camera
(4) Renderer

– UpdateDisplayList / EnterFrame event / Thread

 다음은 PV_Base파일을 상속받아 Gallery3D클래스를 만들어봅시다.

Papervision3D Tutorial #2 : 설치 및 환경설정하기 (by Marines)


안녕하세요 마린즈입니다.
오늘은 어제에 이어 PV3D를 사용하기 위한 설치 및 설정방법에 대해서 알아보도록 하겠습니다.

사용자 삽입 이미지

아니.. 어제 글쓰고 그사이에 버젼업데이트가 되었네요. 세부내용은 나중에 살펴보도록 하죠.
zip파일을 받아서 압축을 해제하면 아래와 같은 폴더가 있을겁니다.

사용자 삽입 이미지

최상위 패키지 org의 하위패키지로 ascollada 와 papervision3d 가 있습니다.
그러면 이제 Flash Develop을 실행시켜서 Project를 생성해보도록 합니다.


1. Create New Project in FlashDevelop


사용자 삽입 이미지

위의 그림처럼 Create a new project를 누른후, AS3 Project를 선택합니다.
하단에 Name항목에 프로젝트명을 적어주고, 작업폴더를 설정한후 OK버튼을 눌러줍니다.

사용자 삽입 이미지

프로젝트를 생성하면 Main.as파일이 자동으로 생성됩니다.
아까 다운받은 PV3D패키지를 src폴더 안에 카피를 하면 바로 작업이 가능해지는 거죠~

사용자 삽입 이미지

swc파일을 쓰려면 src폴더가 아닌 lib폴더 안에 swc파일을 카피하고 해당 swc파일을 선택한후,
Add To Library해주면 됩니다.
이때 주의해야할 점은 src폴더내의 패키지 형태로 쓰던지 lib폴더 내의 swc형태로 쓰던지 택일을 해야합니다.

여기까지 진행하셨다면, 이제 PV3D를 사용하여, 바로 작업이 가능한 것입니다.

Papervision3D Tutorial #1 : Getting Started (by Marines)


안녕하세요 마린즈입니다.
Adobe Flash/Flex/AIR(ActionScript 3.0) 에서 사용되는 Papervision3D에 대해서 알아볼까 합니다.

사용자 삽입 이미지


Papervision3D(PV3D)는 MIT License를 가지는 오픈소스 라이브러리입니다.
기존에는 유료로 제공되었던 적도 있으나, 현재는 무료로 사용가능하며, 지속적으로 업데이트 중입니다.
PV3D는 최근 많은 곳에서 사용되고 있으며, Adobe Flash Player가 구동가능한 모든 플랫폼,Device에서
사용가능합니다. (물론 Device에 따라 성능에 따른 제약이 생길수도 있겠지만요)

PV3D Reel 영상 링크 : http://note.marines.co.kr/106
아래의 영상이 안보일경우, 위의 링크를 클릭해주세요.


영상을 잘 감상하셨고, PV3D에 관심이 생겼다면 아래글을 따라서 진행하시면 됩니다.



1. Papervision3D Download

Download PV3D Source : http://code.google.com/p/papervision3d/downloads/list
라이브러리 다운로드는 위의 주소에서 가능합니다.

사용자 삽입 이미지

다운로드 할때 3가지 종류를 선택할수 있습니다.
– SWC버젼
아시는 분들은 아시겠지만, SWC는 소스코드를 component단위로 압축해놓은 파일입니다.
package를 추가하는 것과는 별도로 swc 추가설정이 필요합니다. (다음 포스팅에 설정법에 대해 알아보도록 하겠습니다)
– ZIP버젼
zip파일을 압축을 해제하면 “org”등의 package폴더가 나옵니다. 이 폴더를 해당 프로젝트 src폴더에 카피해놓으시면 됩니다. (다음 포스팅에 설정법에 대해 알아보도록 하겠습니다)
– MXP버젼
Adobe Flash CS3 전용파일로, Component설치형 파일입니다. Extension Manager를 통해 설치가 가능하며,
플래시 버젼에 따라 그에 맞는 mxp파일을 찾아서 설치해주어야 정상작동합니다. 설치후에는 Component Inspector등의 메뉴를 이용하여 사용가능합니다.  (다음 포스팅에 설정법에 대해 알아보도록 하겠습니다)



2. The Definitive Guide to Papervision3D

이번에 Amazon에서 구입한 “Papervision3D Essential” 이라는 책을 잠깐 소개하겠습니다.
사용자 삽입 이미지

국내외를 통틀어서 최초로 나온 PV3D 서적이 아닐까 싶습니다.
물론 한글이 아니라, 영어로 집필되어 있습니다. (하루빨리 번역서가 나왔으면 하는 바램이 있습니다 ^^)
이 책은 총 13개의 챕터로 구성되어있으며, 설치부터 시작하여 Primitives(도형), Material(텍스쳐,질감), Cameras, Shading, External Models, Z-Sorting, Particles, Filters&Effects, 3D Vector Drawing & Text, 최적화 등등 알짜정보들로 가득차있습니다.

저는 이 책을 기초로 하여, 기타 잡다하게 줏어들은 3D관련 지식들을 녹여내어 글을 써볼까 합니다.
기본적으로 3D툴을 다뤄보지 않은 분들을 위해, x,y,z축, Polygon, Edge, Vertex같은 개념부터 시작하여,
Particle의 원리, IK, UVW coords같은 PV3D에 필요한 모든 개념들까지 포스팅해볼까 합니다.
관련 정보가 많이 부족한 시점에서, 제가 쓴 글이 누군가에게 조금이라도 도움이 되길 바랍니다. ^^


3. FLEX 3.4 SDK Download

현재 FLEX SDK는 build 3.4.0.9271 까지 Release 된 상태입니다.(2009년 12월 1일 기준)

다운로드 경로 : http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3

사용자 삽입 이미지



4. Flash Develop Download

지극히 개인적인 취향으로 FlashDevelop을 사용하고 있습니다. 현재 3.0.6 RTM released 입니다.

Flash Develop Download : http://www.flashdevelop.org/community/viewtopic.php?f=11&t=5669

사용자 삽입 이미지

이를 설치하기 위해서는 .Net Framework과 Java JRE 1.6+ 이 필요합니다.

Microsoft .NET Framework 3.5 다운로드 : http://www.microsoft.com/downloads/details.aspx?displaylang=ko&FamilyID=333325fd-ae52-4e35-b531-508d977d32a6
Java JDK/JRE 다운로드 : http://java.sun.com/javase/downloads/index.jsp

위의 주소에서 설치가능합니다.

여기까지 개발에 필요한 모든 프로그램/요소를 소개해드렸습니다.
다음에 지금까지 다운받은 프로그램들의 환경설정 및 간단한 추가설명을 드리도록 하겠습니다.
그럼 다음에 뵙겠습니다 ^^

Papervision3D + Water Simulation = Waterballs

Papervision3D + Water Simulation = Waterballs


 



Ralph Hauwert 씨가 오래전부터 준비해오던 프로젝트가 드디어 완성됬어요!


높이맵(범프맵) 을 이용한 3D 유체 시뮬레이션 입니다.

출처: unitzeroone.com



CPU부담없는 버전은 [여기]


CPU에 좀 자신 있다 하신분은 ↓





Daily Papervision3D

출처 : http://dailypv3d.wordpress.com 

orange8 interactive

26062008

Today I bring you one of my own creations, here’s what Phil Suter (the consultant for this project) has to say about it:

orange8.com is the corporate website of the Swiss web agency orange8 interactive ag. It’s done in Papervision3d and has some nice features like project gallery, readable URLs, alternate site for search engines and users without flash player and more.

Be sure to check it out here: http://www.orange8.com/


 
 

babynrs.nl

25062008

Kees van Dorp just posted a nice Papervision3d gallery “for the (dutch) zero- and first issue magazines collection […]It is the largest collection of magazines from 1980 and contains over a 1000 issues.”
At first sight it might seem as just another gallery, but as you browse trough it you’ll find some nice goodies.

Check it out here: http://www.babynrs.nl/


 
 

13flo

20062008

13flo is the personal porfolio of Florian Bernard, and it’s an amazing one. Not only the design is slick, the motion is smooth, there’s also a nice little 2d ape physics going on. Plus you can download the source and see how it was done for yourself.
Congrats flo!

Check it out here: http://www.13flo.com/


 
 

New Mercedes CLC

19062008

UVE Just released their latest Papervision3d artwork, a beautiful microsite for the new Mercedes CLC. It’s by far one of the best uses I’ve seen for Papervision3d, you can drive the new CLC that’s modeled with great detail and you can even feel the suspension at work, brilliant work!
Also there’s a nice PV3d gallery to show off the CLC.

Check it out here: http://www.mercedes-benz.es/CLC/

*note: due to the high poly model, some of the slower machines might not be able to see it with it’s full potential.


 
 

Flashpanos

16062008

Patrick Cheatham just brought to my attention an open source project by himself and Zephyr Renner, Flashpanos.
Flashpanos is an opensource flash panorama player with plugin support and it’s currently looking for help from the comunity.
It surely looks like a cool project and they have acheived some cool results, be sure to check them out at http://flashpanos.com/.
Most recent post:
http://flashpanos.com/content/open-source-flash-pano-viewer-based-pv3d-update

Most recent example:
http://flashpanos.com/flashpanos_files/Papervision/PanoSalado/trunk/examples/PanoSalado.swf

Most recent Source:
http://www.flashpanos.com/flashpanos_files/Papervision/PanoSalado/trunk/src/FlashPano_005_20080612.zip


 
 

Terratv at Cannes

10062008

Carlos Lunetta just finished his latest experiment for Terratv it’s a beautiful ‘commercial’ featuring Seb’s particle class and his own craftsmanship to achieve a very cool result.

Be sure to check it here:http://www.terra.com.br/TerratvatCannes2008ingles/index.htm


 
 

Silent SONB

10062008

Silent SONB just finished his first PV3D project and has achieved a cool result, it has a simple, yet cool gallery of his works and smooth animations.

Check it out: http://www.silentsonb.com/


 
 

Papervision3D @ FITC

10062008

Our good friend Ralph Hauwert will give a nice pre-event workshop over at FITC named Papervision3D From the Core, here’s the description:

In this one day course we will cover a great part of the capabilities of the Papervision3D API for Flash. From concept to execution Ralph Hauwert will take you through the process of creating an implementation of the Papervision3D api, be it an application or website. During the day we will cover Papervision3D hands-on, with narrative by one of the developers of the API.

Relevant links:
Ralph’s workshop: http://www.fitc.ca/presentation_detail.cfm?festival_id=62&presentation_id=724
FITC full event details: http://www.fitc.ca/event_detail.cfm?festival_id=62

So for those of you who can attend, it’s a must!


 
 

Lets Haka

3062008

Today we have one from our good friend Gabor. He build a cool website for the Euro’08 where you and your mates can upload your faces and make your own haka!

So don’t wait and go get yours now at: http://www.letshaka.com/

*Update: At the moment the project is down due to legal issues, we’ll bring you more on this as soon as we know it


 
 

TEDSphere

2062008

Today I bring one of my favorite topics, by one of my favorite companies, TEDSphere by Bestiario, that give you an interactive network space with the video contents of the TED talks.
It gives us plenty of filtering options, and more important relations between the talks, and as usual with Bestiario in a very cool and unsual way.

So be sure to check it at: http://www.bestiario.org/research/tedsphere


 
 

jiglibflash – Flash 3D Physics engine

DOWNLOAD : http://code.google.com/p/jiglibflash/


Jiglibflash is a open source 3D physics engine with a MIT license (ported from c++ Jiglib).


The current version can be used with Papervision 3D and Away3D.


The source and examples can be found in the trunk at the SVN (see source tab). There is no documentation yet, but you can find a short tutorial in the Wiki.


You can reach our blog at: www.jiglibflash.com/blog.

AS3 3D Physics Engine : WOW-Engine

Download : http://code.google.com/p/wow-engine/

WOW-Engine
is a free AS3 open source physics engine written by Seraf ( Jérôme Birembaut ) capable to handle positions in a 3D environment.


WOW-Engine use Sandy library for all the 3D mathematical computations (matrix, 3D vector, plane). The inner architecture of the engine is also inspired by Sandy’s one.


Collisions and physical reactions are possible thanks to the AS3 physic engine made by Alec Cove, named APE(version 0.2.).. Even if APE is a 2D physic engine, it is possible to extend the contraints on volumes, and that’s the purpose of WOW-engine. WOW-engine extends APE, and allows to simulate physics on 3D volumes.


WOW-Engine is capable to handle positions and rotations of abstract objects, which need to be linked to some visual objects (2D or 3D). The visual objects can be drawn thanks to another library (Sandy3D , Papervision3D, Away3D for 3D).


WOW-Engine use and depend of the Data Structures classes written by polygonal labs.


The engine, still in development, consider to manage the following feature in the near future:


– edges
– quad face surface delimitation.
– Sphere real rotations.
– Forces evenments (based on explosion etc.)


Currently, the engine is capable to manage :


– spheres
– infinity planes
– boundArea ( bounding volume based on a box )
– advanced contraints ( with or without mass )
– verlet box


-collisions events


You can use several instances of the engine for a single scene, permitting to compute in the different intances espectively a falling leaf, and a character cloth simulation.


Basic technical Demos :




Advanced technical Demos:


Discussions Board:


french: http://flash.mediabox.fr/index.php?showforum=102
english: http://groups.google.com/group/wow-engine


Tutorials:



Download:


ver1


WOW-Engine ver1 Classes
IMPORTANT!!! wow-engine ver1 need AS3 Data Structures For Game Developers for run


ver2


*SVN* for the ver2 alpha, check the following svn http://code.google.com/p/wow-engine/source/checkout


Contribute:


We are doing the WOW-Engine development during our free time, for pleasure, and we don’t make any money with it. WOW-Engine has been released under a licence which allows you to use the engine in your commercial applications for free.


Do you want to help us to make this project better everyday? You can do a contribution using paypal. It is secure, fast and simple.


thank-you for support us.


Special Contributors:


Pierre Girard, http://www.mediabox.fr/ for host and support the project
Thomas Pfeiffer, http://www.flashsandy.org/ for Sandy3D engine and translation
Alec Cove, http://www.cove.org/ape/ for this APE engine

Papervision3D Basic #1

앞서 포스팅한 Papervisiob Basic Template을 바탕으로 하여, 실제로 화면에 3D 오브젝트들을

나타내는 방법에 대해 알아보자.
1. 일단 DAE포맷의 3D Object Data가 필요하다.
2. Papervision3D Library가 필요하다.
일단 이렇게 준비가 끝났다면, 바로 클래스제작에 들어가면 되는데, 간단하게 3D에 대해서 알아보자면,
1) 3D오브젝트 : Modeling 데이터, Texture(Material) 데이터
2) 렌더러 : 화면에 출력을 해주기 위한 RenderEngine
3) Viewport : 화면상의 화상표시영역
4) Scene : X,Y,Z축을 가지는 가상의 공간
5) Camera : 말그대로 카메라~
=====================================================================================
import PaperBase;
1> Collada Parsers를 사용하여 dae포맷의 데이터를 부른다.
import org.papervision3d.objects.parsers.Collada;
cow = new Collada(“cow.dae”);
2> 별도의 DisplayObject3D오브젝트를 만들던지 아니면 default_scene에 addChild하면 화면에 나오게 된다.
아주 간단하게 3D데이터를 플래시에서 표현을 할수있다.
인터랙션을 주기 위해, PaperBase에 정의된 Method를 override하여,
ex> override protected function processFrame()
viewport.y = -(((mouseY – (sceneWidth / 2)) / (sceneHeight/2)) * 200);
viewport.x = -(((mouseX – (sceneWidth / 2)) / (sceneHeight/2)) * 200);
이런식으로 화면을 컨트롤 할수도 있다.
default_camera.moveForward(default_camera.distanceTo(cow) – distance);
container.rotationY = -((mouseX / sceneWidth) * 360)
AS3Dmod(참고 : http://www.everydayflash.com/blog/index.php/2008/09/03/as3dmod/)
– 3 basic modifiers: Noise, Bend and
Perlin
– plug-ins for the most popular engines: Papervision3d, Away3d, Sandy3d and Alternativa3d