WO2001086622A1

WO2001086622A1 - Online presentation system for home pictures and structures

Info

Publication number: WO2001086622A1
Application number: PCT/US2001/015322
Authority: WO
Inventors: Xiangdong Yu; Xiangming Yu
Original assignee: Xiangdong Yu; Xiangming Yu
Priority date: 2000-05-10
Filing date: 2001-05-10
Publication date: 2001-11-15
Also published as: AU2001261470A1

Abstract

A distributed software program allows for creating and providing presentation packages of real properties. It comprises a mechanism for uploading pictures to the servers (112), a sketching program (102) that is stored in servers but can be started from client computers, a mechanism to convert sketching results to presentation and deploy them to appropriate locations, and a mechanism to transmit the presentation packages upon viewer'S requests. The sketching program (102) allows homeowners from various locations to draw diagrams such as floor plans (26), to associate areas in diagrams to pictures and other information of the areas, to compose and save the results back to servers (112) which in turn convert and deploy them. The presentation packages include layout, animation, and navigation code that enable viewers to use graphics-enable network browsers to display a picture box (200), a diagram box (204), and a height bar in a typical setting.

Description

Online Presentation System for Home Pictures and Structures

CROSS-REFERENCE TO RELATED APPLICATION This application claims the benefit of U.S. Provisional Application No. 60/203,353, filed 10 May 2000 by the present inventors, for Online Presentation System for House Pictures and Structures. This application is also related to U.S. Provisional Application Ser. No. 60/190,675, filed 20 March 2000, for Online Cake Design System, by the present inventors, and for which a nonprovisional U.S. Patent Application Ser. No. 09/812,310, was filed on 20 March 2001, and which is herein ' incorporated by reference to the extent relevant.

FIELD OF THE INVENTION The present invention relates to the Real Estate Business and Electronic-Commerce involving realty using computer driven networks. Specifically, the present invention is related to a system that allows homeowners, agents such as realtors, or other users, to present online the houses^* for sale, in the form of structural diagrams such as floor plans, photo pictures for individual parts of the houses, and associations between them so that potential buyers can view the homes online and navigate the photo pictures using the structural diagrams as guides. With this system, the whole procedure, including uploading pictures, drawing diagrams, associating pictures and diagram areas, publishing and viewing the results, can be done online from each user's location.

BACKGROUND: DESCRIPTION OF PRIOR ART The viewing and showing of houses that are on the market are among the major, and more time-consuming, activities of the real estate market, This can be an expensive and time-consuming procedure for both the home buyer as well as the home seller, and often results in dissatisfaction of either the buyer, the seller, or both parties. In recent years the appearance of the Internet has greatly helped to improve the situation because people can list, search and view houses online, enabling potential buyers to screen potential homes to visit, and reducing time spent to travel to homes that might not be of interest. For sellers, this provides an opportunity to expose the property to more buyers, thus may potentially help to achieve a more fair market value. There are numerous real estate websites and other networks (such as the Multilist Service) that store large and up-to-date collections of data on houses on the market. Through the use of the Internet or other communications networks, these listings are made available to real estate organizations, professionals, and potential buyers. The ability to access various real estate sites or networks may vary, because some sources may have restricted access policies. A common problem with most advertisements of residential real estate is that only a frontal picture of the house is presented on these sites by either the realty agents or the home owner. Some sites show . more than one picture for some properties, usually in unorganized lists, which take lot of screen space and do not give viewer enough relation information among the pictures. A recent improvement over this single-picture view has been made through a technology called "Virtual Tour". With this technology, one can get, online, a 360-degree animated rotating view of a scene, such as the outside environment of a house, one or more individual rooms of a house, an entire apartment or the like. This view is sometimes entertaining in addition to being more complete than a single picture. This technology however has the following drawbacks: (a) Although such a tour may be entertaining at the beginning, it is not efficient when a user wants to view a number of house. These tours do not really provide more information then two to four separate pictures taken from different angles, and the transmission of such tours over a communications network can be slow because of the size of the image files being transmitted. (b) The continuous viewing of rotating pictures can and may make many people uncomfortable. If the viewer wants to view the opposite side of the room from the view first presented, he or she has to turn the image 180 degrees. This rotation can be time consuming when done slowly, and some users may become dizzy if the rotation is performed quickly. (c) It requires a trained expert to make a trip to the house to take the 360-degree pictures. If the seller wants to revise the images at a later date, this revision requires an additional trip for each such revision, which can result in delays, as well as additional costs. (d) It does not tell much about the structure (layout) of the house, such as the relative locations and sizes of individual rooms. Tornetta (U.S. Pat. No. 5,032,989) discloses a real estate search and location system and method, which provides information about the properties in textual form. The user enters a geographic area of interest into the system, and as the user narrows the area, symbols representing homes for sale and that are listed in the database are indicated to the user. Hughes (U.S. Pat. No. 5,736,977) discloses a video real estate information service, which can provide a virtual tour of the home using digitized video, and can include a textual description of the property and its surrounding areas. In U.S. Pat. No. 5,754,850 Janssen discloses a real-estate method and apparatus for searching for homes in a search pool, in which the user enters a plurality of search criteria, the system evaluates the criteria according to a ranking system, and displays a specified number of items from within the search pool that match the user's criteria. In U.S. Pat. No. 5,867,155 Williams discloses a large scale distributive video on demand system for the distribution of real estate properties information. Video information, such as a video tour, of the home for sale is entered into a computer database, and digitized audio sound tracks can be included with the video information about the home. The drawbacks of these video based system are, (a) video consumes more network bandwidth than individual pictures, (b) video does not give as detailed layout information as maps and floorplans, and (c) while good for auto playing, video is not good for free navigation. There are a number of commercially available, off-line, Computer Aided Design ("CAD") programs on the market for creating and editing diagrams of houses. One such general purpose CAD program is AUTOCAD (Trademark of Autodesk Inc.), which can be used for numerous drawing functions, and other programs directed specifically for real estate. These programs often require a significant amount of computer resources, and many are stand-alone programs that often lack communication capabilities. Many programs are complicated and expensive for ordinary homeowners or realty agents to use, and thus they are not suitable for use as an online sketching tool for home- selling purposes. There are also a number of online design, painting or sketching programs used for other purposes, such as designing a garden, cakes, artwork and the like.. A drawback of many of these systems is that they are not tailored for use for sketching house structures (layouts, floor plans), mapping pictures, and converting them to presentable webpages. The present inventors have described an easy to use system for the online design of cakes in a related United States Patent Application, (Serial No. 09/812,310, filed 20 March 2001) and in this specification we apply that technology for use with the online display of real estate, which may lead to sales of that real estate. Although the present invention describes the use of the system for displaying of residential real estate, it is to be understood that the present invention can be applied to other forms of real estate as well, such as industrial and commercial realty, it may be used to help rental as well as sale.

BRIEF SUMMARY OF THE INVENTION. In accordance with the present invention, an online presentation system for home pictures and structures comprises one or more network sites, a mechanism for uploading pictures to these sites, a drawing / sketching program for a user with knowledge of the house structure to sketch structural diagrams (such as floor plans) for a number of cross-sections of the home, a mapping function of the program for associating areas in diagrams to appropriate pictures, a conversion program to combine the pictures and diagrams into one or more presentable pages, and a deploying program to send these pages to network sites from which potential buyers can view the pictures using the diagrams as a guide. The home presentation can be viewed in one or more modes. The initial mode allows the user to view the presentation in a package with a small number of pictures to provide a short time for downloading. A presentation in detailed mode includes more pictures. In any mode, in order to conserve screen space, the presentation initially displays only two or more picture boxes and some text. As the viewer navigates through the pictures and areas in pictures, the contents of the picture box switch accordingly. At any point in the navigation, the viewer can request further information, such as a larger picture, video images, virtual tours, or additional text descriptions of the area, or request to upgrade to a more detailed mode, if available.

It is an object of the present invention to provide a system for the online presentation of real property such as houses

Another object of the present invention is to provide a system for online presentation of real property which gives homeowners, real estate agents or other users the flexibility to choose to show whatever parts of the home they prefer, both externally and internally (structurally). Another object of the present invention is to provide a system for online presentation of real property which can be utilized by individuals having little or no experience using computer aided design programs.

Another object of the present invention is to provide a system for online presentation of real property in which the sketching program does not require an explicit installation procedure on a user's computer system, such that once the user has connected to the network, the program can be started directly.

Still another object of the present invention is to provide a system for online presentation of real property in which the homeowner, realtor or other user can eliminate redundant andor unnecessary pictures from the system, thereby conserving network bandwidth and reducing time needed to download and view the images.

Another object of the present invention is to provide a system for online presentation of real property in which the viewer can choose images from a package comprising either a small or a large number of images, such that the viewer can select whether to view a few images in order to facilitate their downloading, and if the property is interesting, the viewer can view additional images.

Still another object of the present invention is to provide a system for online presentation of real property in which the pictures and diagrams needed for the system can be prepared by nonprofessionals, from their own home or place of business, and transmitted through the network.

Yet another object of the present invention is to provide a system for online presentation of real property in which potential buyers can have an intuitive view of the property layout through structural diagrams (maps and floor plans), and the potential buyers can easily navigate the pictures using the structural diagrams as a guide. Areas with corresponding pictures are optionally marked in the diagram being viewed, and a picture is shown in a box beside the diagram whenever the viewer moves the cursor into the corresponding areas.

Yet another object of the present invention is to provide a system for online presentation of real property in which a large amount of information can be displayed through a small screen space one group at a time, therefore providing a possibility of having a few of such presentation side by side in one computer screen, making it easier to compare different properties.

Yet another object of the present invention is to provide a system for online presentation of real property in which navigation of the system can be done intuitively. The system can optionally include a "Direct Navigate" capability, in which the viewer can place the cursor in a picture being viewed, and switch to an appropriate neighboring picture, such that when the cursor is moved in a certain path, such as to the right, the picture, if any, showing the part of the house to the right of the current picture will be switched in.

It is also an object of the present invention to provide a method for the online presentation of real property such as houses

Another object of the present invention is to provide a method for online presentation of real property which gives homeowners, real estate agents or other users the flexibility to choose to show whatever parts of the home they prefer, both externally and internally (structurally).

Another object of the present invention is to provide a method for online presentation of real property which can be utilized by individuals having little or no experience using computer aided drawing programs.

Still another object of the present invention is to provide a method for online presentation of real property in which the homeowner and/or the realtor can eliminate redundant and/or unnecessary pictures from the system, thereby conserving network bandwidth and reducing time needed to download and view the images.

Another object of the present invention is to provide a method for online presentation of real property in which the viewer can choose images from a package comprising either a small or a large number of images, such that, the viewer can view select whether to view a few images in order to facilitate their downloading, and if the property is interesting, the viewer can view additional images.

Still another object of the present invention is to provide a method for online presentation of real property in which the pictures and diagrams needed for the system can be prepared by nonprofessionals, from their own home or place of business, and transmitted through the network.

Yet another object of the present invention is to provide a method for online presentation of real property which potential buyers can easily navigate the pictures using the structural diagrams as a guide. Areas with corresponding pictures are marked in the diagram being viewed, and a picture is shown in a box beside the diagram whenever the viewer moves the cursor into the corresponding areas.

Yet another object of the present invention is to provide a method for online presentation of real property in which navigation of the system can be done intuitively. By inclusion of a "Direct Navigate" capability, the viewer can place the cursor in a picture being viewed, and switch to an appropriate neighboring picture, such that when the cursor is moved in a certain path, such as to the right, the picture, if any, showing the part of the house right of the current picture will be switched in.

The present invention is a software program, preferably but not necessarily a distributed software program, for displaying images and structural diagrams of homes that may run on a computer network, includes a sketching program which may be stored in a server computer and can be started from a client server-side conversion,and communication programs, and a client side viewing program. Homeowners (using Sketcher, or other creation parties) from various locations input, such as by drawing, upload images of the homes, such as floor plans and other descriptions of the property, for viewing over the network by an individual at another location. The Sketcher obtains the drawing program, an applet with a graphic user interface, and enters images of the home onto the server. A conversion program converts the completed images and other data into pages suitable for deployment on the network and viewing by others. The network can be the Internet, World Wide Web, or other communications network. The images include a frontal view of the home, and indicia indicating the level at which the cross-sectional image has been made available. A typical home has an overview map, and three floor plans, but the number is determined by the Sketcher. Potential buyers retrieve floor plans from the servers using a graphics-enabled viewing program and decide whether to take further action regarding a home purchase. The size and number of images the buyer can download can be adjusted to minimize download time and conserve network and computer resources.

BRIEF DESCRIPTION OF THE SEVERAL VIEWS OF THE DRAWINGS Fig 1 shows an overview of the present invention. Fig 2 shows the user interface of the sketching program of the present invention. Fig 3a and Fig 3b illustrate the interface of the viewing program, for viewing and navigating the house online. Fig. 3a illustrates the screen's appearance when the viewer moves the cursor to a height mark to show a cross-sectional diagram corresponding to this height. Fig. 3b illustrates the screen's appearance when the viewer moves the cursor to a marked area in the diagram to display the corresponding picture. Fig. 4 illustrates the operation of the algorithm Marked Area to HTML. Fig. 5 shows the data and code pieces and logic flows among them in the sketch program running on the client side.

DETAILED DESCRIPTION OF THE INVENTION As shown in Fig 1, the system of present invention is based on a computer driven network 100 such as the Internet, or a more recent variation of the Internet called the World Wide Web "(the Web"). Although reference in this specification may be made to the Internet or the Web, it is to be understood that the present invention is not restricted to either or both, and is intended to include other communications networks, such as intranets, extranets, local area networks (LANs"), wide area networks ("WANs"), other .private communications links, using both wired, wireless and satellite technologies and the like. The Internet and the Web comprises a plurality of individual computers which are interconnected with a plurality of server computers 112, 120 using a communications means, such as a telephone network, cable communications network, fibre optic communications, high speed digital subscriber lines ("DSL"), wirelessly or the like. The term Seller (or Sketcher or Homeowner) 130 refers to any other individual who knows enough about a home for sale and is going to create structural diagrams for this home (which can be a house, an apartment or condominium, a building, or other real property, including commercial or industrial property). The Seller or Sketcher may be the same person, or may be one or more persons, but for purposes of the present specification, will be considered to be the same person. Thus, for example only ant not intended as a limitation, Seller may be the actual homeowner whose house is being offered for sale, the realty agent handling the transaction for the Seller, or a service person creating a presentation for them. Although not shown in the Figures, Seller 130 accesses the present invention using either a personal computer at the Seller's location (whether residence, place of business or the like), or other computer workstation or device through which Seller may have access to the network 100. Such a point of access could even include a library, kiosk in a public area, such as a real estate office, hotel or the like. Sketcher starts the Sketch Program 102 on Server Computers 112 in Network 100. Before starting, the Sketch Program 102 may need to be downloaded from Server 112, unless it has been previously downloaded and is still usable. This download step can be, and generally is, implicit, as in the case of a Java (Trademark of Sun Microsystems, Inc. San Rafael, CA) Applet which runs in an Internet browser. Java applets are small computer programs, and are known to those skilled in the art. Examples of Internet browser include Microsoft's Internet Explorer) or Netscape's Communicator programs (Internet Explorer and Netscape Communicator are trademarks of Microsoft Corporation, Redmond, WA, and America On-Line-Time-Warner, respectively). Because the present invention is not restricted to the Internet or the Web, other graphic-enabled programs which are used to connect computers connected to a network can be employed. What the Sketcher 130 sees is that Sketch Program 102 is "starting"; is in contrast to traditional programs that require the explicit step of installation before they can be run. Diagram Resources 104 refers to the icons, images, texture, and colors of house components, and include elements such as, but not limited to, bathrooms, kitchen, windows, doors, stairs, lights, etc. During sketching, Sketcher 130 can freely use the elements of Diagram Resources 104 stored in Server 112. The uploaded pictures, sketched diagrams, and mapping between diagram areas and pictures are also stored in Server 112 as result 114. After the sketching (drawing of the various floor plans and their contents, other images of the home being offered, association of areas and image) is done, Conversion Program 106 converts these drawings (results) 114 into Presentable Pages 118. A Presentable Page 118 represents that the drawing has been converted from the format it was drawn in into a format that will enable that image to be viewed on the network, and any computer code supporting animation and navigation has been embedded in. Thus, a Presentable Page 118 may be in HTML (Hypertext Markup Language) or other language compatible with the network and with script and/or applet support. A Buyer or Viewer 110 or 122 can view and navigate Presentable Pages 118 with View Program 108. View Program 108 is a general purpose platform used to show the various Presentable Pages 118. The View Program 108 can support the graphic and interaction mechanism needed for the presentation package, where the- Structural Navigator 109, can be run.

To reduce the load of Server 112 and for certain business reasons, Presentable Pages 118 can be deployed to other servers in Network 100 by Deploying Program 116. Viewer 110, using the Viewing Program 108 can view pages 118 deployed from other servers on the network.

It is to be understood that the present invention relates to the presentation of real property, other transactions related to the sale of such realty are outside the scope of the present invention, and will not be discussed further. These include transactions such as the establishment of a contract to sell the real property, a contract for the services of a realty agent, broker or the like, or communications between a buyer and seller after viewing the home using the system of the present invention.

Fig 3a. shows a user interface for using both Viewing Program 108 and Structural Navigator 109. The interface comprises a Picture Box 200 and a Diagram Box 204. When a house is first brought up, the Picture Box 200 generally shows a frontal image, which typically is from a _ photograph, of the home, with a Height Bar 202 between this image and Diagram Box 204. Initially, the Diagram Box 204 may be a blank screen, but may include a help icon or message, should the Viewer 110 want assistance, such as, for example only, on how to proceed, or may show an overview diagram that may describe features such as the surroundings of the house. While the Height Bar 202 may comprise Height Marks 206 measured proportional to real object heights, the Height Marks 206 may also indicate the relative heights of specific cross-sections whose diagrams are to be shown. For example, the second floor's height marks is above the first floor's. When the Viewer 110 moves Cursor 210 to a Height Mark 206, the Height Mark 206 will be highlighted and a floor plan that corresponds to the home at this height will appear in Diagram Box 204. If Cursor 210 is moved to the background area (out of all height marks) of Height Bar 202, the initial overview diagram will show. In either case, if the Viewer wants to focus on the then currently visible diagram, he or she can click at the same mouse position. Here "focus" means to have Diagram Box 204 shows the diagram even when mouse moves out of Height Bar 202, thus makes area navigation described below possible. Fig 3b. shows what happens when the Cursor 210 is moved into Diagram Box 204. If Cursor 210 is moved into a marked area of the Diagram Box 204 which is mapped to a picture of the home, that picture will then be shown in Picture Box 200, replacing the image previously displayed. If Cursor 210 is moved into an area of Diagram Box 204 which is not mapped to a picture of the home, Picture Box 200 will either remain unchanged, show some text, or show a gray box, or display other thing that may be indicative of a blank screen.

A Width Bar 212 may be displayed when the homeowner has included vertical cross-sectional views of the home, rather than the more traditional horizontal views used for a floor plan. Such a vertical view can illustrate how the rooms on the various floors of the home are situated. If such vertical sections are used, the width bar displays the relative positions of the vertical cross-sections ' with width markers.

In Figs.3A and 3B, the phantom lines represent the areas where a picture may be associated, where the picture would be shown in Picture Box 200 if the viewer 110 were to move the mouse into those particular areas of the Diagram Box 204. As the cursor is moved over the area, the image shown in Picture Box 200 will change. The changing of the image in Picture Box 200 occurs in the absence of any additional input by Viewer 110, such as in the absence of a signal from an input device such as a mouse or the like. Clicking in this area will lead to a new page showing additional contents, such as a larger picture, a video segment describing the image, a virtual tour, additional descriptive text or the like, and, if the presentation is in a lower mode consisting of smaller amount of material for quicker download, this request may trigger a mode upgrading and additional presentation material will be downloaded before navigation continues. The phantom lines may or may not be shown in the presentation. Fig 2 shows a typical layout of the graphic user interface ("GUI") of Sketch Program 102. Among the elements of the GUI are a Menu Bar 12, an Icon bar 11, and various groups of Controls 20, 22, 28 and 30. The GUI comprises a Sketch Area 26 in which diagrams (such as the floor plans and/or vertical sections) are created and edited. Near Sketch Area 26 is a Cross Sectioner 14. The Sketcher 130 can drag a line 27 in the Cross Sectioner 14 to define the cross section position to which current diagram is to be associated. (In the resulted presentation, this cross-sectional view of the home would be indicated by an appropriate Height Mark 212 along Height Bar 202). While the view of the cross-section of the home is typically horizontal (as in the typical floor plan, described previously), the section can also be a vertical cross-section. The house itself is the background image in Cross Sectioner 14 under line 27. The program also has a Picture List 16. The Sketcher 130 can define a Picture Area 24 in the diagram and find the corresponding picture in Picture List 16 to map them to each other. Alternatively, the Sketcher 130 can select a picture by entering or picking its name from Picture Name Box 18, and the selected picture will be shown in Picture List 16. Since usage of Cross Sectioner 14 and Picture List 16 are exclusive, they can share the same window area to save space. Fig. 2 also illustrates the groups of controls and text/icons that are part of the GUI. Among these elements are a Menu Bar 12, an Icon bar 11, and various groups on Controls 20, 22, 28 and 30.

CONTROL AND TEXT/ICON GROUPS The layout of controls can be quite flexible, below is just one way of organizing them. 1. The Diagram Control Group includes the controls for creating new diagrams, functions such as open, save, close, specifying diagram parameters (such as name), and converting diagrams to various representation formats, etc. One way to place these functions is in reference numeral 12 in Fig. 2. 2. Optional View Group, one way to place these functions is in reference number 10. In Fig. 2, the Sketcher 130 is allowed to examine the diagrams in either a 2-Dimensional ("2D"), 3-Dimensional ("3D"), or Multi-piece view. 3. The Edit Control Group, one way to place these functions is in reference number 20, includes modes such as Select, Line, Area, Text, Component, Marker, and Trace. Each of the controls in these groups must work with the Choices of Operation Group 22 components. The choices in Operation Group 22 change with Edit mode, as described below: 3.1. Select. This mode enables the sketcher 130 to choose the shape(s) in which an area (or the object(s) it indicates) in the image can be selected, including Point, Rectangle, Oval, Polygon, Color (to select an area of the same or similar color), and so on; and operations on the selected area such as Move, Copy, Rotate, Flip, Scale, Stretch, and the like. 3.2. Line. Provides a choices of lines and "hollow shapes", which differ in thickness and style. The Sketcher 130 has the flexibility of choosing the color and style associated to lines. Hollow shapes such as a rectangle, polygon, or oval can be used to represent elements of the home, such as the walls of a room. 3.3. Area. This mode provides a choices of very thick lines and "solid" shapes (such as a filled rectangle, polygon, oval, etc, in contrast to the "hollow"shapes described in the previous paragraph). Different colors and filling patterns can be specified to fill the area of these solid shapes. Solid shape can be used to represent elements of the home such as the areas inside rooms. For example only, and not intended to be a limitation, a light-cyan- filled room means it is a kitchen, a dark-cyan-fill room means bathroom, green-filled area mean grassland, etc. 3.4. Text. Choices of type face and styles. Different colors for -the text can be selected. 3.5. Components. Choices of components constituting a house, selected from Diagram Resource 104, including Doors, Windows, Stairs, Stoves, Built-in Table, Closet, Lights, Fireplace, Sink, Toilet, etc. The appearance of these components can be either a top or side view, depending on how fancy the Sketcher 130 may desire to illustrate the home. In its simplest form, a component can appear in the diagram as a specifically colored area, e.g., dark-cyan-filled room means bathroom, as described in a previous paragraph. 3.6. Marker. The Marker function allows the Sketcher 130 to specify areas shown in Diagram Box 204 that correspond to pictures. These areas can be rectangles, polygons, circles, etc, depending on the choice of the Sketcher 130, and the ability of the final presentable page 118 to accommodate such a shape. For example, if the presentable page 118 will be written using HTML image map and Javascript to trigger events such as, but not limited to, onMouseOver and onMouseOut actions, all three shapes mentioned above can be used. There is similarity between Marker and Select's functions, these two modes can be combined in practice. 3.7 Model. The Model mode allows the Sketcher 130 to specify a model image by entering its reference data such as network location. The model image will be loaded by the sketching program 102 and displayed in Sketch Area 26. Sketcher 130 can then transform it (such as move, scale, flip and the like) and possibly define an area of the model image, then copy it, in whole or in part, into the area and add it into the current diagram. The Sketcher 130 can also enter into a Trace operation in which the Sketcher' s drawings will be placed on an image buffer "over" the model image, so that the drawing result appears to be "floating" over the original. The purpose is to help the Sketcher to draw following a model, like a beginner learning to paint by placing a piece of transparent paper on a picture. To facilitate distinguishing the model from the traced image, the sketching program 102 can switch from showing the model as is, as reversed video, or not showing it at all. After tracing, the resultant lines can be inserted into the current diagram. 1. Session group. Associated to individual mode-operation combinations, such as Line- Thickness 10 and Area-Oval. A common component of the Session group is a help area (icon/text) that provides a brief hint about what controls should be utilized under current circumstance. Other session controls become visible only under the specific circumstances they are applicable. These controls include: 4.1. For Select. Controls for Flip, Rotate, and other operations on the selected region of the drawing. For example, the control for Flip can be a selection list (such as a drop-down menu)including items such as "No Flip", "Vertical", and "Horizontal". The Rotate control can include one or two selection lists for degrees of rotation. Alternatively, these functions can be performed using image buttons rather than drop-down menus. 4.2. For Text. A text field to enter text, or a character picker. 4.3. For Component. Flip and Rotate controls. ₍ 2. Color group 30. This is a color palette. While working with Edit modes, color group 30 has two sections. The top section of the palette contains frequently used sketching colors. The other section of palette 30 covers more colors of the spectrum, for example, the 216 standard colors used for Netscape's web browser. Color is just one kind of "Filling Material". It is possible to fill the drawing, or parts thereof, using elements such as gradient, pattern, texture, etc, as long as the palettes for them are loaded from Diagram Resource 104. 3. Reverse group. This includes functions such as Undo or Redo, for either completed or partially completed operations. It also includes a function to cancel a partial operation. A related group of controls may be arranged in a container, which may have scrollbar(s) if the group is too large. Containers as well as controls can be hidden/removed when not needed. The controls can also be arranged in other manners known to those skilled in the art, such as through the use of drop-down menus, radio buttons and the like.

In addition to the main GUI window shown in Fig 2, other functions are contained within pop- up windows 28 in Sketching Program 102, and include: 1. Help (Information) Boxes. These are windows comprising help information, which can be a fixed set of information, or context sensitive information, using programs which are known to those skilled in the art.. While the Sketching Program 102 is intended to be very intuitive to operate, Help may occasionally be necessary because it is anticipated that most Sketchers 130 are homeowners who would be infrequent users of the program. 2. User Dialog Boxes. These are modal windows to show a warning or other status messages. The User Dialog boxes also allow for the Sketcher 130 to enter text. Such User Dialog boxes are known to those skilled in the art, and may comprise commands such as OK, Cancel, Yes, or No. 3. Component Viewer Window. These windows provide additional convenience to the Sketcher 130 for manipulating the house components in the diagram. The Sketcher 130 can select individual components within the drawing area and modify their parameters.

The functions described above are feasible for use in computer networks using current technology, and are known to those skilled in the art.

Fig. 5 illustrates the operation of the sketching program 102 of the present invention on the client side (after downloaded from a server). The program comprises program components, data, events and control flows. The following details the conversion from sketching results to presentable pages. Given a collections of marked areas and their mapping to pictures, it is quite straightforward for a viewing program to switch pictures based on which area(s) contain the cursor, with certain simple conflict-resolving rule (e.g., areas marked later take priority). A web browser program supporting HTML image mapping and the Javascript functions onMouseOver and onMouseOut is one example of such viewer.

Some viewer programs, such as older versions of web browsers, often do not provide very detailed cursor position information to the sketching program 102. For example, the viewer program 108 may know that the cursor 210 is over an image, but does not know exactly where in the image the cursor 210 is positioned. To keep a diagram as a navigation guide, a single diagram must be split into small pieces, so that from each piece of the diagram one marked area can be identified to the viewing program as being an active image, (i.e., its corresponding picture is shown in Diagram box 204). For images in HTML, the image pieces are made into rectangular shapes (Fig. 4). The rectangular shapes are fit into a table within the program's data register. Some cells in the table may span across rows and/or columns to accommodate larger pieces of the image. Given a collection of rectangular marked areas, the following method is used to generate the table:

Algorithm for Converting Marked Image Areas to an HTML Table 1. Sort in top-down order the x-coordinates of all corner points of the marked areas. The top boundary of the table is in line with the top edge of the diagram. Set variable current_boundary to be the top boundary. 2. Repeat until there are no more x-coordinate below current_boundary 3. Get the x-coordinate closest to current_boundary 4. Create a new row boundary across this x-coordinate , 5. Set variable current_boundary to this new row boundary 6. Continue loop 7. If the lower edge of the image is not in line with any row boundary, add a new row boundary at the position of this edge. 8. Obtain column boundaries in a similar procedure as the above steps, but in a left to right order. 9. Proceed as follows to obtain individual pieces of the diagram and output the structure. 10. Initially mark all cells in the table to be "free", and set current_cell to be the one in upper-left corner of the table. Piece_collection is initialized to be an empty set. 11. Output a starting table tag and row tag. 12. Repeat: ^* 13. Initially set current_piece to include current_cell only 14. Find a top-most area boundary below current_cell and crossing the column current_cell is in. Include into current_piece all the cells above this boundary and in the same column as current_cell. Now current_piece has the shape of a vertical bar. 15. Identify the rectangle in the table whose left edge matches exactly that of the vertical bar, and whose right edge is the right-most one such that no area boundaries are contained inside the rectangle. Set current_piece to be this rectangle. 16. Mark all cells in current_piece "used" and add current_piece to piece_collection. 17. Output a table cell definition tag that has rowspan and colspan set corresponding to the rectangle. 18. Set current_cell to be the most "upper-left" free cell, if any, where the most upper-left means first find the top-most table row that contains free cells, then pick the left-most free cell in this row. 19. If the new current_cell is in a different row than the previous, output an ending row tag and a starting row tag. < 20. Continue loop. 21. Output an ending row tag and table tag. 22. The elements in piece_collection are all the pieces constituting the diagram. Create diagram image pieces based on geometric information stored in piece_collection. These images will be embedded in the appropriate positions in the table. 23. End of the algorithm.

The present invention includes functions sufficient to recognize various versions of viewing programs 108, and this algorithm is activated under appropriate conditions. After the algorithm is employed to convert the marked image to an HTML table, the presentation program proceeds to display the images.

Second Embodiment In the Algorithm for Converting the Marked Image Areas to an HTML Table, all corner points of all image areas are taken into account. An advantage of this first algorithm is that is has preserved all information, and potentially allows one image piece to trigger the display of multiple pictures whose areas cover the cursor position of that image's piece. A disadvantage of the first algorithm is that it can result in having more image pieces than necessary, especially if only one picture is to be displayed.

To solve this problem, this second algorithm removes the corner points that are hidden by the other image areas before the sorting step (step 1 of the Algorithm for Converting the Marked Image to an HTML Table). This second algorithm then modifies the area boundaries to remove any parts hidden by other areas (this may result in zero, one, or more than one line segment from one area edge). Once these steps are performed, the second embodiment follows the same steps as described for the Algorithm for Converting the Marked Image to an HTML Tables. Fig. 5 illustrates the "engine" part of Sketching Program 102, and works as an event-driven system. From Sketcher 130, there are two major event types: Control Events 300 and Draw Events 302, which generally represent events originating from the controls around Sketching Area 26 and those from Sketching Area 26 itself, respectively. Based on the event received from the Sketcher,, Event Handler 304 calls the appropriate subroutines of the present invention to modify the respective data entities and update the images displayed on GUI 314. These subroutines include the session and related routines 306, drawing subroutines 308, recording subroutines 310, and communication subroutines 312. After the sketching hsa been done, data is stored in the data and image buffers 316, and at 318, the updated sketch is sent to the user interface. The control events 300 actuate the various program events 320, which actuate the icons, and other sketching parameters 322, which are also transferred into buffers 316. The drawings are sent, as a refreshed drawing, to the user interface at 324. The core data entities are drawing images itself. The drawing images are represented in a layer-and-object structure. This structure may comprise a number of layers, while each layer may comprise a number of objects, which can be vector-compressed shapes or bitmap images, as known to those skilled in the art. The final image is the result of rendering all of the layers bottom-up. The advantage of objects is that they can be selected and manipulated individually, such as move and rotate. It also helps in identifying which component or home element is picked from the program's Diagram Resources 104. Without using objects, this identification, if necessary, may be achieved by using "Alpha-Channel" (as known to those skilled in the art, a byte used for carrying information in addition to the red, green and blue bytes used for describing a pixel), or by out-of-image comments. In the simplest case, there is only 1 layer of bitmap, and no objects. Bitmaps are stored in image buffers 310. One example of an image buffer is Java's Image class. The major component of an image buffer is a pixel matrix. To support an anti-flickering technique called "double buffering", drawing codes must be made applicable both to "screen" and to image buffers. Image buffers can in turn be drawn to the screen. Objects are maintained in an object list, one for each layer. They are painted to an image buffer in bottom-up order. Each object has a vector or bitmap representation. It has a method called IS_AT. Given a position, this function tells if this position is at this object, and is used to determine if this object is selected by a particular select action. Objects are ordered. To the user's view (i.e., the Sketcher 130 or Buyer 110, one object may be in front of another (i.e., in an upper position). This order is not only used for rendering, but also used in selecting. In rendering, objects in the back are drawn first. In selecting by means of an input device, such as a mouse click, the most front object with IS_AT (clock position) equal to true is selected. By default, a newly introduced object is the most front one in the current layer. More complete information about the data entities handled by the Sketching Program 102 follows, wherein: the following abbreviations are used, "crnt" for Current:, and "prev" for previous. 1. State Data Entities include: crnt_mode prev node crnt_operation prev_operation crnt_color prev_color in_session indicating current session type crnt_layer; prev_layer crnt_object; prev_object; crnt_keyboard_focus; prev_keyboard_focus. Because these terms are known to those skilled in the art, they will not be described further. Other state data, such as crnt_area, crnt_cross_section, crnt_picture, modify flags, reverse video flag in tracing mode, and other state data known to those skilled in the art. 2. Geometric Data Entities include: crnt_x; crnt_y; prev_x; prev_y; data for selected region; degree of rotation; direction of flip; ratio of resize, etc.; Other geometric data. 3. Design Data Entities 310 include: Image buffers. These buffers are used for an on-going session, for a previous session, for model image, for the result of a tracing, and some auxiliary buffers. One buffer may serve multiple purposes to reduce the use of system resources. For example, in a "simple" situation using a minimum of system resources, the buffers may be configured to as to have a master image buffer, a reverse image buffer, and, optionally, a volatile image buffer. The master buffer generally represents the image that is displayed in the sketch area 26 viewed by the sketcher 130. Before a session starts, the contents of the master buffer are copied into the reverse buffer, and all of the subsequent partial drawing occurs with the master buffer. When an Undo command is executed, its reversing action will swap the role of master and reverse buffers. The volatile image buffer is used to draw temporary contents, such as the image cursor, auxiliary lines, and the like, with the master buffer as the background. In this case, the displayed image will be the contents of the volatile buffer. Every time the temporary contents change, the master buffer is copied to the volatile buffer, followed by drawing of the temporary contents, which is in turn followed by rendering of the volatile buffer to the screen. Without the volatile buffer, these temporary contents can be directly rendered to the screen, causing some flickering of the images on the sketcher's viewing screen. Generally, the temporary contents are small, thus having a negligible effect. The volatile buffer can also be used as temporary storage of filtering operations, such as changing color, restrict to a region, or other bit-by-bit image conversions, as known to those skilled in the art.

In its present embodiment, the system has the capacity to perform a single undo step. The addition of more reverse buffers to the system can enable the use of multiple undo steps. In the absence of multiple reverse buffers, the undo steps would have to be implemented in a different manner using recorded actions.

Action recording. This optional feature tracks actions that have happened to the current drawing, and can be used to playback the design. This feature is editable by the sketcher 130, and it may be organized in a list of timely ordered actions, or in a hierarchically grouped objects. Among the parameters recorded include event type, mode, operation, geometric data, etc.

4. Network Data entities, include: Addresses to retrieve real property data; Addresses of storage locations; Other network data.

The Sketcher 130 generates raw input events through an input device such as a pointing device and a text input device. Generally, the pointing device (not shown) is a mouse, but may be an equivalent such as an ACCUPOINT (Registered Trademark, Toshiba America Information Systems), TOUCH-PAD or the like. Generally text input device 206 is a keyboard (not shown), but may include other forms of test input devices, such as commands entered from a touch-screen display, and the like. Event handler 304 processes these events and converts them to abstract input events. For example, when the Sketcher 130 clicks a button corresponding to the Editing mode "String", the raw event of "mouse click at the button" is translated into an abstract event :"Enter Mode String". With this level of abstraction, the design program 102 has flexibility in the layout of the GUI, enabling the GUI to be customized and/or redesigned so that the same "Enter Mode String" event is triggered in some other way, such as, for example only, by a second Sketcher's selection from a list, such as from a drop-down menu. In the program of the present invention, this abstraction is implemented by clearly identifying the code routines which be called upon in each abstract event. Event handler 304 calls these code pieces upon the corresponding raw event(s). The handling of abstract events is described below, and the raw events that typically result in the implementation of the abstract event.

GROUPS OF EVENTS 1. Enter-Mode Events There is one such event for each of the Editing Modes described above. The Sketcher 130 is requesting the Design Program 102 to switch into the mode associated with this event. Enter-Mode events are triggered when the Sketcher 130 clicks one of the buttons in group 20. In response, the sketching program 102 first finishes certain clean-up tasks, if any, from the previous mode. Then the program updates internal variables needed for the switch, and then refreshes (316) the GUI to show the appearance matching the new mode.

Specifically: 1.1 The clean up tasks include finalizing editing done in a prior session (see below); 1.2 Related internal variables include: 1.2.1. crnt_mode; //current mode 1.2.2. prevjmode; //previous mode 1.2.3. crnt_op; //current operation (see below) 1.2.4. prev_op //previous operation (see below) Since operations are connected to modes, mode switching must cause operations switching. When entering into certain modes and/operations, Sketching Area 26 will change, such as showing the Model image, show marked areas, etc. When entering a mode, the operation is switched to the one when exiting from the same mode last time. If it is the first time in this mode, the operation is set to a default one in the group.

Defaults are as follows: Mode Default Operation Select Rectangular area selector Line Thin straight line Area Rectangle Text Times New Roam typeface Component Grassland Trace Enter location of model image Marker Usually combined with Select, and generally has no default of its own. Is a rectangular area if used independently.

Refreshing the GUI usually means showing the triggering control(s) for this mode in proper visual form, such as a pushed down button, and the remaining controls in the group 20 in normal form, i.e., buttons which have not been pushed. The operation group 22 associated to previous mode is removed or hidden from operation container 29, and the operation group associated to current mode is added io or made visible. Similarly, the session control group associated to the operation in previous mode is replaced with that for the operation in current mode.

2. Enter-Operation Events Given mode, there is one such event for each Choice of Operations associated to the mode. The Sketcher 130 is requesting the Sketching Program 102 to switch into the operation associated to this event. They are triggered when the Sketcher 130 clicks the icons in operation group 22 which is held in container 27. In response, the Sketching Program first finishes certain clean up tasks, if any, from the previous operation. The design program then updates internal variables needed for the switch, and refreshes the GUI to show the appearance matching the new operation. Specifically: 2.1 The clean-up tasks include, finalize editing done in previous session (see below); 2.2 Related internal variables include: 2.2.1. crnt_op : //current operation 2.2.2. prev_op; //previous operation 2.3 Refreshing GUI usually means showing the triggering controls) for this operation in proper visual form, such as an icon with a frame, and the remaining controls in group 22 in a normal form, such as un-framed icons. In addition, the session control group associated to the previous operation is replaced with that for the current operation. 3. Pick-Color Events There is one Pick-Color event associated with each color in palette 30. Selection of a Pick- Color event indicates that the Sketcher 130 wants to change the color to be applied in the following drawing Sessions (see below). In certain mode-operation circumstances, a Pick-Color event means to fill all spots in a solid drawing element. Pick-Color events are triggered when the Sketcher 130 clicks on one of the color cells in palette 30. The associated color to the Pick-Color event is the color in the cell which has been clicked on. In response to a Pick-Color event, the Sketching Program 102 first finishes certain clean-up tasks, if any, for a previous color. The Sketching Program then updates internal variables needed for the switch, and refreshes the GUI to show the appearance matching the new color. Specifically: 3.1 The clean-up tasks include finalize editing done in previous Session (se below); 3.2 Related internal variables include: 32.1 crnt_color //current operation 3.2.2. prev_color; //previous operation 3.3 Refreshing GUI means showing the triggering controls) for this operation in proper visual ■"' form, such as a color cell with a frame, and the remainder of the controls in palette 30 in their normal form. As mentioned earlier, in certain situations, Sketching Area 26 will be changed too. 4. Draw Events This feature refers to a group of events that lead to direct changes in the Sketch Box 26. These events are initiated from the Sketcher's action in this area. The Draw Events work in a Session. A Session comprises a single or a sequence of draw events. The result of a session is usually a graphic unit in the design image: a point, a line or trail, a shape, or the like. The result of a session may also be an auxiliary visual action, such as the movement of a graphic entity from one location to another, or other manner of transforming the entity during a session. 4.1 Point-Press Event; Point-Drag Event; Point-Release Event; and Point-Move Event. These are abstract events that are often used together in a session. A Point-Press Event is typically generated when the Sketcher depresses an input device, such as depressing a mouse button, or touching a point in a pressure-sensitive screen. This event includes information such as the coordinates of the pressed point, and the time when the press has occurred.

A Point-Release Event is similar to a Point-Press event, except that the Point-Release event corresponds to the Sketcher's action of lifting the depressed mouse button or removing the finger from the point at which the touch-screen was pressed.

A Point-Drag Event is generated when the Sketcher moves the cursor by moving the pointing device in a "pressed" condition. Such dragging is known to those skilled in the art. One such event is corresponding to a very small step in the move, and carries information such as the coordinates of the starting point and ending point of this step, and its starting or ending time.

A Point-Move Event is the same as a Point-Drag event, except the Point-Move event occurs when the pointing device is in a released (i.e., no button has been depressed) condition.

4.2 Point-Click Event and Point Double-Click Events are "synthetic" events derived from Point-Press and Point-Release. A Point-Click event is generated when a Point-Release event follows a Point-Press event without any event in between. A Double-Point-Click event is generated if two Point-Click events happen within a time period without any event in between. The length of the time period can be set as required. 4.3 A Click Session comprises a Point-Click Event. 4.4 A Double-Click Session comprises a Point-Double-Click Event. 4.5 A Drag Session comprises a Point-Press event, a sequence of Point-Drag Events, and a Point- Release Event. 4.6 A Hop Session comprises a repeated pairs of a Point-Click Event plus a sequence comprising Point-Move, and a terminating Point-Double-Click or Point-Drag Event. 4.7 A Move Session comprises a sequence of Point-Move Events. 4.8 The above five (5) Sessions form the basic set of actions needed to sketch the home's structure comfortably. These sessions require the use of a pointing device with a single button. If the Sketcher's workstation includes a pressure sensitive screen, the Sketcher is only required to employ a single finger. These elements also form the basis for the present invention's advantage of being easy for an individual to learn and to use. 4.9 Transformation Events These Events include such events as Scale Event, Flip Event, Rotate Event, and the like, which cause the size of the image to be scaled up or down, flipped in one direction or another, or rotated any number of degrees, respectively. Each of these transformation events is normally a single- event session. Although the present invention can achieve the same functionality with the basic sessions described in the preceding paragraphs, using a control that is outside of Sketching Area 26 can often be more accurate or easier to use. For example, the Sketcher 130 can enter a number into a text field to indicate the scaling percentage desired; click on an icon in a session control group to instruct the system to flip the image either horizontally or vertically; or select the exact degree to rotate the image from a list, respectively. 4.10 Text Events Address Events: Seller enters a network address into a text field. This may trigger some network action, such as loading data from a network server. For security reason, if this server is different from the server the sketching program starts, the data may have to go into the starting server first which in turn will transmit to the sketching program.. The Seller may also enter the name of an area into the Picture List, enter a description of the room, such as dimensions, or other features of the room components, such as the name of the air conditioning unit, manufacturer of an appliance, or the like. The Text Events are not necessarily part of a session. The Design program handles them by storing the text information in proper variable(s) to be used in later session(s). These events can also be categorized as Control Events instead of Draw Events because they may not directly change the designed image. 4.11 Trace Events These events are related to tracing a model image, and are generally triggered when the Seller presses a corresponding button. A model image buffer is used during tracing to store a model image, if any. A tracing image buffer receives the tracing result. The tracing result can be inserted into the design image, which is stored in a separate design image buffer. The model image can be stored anywhere on the network, and input using any method known to those skilled in the art, providing it can be accessed by the presentation program. Copy-Model Event: This function allows the user to copy part (if a region has been selected) or all of the model image to the tracing buffer. Show Image, Contrast Image, and Hide Image Events: these functions control the display of the model image: Show as is; Show in /contrast (XOR'ed, reverse video); Color, or hide. Clear-Trace Event: Clear tracing buffer. Insert-Trace Event: To insert the traced or copied result into the tracing buffer to design image. Trace Events form single event sessions. 4.12 — Session Below we describe in more detail how a session works in the present invention. Under any given mode-operation circumstance, it is made clear which sessions are expected and what to do in each type of session. Sessions are exclusive, and the system will not expect one session if the system is already engaging in a session. When the first event(s) in a session is received, the system start subroutine, called session_start . It may sometimes take more than one event for the system to determine which session to start. For example, a Point-Press Event may lead to either a Point-Click Event or a Point-Drag Event, so the system cannot determine which session to enter until the next event occurs. A Point-Drag Event can signal a Drag Session, and a Point-Release Event can signal a Click Session. In other situations, one session type may be a precursor of another session type. In the example of a Click Session in contrast to a Double-Click Session, the sketching program can either delay processing of the Click Session for a short period to distinguish it from a Double- Click Session. The system can also make the actions of two sessions compatible, so that the system will accept the effect of a previous click when handling the second click of a Double-Click Session. The subroutine esession_start is passed with the current session type, and any event data such as coordinate(s); text string, etc. If it is a multiple-event session, the sketching program will wait for the coming events. When a new intermediate event is received , a session_update subroutine is called., Depending on the event type, it may be an update_point, update_point_pair, and so on. The event data are passed into these ^■ subroutines. Upon receiving an ending event for the current session, the subroutine_end is called with event data. All drawings in the session are done to an active data structure including image buffer(s) and other variables. For the purposes of Undo, the changes are not immediately merged into a more permanent data structure. That will be done through subroutine session_finalize upon next Enter- Mode, Enter-Operation, Pick-Color, Session Start, and other events that may need the active data structure to take new changes.

5. Reverse Events. UNDO Event: Using this function, the contents of the active data structure are replaced with a set of contents that has been stored in another data structure. In the present invention, the system has memory sufficient to perform a single undo step, although the system's memory can be expanded to include the ability to handle a larger number of undo steps. In an UNDO step, the data swapped away from the active data structure is not discarded immediately, because the data may be needed again in a REDO step. If the next action is not a REDO step, the data swapped away is discarded. REDO Event: This is actuated when the Sketcher 130 wants to go back to the step that was just undone by the UNDO event, and the Sketcher 130 either presses the REDO Button or selects REDO from a menu. If the UNDO step has been done by tracking its history data structure, REDO is done by tracking forward. Such forward and backward movement of in software is known to those skilled in the art. CANCEL Event: This is actuated by depressing the Cancel button, and means to terminate the current session and undo it.

6. PRESENTATION EVENTS OPEN EVENT: This step loads an existing presentation into the active data structure. Existing presentation are stored on the network. While they may likely be stored on the same server from which the program is starting, such presentations may be stored elsewhere on the network, or on another computer or computer system connected to the network. The Sketcher 130 is given a chance to enter its address (i.e., URL or other identifying information) or browse it. SAVE EVENT: This command composes and stores the presentation to the network server(s). While such they most likely are stored on the same server from which the program is starting, such presentation may be stored elsewhere on the network. The Sketcher 130 is given a chance to enter its address (i.e., URL or other identifying information), browse a storage location, or alternatively the system can automatically generate an address. NEW EVENT: create a brand new presentation set. CLEAR EVENTS: clear current diagram or clear the whole presentation. 8. MISCELLANEOUS EVENTS: HELP EVENTS: The Sketcher has a question, and these events are triggered by actuating the HELP button or selecting HELP from a menu. In response to the Sketcher's inquiry, the sketching program can show general help as well as context-sensitive help. COMMUNICATION EVENTS : The Sketcher 130 wants to communicate with the starting server or other network computers, such as making comments or requesting further information. The Address Events described above are also a form of communication event. In response to a communication event, the system of the present invention actuates the network subroutines necessary to complete the task requested by the Sketcher.

In response to the events described above, the sketching program will activate certain subroutines. The implementation of these subroutines depends upon the computer language and software packages used by the system. These subroutines have been used in many existing programs, and are known to those skilled in the art. Except for certain special cases, therefore, these subroutines are listed without further explanation. A. LINES AND SHAPES. These are of various thicknesses and lengths. Lines can be a sequence of straight segments, or of some analytic form, such as Bezier curves. Shapes can be filled with colors, patterns, texture etc. B. IMAGE. Can be rendered as is, filtered or scaled. C. TRANSFORMATION, ROTATE, FLIP, STRETCH. D. TEXT. Can be added to certain locations, with certain fonts, sizes, color, style and the like. E. OBJECT HANDLING, such as select, add, delete, duplicate, move, etc. The result of a session can either be object(s), or change(s) made directly to a "background" image. Objects floating over the background image can be handled independently of the background. The object feature provides flexibility, but requires greater system resources and for the Sketcher to have a higher level of skill. This feature can be eliminated from the program in systems lacking sufficient resources and/or where network bandwidth may be insufficient, because similar effects can be achieved through selecting and manipulating regions.

COMMUNICATION PARAMETERS: 1. READ: System reads a certain type and amount of data from a specific address. 2. WRITE: System writes a certain type and amount of data to a certain address. 3. BROWSE: System browses selected directories in the network.

MISCELLANEOUS: 1. PARSE text file in a certain format. 2. Generate a random number or pick a random entry.

SESSION CHARACTERISTICS: Many actions that occur within the sessions are circumstance specific, and certain sessions, as described previously, may have no effect on the final result, but there are some guidelines that are generally applicable. A Click-Session generally means selecting an object, a location or an area without any modification. If the session employs the "Fill" circumstance, then the selected target will be filled with either the current color (crnt_color) selected from the palette, or another filling material selected from the program's menu. A Double-Click-Session generally triggers a point-oriented action, such as dropping a home component at that location in the sketch. A Drag-Session is used to draw a line (straight or curved), to draw a standard shape or object (rectangle, oval, text, etc.), to move something from place to place within the sketch, to specify an angle and quantity of a transformation, to indicate the direction of a gradient fill, and the like. A Hop-Session is used to draw a line or polygonal shapes. A Hop-Session is especially useful when drawing a fine-tuned target, in comparison to doing so during a Drag-Session. In a Hop- Session, the Sketcher can see the would-be new point of the sketch when the cursor is moving. This new point is not added into the sketch until the next Point-Click, which occurs after the Sketcher is satisfied with the appearance of the sketch. In contrast, in a Drag-Session the entire trail of the cursor is recorded within the sketched image, even if a Drag has been performed by mistake, or includes rough lines drawn by a mouse which has not been moved in a smooth path. A Move-Session is used to show an icon that moves with the cursor; such a session generally has no effect on the sketch. For example, the image of an item within the floor plan can move with the cursor, so that it is clear to the Sketcher where the appropriate location to put that item is in the floor plan. The descriptions of other single event Sessions, such as Horizontal-Flip, Resize-to-Ratio, Rotate-To-Degree, Copy-Model-Image, Hide-Mode-image, Insert-Traced-Result, and the like, are apparent to those skilled in the art based on their nomenclature, and, accordingly, will not be described further. As a session progresses, all actions that occur will be recorded in the system's recording data structure, if this function is turned on.

SESSION ACTIVITIES: 1. In many circumstances, the handling of single event sessions are triggered from related controls outside Sketch Box 26. 2- In Operation Lines in any mode, Handle Drag-Session and Hop-Session. 3. In Operation standard shapes (such as rectangle, oval and others that can be defined by two points) in any mode, Handle Drag-Session. 4. In Operation polygonal shapes (that requires more than two points to define) in any mode, Handle Hop-Session. 5. In Operation Move, Copy, and Gradient Fill in Mode Select, Handle Drag-Session. 6. In Operation (Non-Gradient) Fill in Mode Select. Handle Click-Session. 7. In Operation By-Color in Mode Select, Handle Click-Session. 8. In Mode Text: Handle Drag-Session and Click-Session. Although the Sketcher can click at a location and enter text, the Sketcher can enter text in a separate text field and then drag it into the Sketch Box 26. The text will be resized and relocated as the cursor moves, and be added into the sketch after the session ends. 9. In Mode Component Handle Double-Click-Session and Drag-Session. Different items may have different behaviors in Drag-Session. Some items, such as the size of a door or window, are resizeable, and Drag-Session will define their final size. Other items are not resizeable, and Drag-Session will drop them along a line. To avoid the sketch being overcrowded, the next drop will not be done until it is sufficiently far away from the previous drop. Handle Move-Session. 10. In Operation Address and Move-to-insert in Mode Trace, Handle Drag-Session. For Address, the model image is moved. For Move-to-insert, the traced result is moved.

From what we have presented so far, it should be clear that once set up, how sketching program 102 supports the Sketcher's drawing actions. Next we describe how to set up and initialize the program, how to clean up and terminate it, and how to load and save data. During start up, the sketching program loads certain configuration and interface data from the starting server, including geometric data, icons/images, text strings, addresses, and business data. Ittt initializes to a default design state that is convenient for the user to get started. To start, Mode String and Operation Line X (meaning a line with width X) are actuated. The action recording data structure is initialized to be empty. The necessary image buffers are created. If the Sketcher wants to exit the program, sketching program 102 will so prompt the user, if necessary, with a reminder about saving any unsaved work and related information. Then the sketching program 102 will turn control over to other processes such as furnishing more information to the system about the property being listed.

Server 112 is the source of all functionality because the client side sketching program starts from the server and communicates with server. But as compared to the client side design program described so far, the interface in the server side program to the client is relatively simpler. Server 112 holds a copy of client side sketching program 102 and all the supporting icons, images, configuration files, and so on. In response to sketcher's request to load the program, server 112 sends these data out (possibly acquire unavailable data from other servers before sending). During the drawing stage, the client computer does not have to be connected to the server at all times; the connection needs to be maintained or reestablishing only if the client program 102 requests additional floor plan resources, wants to save their results, or send other messages to the system or other elements of the network. However, the server side of the system does play a role in the overall process. -Diagram resources may come from different providers, and may need to be in a compatible format for use with the present invention. -While it is possible to have a copy of all the required resources in a single server, different realtors may have multiple servers in the network, in order to overcome network reliability problems, to increase marketing visibility, balance server load, etc. The system must coordinate different mirror servers as well. -Several realtors, homeowners, and service providers may share a single server to save cost. The server side program runs on every server involved. In the minimum case, it runs on a single server for a single realtor. In a broader view, it runs on computers distributed all over the network for realtors world wide. The servers can communicate with each other. Different tasks, such as searching, may be handled by the same servers or by different servers. If necessary, a number of master servers can be used to maintain overall pictures of the distributed system, redirect user hits, collect contact data, and carry out other administrative tasks. Each program execution may activate all or part of its modules. The server program contains the following major modules: Resource Manager, Server End Designing Interface, E-Commerce Module, and Administrative Module. The Server End Designing Interface has been described above.

The functions of the other modules are described below. Details of the implementation of these modules will be omitted because an average programmer (one having ordinary skill in the art) would have no difficulty realizing them using existing technologies of the industry.

RESOURCE MANAGER: The Resource Manager stores, organizes and provides presentation resources. There are three types of resource. The first, Type One, comprises 2-dimensional or 3-dimensional representations of physical items, such as walls, doors, kitchen or bathroom fixtures and the like. The second, Type 2, resources, are model images that customers can copy or trace. The third, Type 3, are computer program pieces to support animation and navigation. For type one, the system may maintain information such as manufacturers, model numbers, etc. For type two, the skill levels required for following, tracing, and implementation must be indicated. For type 3, the applicable platforms and situations must be indicated. All types needed to be well categorized to make it easy for users to choose for different purposes. There are several different standard formats for visual representations, such as the GIF and JPG formats used. Resources are organized by categories for easy browsing. They can be searched by key words. The categories and key words can be based on type of room, size of room, room nomenclature of other description. Different resource entities may have different numbers and types of attributes. Their database representations must take a general format that can accommodate all of them, and allow null fields for those with smaller number of attributes. A format field governs the interpretation of the formats. For example, format 102 can mean, integer field 1 contains manufacturer id, integer field 2 contains color id, integer field 3 contains taste id, integer field 4 contains material id, floating number field 1 means width, floating number field 2 means height, and so on. Format 103 can mean, string field 1 contains the address of an image, integer field 1 contains painting style id of the image, and so on. Each entity has a unique ID number, a name, and possibly a version number for internal use.

There can be multiple indexes or category trees based on different criteria mentioned above. Keywords can be associated to category nodes as well as to resource entities. A few auxiliary tables are needed to define materials, color, style, and so on.

Home components can be updated to a new version. Database modification, updates and other system maintenance can be done during certain times when the system may be shut down temporarily. It if is desired to keep the system of the present invention operational all the time, two sets of resource databases can be prepared, with all update work being performed on the duplicate set, and then the sets switched. After it is ready and from a certain time on, all new sketchers are directed to the spare set. The previous set will be detached from the system, after the last Sketcher using it finishes their work. Besides maintaining the resource information database as well as resource visual representations it has, the Resource Manager on each server can also talk to resource managers on other servers to get additional data. Their communication follows certain business and security protocol regarding availability, prices, and so on. The data maintained or collected by Resource Manager can be furnished to sketching program 102 through the Server End Designing Interface described previously.

E-COMMERCE MODULE: This module takes care of -contacts between the potential buyer and a realtor, or directly with the seller isf the seller so desires, within the limits allowed by statute. While it is conceivable that the entire transaction for the sale of real property could be carried out online, such transactions are outside the scope of the present invention, but could be included as part of an electronic commerce module.

ADMINISTRATIVE MODULE: This module administers membership, such as a list of participating realty agents, registration of the seller and buyer, and the like.. It handles customer comments and complaints. It also helps to manage marketing and other business activities, and undertakes system monitoring, backup and replication. Alternative Embodiment: The sketching program can be simplified to reduce size and meet simple needs. On the other hand, the system can be enhanced to be more attractive and more powerful. In the simplest case, the sketching program can only enable drawing of lines and simple shapes, and saving of the result. Thus, if necessary, elements such as 3-dimensional view, Editing Modes Select, Text, Tracing, Highlighter and Assembly could be deleted or their functions reduced. The sketching program can be enhanced. Sound effects could be added, to amuse the sketcher during the drawing process, or to provide audio help during the design procedure. For example, whenever an operation is selected, in addition to showing its meaning only in the form of help text, the sketching program can read it out in a synthesized voice. As long as computer and network capacity permits, the system can incorporate various special graphic user interface behaviors and painting effects, making the sketching procedure more like the real operations of a draftsperson.

Operation of the Present Invention. Sketcher 130 follows these steps to create the home presentation, including pictures, diagrams, text, and mapping. 1. Obtain necessary pictures for presenting the house and its surroundings. This can include photographs, drawings, video or the like, where photos and drawings, possibly downsized version, can be used for showing during navigation, while their large size version, and video clips, virtual tours, etc, can be used for showing when further information is requested. Scan the pictures into a computer, if they are not already in the form of computer files. 2. Name all the rooms, yards, etc, such as Rl, R2, R3, or Ra, Rb, Re, This can include both interior rooms and the area exterior of the house, such as a yard, a deck, patio or the like. 3. Name all the pictures with the names of the corresponding areas (room, yard, as prefix, such as Ra-l, Ra-2, rRl-a, Rl-b. While it is not necessary for Sketcher 130 to follow these conventions, it is preferable to do so. 4. Optionally prepare or obtain simple hand-drawn diagrams of the house, at different cross sections. Collect a copy of the blueprints of the property, if available. Scan the blueprints into a computer, if they are not already in the form of computer files. 5. Optionally mark out in the hand-drawn diagrams the areas corresponding to the pictures, (which will optionally be shown as the phantom lines in Fig. 3.) 6. Connect the Sketcher's computer to a network server where the diagram sketching program of the presents invention is available. 7. Register the house information with a server, if it has not been done previously. (A previously registered home can be updated if desired). .8. Upload the pictures prepared above to a server, where a properly resized copy may be created if necessary. 9. Start sketching program 102. This may include an implicit downloading from server 112, if the program has not already been downloaded to, or is resident on, the Sketcher's computer. • During the download period, server 112 will display to Sketcher 130 information,- such as sketching guidelines, ideas, component resource introduction, advertising for realty related goods or services or the like.. 10. Sketching program 102 is started. The Sketcher 130 can freely activate the various controls (Buttons, Selections, etc) in the graphics interface using an input device, such as with the click of a mouse. The icons associated with the various controls are designed to give the Sketcher 130 hints on what they are for. After a control is triggered, and the Sketcher requests it, a help text (and possibly voice) gives more detailed information on what to do in that situation. Help functions in which live assistance can be obtained over the Internet are known, and are available on numerous e-commerce websites, and can be incorporated into the functions of the present invention.. 11. Following help text or voice, Sketcher 130 initiates drawing, working with Cross Sectioner 14, Picture List 14, Picture Name Box 18, and Sketching Area 26. Using Cross Sectioner 14, Sketcher 130 creates new cross-sectional diagrams, remove unwanted ones, modify their proportional and relative positions, select which diagram to work on. Sketching Area 26 " shows contents of the current diagram, the drawing effects are shown as actions are made. ^• Sketcher can undo step(s) just made, or clear the area and start over. 12. Sketcher 130 can draw lines and shapes of various line width, color, and other attributes, and further can place icons of various components of real property, such as grassland, flowers, door, bath tube, fireplace, etc, into the diagram. It is possible to define an area in current diagram and create an icon on-the-fly from it for applying to other place(s), either kinds of icons can be transformed (move, resize, rotate, etc) before application. 13. For convenience, it is allowed to do color conversion — change all pixels of color A to color B, or change a continuous region of pixels of color A to color B. 14. Sketcher can draw picture as well as enter text information for any part of the house. For example only, the dimensions of a bedroom, the brand name and age of a central air conditioning unit, or the like can be included. Depending on the Text operation, the text can be either visually inserted into diagram, or entered through a dialog box and associated as hidden information which will be shown in a certain area and at a certain time in the final presentable pages. 15. If Sketcher 130 wants to copy or trace a model diagram such as a blueprint or the like, or make a comparison with it, Sketcher 130 may enter into a Trace Mode, where the network address of the model can be entered, and after loading, the model image can be transformed (moved, resized, rotated, etc) if necessary. In this mode, two overlaying planes of diagrams are present, the top plane contains any copy or tracing result, and the bottom plane contains either the model image or the diagram being working on, depending on current operation. What appears in Sketch Area 26 is the combination of the two planes. Sketcher 130 can trace over or (partially) copy the model image, then show the traced or copied result over the working diagram, move to a good position, and do comparison or insertion. To make tracing easier, it is allowed to show the model in "Contrast Image" mode (i.e. reversed video) to distinguish it from current diagram, or hide it completely. A few line widths are selectable for tracing, and a few shapes are selectable for defining copying area. While the Sketcher 130 can probably determine how to do this using the screen icons and help resources, the present invention includes a separate online help document to assist users with these functions. 16. The Sketcher 130 can also mark an area in the diagram, in addition to sketching the house structure. To do this, Sketcher chooses a area shape in Mark Mode, draws an area in the diagram (which is usually a rectangle, but can be any shape), then picks a picture from Picture List 14 or enters a name into Picture Name Box 18. This is repeated for as many areas as desired. The present invention allows the user to have more than one area associated with the same picture. If the final presentable page 118 has more than one picture box, it is also allowed to have one area associated to more than one picture. Sketcher 130 can always select an existing area and change its picture association, or delete the area. 17. After Sketcher 130 thinks that enough have been put into Sketching Area, Sketcher can trigger the Save control to compose and store the presentation set to the server. During the Save step, the sketching program may ask for certain file names to use. By default, diagrams will be named based on their relative positions, such DO, Dl, D2, etc. Usually, one overview (DO) and three cross-sectional views are considered sufficient to depict a normal residential house: a High Diagram ("Dl") for the second floor, a Mid Diagram ("D2") for the first floor, and a Low Diagram ("D3") for the basement. 18. Upon completion, Sketcher 130 can close the sketching program. Once the Sketching Program 102 is closed, Server 112 will run the Conversion Program 106 to organize the pictures into Presentable Pages 118 (including, making sure the images are in a format appropriate for viewing, the necessary interaction and animation code is generated for navigation, etc), and then run Deploying Program 116 to transmit Presentable Pages 118 to an appropriate server 112 on the network 100. 19. Sketcher will optionally receive an email message generated by Server 112 notifying Sketcher 130 of the successful completion of the deployment, or of any failure that may have been encountered. 20. If the Sketcher 130 later wants to do some modification, such as adding or replacing pictures, remapping areas and pictures, correcting errors, etc, the Sketching Program 102 can be launched again to load the previous presentation package for modification. The newly generated presentable pages 118 will then overwrite and replace the previous ones stored on the system.

A Viewer (or Buyer) 110 or 132 follows the following steps to navigate, online, a house whose data has been stored on the network. 1. Using the Buyer's 110 computer, the Buyer 110 directs its graphics-enabled browser to the appropriate network address where the presentable pages 118 are located. Links, advertisements,- directories, etc can be helpful in guiding Viewer to the right houses. 2. When the Buyer 110 has arrived at the "home page" for a particular house, Viewer 110 will see information about the house, such as its location, offering price, size, taxes and the like. Either embedded in this page, or in another page linked to this home page, is Structural Navigator 108 of the house whose data has been created and deployed. 3. Once the Structural Navigator 108 has been loaded, it initially shows a front image (which can be a photograph, a sketch, or any representation) of the whole house in Picture Box 200. Diagram Box 204 may be empty, may contain some instructions for use of the system (Fig. 3), or may show an initial diagram such an overview map of the house and its surroundings. There is a Height Bar 202 between the house image and Diagram Box 204, and the Viewer 110 is instructed to move the cursor 210 -over the Height Bar 202. When actuated by an input means, such as by a mouse move in, the different heights marked along Height Bar 202- trigger the corresponding diagram to be displayed in Diagram Box 204. But when mouse moves out, Diagram Box 204 will switch back to its previous contents. To fix Diagram Box 204 to a diagram in a particular height, Viewer 100 must trigger another "more serious" input event such as mouse click inside the height marker. Triggering in the background of Height Bar 202 (out of all the height markers) means to fix to the initial diagram. In general, the diagram fixed in Diagram Box 204 is said to be the one being focused on. 4. When the presentation is focusing on any particular diagram, Viewer 110 moves cursor 210 into Diagram Box 204. If the cursor 210 is moved into a marked area which has been mapped to a picture, that picture (probably a downsized version) will be shown in Picture Box 200. Otherwise, Picture Box 200 will either remain unchanged or show a sign such as "Bed Room", "Kitchen", etc. As the cursor is moved over the area, the image shown in Picture Box 200 will change. The changing of the image in Picture Box 200 occurs in the absence of any additional input by Viewer 110, such as in the absence of a signal from an input device such as a mouse or the like. 5. Viewer 110 can click in the current area in Diagram Box 204. This means to to view further information, such as a large size or video pictures, a virtual tour, more text descriptions, etc., and, if the presentation is in a lower mode consisting of smaller amount of material for quicker download, this request may trigger a mode upgrading and additional presentation material will be downloaded before continuing navigation. Conclusion, Ramifications, and Scope Thus the present invention can provide users a way to create and view a home presentation in the form ' of structural navigation. The system is deployed in a computer driven network and usable by anyone from anywhere connecting to the network. The present invention has the additional advantages in that 1. It permits Sketcher to make use of diagram resources prepared in the system; 2. It enforces a standard way for online presentation for all homes presented with this system. 3. It would greatly save time and cost of house hunting procedure. 4. It would help to increase exposure between buyers and properties thus achieve more fair deals. It is to be understood that although the present specification may relate to residential real estate transactions, this system can be applicable for use in the commercial and industrial real estate markets. The word House here can mean Apartment, Store, and other real properties, and sale can mean rental also.

While the above description contains many specificities, these should not be construed as limitations on the scope of the invention, but rather as an exemplification of one preferred embodiment thereof. Many other variations are possible. Therefore, although this invention has been described with a certain degree of particularity, it is to be understood that the present disclosure has been made only by way of illustration and that numerous changes in the details of construction and arraignment of elements may be resorted to without departing from the spirit and scope of the invention.

Claims

CLAIMS. We Claim: 1. A method of accessing a plurality of data regarding real property, said data being associated with each other, said method comprising the steps of: (a) displaying a first datum of said data; (b) graphically selecting a location of said first datum, said location being associated to a second datum of said data; (c) displaying said second datum; and (d) designating said second datum as a new first datum of said data; and (e) repeating steps 1(b) through 1(d), inclusive, as long as desired.

2. The method as described in Claim 1, wherein: said step 1(a) comprises a video display terminal, and said step 1(b) comprises designating said location by pointing with a computer input device.

3. The method as described in Claim 2, wherein said step 1(c) further comprises displaying upon said pointing.

4. The method as described in Claim 3, wherein said data is accessed from a computer network.

5. The method as described in Claim 3, wherein each of said plurality of data is chosen from the group consisting of text, a view of said real estate, a photograph, a traced image, a drawn image, or a schematic view of said real estate.

6. The method as described in Claim 5, wherein said schematic view comprises a floor plan.

7. The method as described in Claim 5, wherein one of said plurality of data comprises a height bar.

8. A system for accessing a plurality of data regarding real estate, said data being associated with each other, said system comprising: (a) storage means to store said plurality of data; (b) a video display terminal; (c) first display means to display a first datum of said data on said video display terminal; (d) an input device capable of pointing to a location on said video display terminal; (e) detection means for detecting said location upon occurrence of said pointing; (f) associative means for associating said location with a second datum of said data; and (g) second display means for displaying said second datum on said video display terminal upon said detection.

9. The system as described in Claim 8, wherein said video display terminal comprises first and second windows, wherein said first datum is displayed in said first window and said second datum is displayed in said second window.

10. The system as described in Claim 9, wherein said detection means does not require any movement of said input device other than moving said input device to said location.

11. The system as described in Claim 9, wherein said storage means comprises storage on an interconnected computer network.

12. The system as described in Claim 10, wherein each of said plurality of data is chosen from the group consisting of text, a view of said real estate, a photograph, a traced image, a drawn image, or a schematic view of said real estate.

13. The system as described in Claim 12, wherein said schematic view comprises a floor plan.

14. The method as described in Claim 12, wherein one of said plurality of data comprises a height bar.

15. A method of providing information about real estate through a computer driven network, said information being a set of images of the real estate and textual information about said real estate, said method comprising the steps of: connecting to said network by a viewer using a computer comprising a graphics enabled network browser; directing said browser to said information, said information being stored on said network; transmitting said information to said viewer; navigating said information, said information further comprising different images and different areas from within said different images, said images of said real estate and said textual information about said real estate being associated with each other; and storing said information on one of said computers.

16. A method of providing information about real property through a computer driven network, the information being a set of pictures and text of the real property, and associations between said pictures, text, and areas in said pictures, the method comprising the steps of: storing said information on one or more computers (called servers) in said network, after a viewer connecting to said network from a computer with a graphics-enabled network browser, and directing said browser to a network address of said information, said server(s) responding by transmitting said information to said browser, with said browser supporting viewer action of viewing pictures and text in said browser, navigating through different pictures and different areas in pictures, viewing associated pictures and text while navigating to different points, and requesting further information if desired.

17. The method as described in claim 16, wherein said pictures being chosen from the group , consisting of photographs, drawn images, and schematic views of said real property, its surroundings, and other related objects, wherein said schematic views being chosen from the group consisting of maps, floor plans, and structural diagrams.

18. The method as described in claim 16, wherein said browser being instructed to display said information in steps, with the advantage of consuming less screen space, by initially showing part of said information in two or more picture boxes, and proceeding to show more by switching contents of said picture boxes as navigation going on.

19. The method as described in claim 16, wherein said navigation, comprising of means of changing the picture that is used as a uide and changing the area of focus in said guide, with associated pictures being displayed in said picture boxes, and with the possibility of requesting further information of said area, being able to carried out in a style chosen from the group consisting of automatically by said browser and manually by viewer input device such as by mouse move.

20. The method as described in claim 19, wherein said means of changing the picture that is used as a guide, being chosen from the group consisting of automatically following certain order by said browser, manually by viewer triggering said focused area (such as by a mouse click or the like), and manually by viewer triggering of certain controls or links shown in said browser, wherein said controls or links being chosen from the group consisting of hyperlinks supported in said browser, Back Forword/Go or the like navigation buttons in said browser, and a height bar with height markers, wherein said height bar, being an additional picture box showing a background area and zero or more height marker areas, with said background area indicating the display of an overview map in a picture box and a height marker, being placed according to relative height or proportional height of a floor plan, indicating the display of the corresponding floor plan.

21. A method of creating an information through a computer driven network, the method comprising the steps of: connecting to said network from a computer with an applet-enabled browser, after entering certain information on a real property into appropriate destination, directing said browser to the address of a sketching applet, wherein said applet being a means in form of a computer program being stored in computers (servers) in the network, and being able to be started from any connected computers under certain security convention, with such starting possibly incurring an implicit downloading stage but skipping the installation procedure as required by regular computer software, Uploading pictures to server(s); Using said applet to manipulate picture entries in the set: create new, insert from outside, and remove existing ones; Using said applet to draw/sketch pictures; Using said applet to insert and modify text in the set; Using said applet to insert and modify and real property components (icons) in pictures; Using said applet to define areas in the pictures, and associate areas with pictures and text; Using said applet to transmit (Save) data into server(s) for them to work together to compose, convert and store said data in a form that is usable by the method described in claim 1.

22. The method as described in claim 21, wherein said applet comprising of Cross Sectioner, component icon.

23. The method as described in claim 22, wherein said applet further including capability to import, copy, partial copy, and trace an existing pictures from user specifiable locations in the network.