Escher Web-Based Toy
Sampath Jagannathan
Reflections Interactive
Figure 1a: The Escher User Interface. Patterns in the Applet Window (right) are modeled on the 3D object (left) in the Cosmo Player Window.
Figure 1b: Serpinski modeled four times on a tetrahedron. The result is a fractal-like shape.
Figure 1c, 1d: Produced by layering patterns one over the other.
Figure 1e: An offbeat design produced by applying GlassBits whose triangles don’t lie on the plane of the triangles of the teapot.
Escher is a web-based toy for modeling visually interesting designs directly on the geometry of a 3D object. The idea behind Escher is very simple: a 3D object is made of triangles. To model a design on its geometry, you replace its triangles with a pattern. This pattern is not a texture but another collection of triangles. Thus the integrity of the resulting object is maintained while the arrangement of triangles suggests a design to the eye.
Escher is a toy, so it needs to be fun to use, run on modest machines with slow Internet access, and require no special browser or plug-ins (except of course, VRML using CosmoPlayer!). Escher is written in basic Java and uses the External Authoring Interface (EAI) to interact with the VRML world rendered by CosmoPlayer. All the action happens inside Internet Explorer or Netscape Communicator.
When Escher starts up, it greets you with a rotating tetrahedron. You get a subtle cue: the program has loaded and is now waiting for you to explore. You begin by examining what other objects are in store for you by clicking the Choose Mesh box. Now the real fun is in modeling patterns on a 3D object. You can click the Choose Pattern box and find a bunch of patterns ready to use. When you select a pattern, the triangles of your 3D object are instantly replaced by those of this pattern. You like it and proceed to try out the other patterns. But there are a lot of them! Why not create your own pattern from an existing pattern? You select a pattern and edit it with Create Triangle, Move Triangle and Delete Triangle tools. Every minute adjustment you make is faithfully reflected on the 3D object in real time. By now, you have spent a few minutes with the program so your natural instinct is to break it! You create a pattern with loads of triangles; Escher tries to keep up but when finally overloaded it visually refuses to model the pattern.
Figure 1a shows Escher in operation, and Figures 1b through Figure 1e show the kind of designs possible. By successively replacing the triangles of a tetrahedron with the pattern Serpinski (Figure 1a) you can produce a fractal-like shape (Figure 1b). By layering patterns one over the other you can produce complex designs (Figure 1c and Figure 1d). The spiky teapot in Figure 1e was produced by applying GlassBits whose triangles don’t lie on the plane of the triangles of the teapot.
Let’s now look at how Escher can be improved:
- Patterns can be layered but there is no way of editing the layers themselves. I seriously considered adding this, but refrained since it would make the program hard to use for first-time users.
- Allow user-defined patterns to be stored on the server. Thus a library of patterns could be built with patterns contributed by people all over the world.
- Better still. Make Escher multi-user! A group of your friends could decide one afternoon to sculpt a teapot. Each member would model his patterns on a specific portion of the teapot while the rest would happily peck on the other portions and everybody will be able to see what each other is doing!
Personally, I developed Escher to see if it’s truly possible to do real-time 3D on the web and make it accessible to as many people as possible. It seems so, since Escher runs smoothly on PCs, Macs and SGIs with modest connections to the Internet. Three things contributed to this success: VRML, Java and the Web3D RoundUP.
Please find Escher at: http://sjagannathan.tripod.com/escher/escher3d/.
References
- Cooper, Alan. About Face: The Essentials of User Interface Design, IDG Books.
- Glassner, Andrew S. "Geometric Substitutions: A Tutorial," IEEE Computer Graphics and Applications, January 1992.
- Jagannathan, Sampath. "Escher," http://sjagannathan.tripod.com/escher/escher3d.
- Norman, Donald A. The Design of Everyday Things, The MIT Press.
Sampath Jagannathan is a Senior Tools Developer at Reflections Interactive, a leading games developer in Newcastle, United Kingdom. Jagan is interested in developing friendly, intelligent and intuitive tools for CG character animation and visual effects. Other interests include collaborative web browsing and distributed 3D
Senior Tools Developer
Reflections Interactive
Newcastle, United Kingdom
Website
The copyright of articles and images printed remains with the author unless otherwise indicated.