Digital Image Magnification For Internet Appliance
A magnifying tool that enlarges a selected region of displayed image surrounding a cursor in a graphical user interface (GUI), and superimposes the enlarged region directly over the selected region (and a portion of the adjacent non-selected region). The location of the cursor relative to the enlarged region is co-located with the location of the cursor relative to the selected region such that the locations are identical.
Latest VIACLIX, INC. Patents:
This invention relates to graphical user interfaces. More particularly, the present invention relates to a method for dynamically magnifying a moveable selected region of a digital image within a graphical user interface.
BACKGROUND OF THE INVENTIONWhen viewing images displayed on a television screen by an Internet appliance, it is often desirable to view a portion of that image in a magnified format in order to discern small details that are lost by the typically poor resolution found on television screens. For example, Chinese characters often include small details such as lines separated by small distances that are impossible to discern at typical television screen resolution. To discern which character is displayed; the character must be magnified enough to discern these small details.
A problem with the magnification tool taught by Soohoo is that Soohoo fails to display a cursor or other pointing device in floating window 122, and fails to teach or suggest a method for selecting (clicking on) interface elements, e.g. a hyperlink, located in floating window 122. It would be desirable to have a method for using the pointing device interactively with interface elements shown in floating window 122. Additionally, reading horizontal text is difficult when the width of floating window 122 is less than the display screen width. It would be preferable to have a window extending the width of the display screen to maximize the horizontal area, thereby maximizing the readability of text appearing in the floating window.
A problem with the magnification tool shown in
What is needed is a magnification tool that facilitates the interaction with interface elements, such as push buttons, text entry boxes, and hyperlinks, while minimizing the amount of required screen space and maintaining context, thereby optimizing the magnification tool for Internet appliances.
SUMMARY OF THE INVENTIONThe present invention is directed to a magnification tool optimized for an Internet appliance in that it magnifies a selected region of an original background image, and inserts the magnified image between the original background image and a cursor such that the (unmagnified) cursor is displayed on the magnified image. The display area taken up by the magnified image is smaller than that of the original background image, thereby enabling the original background image to show around the top and/or bottom of the magnified image which maintains context between the magnified image and the original background image as the cursor is moved about the display screen. As the cursor is moved, the magnified image is changed such that a point located on the magnified image below the cursor matches a corresponding point located on the original background image (i.e., the cursor is co-located relative to corresponding points on both the normal-sized selected region of the original background image and the magnified image). Accordingly, when a user locates the cursor over an interface element, e.g. a magnified hyperlink, displayed in the magnified image, the cursor is also located over the same interface element in the original background image (which is covered by the magnified image), thereby facilitating convenient identification and selection of closely spaced or hard to read interface elements. An interface element is a portion of the graphical user interface (GUI) with which a user can interact. This magnified image is displayed as an overlay surface. An overlay surface is a picture that is not part of the original background image that is displayed on the display screen. The overlay surface, while being visible on the display screen, does not change the operation of a GUI with respect to the cursor and the original background image is not changed. As a result, the interface elements of the original background image under the cursor continue to respond to mouse clicks. In other words, the user appears to be mousing over and interacting with a magnified image because of the overlay of the magnified image in front of the original background image but behind the cursor. However, in reality, the mouse clicks are activating the interface elements in the original background image. Thus, the magnification tool of the present invention can be easily incorporated into the GUI with minimal disruption because the magnification tool simply inserts the magnified image between the cursor and the original background image.
These and other features, aspects and advantages of the present invention will become better understood with regard to the following description, appended claims, and accompanying drawings, where:
As described in additional detail below, original background image 310, magnified image 320, and cursor 330 are superimposed over each other to form a composite image shown on display 300 according to known techniques. Original background image 310 includes “normal” (i.e., unmagnified) text 325 (or other indicia or graphics), which in the present example includes the text “LINK 1”, “LINK 2”, “LINK 3”, and “LINK 4”. Note that text “LINK 3” and “LINK 4” are masked by a portion of magnified image 320, which is indicated by shadow block type. In this embodiment, text “LINK 3” and “LINK 4” are not visible through magnified image 320 and are therefore shown in shadow block type only for clarity. Magnified image 320 includes enlarged (magnified) text 335 (i.e., a portion of text “LINK 3” and all of text “LINK 4”) that is read from a portion of the image data associated with a selected region 315 of original background image 310. Note that the image data associated with selected region 315 is magnified using known techniques such that magnified image 320 covers the entire width of display 300, but only covers a fraction of the height of display 300 such that portions 310A and 3103 of original background image 310 are shown above and/or below magnified image 320. Accordingly, the magnification tool allows a user to maintain the context of magnified image 320 relative to the position of the corresponding magnified text in original background image 310.
According to another aspect of the present invention, cursor position data, which is typically utilized by a GUI to position cursor 330 on display 300, is also used to determine the position and content of magnified image 320. Specifically, cursor 330 is positioned by a user via an input device (e.g., a mouse or trackball) to a desired cursor position 331. Cursor position data stored in the video memory of the Internet appliance indicates cursor position 331 at a given time. According to the present invention, the cursor position data indicating cursor position 331 is utilized to position according to the formulations provided below such that a point on magnified image 320 coincides with a point on original background image 310, which in turn coincides with cursor position 331. By modifying magnified image 320 such that the points coincide with cursor position 331, a user is able to utilize the magnification tool of the present invention to precisely position cursor 330 over selected regions of original background image 310 that they are enlarged (magnified) for easy identification. As a result, if selected region 315 includes interface elements such as hyperlinks, then those interface elements are visible to be selected (clicked upon) within magnified region 320. These features are explained further below.
In one embodiment, magnified region 320 is defined as a block transfer (BLT) from the data displayed within selected region 315. Thus, selected region 315 is duplicated exactly into the overlay surface portion of the video memory, having the same shape and size. During display of the overlay surface, a transformation is performed to expand the duplicated portion of selected region 315 such that magnified region 320 is generated on display 300. One such transformation is described below with respect to
In another embodiment, magnified region 320 is defined as an expanded transfer (called a stretch BLT) from the data displayed at selected region 315. Thus, selected region 315 is duplicated and transformed into the overlay surface portion of the video memory. The transformation is such that the rendering of magnified region 320 is stored in the video memory, making the region stored in the overlay surface portion of the video memory larger than that of selected region 315. During display, the overlay surface is displayed directly as magnified region 320 on display 300 without further transformation.
Magnified image 520 extends the width of display 500 to maximize readability of magnified text. Other embodiments extend magnified image 520 only to the edge of the safe display region of a television set to further increase readability on some displays. A safe display region is that portion of a display that is guaranteed to be visible. Magnified image 520 contains the magnified contents of selected region 515. The size of selected region 515 is determined by both the relative position of cursor 530 to the edges of original background image 510 and the amount of magnification desired.
Cursor 530 is positioned with an X axis value equal to XC and a Y axis value equal to YC. That is, cursor 530 points at the coordinate (XC, YC). The position of cursor 530 (XC, YC) is a known value, e.g. cursor position 331 of
As shown in
With respect to the display coordinate system, magnified image 520 is positioned with an X axis value equal to the left-most edge of original background image 510, or XM1=XB1. As previously mentioned, the height of overlay surface 520 is equal to ΔY2. The height of magnified image 520 is centered around cursor position 531 of cursor 530. Therefore, magnified image 520 has a upper left corner Y axis value YM1 equal to the Y axis value of the cursor less half the height of magnified image 520, or YC−0.5*ΔY2. As a result, magnified image 520 has a left-most upper point at (XM1, YM1)=(XB1, YC−0.5*ΔY2).
To determine the X axis location (XA1) of selected region 515, the relative position of the cursor (XC) with respect to the X axis value of the left-most portion of selected region 515 (XA1) is determined. In other words, the X axis value of the left-most portion of selected region 515, XA1, is equal to the X axis value of cursor 530 (XC) less the distance between the X axis value of the cursor (XC) and the left-most portion of selected region 515 (XA1), or ΔX4. Therefore:
XA1=XC−ΔX4 Equation 1.
The relative position of cursor 530 to the contents of selected region 515 is equal to the relative position of cursor 530 to the contents of magnified image 520. Thus, the relative position of cursor 530 with respect to the X axis value of the left-most portion of selected region 515 (ΔX4) to the width of selected region 515 (ΔX3) is equal to the relative position of cursor 530 with respect to the X axis value of the left-most portion of magnified region 520 (ΔX1) to the width of magnified region 520 (ΔX2). In other words:
Because ΔX1 is equal to the relative position of the cursor (XC) with respect to the X axis value of the left-most portion of magnified region 520 (XM1), or ΔX1=XC−XM1, Equation 3 becomes:
As a result, combining Equation 1 with Equation 4 results in the X axis value of the left-most portion of selected region 515 as:
To determine the Y axis location (YA1) of selected region 515, the relative position of cursor 530 (XC) with respect to the Y axis value of the upper-most portion of selected region 515 (YA1) is determined. In other words, the Y axis value of the upper-most portion of selected region 515, YA1, is equal to the Y axis value of cursor 530 (YC) less the distance between the Y axis value of the cursor (YC) and the upper most-portion of selected region 515 (YA1), or ΔY4. Therefore:
YA1=YC−AY4 Equation 6.
The relative position of cursor 530 to the contents of selected region 515 is equal to the relative position of cursor 530 to the contents of magnified image 520. Thus, the relative position of cursor 530 with respect to the Y axis value of the upper-most portion of selected region 515 (ΔY4) to the height of selected region 515 (ΔY3) is equal to the relative position of cursor 530 with respect to the Y axis value of the upper-most portion of magnified region 520 (ΔY1) to the height of magnified region 520 (ΔY2). In other words:
Because ΔY1 is equal to the relative position of the cursor (YC) with respect to the Y axis value of the upper-most portion of selected region 515 (YB1), Equation 3 becomes:
As a result, combining Equation 6 with Equation 9 results in the Y axis value of the bottom-most portion of selected region 515 as:
Therefore, selected region 515 has a left-most upper-most point at
Although the present invention has been described with respect to certain specific embodiments, it will be clear to those skilled in the art that the inventive features of the present invention are applicable to other embodiments as well, all of which are intended to fall within the scope of the present invention. For example, in one embodiment, the unmagnified text obscured by the magnified region may be displayed in some fashion (e.g. alpha blending) through the magnified region to further enhance context.
Claims
1. A method of digital image magnification in a graphical user interface (GUI), the method comprising:
- identifying a region of a first image in which a cursor is positioned in the GUI, the region including one or more graphical elements having corresponding hyperlinks;
- forming a magnified image including an enlarged version of the first image corresponding to the region, the magnified image including enlarged versions of the one or more graphical elements;
- superimposing the cursor over the magnified image to form a second image; and
- utilizing cursor position data indicating the cursor position in the GUI such that positioning of a second point in the magnified image corresponding to the superimposed cursor relative to the magnified image coincides with a first point corresponding to the cursor in the GUI relative to the first image,
- wherein utilizing includes maintaining the cursor position such that it remains adjacent to a magnified region corresponding to the region including one or more graphical elements having corresponding hyperlinks.
2. The method according to claim 1, wherein the magnified image has a width equal to a width of the GUI, thereby enhancing the readability of the text in the first image.
3. The method according to claim 1, wherein a location identified by the cursor relative to the magnified image is co-located with a location identified by the cursor relative to the first image.
4. The method according to claim 3, wherein a user visually interacting with a magnified interface element at the location identified by the cursor relative to the magnified image actually interacts with an interface element at the location identified by the cursor relative to the first image.
5. The method according to claim 1, wherein identifying the selected region comprises:
- determining Cartesian coordinate data identifying a location of the cursor; and
- calculating upper and left boundaries of the selected region based on the Cartesian coordinate data.
6. The method according to claim 5, wherein calculating the left boundary comprises:
- multiplying a distance from the cursor to a left boundary of the magnified image by a width of the selected region to form a first factor;
- dividing the first factor by a width of the magnified image to form a second factor; and
- subtracting the second factor from an X Cartesian coordinate of the cursor.
7. The method according to claim 5, wherein calculating the upper boundary comprises:
- multiplying a distance from the cursor to a upper boundary of the magnified image by a height of the selected region to form a third factor;
- dividing the third factor by a height of the magnified image to form a fourth factor; and
- subtracting the fourth factor from a Y Cartesian coordinate of the cursor.
8. The method of claim 1, wherein the second image is displayed within a television safe area on a display screen.
9. The method of claim 1, further comprising alpha blending the first image with the magnified image, such that the first image shows through the magnified image.
10. A method of digital image magnification in a graphical user interface (GUI), the GUI including a first image and a cursor superimposed over the first image and movable on the first image by manipulation of an input device, the method comprising:
- determining Cartesian coordinate data identifying a first point on the first image located under the cursor;
- forming a magnified image including an enlarged version of a region surrounding the identified first point, the region including one or more graphical elements having corresponding hyperlinks;
- superimposing the cursor over the magnified image; and
- utilizing cursor position data indicating the cursor position in the GUI such that positioning of a second point in the magnified image corresponding to the superimposed cursor relative to the magnified image coincides with the first point corresponding to the cursor in the GUI relative to the first image,
- wherein utilizing includes maintaining the cursor position such that the second point remains surrounded by a magnified region corresponding to the region including one or more graphical elements having corresponding hyperlinks.
11. The method of claim 10, wherein the magnified image is superimposed over the first image such that a first edge of the magnified image extends to a first edge of the first image and a second edge of the magnified image extends to a second edge of the first image.
12. The method of claim 10, wherein the magnified image, first image, and the cursor are displayed within a television safe area on a display screen.
13. The method according to claim 10, wherein a user visually interacting with a magnified interface element at the second point actually interacts with an interface element at first point.
14. A method of magnifying a background image in a graphical user interface (GUI), the GUI including image data for generating the background image on a display, and cursor position data for positioning a cursor over the background image, the method comprising:
- identifying a first point of the background image that coincides with the cursor position data;
- forming a magnified image using the image data corresponding to a region located adjacent to the first point, the region including one or more graphical elements having corresponding hyperlinks; and
- superimposing the cursor over the magnified image such that the cursor is located directly over a second point of the magnified image; and
- utilizing the cursor position data such that positioning of the second point in the magnified image corresponding to the superimposed cursor relative to the magnified image coincides with the first point corresponding to the cursor in the GUI relative to the background image,
- wherein utilizing includes maintaining the cursor position such that it remains adjacent to a magnified region corresponding to the region including one or more graphical elements having corresponding hyperlinks.
15. The method of claim 14, wherein the magnified image is superimposed between the background image and the cursor such that a first edge of the magnified image extends to a first edge of the background image and a second edge of the magnified image extends to a second edge of the background image.
16. The method of claim 14, wherein the magnified image, background image, and the cursor are displayed within a television safe area on a display screen.
17. The method according to claim 14, wherein a user visually interacting with a magnified interface element at the second selected point actually interacts with an interface element at first selected point.
18. A system for magnifying an image, the system comprising:
- means for identifying a region of a first image in which a cursor is positioned in the GUI, the region including one or more graphical elements having corresponding hyperlinks;
- means for forming a magnified image including an enlarged version of the first image corresponding to the region, the magnified image including enlarged versions of the one or more graphical elements;
- means for superimposing the cursor over the magnified image to form a second image; and
- means for utilizing cursor position data indicating the cursor position in the GUI such that positioning of a second point in the second image corresponding to the superimposed cursor relative to the magnified image coincides with a first point corresponding to the cursor in the GUI relative to the first image,
- wherein the means for utilizing includes means for maintaining the cursor position such that it remains adjacent to a magnified region corresponding to the region including one or more graphical elements having corresponding hyperlinks.
19. The system according to claim 18, wherein the magnified image has a width equal to a width of the first image, thereby enhancing the readability of the text in the first image.
20. The system according to claim 18, wherein a location identified by the cursor relative to the magnified image is co-located with a location identified by the cursor relative to the first image.
21. The system according to claim 18, wherein a user visually interacting with a magnified interface element at the location identified by the cursor relative to the magnified image actually interacts with an interface element at the location identified by the cursor relative to the first image.
Type: Application
Filed: Feb 14, 2012
Publication Date: Aug 30, 2012
Applicant: VIACLIX, INC. (Los Gatos, CA)
Inventor: Killian D. Murphy (San Francisco, CA)
Application Number: 13/396,576
International Classification: G06F 3/048 (20060101);