.

Create a 360 degree presentation of a cellphone

Prerequisites: You need to create the object snapshots or photos for use with the component. Depending on your case, you can do this by using your favorite 3D software or taking pictures of the real object.

(!) Make sure that the angle difference between adjacent snapshots is constant.

You can also download the cellphone online trial sample included in the Downloads area of the 3D Rotate component and use the images included in the package ( Go to Downloads )

The goal for the following example is to create a 360 degree presentation of a cellphone using the mouse to control the rotation.

We are going to use the cellphone snapshots provided as examples (included in the cellphone sample package).

FT SPECIAL PACK


1. Start Adobe Flash, open a new document and set a 30 fps in the Document Properties Panel.



2. Open the Components Panel (Window/Components). You will find the component in the Flashtuning folder.



3. Drag the 3D Rotate component (Ft3DRotate) from the Components Panel to the stage. The component graphic symbol should now be displayed on the stage.

4. Create the component configuration file:
  • Make a copy of the snapshots.xml file found in the component archive.
  • Configure the XML file by adding/removing entries for each of the cellphone snapshots (the highres must be specified, the lowres version is optional) or leave it unchanged for this example.
  • A correct entry should look similar to the line below:
    <slide lowres="slides360/lowres/slide00.png" highres="slides360/highres/slide00.png" sourcetype="external" regname="slide00"></slide>
  • Save the configuration file and make sure it is a valid XML file. Most web browsers (such as Internet Explorer or Mozilla Firefox) should be able to report any errors in the XML format.


(!) Make sure to export the movie for min Flash Player 8 (ActionScript 2.0) when using PNG images or motion blur.

6. Switch back to Adobe Flash, select the 3D Rotate component on the stage and configure its parameters in the Parameters Panel or in the Component Inspector Panel (Window/Component Inspector)
  • Instruct the component to use the newly created XML file as the data source (xmlData).
  • Make sure mouseInput is set to enabled
  • Leave the rest of the parameters unchanged, as they are already populated with default settings


6. Test the movie (Control/Test Movie). Use the mouse to click and drag to rotate the cellphone.

(i)
Please refer to the 3D Rotate component Flash Help Book for more information and options included with the 3D Rotate.

The component comes with a built in Help Book with all the supported methods/properties and events explained and you can access the files via the Flash Help Panel. You will find the book under the name Flashtuning 3D Rotate or you can perform a search under the Flashtuning or adjacent keyword and the documentation files will be automatically displayed.



No comments found ! Click here to be the first adding comments for this tutorial!