Visual Property Editing Tools for Web based Virtual Reality

Szilárd Kiss
University of Twente
P.O. Box 217
7500 AE Enschede
The Netherlands


We present an approach to modeling which is based on Virtual Reality and web technologies. Based on the web enabled VRML language, we build virtual environments that enable users to perform editing operations on H-anim and other bone-like hierarchies, their skin, on textures and even NURBS surfaces. All of this is effectuated on-line, within a web browser running a VRML plug-in and a control-handling applet. By creating custom control code ("widgets") and integrating them directly into the environment, we eliminate the usual "application window around the visualization" approach in favor of immersion into the environment. The purpose of these environments is to fill the gap caused by the few VR oriented modeling systems and to provide an easy to use, natural 3D editing approach that is usable by users inexperienced in 3D modeling, the majority of inhabitants in VR communities.


VRML, graphics modeling, WWW.

Categories and Subject Descriptors

I.3.6 [Computer Graphics]: Methodology and Techniques, Interaction techniques; I.3.7 [Computer Graphics]: Three-Dimensional Graphics and Realism, Virtual reality.


Typically, a virtual environment (VE) provides the means for 3D visualization and interaction. To provide editing capabilities in such an environment, custom interaction modalities must be used [3][5], for which the results are persistent and can be recorded. These custom interaction modalities are commonly referred to as "widgets" [4] and they are used for a multitude of purposes [1].

Graphics editing packages treat graphics objects somewhat on multiple, different levels. Their components are categorized, and often a "mode shift" is required (e.g. expressly specifying what the user wants to select: vertices, edges, polygons, etc.) to be able to effectively manipulate these target objects. The picture is different in case of Integrated Development Environments. IDEs provide a framework for visually handling geometrical objects via their property fields. The graphical properties of virtual objects fall not far from this concept, especially if the target objects are truly web-oriented and simpler in construction. These properties are usually a collection of coordinates, positioning data and other types of data. Custom controls that handle their values can be built easily, as several example systems already demonstrated [2][6].

Editing on top of a VR system which is at the same time an on-line platform will always fall short with regard to complexity and the possibilities of specialized, complex VRML editing tools like CosmoWorlds and especially of general graphics packages like GMax, Maya (PLE), etc. However, these sort of systems still provide advantages like simplicity, appropriateness for casual users, up-to-date (server-archived) software and even multi-user, collaborative access.


Our modeling environments are based on handling the properties of edited virtual objects. The visualization incorporates both the target object and the control structures or widgets used to manipulate the object properties. The actual control is exercised from an applet, which handles via an inter-plugin communication channel the actual geometrical operations and keeps data modification records for saving, automatic control code creation and property modification operations.

VRML properties

Almost all data fields present in VRML represent graphics properties or are related in some way with the screen visualization. Our goal is to provide modeling capabilities for the components of H-anim and similar characters, which contain IndexedFaceSet geometry meshes, joint coordinates, hierarchy properties, textures, etc.

Visual editing tools - Widgets

The editing tools handle selections and different types of manipulations. The selections are enabled by graphics and sensors wrapped around coordinates and edges. The widgets provide different functionalities like scaling, positioning, rotation with regard to the object properties and also to the visualization parameters.

2.1 Geometry (IFS) editor

The geometry editor subsystem handles IndexedFaceSet geometries consisting of coordinates which in our case are restricted to a regular grid. The restriction makes possible the grouping of the coordinates into ring and column primitives for a hybrid, low-level and multi-target manipulation approach that differs from classic approaches in favor of natural and intuitive interaction. These primitives are selectable entities and the different widgets can be used for modeling them. Coordinates are represented by sensor boxes, while ring and column primitives are represented by sensor line geometries. A number of geometric operations are defined, both the common translation, rotation respectively scale operations and several that are extended to or specific to the ring and column primitives (smoothing, scaling, rotation, etc.). We aim for a direct selection and manipulation mechanism which makes the interface easy to use. Symmetry is automatically handled when necessary.

Sample geometries with control structures
Figure 1. Sample geometries with control structures: directly on the mesh and symmetric (left) respectively elevated and unsymmetrical (right) control structures.

2.2 H-anim hierarchy editor

An H-anim hierarchy consists of a collection of joints building up a bone hierarchy and the attached geometry segments. Our system uses a bone representation based on the same principles as the geometry editor. Joint centerpoints are coordinates and hierarchy properties are edges, the latter used here only for visualization purposes. Segments are edited one by one with the previous subsystem, as well as through the soft links set up between the joint center properties and segments, making possible segment deformations (segment endpoints follow joint centers).

Sample hierarchies
Figure 2. Sample hierarchies: simple H-anim respectively spider hierarchy with Joint selection sensors.

Sample characters
Figure 3. Sample characters: human and spider.

2.3 NURBS editor

With the introduction of the NURBS extension to VRML and due to the similarities between our regular grid approach and the NURBS control structure, it is relatively straightforward to transform our geometries into NURBS surfaces. Due to this transformation, the system low-level (coordinate-based) and hybrid-level (multi-coordinate based) operations transform into high level operations, since the NURBS surface is a very detailed surface and the control structure acts upon the general shape, without the possibility to influence individual vertices.

Sample NURBS geometry
Figure 4. Sample NURBS geometry, with a coordinate to NURBS knot transformation.

2.4 Texture applicator

When a 2D texture is applied to a 3D object, there is a mapping of 2D texture coordinates to the 3D vertices of the object. To provide access to this mapping, our texture applicator system creates selectable and manipulable objects that represent the texture coordinates of individual vertices. This way a simple and direct texture positioning method is achieved.

Texture applicator
Figure 5. Texture applicator.


With these sorts of visual approaches, the programmer's or casual user's work can be speeded up. Geometry handling becomes intuitive, visual, eliminating the preview steps necessary with text editors and the complexity of graphics editors, providing a clean, simple alternative. It can work both locally and on-line, providing an always updated tool for occasional users. However, to be more usable, these prototypes can be extended to incorporate handling for additional properties of graphics objects. Tables 1 and 2 are assessing the complexity and speed of the different components or aspects of our system.

Component Complexity Observations
and widgets
3000 lines of code
100KB length
Basic geometry, behavior
Medium complexity
Applet 8000 lines of code
140KB (compiled)
Data storage, dynamic code
Medium-high complexity
Dynamic content Variable Depends on the number
of hierarchy components

Table 1. Component complexity.

Operation Assessment
Loading applet and plugin Medium speed, 250KB data
Loading and visualizing
object files
Read is local, geometry generation
takes several seconds, acceptable
Manipulation speed Instant, interactive (except when
geometry is generated)
Saving speed High, local

Table 2. Speed characteristics.


We are continuing our work in the direction of visually editing all geometry properties of the VRML language, to enable the manipulation of all components of a virtual environment, without any geometrical constraints, but including the general language constraints as a form of environment knowledge.

However, our current preoccupation is an animation editor for the bone hierarchies, where next to the so far editable properties we want to introduce editing possibilities (widgets) for time, interpolator, boolean type (enabled/disabled) and other types of properties in our specialized editing system.


  1. J. Barrilleaux. 3D User Interfaces with Java3D. Manning, 2000.
  2. E. A. Bier. Skitters and Jacks: Interactive 3D Positioning Tools. Proceedings 1986 ACM Workshop on Interactive 3D Graphics, p.183-196, 1986.
  3. J. Butterworth, A. Davidson, S. Hench and M. Olano. 3DM: A Three Dimensional Modeler Using a Head-Mounted Display. Proceedings of the 1992 Symposium on Interactive Computer Graphics, p.135-138, 1992.
  4. D. Brookshire Conner, Scott S. Snibbe, Kenneth P. Herndon, Daniel C. Robbins, Robert C. Zeleznik and Andries van Dam. Three-dimensional widgets. Computer Graphics (1992 Symposium on Interactive 3D Graphics). 25(2): 183-188, ACM Press, 1992.
  5. J. Döllner and K. Hinrichs. Interactive, Animated 3D Widgets. Proceedings of Computer Graphics International CGI`98. 1998.
  6. M. Nousch and B. Jung. CAD on the World Wide Web: Virtual Assembly of Furniture with BEAVER. VRML '99, Proceedings of the Fourth Symposium on the Virtual Reality Modeling Language. 1999.