In this project, the 3D rendering window covers only the top half of the entire applet space, and the bottom half of the applet is devoted to the interface. I rendered a top view of the 3D scene in MAX to use as the floorplan image. The slight bit of perspective reveals the locations of doors and windows.

Shout uses Java 1.1 because more recent versions of Java have yet to make it into the standard Web browsers. Java 1.1 provides pitifully weak 2D graphics tools, and I had to be rather creative to fashion even the simple triangular pointer. The applet receives mouse input and moves the pointer to the current cursor position. The arrow keys are used to rotate the pointer. Whatever happens to the 2D pointer is mapped to the camera in the 3D scene. Rotating the pointer rotates the camera heading. The location of the pointer in the 2D pixel space of the floorplan image determines the corresponding position of the camera in the 3D scene. There were a few little tricks, but it was basically as simple as that.

Architectural walk-throughs can be very misleading. In the real world, only about 50 degrees of arc is in focus and the remainder is captured by less discerning peripheral vision. In a 3D rendering, everything is in focus. If you set the camera field-of-view as wide as that of the human eye, you get considerable perspective distortion. If you limit it to 50 degrees or below, the distortion disappears, but you are not sensing the surrounding environment as you would in real life.

There's no solving this problem, at least without immersive headsets, so I decided to at least make the problem clear to the user. The guidelines extending from the pointer indicate the current field-of-view angle, which can be adjusted with the UP and DOWN arrow keys. I also created wireframe grids for the floor and ceiling to clarify the effects of perspective distortion. Check out the effect as you interactively change the field-of-view.

Architecture has its own graphical presentation standards, and I tried to create an appropriately professional "pen and colored pencil" look. This involved the use of vertex colors in MAX to create the color gradients on the walls. I superimposed wireframe versions of the walls, windows and doors on top of the solid versions to create the outlines. This scene building process required lots of experimentation.

The overall concept could easily be expanded to more ambitious contexts with multiple floors and alternative floorplans. I enjoyed this piece because it was a complete synthesis of interactive design, 3D graphics work and Java programming. The whole is more than the sum of the parts.

Next time, we'll look at the most entertaining project in the book – a 3D game.