FreshPatents.com Logo
stats FreshPatents Stats
4 views for this patent on FreshPatents.com
2014: 3 views
2013: 1 views
Updated: August 12 2014
newTOP 200 Companies filing patents this week


    Free Services  

  • MONITOR KEYWORDS
  • Enter keywords & we'll notify you when a new patent matches your request (weekly update).

  • ORGANIZER
  • Save & organize patents so you can view them later.

  • RSS rss
  • Create custom RSS feeds. Track keywords without receiving email.

  • ARCHIVE
  • View the last few months of your Keyword emails.

  • COMPANY DIRECTORY
  • Patents sorted by company.

Follow us on Twitter
twitter icon@FreshPatents

Web page hot spots

last patentdownload pdfdownload imgimage previewnext patent


20120297280 patent thumbnailZoom

Web page hot spots


An image map designer creates an image map for use with an image. The image map contains one or more hotspots, each of which specifies a set of pixels which may be non-contiguous and non-polygonal. The image map designer may create the image map using image processing software that facilitates creation of non-contiguous and non-polygonal image maps. Multiple versions of the image map may be created, each for use with a different magnification of the image. The image maps are stored in a compact format, which may be transmitted efficiently from a server to a client. Data contained within the image map facilitates the process of determining whether the client user's mouse pointer is within any of the hotspots, and the process of applying the image map to the image when rendered at different magnifications.
Related Terms: Designer Image Map Processing Software

USPTO Applicaton #: #20120297280 - Class: 715207 (USPTO) - 11/22/12 - Class 715 


view organizer monitor keywords


The Patent Description & Claims data below is from USPTO Patent Application 20120297280, Web page hot spots.

last patentpdficondownload pdfimage previewnext patent

CROSS-REFERENCE TO RELATED APPLICATIONS

This application is a divisional of U.S. patent application Ser. No. 12/504,497, filed on Jul. 16, 2009, entitled, “Improved Web Page Hot Spots,” which is hereby incorporated by reference herein.

BACKGROUND

It is common for software and web sites to present the user with an image, such as a map of the United States, and to allow the user to select a region of the image, such as a particular state, by clicking on the image region. In response, the software or web site may perform an action related to the selected region, such as displaying additional information about the state illustrated by the selected region.

Such functionality is often provided using an “image map,” which defines an outline of each of the regions within the image which may be selected by the user. In the example above, the image map would include, for each state, a set of coordinates defining the vertices of a polygon which form the outline of the state. Each such polygon defines a “hotspot” within the image which may be selected by the user to select the corresponding state. Associated with each hotspot may be instructions defining the action to be taken in response to the user\'s selection of the hotspot. Such instructions may, for example, take the form of a hyperlink to a location containing more information about the corresponding state.

The intent of an image map is to enable multiple regions (hotspots) within a single image to be linkable to different locations (or to trigger other actions) without requiring the image to be divided into separate image files. This simplifies the process of creating user-friendly web pages containing multiple hotspots within a single image.

Existing languages for defining web pages, such as HTML and XHTML, contain mechanisms for implementing image maps in the manner described above. Existing techniques for creating an image map containing multiple hotspots, however, tend to be tedious, time-consuming, and prone to error. For example, it is possible to create an image map by writing the necessary HTML code manually using a text editor, but defining each vertex of each hotspot in an image is a painstaking process. As a result, most image maps which are created by hand-coding tend to consist of hotspots which are simple polygons, such as rectangles and trapezoids, and which therefore may not correspond very accurately to the image regions they are intended to overlap. Consider, for example, attempting to code by hand a hotspot for an irregularly-shaped state such as Florida using only simple polygons.

As a result, software tools exist which facilitate the process of creating image maps by drawing hotspots within them. Although such tools represent an improvement over hand-coding, the process of creating a polygon that forms the precise outline of an irregular shape can still be tedious, time-consuming, and error prone. Creating a large number of such hotspots within a single image can be particularly time-consuming. As a result, users are still often faced with image maps containing hotspots that only roughly correspond to the image regions they are intended to represent.

What is needed, therefore, are improved techniques for implementing hotspots in web pages and in software more generally.

SUMMARY

An image map designer creates an image map for use with an image. The image map contains one or more hotspots, each of which specifies a set of pixels which may be non-contiguous and non-polygonal. The image map designer may create the image map using image processing software that facilitates creation of non-contiguous and non-polygonal image maps. Multiple versions of the image map may be created, each for use with a different magnification of the image. The image maps are stored in a compact format, which may be transmitted efficiently from a server to a client. Data contained within the image map facilitates the process of determining whether the client user\'s mouse pointer is within any of the hotspots, and the process of applying the image map to the image when rendered at different magnifications.

One embodiment of the present invention is directed to a computer-implemented method comprising: (A) receiving a first instruction from a first user to select a first portion of a first digital image, the first digital image comprising a plurality of pixels; (B) in response to the first instruction, selecting a first subset of the plurality of pixels in the first digital image; (C) storing a record of the first subset in an image map collection data structure; (D) transmitting the image map collection data structure and the first digital image to a client; (E) identifying a current location of a user cursor within a rendering of the first digital image at the client; (F) determining whether the current location is within the first subset; and (G) if the current location is within the first subset, taking a first predetermined action associated with the first subset.

Other features and advantages of various aspects and embodiments of the present invention will become apparent from the following description and from the claims.

BRIEF DESCRIPTION OF THE DRAWINGS

FIG. 1 is a dataflow diagram of a system for creating one or more image maps according to one embodiment of the present invention;

FIG. 2 is a flowchart of a method performed by the system of FIG. 1 according to one embodiment of the present invention;

FIG. 3 is a dataflow diagram of a system for generating portion channels and bounding areas for hotspots in image maps according to one embodiment of the present invention;

FIG. 4 is a flowchart of a method performed by the system of FIG. 3 according to one embodiment of the present invention;

FIG. 5 is a dataflow diagram of a system for creating an image map collection data structure according to one embodiment of the present invention;

FIG. 6 is a flowchart of a method performed by the system of FIG. 5 according to one embodiment of the present invention;

FIG. 7 is a dataflow diagram of a system for enabling the use of hotspots by a user according to one embodiment of the present invention; and

FIG. 8 is a flowchart of a method performed by the system of FIG. 7 according to one embodiment of the present invention.

DETAILED DESCRIPTION

Techniques for creating and using image maps according to various embodiments of the present invention will now be described. Referring to FIG. 1, a dataflow diagram is shown of a system 100 for creating one or more image maps according to one embodiment of the present invention. Referring to FIG. 2, a flowchart is shown of a method 200 performed by the system of FIG. 1 according to one embodiment of the present invention.

A user 102, referred to in FIG. 1 as an “image map designer,” provides input 106 selecting one or more portions of an image 104 (FIG. 2, step 202). The image map designer 102 may provide the input 106 in any of a variety of ways. For example, the image map designer 102 may use image processing software, such as Adobe Photoshop, to select one or more portions of the image. Such software includes a variety of tools for selecting portions of an image. Any such tools may be used by the image map designer 102 to select portions of the image 104. For example, the image map designer 102 may use a rectangle selection tool to select a rectangular portion of the image 104, an ellipse selection tool to select an elliptical portion of the image, a color selection tool to select all pixels having a particular color or range of colors, a pixel selection tool to select one or more pixels within the image 104, or a “magic wand” selection tool to select all contiguous pixels having the same color or range of colors starting from the location of the mouse pointer.

As the “magic wand” example illustrates, the image map designer 102 may select a portion of the image 104 representing an object within the image without specifying the shape of the object. For example, if the image 104 contains a sofa, the image map designer 102 may click on a pixel within the sofa using the “magic wand” tool, thereby causing the portion selector 108 to select some or all of the pixels representing the sofa, but without requiring the designer 102 to draw a polygon representing the outline of the sofa, or to otherwise specify the outline of the sofa. Such techniques may greatly simplify the process of selecting objects within the image 104 having complex shapes and thereby greatly simplify the process of creating hotspots for such objects.

This method of selecting the portion(s) is shown in FIG. 1, in which the image map designer 102 provides portion selection input(s) 106 to a portion selector 108, in response to which the portion selector 108 outputs one or more image portion selection data structures 110 representing the selected image portion(s) (FIG. 2, step 204). The portion selector 108 may, for example, be part of standard image processing software as described above. The image portion selection data structure(s) 110 may take any form, such as data structures internal to the portion selector 108.

Furthermore, the set of pixels corresponding to a particular image portion may be represented within the corresponding image portion data structure in any of a variety of ways. For example, a set of image portion pixels may be represented within the image portion selections 110 as a list or array of pixels, which may be compressed or uncompressed.

The image map designer 102 may select the image portion(s) in other ways, such as by issuing text-based commands, or by writing code defining the image portion(s). Any of the techniques described above for selecting the image portion(s) may be combined with each other and with other techniques.

As the examples just provided indicate, there may be any of a variety of relationships between the input 106 provided by the image map designer 102 and the resulting image portion selections 110, as a result of various types of processing which the portion selector 108 may apply to the designer\'s input 106 to produce the image portion selections 110. For example, the designer\'s input 106 may specify the coordinates of a polygon, in response to which the portion selector 108 may generate portion selections 110 representing the set of pixels within the specified polygon. As another example, the designer\'s input 106 may directly specify one or more of the pixels to be contained within the image portion selections 110.

Note that a single “portion” of the image need not consist solely of a contiguous region within the image 104. Rather, the term “portion” as used herein may refer to any subset, whether contiguous or non-contiguous, of the image 104. For example, if the image 104 is a rasterized image, a single “portion” of the image 104 selected by the image map designer 102 may consist of any subset of the pixels within the image, whether or not such pixels are contiguous.

The image 104 may be any kind of image stored in any format. For example, it may be a rasterized image stored in a format such as JPEG or GIF, or a vectorized image. Each pixel in the image 104 may have any number of bits. The portion selector 108 may process the image 104 in its existing format, or may convert the image 104 into other formats to facilitate processing.

As stated above, the image portion selection(s) 110 may include representations of one or more portions of the image 104. Each such portion may be used to create a distinct hotspot within the image 104 when the image 104 is displayed by a web browser within a web page or by other software. One example of a method for creating such hotspots from the image portion selections 110 will now be described.

In the following example, a separate image map is created for each of multiple magnifications of the image 104. This is not, however, a requirement of the present invention. Rather, for example, a single image map for a single magnification (e.g., a magnification of 1.0) of the image 104 may be created.

The system 100 includes an image map collection creator 112, which creates a collection of image maps, one for each desired magnification, for use with the image 104 based on the image portion selections 110. Assume for purposes of example that the image map designer 102 desires to create image maps for each of M different magnifications. The designer 102 may indicate this to the image map collection creator 112 by, for example, providing a list of the magnifications desired by the user (e.g., 0.5, 1.0, and 1.5) or in other ways. As another example, the image map collection creator 112 may apply a set of default magnifications representing commonly-needed magnifications for use with standard display sizes.

The image map collection creator 112 creates an empty image map collection data structure 114 (FIG. 2, step 206) enters a loop over each magnification mn, where 0≧n>M (FIG. 2, step 208). For example, if the three desired magnifications are 0.5, 1.0, and 1.5, then M=3, m0=0.5, m1=1.0, and m2=1.5.

For the current magnification mn, an image map magnifier 116 scales all of the portions 110 by a factor of mn to produce scaled versions of all of the portions 110 (step 210). The image map collection creator 112 uses the scaled portions to produce a scaled image map 118 containing the scaled portions (step 212). The image map collection creator 112 adds the scaled image map 118 to the image map collection 114 (step 214). The image map collection creator 112 repeats steps 210-214 for the remaining magnifications (step 216). The result is that the image map collection 114 contains M image maps, each of which is scaled according to the corresponding value of mn.

The techniques disclosed above with respect to FIGS. 1 and 2 may be implemented in a variety of ways, examples of which will now be described. It was described above that the portion selector 108 may be used to create the image portion selections 110 based on the designer\'s input 106. More specifically, when the designer 102 selects a portion of the image 104, the portion selector 108 may create a masking layer within the image 104 which consists of the same pixels as those selected by the designer 102, but in a particular easily-identifiable color, such as red. The portion selector 108 may display the masking layer on top of the image 104 to clearly identify to the designer 102 which portions of the image 104 have already been selected. The portion selector 108 may display the masking layers for all portions 110 simultaneously so that the designer 102 does not re-select any portions which were selected previously.

The masking layers and other “layers” described herein may be implemented using image layers already supported by image processing software such as Adobe Photoshop, but this is not a requirement of the present invention. Rather, such layers may be implemented in other ways which are independent of such image processing software. Furthermore, the “layers” described herein may be implemented using any data structure suitable for representing a set of selected pixels, not only those data structures characterized as image “layers.”

For example, if the mask information is represented as layers, they may be saved within the image file 104 itself. As a result, the image file 104 may contain both the original image and the image portion selections 110, in the form of the mask layers. In such a case, the image 104 and image portion selections 110 may both be implemented within a single layered image file. Alternatively, however, the image 104 may be stored in an image file which does not include the image portion selections 110, which may be stored in a separate file, files, or other data structure(s).

The image map collection creator 112 may be triggered manually or automatically. For example, the image map collection creation process represented by steps 206-216 in FIG. 2 may be performed automatically once the image portion selections 110 are created. Alternatively, for example, the image map designer 102 or other user may instruct the image map collection creator 112 to create the image map collection based on the image 104 and the image portion selections 110. For example, if the image 104 and image portion selections 110 are stored within a single layered image file, the designer 102 or other user may use a file selection dialog box or other means to point the image map collection creator to the saved layered image file, in response to which the image map collection creator 112 may create the image map collection 114 using the techniques disclosed above. The user may also provide other input to the image map collection creator 112 at this stage, such as the desired magnification(s), and the filename and path in which to store the image map collection data structure 114.

It was stated above that the image map collection creator 112 received the image 104 as input. The image map collection creator 112 may include an image converter 120, which converts the image 104 from its original format (e.g., Adobe Photoshop) to an image 122 stored in the final format (e.g., JPEG or GIF) in which it is intended to be viewed (FIG. 2, step 218). Note, however, that this conversion is optional; the image 104 may instead be retained in its original format for viewing.

Additional processing may be performed on each of the image maps in the image map collection. Such processing may, for example, be performed in the manner illustrated by the dataflow diagram of FIG. 3 and the corresponding flowchart of FIG. 4. For ease of illustration, FIG. 3 shows only those portions of the image map collection creator 112 which are relevant to the method 400 illustrated in FIG. 4. Those having ordinary skill in the art will appreciate how to combine the teachings of FIGS. 1 and 2 with the teachings of FIGS. 3 and 4. In particular, FIGS. 3 and 4 only illustrate processing that may be performed for a single magnification. The same techniques may be applied to all desired magnifications.

The image map magnifier 116 scales the selected image portions 110 to produce scaled portions 126, as described above with respect to FIGS. 1 and 2 (FIG. 4, step 210). The image map magnifier 116 also scales the converted image 122 to produce a scaled image 124 (step 402).

If a single layered image file is used to store both the image 104 and the image portion selections 110, the scaling (magnification) process described above with respect to step 210 of FIG. 2 may be performed by scaling all layers of the layered image file. Software such as Adobe Photoshop can perform such scaling on all layers of a layered image file automatically upon instruction. As a result, if the layered image file is stored in Adobe Photoshop format, the image map collection creator 112 may perform step 210 by instructing Adobe Photoshop to scale all layers of the layered image file, including the layers representing the selected image portions 110.

The image map collection creator 112 then enters a loop over each selected portion P (e.g., each layer of the layered image file) (step 404). A portion channel creator 302 creates a “portion channel” 306 corresponding to portion P which has the same width and height as the scaled image 124, but in which the pixels in the portion P are active and in which all other pixels are inactive (step 406).

The portion channel 306 may be implemented in any of a variety of ways, such as by using an alpha channel in Adobe Photoshop within an image separate from the converted image 122, in which pixels with a maximum value (e.g., a value of 255 in the case of 8-bit pixels) play the role of active pixels, and in which pixels with a minimum value (e.g., 0) play the role of inactive pixels. The image map collection creator 112 may apply a threshold filter to the portion channel to force the portion channel to contain only pixels with the applicable minimum and maximum value, such as a filter with a threshold value of 128 (assuming 8-bit pixels) (step 408). Note, however, that step 408 is optional and need not be applied in cases where it is not necessary, such as in cases in which the pixels in the portion channel merely defines pixels as “active” or “inactive,” without intermediary values.

The image map collection creator 112 converts the portion channel to a RAW file or other file in which header information has been eliminated (step 410). The dimensions of the image stored in the RAW file may be equal to the dimensions of the corresponding boundary area. The image map collection creator 112 may store the resulting portion channel 306 within the scaled image map 118 along with a link between the portion channel 306 and corresponding scaled portion P 126.

A bounding area creator 304 creates a bounding area data structure 308 defining a bounding area around scaled portion P 126 (step 412). The bounding area data structure 308 may, for example, define a rectangular bounding area defining the smallest rectangle which contains all pixels within scaled portion P 126. The image map collection creator 112 may store the bounding area data structure 308 within the scaled image map 118 along with a link between the bounding area 308 and the corresponding scaled portion P 126. When using Adobe Photoshop, for example, the bounding area data structure 308 may be created by selecting all of the pixels within the portion channel 306, which may be implemented as an Adobe Photoshop alpha channel, and cropping the alpha channel to the smallest rectangle which contains all of the active pixels within the portion channel.

The image map collection creator 112 repeats steps 406-412 for the remaining scaled portions P, thereby creating portion channels and bounding areas for each of the scaled portions P (step 414).



Download full PDF for full patent description/claims.

Advertise on FreshPatents.com - Rates & Info


You can also Monitor Keywords and Search for tracking patents relating to this Web page hot spots patent application.
###
monitor keywords



Keyword Monitor How KEYWORD MONITOR works... a FREE service from FreshPatents
1. Sign up (takes 30 seconds). 2. Fill in the keywords to be monitored.
3. Each week you receive an email with patent applications related to your keywords.  
Start now! - Receive info on patent apps like Web page hot spots or other areas of interest.
###


Previous Patent Application:
Method and apparatus for providing supplemental video content for third party websites
Next Patent Application:
Document analysis, commenting, and reporting system
Industry Class:
Data processing: presentation processing of document
Thank you for viewing the Web page hot spots patent info.
- - - Apple patents, Boeing patents, Google patents, IBM patents, Jabil patents, Coca Cola patents, Motorola patents

Results in 0.5216 seconds


Other interesting Freshpatents.com categories:
Computers:  Graphics I/O Processors Dyn. Storage Static Storage Printers

###

Data source: patent applications published in the public domain by the United States Patent and Trademark Office (USPTO). Information published here is for research/educational purposes only. FreshPatents is not affiliated with the USPTO, assignee companies, inventors, law firms or other assignees. Patent applications, documents and images may contain trademarks of the respective companies/authors. FreshPatents is not responsible for the accuracy, validity or otherwise contents of these public document patent application filings. When possible a complete PDF is provided, however, in some cases the presented document/images is an abstract or sampling of the full patent application for display purposes. FreshPatents.com Terms/Support
-g2--0.775
     SHARE
  
           

FreshNews promo


stats Patent Info
Application #
US 20120297280 A1
Publish Date
11/22/2012
Document #
13564255
File Date
08/01/2012
USPTO Class
715207
Other USPTO Classes
715205
International Class
06F17/00
Drawings
9


Designer
Image Map
Processing Software


Follow us on Twitter
twitter icon@FreshPatents