6FootMedia, a multimedia company

Client:
6FootMedia

Synopsis:

6FootMedia developed a virtual reality player in Flash. The player allows content developers to quickly embed content without any software development.

The size of the player is only 35Kb!

You might also be interested in our product 360 rotational VR, which is also Flash based. MORE INFO>

• Virtual Reality Demo
  This is the VR player with a sample image loaded
• Editing the MAP file
  This screenshot demonstrates the simplicity of creating hotspot areas for the 6FootMedia VR player, outside of Flash. No need for Flash development or coding - completely GUI friendly use.

Other projects for this client:

• 6FootMedia Promo
• 9/11 Comemmoration

6footmedia's Virtual Reality Player
What you are looking at is the result of extensive development of the 6footmedia virtual reality player. Originally developed as a tutorial (view here). The improvements made upon the previous version are as follows:

• Zoom in now is an organic behaviour and automatically detects the center of expansion so that the rest of the bitmap grows OUT of the center point (use the numeric "+" and "-" keys. Make sure the flash player has focus, i.e. if the player is not responding to keyboard commands, click once on any area of the player)
• VR player allows user to load external bitmaps. All the calculations of displacement, rotation of the image, hotspots, etc, is dynamically calculated (click on the "status" button for information about the image loaded in to the player).
• You can freeze the image on screen ("freeze" button) and easily explore the hotspots.
• Code completely rewritten for Flash MX is completely OO compliant and has reusable, recursive functions.
• THIS ENTIRE PLAYERS IS 35K IS SIZE !

MAP file
In order to provide the player with the coordinates of the hotspots, the designer simply creates an HTML page, loads the image, and creates hotspots. The following highlights refer to the screen shot (click on the link "Editing the MAP file" in the yellow box to your left):

• The hotspots (marked as "1") are created using the picture toolbar (marked as "2")
• By double-clicking the link, the "edit hyperlink" dialog box opens up (marked as "3")
• After assigning the hyperlink, the designer clicks on "screenTip" (marked as "4")
• He then types a descriptive text into the ScreenTip box (marked as "5").

The ENTIRE code block, is copy/pasted into a text file which is read into the VR player. The VR player ignores the tags or any other tag (BODY, HTML, etc), and only reads in the MAP tags. This makes it extremely easy to maintain the hotspots using Frontpage or any other editor.

Here is a sample MAP file.

The challenges faced in this development were the following:

• Dynamically Loaded HotSpots for a general idea how we implemented hotspots, view the following source code.
• Drawing a circle The VR player is required to duplicate the circular hotspots which may appear in the MAP file. Sounds pretty simple, doesn't it? Well, flash MX does not provide a circleDraw function, so we had to develop a circledraw function of our own. The source code is here.
• GlobalReplace We needed an optimized search & replace function. We came up with a recursive function, source code available here.
• Zoom In & Out We had to come up with a way to calculate an offset (x,y) after changing the image scale so that the zoom appears to be emanating from the center of the screen. This is a challenge because scaling always occurs from the image handle while the image we are viewing is much larger than the VR viewing window, so it does not scale up/down correctly.