Add interactive 3D components to your ebook that your readers can rotate and scale. Kotobee Author supports 3D objects of extension .obj. There are many available models online for download, from websites such as TurboSquid. For extensions other than .obj you can use HTML embed readers through iframes. A good example if SketchFab, which provides an HTML embed reader to add to your HTML page.


 

To add 3D components

  • Click on the 3D tool

  • Enter a title for the 3D object. This name is optional and will not affect the model's behavior in anyway. But it is a way to label the 3D object in editing mode.
  • Click on the Objects tab button. From the dropdown list, click on Import new object. Select the .obj file from your file system. Note that you can add multiple objects.
  • To preview your 3D model, click on the large Render model button under the 3D Model Preview panel at the left. This will render the 3D scene as it will be appear in the book. If the scene is larger than the container, horizontal and/or vertical scrollbars may be used. If the model does not appear, then you need to adjust other settings for the object, camera, lighting, and scene. This is covered in the next section.
  • Click on Create.

Following the previous steps for adding a 3D object in the most basic way, we will see how we can make further settings to control the appearance and behaviour of the model. There are five different tabs, each controlling a certain aspect of the object.


Interaction tab

Here you control how the object is displayed initially before the 3D model appears.

Placeholder image This image will be initially displayed as a placeholder. Upon click, the 3D model will appear
Include overlay message A custom label of your choice will appear on top of the placeholder image, instead of "Click to see 3D object"
Target Do not do any action. This may be useful for activities taking place in the classroom, requiring teacher intervention



Scene


Here you can select general settings for the scene.


Width Represents the scene area which is rendered in 3D. The larger the area, the higher the processor consumption
Height Represents the scene area which is rendered in 3D. The larger the area, the higher the processor consumption
Background color The background color used for the scene


 

Camera


Here you can control the camera view for the model.


Position The position of the camera (in 3D space)
View angle The view angle that covers models in the scene
Near Objects that are closer than this distance will disappear from the scene
Far Objects that are farther than this distance will disappear from the scene


 

Lighting


Here you can control the light sources for your scene. You can add more than one light souce, by clicking on Create new light in the drop-down list, when clicking on the tab button.


Name This name will be used as an ID and will not affect the lighting behavior in any way
Light type There are six different lighting types to choose from, each showing different results. Each light type will display different properties to set, such as color, position, and intensite


 

Objects


Here you can control the light sources for your scene. You can add more than one light souce, by clicking on Create new light in the drop-down list, when clicking on the tab button.


Name This name will be used as an ID and will not affect the lighting behavior in any way
Texture Add an image that will be used as a texture to wrap the OBJ model
Position The position of the object in 3D space