Web site converter

BACKGROUND OF THE INVENTION

[0001] 1. Field of the Invention

[0002] This invention relates to web site production, and in particular to a method of translating traditional web sites, product information and other types of data into immersive web environments with a spatial visualization of the data in three dimensions.

[0003] 2. Description of the Prior Art

[0004] Typical websites, while graphic rich in content, are typically two-dimensional, that is they do not offer browsers an environment that simulates the real world. A customer interested in a particular class of products may follow the links associated with that class and end up at a page for purchasing a particular product, but this process does not resemble the real world of shopping.

[0005] Three dimensional websites that give the consumer the ability to navigate within a virtual environment exist, but they are extremely time consuming to set up. A typical e-commerce merchant selling goods through an flat established web site which has a transaction engine and fulfillment capabilities would need to completely set up the new website from scratch.

[0006] What is needed is a converter that will allow these merchants to offer a new way to navigate through their stores that is closer to the experience that customers have in real life.

SUMMARY OF THE INVENTION

[0007] The invention permits the automatic creation of a website that simulates a real-world environment.

[0008] According to the present invention there is provided a method of transforming a flat web site comprising a plurality of pages containing items for display, each item being associated with hyperlinks pointing to a target destination, into an immersive web site having a three dimensional virtual environment, comprising crawling said flat website and parsing its content; identifying item links pointing to said items; for each item locating the associated hyperlink pointing to the target destination; associating said located item links with their corresponding hyperlinks to form link pairs; storing said link pairs in memory; processing said link pairs to remove redundant information and validate the associated data; grouping said remaining link pairs into subsets; for each subset creating a virtual room defined as a set of points in a three-dimensional virtual space; identifying display surfaces in said virtual room; and arranging said items on said display surfaces within said virtual space to display said items in a realistic setting while preserving said associated hyperlinks to the target destination.

[0009] Typically the link pairs relate to image files describing items, such as merchandise for display, but other types of files, such as audio, video can be used.

[0010] The items can, for example, be images of articles for sale, although it will of course be understood that they can represent intangible articles or services, such as vacation packages and the like.

[0011] An existing site may have links pointing to specific items for sale, for example, swimsuits. The link will take the potential customer to an image representing the swim suit. This image will be associated with another link taking the potential customer to another page giving more details of the item and providing a mechanism for placing an order. The invention places the first image in the three dimensional virtual space, but when the customer clicks on the image in the 3D space, he or she is taken back to the target destination to obtain more details about the item and/or place an order.

[0012] Generally, the images are placed directly in the virtual space, for example, in display cabinets, although it is possible to render the images themselves into 3D representations, although typically this will not be necessary.

[0013] Using this method, merchants can easily and seamlessly translate their existing web site into an “immersive” Web Store. The generated environment allows spatial representation of a store and its goods. The store managers do not have to maintain two different sites. They can keep maintaining their original web site and the converter can be automated to synchronize with the existing web site. They can also modify generated environments or build brand new ones.

[0014] Existing investment in site infrastructure and development for transaction management and web development are maintained. The Web Site Converter generates an environment that sits on top of the existing web site, leveraging the existing components.

[0015] Additional uses of the invention include the ability to translate other forms of data into “immersive” environments, such as stock market data, static text and information residing in database tables.

[0016] The invention allows the user to change settings regarding how the site is crawled, how the web store is to be built, etc. The user has a choice to run the process with minimal intervention or may choose to exercise control over virtually the entire process or specific parts of the process.

[0017] The information that is extracted from a target web site (or other source) and is converted into a list of image link pairs that will typically be represented as hyperlinked images in the resulting web store. The process may include other media types as well, e.g. audio, video, etc. Various refinements and filtering processes may be applied to the extracted data.

[0018] In a preferred embodiment, a grouping strategy may be applied to the data to automatically separate the image link pairs into departments that will be represented as separate rooms in the resulting web store.

[0019] To create input for the web store builder, a local directory and file structure is constructed, including generated data files. Any necessary files, such as the image files represented in the image link pairs, are retrieved to local storage.

[0020] The invention permits unique, realistic, immersive environments for each of the departments in the web store to be dynamically constructed. The product generates environments that do not have any obvious similarities and are of comparable quality to the traditionally modeled rooms. The web store builder is not in any way restricted to generating rooms strictly for online web stores. It can be used to enhance any hierarchal set of data which would benefit from a three dimensional representation.

[0021] The user can import new building blocks, room shapes and textures to be included in the web store builder. All subsequent web store constructions will have the newly imported items to choose amongst along with all previously imported components.

[0022] The user can easily customize and modify the web store. The options available include the creation/deletion of departments, create/delete/move hyperlinked images, and changing a room's shape. There are also a variety of layout techniques that the user may choose amongst to customize how images and building blocks are chosen and positioned.

[0023] All hyperlinked images are typically distributed throughout the rooms. The user can simply click on an image and the more detailed product information will be loaded from the original web site. In building the 3D site, it is desirable to reproduce the directory structure of the original site on a local computer, and also add an extra directory containing files storing information about the image pairs, for example, the link pairs associated with the items for display.

[0024] The invention also provides a web site converter for transforming a flat web site into an immersive web site having a three dimensional virtual environment, comprising a web site crawler including a parser for parsing said site and generating input data; and a web site builder for analyzing said input data, generating three dimensional rooms defined as a set of points in virtual space, and filling said virtual rooms with items identified by said web site crawler.

[0025] The web site converter will typically generate a VRML file, or other file serving as an input to a rendering engine that creates a representation of the 3D virtual space. A rendering engine is analogous to a web browser in that whereas a web browser takes HTML code and generates a web page for viewing, a rendering engine takes VRML code and generates a representation of the three-dimensional virtual space defined by the VRML code.

BRIEF DESCRIPTION OF THE DRAWINGS

[0026] The invention will now be described in more detail, by way of example only, with reference to the accompanying drawings, in which:

[0027]
FIG. 1 shows the main web crawler algorithm;

[0028]
FIG. 2 shows the parser algorithm;

[0029]
FIG. 3 shows an algorithm for refining the extracted data;

[0030]
FIG. 4 shows the algorithm for grouping the data into department sized subsets;

[0031]
FIG. 5 shows an algorithm for building departments;

[0032]
FIG. 6 shows the main algorithm for building a webstore from the extracted data;

[0033]
FIG. 7 shows a hierarchical representation of web store building blocks;

[0034]
FIG. 8 shows a virtual room building algorithm;

[0035]
FIG. 9 shows an algorithm for building the periphery of a virtual room;

[0036]
FIG. 10 shows an activity diagram for a percentage layout scheme;

[0037]
FIG. 11 shows an algorithm for creating a display case;

[0038]
FIG. 12 is a diagram representing how interior components are laid out;

[0039]
FIG. 13 is an algorithm for the installation of interior components;

[0040]
FIG. 14 is an illustration of a pixel having the largest bounding box;

[0041]
FIG. 15 is an illustration showing the addition of the first interior component;

[0042]
FIG. 16 is an algorithm showing the creation and installation of tables;

[0043]
FIG. 17 is an algorithm for installing tables along exterior walls;

[0044]
FIG. 18 is an algorithm for adding tables around interior components;

[0045]
FIG. 19 is an algorithm for adding tables anywhere; and

[0046]
FIG. 20 illustrates the addition of tables in a floor plan.

DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENTS

[0047] Certain specific terms used herein are defined in the appended glossary.

[0048] As noted above, the invention permits a target flat website to be converted into a full immersive three-dimensional virtual environment. Typically, the target web site will be an e-commerce site, which in accordance with the principles of the invention can be converted into a true three dimensional virtual environment paralleling a real shopping experience, where the user can enter virtual rooms and view virtual items on display just as in a real store.

[0049] The first step is to gather information (and copy files) from a local or remotely stored web site (including distributed web sites) and output data to a local directory for further processing by the web crawler algorithm shown in FIG. 1.

[0050] First, the Web Store Converter application is started and the user starts a new project by entering the URL of a target site to analyze for the Web Store Builder. The new project is initialized; the user may edit project settings. The user then starts the crawl of the target site.

[0051] The Parser Algorithm begins to retrieve and extract image link pairs and other data from the target site. The list of extracted image link pairs is further refined to deal with possible redundant information in the extracted data. This is clarified in the Refine Extracted Data Algorithm.

[0052] The remaining image link pairs are then grouped into department-sized subsets. The grouping sizes are determined by user preferences or may be calculated automatically. The Grouping Algorithm elaborates on this process. After this, a loop is formed to build all the departments, including retrieving valid images and other context information.

[0053] The web store builder process is called with all necessary information passed or made available, i.e. the local directory where the output was generated and a list of department names.

[0054] The first step in the conversion process is to parse the target site one page at a time starting from a user-specified URL. The parser algorithm is shown in FIG. 2. Links are extracted from the first page and additional URLs of HTML pages are recursively retrieved and crawled until no new pages are discovered. Pages are parsed tag by tag and the contents of the tags are examined for patterns representing hyperlinks and image file locations.

[0055] The following description describes one way to parse through an HTML page, but it will be appreciated by one skilled in the art that many other ways can be employed consistent with the principles of this invention. This design is easily extensible to other documents, data storage devices and formats as well; for example, information stored in databases or XML documents could be crawled with only minor modifications. Similarly, although image files are currently retrieved, the process easily allows for other file types such as video, audio, etc. to be identified, retrieved and displayed in the web store.

[0056] A connection is attempted with a remote site using the specified URL. If the connection fails or is redirected the user is notified and prompted for action (connect error). If the connection succeeds the contents of the target page are read into memory. If the page cannot be read the user is notified and a new URL is requested. If the contents of the HTML page have been successfully retrieved then the first/next tag in the HTML text is retrieved. If there are no tags left in the document the next unparsed URL of the site is retrieved and parsed. If no more unparsed pages exist in the target site crawling is complete.

[0057] If a tag is retrieved it is examined to see if it contains an HTML URL (hyperlink) pattern. If it does not the next tag is retrieved. If a hyperlink pattern is detected the links contents are extracted and validated. If validation fails the next tag is retrieved. Link validation occurs as follows:

[0058] a. The prefix is examined to see if it is a relative link. If the link is relative an attempt is made to convert it to an absolute link.

[0059] b. If this link contains a string of characters indicating that it is outside the target site, has already been found, or is a script file, then it is said to contain a link excluder and is discarded.

[0060] If the link passes verification, belongs to the target site domain(s), and has not already been found it is added to the list of remaining links to crawl. It is temporarily stored while the next tag is extracted from the HTML text and examined. A new recursive loop is formed where succeeding tags are examined until one of these conditions is met:

[0061] a. An image link pattern is found.

[0062] b. An end anchor (end link) pattern is found.

[0063] If an image link is found, the link is extracted and validated as described above with the exception that image links are not discarded unless they fail a type check against desired image file extensions or fail to meet minimum width and height restrictions. Furthermore, upon passing validation the image link becomes associated with the hyperlink in temporary storage and forms an ‘image link pair’. If this image link pair is unique and in turn passes further checks, it is stored for further processing along with the URL of the originating page (and possibly other information) for use by the department builder later in the crawling process.

[0064] The Data structure for image link pairs is as follows:

[0065] Element1—{hypertext URL, image URL, context URL}

[0066] Element2—{hypertext URL, image URL, context URL}. . .

[0067] Element n—{hypertext URL, image URL, context URL}

[0068] The first two components form the image link pair while the third represents a context link, which is the URL of the page from which the image link pair was extracted.

[0069] If an end anchor tag is found, the image link fails any checks or the image link pair fails any checks, the process again searches for the next hyperlink.

[0070] When no tags remain in a document the next unchecked HTML page is taken from the list of remaining links to crawl. If a connection cannot be established with the next URL or there is an error reading the remote file the URL is discarded and the next link is processed. This continues until all pages in the list have been parsed.

[0071] The purpose of parsing the site is to extract as much useful information as possible from the target site for the generation of the web store. Filtering redundant information in the data is important because the image link pairs eventually become hyperlinked images in the web store being constructed. Ultimately, only the best images, associated with relevant html links are desired. Data that may be undesirable includes multiple copies of the same image or multiple images in the web store all linked to the same html page when clicked.

[0072] The cases below indicate specific examples of how such information may reside in the data, as well as how it is to be resolved. Three types of image link pairs are found in the data:

[0073] 1. Unique html link unique—image link:

[0074] E.g. www.notvirtual.com/engine.html

[0075] www.notvirtual.com/images/engine.jpg

[0076] 2. Several unique html links associated with the same image link:

[0077] E.g. www.notvirtual.com/news/index.html

[0078] www.notvirtual.com/banner.jpg . . .

[0079] www.notvirtual.com/careers/ottawa.html

[0080] www.notvirtual.com/banner.jpg

[0081] 3. Several instances of the same html link point to multiple image links:

[0082] E.g. www.notvirtual.com/product/index.html

[0083] www.notvirtual.com/rack.gif . . .

[0084] www.notvirtual.com/product/index.html

[0085] www.notvirtual.com/fullview.jpg

[0086] Case 1 are desirable image links and usually require no refinement.

[0087] Resolution Methods for Cases 2/3:

[0088] Prior to crawling the site, the user has the opportunity to set preferences for how to deal with cases 2 and 3 above. Different methods can be applied to html links and image links; however, the order in which resolution methods are applied is significant. Five methods are presented, there are many others. Resolution may include one or a combination of the following:

[0089] a. Simple the first, last or another arbitrarily determined image link pair is saved and the others are discarded.

[0090] b. Save All—all image link pairs are saved resulting in redundant links and/or images in the resulting web store.

[0091] c. Best Image ambiguity may be resolved by pattern recognition algorithms designed to discover the image with the highest probability of being a person, object, scene, etc.

[0092] d. Image properties The pair containing the image with the largest dimensions, highest resolution or another image property may be selected.

[0093] e. Hypertext Properties The pair containing the hypertext link to the deepest page, a specified site name or another hypertext link property may be selected.

[0094] The algorithm shown in FIG. 3 is as follows:

[0095] 1. The image link pairs are first sorted by the HTML URL then by the Image URL. This facilitates extracting groups of Case 2 and Case 3 instances.

[0096] 2. Get the first/next groups of Case 3 instances (these will appear before instances of Case 2). If there are no Case 3 groups left go to step 4 below.

[0097] 3. Apply the selected resolution methods for Case 3 groups. Return to step 2.

[0098] 4. Get the first/next group of Case 2 instances. If there are no Case 2 groups left pass the refined data on to the Grouping Algorithm shown in FIG. 4.

[0099] 5. Apply the selected resolution methods for Case 2 groups. Return to step 4.

[0100] Sorting image link pairs into department-sized groupings is accomplished by several methods. The department size or approximate number of images per room is a key factor and may be user defined, a default value or a calculated ideal range. For each method below a copy of the refined data set is used. Only three methods are described here; many other methods can be employed.

[0101] Context analysis Each image link pair is already associated with the URL of the page from which they were extracted. The first level of grouping is to sort the list of image link data by their originating page or context link. This method is useful for discovering end pages on a target site whose main entry link is a sectional page of related products containing thumbnail images linked to end product pages.

[0102] Steps:

[0103] 1. The list of all image link pairs is sorted by context link.

[0104] 2. This data is temporarily stored for further treatment.

[0105] Path analysis This grouping strategy attempts to partially recreate the file structure of the target site. Files are grouped according to the directories indicated in the URL's path. In example below, the ‘investors.html’ and ‘management.html’ files in the directory ‘section1’ would be grouped together:

[0106] http://www.notvirtual.com/section1/investors.html

[0107] http://www.notvirtual.com/section1/management.html

[0108] http://www.notvirtual.com/section2/engine.html

[0109] http://www.notvirtual.com/section2/subsectionA/browser. html

[0110] Path analysis may be applied to both hyperlinks and image file links. This method is advantageous for discovering traditional web site hierarchies for both departments and subdepartments that are organized by directory structure.

[0111] Steps:

[0112] 1. The list of all image link pairs is duplicated and each is sorted. The first list is sorted by hyperlink directories, the second by image link directories.

[0113] a. The sort is implemented by parsing URLS by ‘/’s and recursively sorting the names of directories.

[0114] b. E.g. in the links above the directory name ‘sectionl’ is retrieved and will group two files together. Two additional groupings of one file are found in the example—‘section2’ and ‘subsectionA’, the latter possibly representing a subdepartment of ‘section2’.

[0115] 2.The two sorted sets are stored temporarily for further treatment.

[0116] File analysis This level of grouping looks at the file names and arguments at the end of a URL and analyzes the syntax of these character strings for useful groupings. File analysis is best applied to hyperlinks rather than image file links. This method is useful for discovering data storage methods in effect at the target site, which are often ordered along product lines. A similar implementation of this method could extend the analysis to include the contents of certain html tags (e.g. title tags).

[0117] Steps:

[0118] 1.The list of html links is used for the sort. The file name and any associated arguments (i.e. the character string from the last ‘/’ to the end of the URL) are extracted.

[0119] This string is added to the rest of the data associated with the image link pair.

[0120] 2. A second pass is made over the data; the list of filenames is scanned for substrings that frequently appear. This occurs by a regular expression search for all character string combinations while maintaining a frequency count for repeating patterns discovered. These substrings are temporarily stored.

[0121] For example, these patterns typically occur in arguments that appear after filenames and represent the names of data structures in effect at a target site using dynamically served pages. For example, most pages in the Victoria's Secret site are similar to:

[0122] http://www2.victoriassecret.com/proddisplay/?prnbr=42-135292&cgname=OSBRPSTRZZZ

[0123] Thus, looking only in the filename substring of the URL:

[0124] ?prnbr=42-135292&cgname=OSBRPSTRZZZ

[0125] The most frequently occurring patterns across the site will be ‘?prnbr=’, ‘&cgname=’ which seem to represent data structures used by their server.

[0126] 3.On a third pass through the data, parsing the filename again, we use the substrings obtained to extract the contents of these arguments, in this case we have: ‘42-135292’ and ‘OSBRPSTRZZZ’ respectively.

[0127] 4. Going back to the original data set we now sort the elements according to these substrings and temporarily store the result set.

[0128] Finding the Ideal Department Size:

[0129] It is desirable in some cases to automatically attempt to find the ideal department size for a web store. Two cases are when a user does not enter a range, or if the range they have entered lies far outside of groupings determined by the best grouping method (determined by rank, below). This calculated range is gauged by finding the mean and standard deviation of sorted data sets. Using the assumption that groupings with a lower variance represent the successful application of a grouping method we set the ideal range as the mean of this set ± one standard deviation.

[0130] Ranking Result Sets:

[0131] For each result set arrived at a rating is calculated. There are various ranking strategies, however, this implementation simply takes number of ideal sized groupings arrived at in the grouping method.

[0132] The highest rating associated with a result set determines which method is used. The generated result set is compared to the user's preferences (if any) to determine if the best fitted data set is significantly different from the user's desired outcome. If no user preferences have been entered all data from the best grouping method is used. The other sets are discarded and the final result set is built into departments.

[0133] Grouping Algorithm (FIG. 4):

[0134] 1. The first/next grouping method is identified and applied to a copy of the data. If all appropriate grouping methods have been applied the best grouping method is determined by rank and the results are passed to the Department Builder Algorithm.

[0135] 2. If there are grouping methods to apply, remaining, the next is chosen and any searches and extractions appropriate to this method are conducted.

[0136] 3 Next the data is sorted as appropriate to the method.

[0137] 4. The ideal department size range is calculated for this method.

[0138] 5.The ranking of this method is determined.

[0139] 6.The results are temporarily stored pending computation of remaining methods. Return to step 1.

[0140] On receiving the grouped image link pair data from the grouping algorithm, a loop is commenced to build the necessary output for each department. This is shown in FIG. 5.

[0141] 1. The first/next group of image link pairs, representing a department, is retrieved. If there are no groups left the output is complete and the Web Store Builder is called.

[0142] 2.If there are remaining department groupings, the Department name is automatically generated or specified by the user. The department directory is created locally.

[0143] 3. The first/next image URL in the group is connected to and the file is attempted to be retrieved to the appropriate local department directory. If there are no image URLs left to process in this group the info.txt file (a data file) for this department is created and the next department group is fetched (step 1).

[0144] 4. If during the image retrieval process something fails, the data for the department is updated to reflect the missing image file and step 3 is attempted with the next image URL.

[0145] Next the output generated above is examined to create an immersive web store. This process is illustrated in FIG. 6.

[0146] The algorithm is as follows:

[0147] The WebStoreConverter creates an instance of the WebStoreBuilder and invokes the buildWebStore( ) method with a list of input directories for each of the web store's departments.

[0148] The WebStoreBuilder then creates an instance of RoomBuilder and issues the buildRoom( ) command for each room in the web store along with the room's input directory as a parameter.

[0149] The RoomBuilder parses the input files for a particular room, chooses the room's shape, installs all the room's building blocks and places the room's product images throughout the room

[0150] Once all rooms have been built, the WebStoreConverter creates an instance of WebStoreWriter and initiates the outputWebStore with the output directory as well as the output format for the three dimensional representation of the webstore.

[0151] The WebStoreWriter simply creates an instance of RoomWriter and for each room in the webstore, calls the outputRoom method.

[0152] The RoomWriter parses through all room building blocks, and based on the output format, generates the appropriate files to be used as input into a rendering engine.

[0153] The NVNWebStoreBuilder is the starting point in the construction of the three-dimensional web store. It is the controller class for the NVNWebStore and is responsible for providing the room builder with the necessary information to both construct the rooms, and insure the proper linking (via doors) between the rooms.

[0154] The NVNRoomBuilder is the controller class for the NVNRoom. It is responsible for the entire construction of the room, the placement of interior items as well as the placement of all images and doors throughout the room.

[0155] The room is made up entirely of building blocks. The building blocks are separated into two groups, those that can contain child building blocks and those, which cannot. FIG. 7 illustrates the classification and available building block types. All preconstructed building blocks have been normalized; therefore, the bounding cube for each component is originally no larger than (1 m×1 m×1 m). This simplifies the positioning and scaling of objects when installed in the room. Building blocks, which can hold picture frames, have what is referred to as display surfaces. The display surface is the portion of the building block that is capable of holding either a standup picture frame or a hanging picture frame. Building blocks, which have display surfaces, are walls, display cases, and tables, all of which are composite. When an image is assigned to a composite building block, it is really the picture frame, which is assigned to it, and the image is part of the picture frame. Images cannot be directly assigned to a composite building block.

[0156] When the room builder instance is created it's initialization involves two stages. The shape of each room is represented by a polygon; all available room shapes (polygons) are read in. All building blocks are read in along with the various texture groupings, which may be rendered on to the component. The building blocks consist of walls, display cases, tables, pillars, wall decals, doors and picture frames.

[0157] The steps for the construction of a room will now be described with reference to FIG. 8.

[0158] Every room will have an input file generated from the web crawler. The input file contains information such as; image/URL mappings, room name, and preferred layout scheme.

[0159] Once the room builder has completed its construction of the room, information will be appended to this file allowing a user to rebuild the room at a later time with the same style and layout as was originally created. If this data is found within the file, then it will be read in as well.

[0160] If the room's style was not specified within the room's input file, the room builder chooses it randomly to make each room unique.

[0161] The first stage is to pick the room shape amongst all room shapes, which have been installed into the room builder.

[0162] The second stage chooses the overall look and feel of the room; otherwise referred to as the style. Every building block available has several groupings of textures, which can be applied onto them. Each grouping has a style associated with it. When a component is selected for installation in a room, the room builder matches the room's style with the component's list of textures and randomly selects among the available textures for that style. For example, if the room's style is “gothic”, then perhaps many of the textures will resemble stone.

[0163] Other room specific details are decided; such as, the room's height, spacing between interior objects (walkway size), range of sizes for images etc.

[0164] The types of doors to be used are also chosen. One type, which is typically larger, connects the room to the parent room, and the second type joins this room to all child rooms (or sub departments). Once again the appropriate texture is selected based on the room's style.

[0165] The peripheral walls are built by iterating through the edges of the polygon representing the room's shape. FIG. 9 illustrates the activity diagram for the process. The component selected during this stage is a simple plain wall with nothing on them. The wall will eventually have sub components installed on them such as wall decals, display cases and framed images; but this will occur during the layout stage.

[0166] The algorithm is as follows:

1For each edge in polygon (in clockwise order) {P1 = start point of edgeP2 = end point of edgeWall width = length of edgeWall height = room heightWall location = center of edge [p1 + (p2 − p1) /2]Wall rotation = angle between edge (p1,p2) and thepositive x axis} // end for each edge in polygon

[0167] The room builder will have several layout methods to choose amongst. Each layout method is the workhorse of the algorithm. This document will cover only one of the layout schemes referred to as the Percentage Layout, which is illustrated in FIG. 10. The percentage method requires three percentages as input. The percentage of images to be placed on interior side of the peripheral walls, on top of tables and in/on interior components.

[0168] The user may select other layout schemes. The schemes available are as follows:

[0169] Percentage Layout

[0170] Maximize usage of peripheral walls

[0171] Maximize usage of floor space

[0172] At this time, the room's peripheral building block list consists only of exterior walls, which are sorted by the space availability of the walls in descending order. Next, doors are continually added to the walls, which have the most space remaining. Should there be insufficient space, the entire room is scaled. The algorithm is as follows:

2NumDoorsRemaining = vecDoors.size( )While (NumDoorsRemaining > 0) {Wall = getWallWithMostSpace( )Door = choose door type (based on whether parentor child door)Scale door based on room style (room height)If (Wall.spaceLeft( ) < door width)// Find wall with min scale factor to fit thedoorScaleFactor =getMinScaleFactorToFitComponent (door)ScaleRoom(scaleFactor)Wall = getWallWithMostSpace( )Assign door to wall's display surfaceNumDoorsRemaining = NumDoorsRemaining − 1} // end While (NumDoorsRemaining > 0)

[0173] Display cases (DC) are used to hold picture frames to be placed on peripheral walls. The display cases (and textures) are chosen randomly amongst the installed cases supporting the room style. The display cases may have multiple display surfaces to hold images (i.e. shelves). Every attempt is made to eliminate empty display surfaces. Once the DC is assigned to the wall with the most free space, frames are assigned to the display surfaces. All display cases can be expanded to hold more picture frames; therefore, occasionally display cases will be scaled rather than building new ones. FIG. 11 illustrates the process for building or expanding a single display case.

[0174] The algorithm is as follows:

3NumImagesRemainingForExtWalls =PrecentImagesForExtWalls * numImagesWhile(NumImagesRemainingForExtWalls > 0) {Wall = getWallWithMostSpace( )If (SpaceLeftOnWall < min.DC size) {ScaleFactor =getMinScaleFactorToFitObjectOnAWall(min.DCsize)scaleRoom(scaleFactor)Wall = getWallWithMostSpace( )}

[0175] Randomly decide whether to add a new display case (DC) or expand an existing DC (if any) on wall.

4If (expand an existing DC)DC = pick a display case on wall to scale/* Display case's widths are expanded bytheir original width which is equal to min.DC size*/Expand DC by the minimum DC sizeElse (choose another DC) {Randomly choose a display case such thatnumberOfDisplaySurfaces <NumImagesForExtWallsRemaining (so that nodisplay surfaces are left empty)Scale DC by min. DC size (Scale width &height by room height)}NumDisplaySurfaces = DC.getNumDisplaySurfaces( )For each DisplaySurface (DS) {NewFrame = randomly select frame amongstavailable framesScale frame to minimum(maxFrameSize,MaxSpaceAvailable)Assign newFrame to DSNumImagesRemainingForExtWalls - -} // end for each display surface} // end while NumImagesRemainingForExtWalls > 0)

[0176] The next stage is to build a grid representing floor space. This is carried out as follows:

[0177] 1. Create a polygon (PFS) representing the floor space in the room. The polygon is the same as the polygon for the room shape except that it is reduced in size by a one-meter perimeter to leave space for any display cases, which are protruding from the walls.

[0178] 2. Create a raster with the same dimensions as the room shape's outer bounding box. The raster is used to represent the available floor space in a grid of 1 m by 1 m pixels. All pixels are initialized to null. Note that since the grid is based on the room shape it will always have a boundary (at least one pixel) surrounding the floor space polygon (PFS)

[0179] 3. Using scan lines set all pixels to null which lie outside the PFS. Once scan line enters inside the PFS, set the pixel's bounding box size to 1×1. Doing so allows the algorithm to identify free floor space by any valid bounding box as shown in FIG. 12. The algorithm is as follows:

5For each row in grid {For each column in grid {bBox = 1×1 bounding box centered at pixelcenterif(bBox liesCompletelyInside(Pfs)) // insidethe roompixel = bBoxelsepixel = null} // end for each col} // end for each row

[0180]
FIG. 13 shows how a single interior component is positioned into the room.

[0181] The algorithm for the installation of interior components consists of the following steps:

[0182] 1. Iterate through the grid, all pixels, which are not null, represent available floor space. Compute the maximum square bounding box which can be centered at the current pixel. For the installation of interior components, the minimum size of the bounding box is 9 m by 9 m. This permits a 3 m walk space around the object, which has a minimum size of 3 m by 3 m. (See FIG. 14)

[0183] The algorithm is as follows:

6For each row in grid {For each column in grid {If( pixel = = null)continuebBox = min bounding box (9×9) centered atcurrent pixel/* Continuously try to scale the bBox evenlyin all directions sothe center remains at the current pixel*/while (bBox liesCompletelyInside(Pfs)) {pixel = bBoxbBox = bBox increased by (2×2) (ie.(9×9) -> (11×11) )} // end while} // end for each col} // end for each row

[0184] 2. Position an internal component within the largest bounding box in the grid. Once the object is installed update the grid by setting occupied pixels to null and updating all bounding boxes which were impacted by the installation. The algorithm is as follows:

7NumImagesRemainingForIntComp = PercentImagesForIntComp* numImagesWhile (numImagesRemainingForIntComp > 0) {Pixel = get pixel with largest bounding boxIf(pixel = = null)// No more space leftscaleFactor = scaleFactorNeededForComponent(minBBox)scaleRoom(scaleFactor)Rebuild the gridcontinueIntComp = randomly choose interior componentScale intComp to 3×3location = center of pixelintComp.setLocation(location)room.add(intComp)setOccupiedPixelsToNull(intComp)For each DisplaySurface (DS) {NewFrame = randomly select frame amongstavailable framesScale frame to minimum(maxFrameSize,MaxSpaceAvailable)Assign newFrame to DSNumImagesRemainingForIntComp - -} // end for each display surface/* Must now update all pixels′ bounding box in thegrid becausemany of them will have been reduced due to theprevious installation. This is similar to step 2*/For each pixel in grid {BBox = pixel.getBBox( )If(pixel = = null)continueif(BBoxliesOutside(listOfInteriorComponents))continuewhile(!bBox.liesOutside(listOfInteriorComponents))bBox = bBox decreased (2×2)pixel = bBox} // end for each pixel in grid} // end of while (numImagesRemainingForIntComp > 0)

[0185] The method of installing the tables is similar to that of the interior components. A minimum bounding box of size (8×7) is created, this permits a walkway space of 3 m surrounding the table, thus the minimum size of a table is (2×1). Tables are scaled in only one direction (width), maintaining a consistent depth of 1 m. The frames, which are placed onto the tables, have a maximum width of 1 m and have at least 0.5 m spacing between images and the edges of the table. Tables hold (width/2) picture frames.

[0186] The process of adding tables will have at most 3 steps as outlined below. Exiting a stage will only occur if there is insufficient space to continue or the number of images remaining is zero. FIG. 16 shows the activity diagram for the process.

[0187] The algorithm is as follows:

8While (numRemainingImagesForTables > 0) {(1) InstallTablesAgainstWalls( )If (numRemainingImagesForTables = = 0)Break(2) InstallTablesAgainstInteriorComponents( )If (numRemainingImagesForTables = = 0)Break(3) InstallTablesAnywhere( )If (numRemainingImagesForTables = = 0)Break// No more space in room for tablesscaleRoom} // end while (numRemainingImagesForTables > 0)

[0188] 1.Installing tables against the exterior walls (See FIG. 17).

[0189] The algorithm is as follows:

9For each exterior wall {bBox = minBBoxForTable( )bBox.translate(center of the wall's width and 1minwards, from wall )bBox.rotate(same rotation value as the wall)NumFramesOnTable = 0While( (bBox lies inside Polygon for floor space(PFS) &&(bBox lies outside all interior components)&&(bBoxWidth - 6(space for walkway) < wallWidth))maxTableBBox = bBoxnumFramesOnTable ++if (numImagesRemainingForTables < =numFramesOnTable)breakbBox = bBox width increased by 2if (numFramesOnTable = = 0 )continuetable = randomly choose a tablescale table to bounding box size - (6×6) // spacereserved for walkwayupdate the grid pixels which contain the tablefor i=0; i<numFramesOnTable; i++)Frame = create a new frameAssign frame to the tableNumImagesRemaining - -}if (NumImagesRemaining = = 0)return} // end for each exterior wall

[0190] 2. Installing tables around interior components' bounding box. (See FIG. 18)

[0191] The algorithm is as follows:

10For each interior componentFor each side of the component bounding box(4sides)bBox = minBBoxForTable( )bBox.translate(center of object's bBox sideand 1m away)bBox.rotate(same rotation value as theobject's bBox side)While( (bBox lies inside Polygon for floorspace (PFS) &&(bBox lies outside all interiorcomponents and tables))maxTableBBox = bBoxnumFramesOnTable ++if(numImagesRemainingForTables<=numFramesOnTable)breakbBox = bBox width increased by 2if (numFramesOnTable = = 0 )continuetable = randomly choose a tablescale table to bounding box size - (6×6)update the grid pixels which contain thetablefor (i=0; i<numFramesOnTable; i++)Frame = create a new frameAssign frame to the tableNumImagesRemaining - -}if (NumImagesRemaining = = 0)return} // end for each side} // end for each interior component

[0192] 3. Installing tables anywhere is similar to the method of installing interior components. Using the grid method, center tables at the pixel whose bounding box is the largest (Refer to FIG. 19).

11While (numFramesRemainingForTables > 0) {Pixel = get pixel with largest bounding boxIf (pixel = = null)// No more space leftreturnlocation = computeLocation (pixel)table.setLocation (location)room.add (table)setOccupiedPixelsToNull (table)/* Must now update the pixel's bounding boxes inthe grid becausemany of them will have been reduced due to theprevious installation.*/For each pixel in gridBBox = pixel.getBBox( )If (pixel = = null)continueif (BBox liesOutside (listOfInteriorComponentsand tables))continuewhile (!bBox.liesOutside (listOfInteriorComponentsand tables))pixel = bBoxbBox = bBox width decreased 2} // end of while (numFramesRemainingForTables > 0)

[0193] Next images are assigned to the frames. The reason this is done after all room components have been created is to permit the control of the location of specific images. Several methods of placing the images are available; however, the default is as follows:

12ImageIndex = 0;For each exterior wallFor each display caseFor each frameFrame.addImage (imageList [imageIndex])Image Index++}For each interiorComponentFor each frameFrame.addImage (imageList [imageIndex])Image Index++}For each tableFor each frameFrame.addImage(imageList [imageIndex])ImageIndex++

[0194] Wall decals add a great deal of realism and uniqueness to the rooms. They consist of running boards, pillars, windows or any other possible enhancement to a wall. The running boards may or may not have both a top and bottom piece; nonetheless, they are scaled to fit the entire exterior wall and the texture is tiled on top of it. The running boards are located in their own reserved space, and no other objects invade this space unless they are part of the same style.

[0195] The pillars are positioned in the center of various wall sections, which are unoccupied. The chosen pillars are part of the same style as the running boards, and are designed to be placed together.

[0196] In order to ensure the room does not have large empty spaces the room builder has a variety of objects which act as fillers for the room. The filler objects include pillars, couches, desks and chairs; they are positioned throughout the room when sufficient space exists. The algorithm for this process is exactly the same as installing interior components described above.

[0197] As mentioned earlier, all interior components have a minimum bounding box of 3 m by 3 m and up until now they have all remained the same size. The room builder randomly chooses some of the interior components to scale (should there be sufficient space). The purpose of scaling the interior components is simply to make the interior components appear more unique, as well as reduce unused floor space.

[0198] The final steps are performed by the web store and room writers. The web store writer creates the root output directory for the web store, and

13For each room in the web store {Create room's output directoryRoomWriter.outputRoom (room)} // end for each room

[0199] The room writer class basically performs the outputComponent method for every component in the room. It functions as follows:

14For each component {Perform all necessary translations and rotations oncomponentCopy all necessary textures to room's outputdirectoryAppend all object information (in appropriate 3dformat) to room's output file.For each subcomponent {OutputComponent (subcomponent)} // end for each subcomponent} // end for each component

[0200] It will thus be appreciated that the invention permits a flat web site to be automatically converted into an immersive virtual environment reminiscent of a real shopping experience.

[0201] Glossary

[0202] Absolute and Relative links—Absolute links are complete URLs in the sense that they contain all information regarding the remote source needed to find that source on the Internet or World Wide Web. For example, http://www.notvirtual.com/index.html specifies exactly the protocol to use ‘http://’, the name of remote machine—‘www.notvirtual.com’ and location of the file on that machine ‘/index.html’. Relative links are abbreviated versions of absolute URLs that can only be interpreted correctly if the context of the link is known. For example, if we are browsing the www.notvirtual.com website and follow the relative link ‘/product.html’ our browser may correctly assume that this html page resides in the root web directory of the www.notvirtual.com machine even though it was not explicitly stated in the hyperlink.

[0203] Bounding box—The smallest rectangle that can completely contain a particular polygon.

[0204] Building block—Every room is constructed completely from small components referred to as building blocks. Building blocks consist of walls, tables, display cabinets, interior components, wall decals and pillars.

[0205] Context link—the URL of an HTML page that contains valid image link pairs. Context links are stored with each image link pair extracted from the page and are used in determining department groupings.

[0206] Department—All web store images extracted by the Web Store Crawler are placed into groups that represent a specific department in the web store. Departments are represented as rooms in the generated web store.

[0207] Display surface—The portion of a building block that can have picture frames placed upon it; for example, a table typically has a single display surface, the table top.

[0208] End anchor—This refers to the closing tag of an HTML hyperlink, specifically ‘</a>’ or ‘</A>’.

[0209] End page—A web page in an e-commerce site representing a particular product. It is characterized by a lack of links going ‘deeper’ into a product area; it typically contains purchasing methods and detailed information regarding the product. End pages are the preferred building blocks of dynamically created web stores.

[0210] HTML Page—An HTML Page belongs to the Target Site. Through a manual navigation inside the web site a user can access to an HTML Page of the site. Some HTML pages contain links to other HTML pages and it is the job of the Web Crawler to identify as many HTML pages as possible.

[0211] File name (of a URL)—The file name of a URL is the character string from the last ‘/’ to the end of the string and typically consists of or contains the name of a file on the remote host. It may also contain arguments used by dynamic processes in effect on the target machine. These arguments are typically preceded by a ‘?’. For example, in the following URLs:

[0212] http://www.notvirtual.com/news/newsletter.html

[0213] http://www2.victoriassecret.com/index.cfm?prnbr=42-136500&cgname=OSDRGLACZZZ

[0214] The respective file names are:

[0215] newsletter.html

[0216] index.cfm?prnbr=42-136500&cgname=OSDRGLACZZZ

[0217] Image—In the context of the application, an Image represents an image from a target site, ideally that a potential customer can buy in the Web Store. The class that represents that concept contains the contents and context information relating to an image file retrieved from the target site. Each Image has a URL that identifies the location of the file on the Internet and a URL that identifies the original web page where the item can be purchased. It also contains methods for retrieving and filtering this information.

[0218] Image link pair—a pair of links extracted from a crawled site that represent a linked image in an HTML page or an image with a close association to an HTML page.

[0219] Interior component—Any object that has display surface(s) available for images to be placed upon, and that lie within the room away from the walls.

[0220] Link excluder—any string of characters that may appear within a hypertext link indicating that it is not a link of interest. Examples include ‘javascript:’ and ‘\cgi-bin’.

[0221] Lobby—The lobby is the main room of the Store. It mainly serves as a way to navigate through the entire store and to access the different departments of the store.

[0222] Peripheral wall—The outermost walls that define the room's shape.

[0223] Pillar—An object that is placed within the room or against a wall. It resembles a load bearing structure and its sole purpose is to add realism to the rooms.

[0224] Points to—A hyperlink or URL points to an HTML page means that when a user clicks on the hyperlink or URL, the browser will attempt to display the HTML page.

[0225] Relative Links—See Absolute and Relative links.

[0226] Room—A room is a three dimensional environment that contains all departmental information like images of the items that a customer can purchase and layout information used to build the corresponding VRML file.

[0227] Running Board—A portion of the wall decal that adds detail to the walls. The running boards are normally positioned either at the top or the bottom of the wall and protrude slightly away from it.

[0228] Settings:

[0229] Preferences are those facts, either supplied by the user or generated through default settings or analysis that details a site-specific rule to be applied to some aspect of crawling that site. For example, on the Victoria's Secret site, a preference may be that relative image links are reconstructed with the Akamai domain prefix rather than the Victoria's Secret default. This may also include settings reflecting how the user configures the application (e.g. skins, or skill UIs).

[0230] Parsing rules are those facts, either supplied by the user or generated through defaults or analysis as to how the targeted site will be parsed. The current implementation is HTML driven however it can be extended to other input types, such as XML, or database driven sites. For example the default implementation parses on a tag-by-tag basis and denotes the beginning of a tag by the ‘<’ symbol and the end of a tag by ‘>’.

[0231] Site name the prefix of an absolute link, including the protocol. For example, http://www.victoriassecret.com, http:// a548.g.akamai.net.

[0232] Tag—Tags are the delimiters of markup functions in HTML. They are used for a variety of purposes from creating hyperlinked text to demarcating the different sections of an HTML document. HTML Tags are typically identified as text occurring between the characters ‘<’ and ‘>’. Many tags apply their function to all elements between it's open and it's close tag. Examples of tags include: <HTML>, <A href=“notvirtual.com”>, </a>.

[0233] Target Site—The root URL of the website which is being converted. The logical website is considered—i.e. it may be remotely or locally stored and need not reside completely within one domain or host.

[0234] UI—User Interface.

[0235] Wall decal—An object used strictly for the visual improvement of a wall.

[0236] Web Store Builder—The second part of the Web Store Converter. The Web Store Builder parses the input files generated by the Web Store Crawler and constructs the output file representing the Web Store in three dimensions. The 3D web store consists a lobby and one room for every department.

[0237] Web Store Converter—The application that generates a virtual web store based on information and files from a target site, user preferences and preset VRML components.

[0238] Web Store Crawler—The first of two parts, which comprise the Web Store Converter. The Web Store Crawler extracts content (files and information) from a target website URL and generates the necessary input for the Web Store Builder.

Web site converter

Information

Publication Number

Date Filed

Date Published

Inventors

CPC

US Classifications

International Classifications

Abstract

Description

Claims