The present disclosure relates to images and, more specifically, to enabling a user to vote on a portion of an image and for displaying the image.
Web pages often contain different types of information, such as text, images, and video. Sometimes, the company which has produced the web pages is interested in the popularity of one or more items or people in one or more of the images displayed in the web pages. For example, people may be interested in the popularity of different outfits worn by different celebrities during an awards show, such as the Oscars®. Sometimes the popularity information is gathered for entertainment, while other times companies such as clothing companies may be interested in these popularity statistics in order to determine or adjust their next clothing lines.
The present disclosure relates to enabling a user to vote and/or comment on one or more portions of an image. The number of votes that a portion of an image receives can correlate with, for example, its popularity.
In one aspect, a server computer transmits a web page over a network to a computing device so that the web page can be displayed by a browser operating on the computing device. The web page includes an image. The server computer then receives, over the network from the computing device, coordinates of a portion of the image, the portion of the image selected by a user of the computing device. After receiving the coordinates of the selected portion, the server computer transmits, over the network and to the computing device, an updated image for display via the browser. Portions of the updated image have different levels of opacity that depend on the number of times the selected portion and other portions have been selected by other users to which the image is made available, so that the user can visually determine from the updated image portions of the updated image that have been selected by the user and by other users.
In one embodiment, the server computer transmits a client side software module to the computing device. The client side software module generates the coordinates of the selected portion. In one embodiment, the server computer receives a comment associated with the selected portion of the image from the computing device. In one embodiment, the server computer transmits one or more comments over the network to the computing device, where each comment is associated with a portion of the updated image. The computing device then displays the comment(s).
In another aspect, a server computer transmits a web page over a network to a computing device so that the web page can be displayed by a browser operating on the computing device. The web page includes an image. The server computer then receives, over the network from the computing device, coordinates of a portion of the image, the portion of the image selected by a user of the computing device. After receiving the coordinates of the selected portion, the server computer transmits, over the network and to the computing device, an updated image for display via the browser. Portions of the updated image have different characteristics that depend on the number of times the selected portion and other portions have been selected by other users to which the image is made available, so that the user can visually determine from the updated image portions of the updated image that have been selected by the user and by other users.
Examples of the different characteristics include different borders around different portions of the image and different numbers on different portions of the image. In one embodiment, a key is displayed corresponding to the different numbers and the number of times the selected portion and the other portions have been selected.
These and other aspects and embodiments will be apparent to those of ordinary skill in the art by reference to the following detailed description and the accompanying drawings.
In the drawing figures, which are not to scale, and where like reference numerals indicate like elements throughout the several views:
Embodiments are now discussed in more detail referring to the drawings that accompany the present application. In the accompanying drawings, like and/or corresponding elements are referred to by like reference numbers.
Various embodiments are disclosed herein; however, it is to be understood that the disclosed embodiments are merely illustrative of the invention that can be embodied in various forms. In addition, each of the examples given in connection with the various embodiments is intended to be illustrative, and not restrictive. Further, the figures are not necessarily to scale, some features may be exaggerated to show details of particular components (and any size, material and similar details shown in the figures are intended to be illustrative and not restrictive). Therefore, specific structural and functional details disclosed herein are not to be interpreted as limiting, but merely as a representative basis for teaching one skilled in the art to variously employ the disclosed embodiments.
The user selects a portion of the image on the web page 120 and the client side software module generates the coordinates of this selection box. These coordinates are the coordinates of the selection box relative to a designated point in the web page 120 (e.g., the top left corner of the web page 120). The computing device 105 then transmits the coordinates 125 of the selected portion of the image to the server 110. The server 110 keeps track of the number of votes that the server 110 receives for each set of coordinates 125. As described in more detail below, the server 110 transmits an updated image 130 to the computing device 105. In one embodiment, the server 110 transmits the entire web page again to the computing device 105 with the updated image after receiving coordinates from the computing device 105. In another embodiment, the server 110 transmits only the update image 130 to the computing device 105 for display via the browser 118. As described in more detail below, the update image 130 enables the user to visually determine the portions of the image that have been selected by the user as well as by other users.
For purposes of this disclosure, a computer or computing device such as the computing device 105 and/or server 110 includes a processor and memory for storing and executing program code, data and software which may also be tangibly stored or read from any type or variety of well known computer readable storage media such as magnetic or optical discs, by way of non-limiting example. Computers can be provided with operating systems that allow the execution of software applications in order to manipulate data. Personal computers, personal digital assistants (PDAs), wireless devices, cellular telephones, internet appliances, media players, home theater systems, servers, and media centers are several non-limiting examples of computing devices. The computing device 105 and the server 110 can, in one embodiment, also include a display, such as a screen or monitor.
Next, the server 110 receives a request for a particular web page from the computing device 105 (step 205). The server 110 transmits web page 120 having an image to the computing device 105 (step 210). In step 215, the server 110 receives from the computing device 105 coordinates of a portion of the image selected by a user of the computing device 105. As described above, the coordinates of the portion of the image are generated by the client side software module. In one embodiment, the client side software module is a Javascript program. In one embodiment, the server 110 receives from the computing device 105 one or more comments on the selected portion of the image (step 220, as shown with a dashed box).
In step 225, the server 110 transmits an updated image 130 to the computing device 105 for display on its browser 118. Different portions of the update image 130 have different levels of opacity that depend on the number of times the selected portion and other portions have been selected. More specifically, this updated image contains different portions and the level of opacity for each portion of the image is based on the number of times that that particular portion has been selected. For example, if a first user selects a first portion of the image and a second user selects a second portion of the image, and the first portion and second portion overlap, the updated image 130 will display the overlapped portion as the darkest portion of the image, the portions of the image that don't overlap (but have been selected) as the second darkest portions, and the portions of the image that were not selected by the first and/or second user as the lightest portions of the image.
As a specific example, suppose an image contains three people—Person 1, Person 2, and Person 3. Further, suppose that the computing device 105 transmits coordinates associated with a selection box around Person 1 and Person 1 has previously been selected by this user and/or by other users three times, Person 2 has been selected two times, and Person 3 has been selected one time. In one embodiment, the updated image 130 displays Person 1 as having two more levels of opacity relative to the opacity of Person 3, and Person 1 as having one more level of opacity relative to the opacity of Person 2. For example, Person 3 may be displayed three times as bright as Person 1, and Person 3 may be displayed twice as bright as Person 2.
This “heatmap” enables a user to visually determine which portions of the updated image 130 have been selected and how many times the portions have been selected relative to other portions in the image 130. Further, in one embodiment, when the updated image 130 is being displayed by the browser 118, the user may see the comments associated with different portions of the updated image 130 by pointing their mouse cursor over the different portions. In one embodiment, a user can hover over a portion of the image 130 to bring that portion forward (full opacity) and/or to see the comment associated with that portion of the image 130.
Although portions of an image that have been voted on are described herein as having different levels of opacity relative to the number of votes the portions have received compared with other portions of the image, any identifying technique can be used. In particular, portions of an image that have been voted on may be displayed with different characteristics depending on the number of votes that each portion has received. For example, if a portion of an image gets the most votes compared with the rest of the image, in one embodiment the updated image surrounds that portion with an identifying border. A portion that receives the next most votes has a different border than the portion with the most votes. In yet another embodiment, the portions can be identified by numbers (e.g., a number in the top left corner of each portion that has received at least one vote) and a key can be displayed that shows the portion number with the corresponding number of votes that the portion has received. Color and/or grey scale changes in the image can also be used.
In one embodiment, the screen shot 402 also includes a Show/Hide Comments button 430. If a user clicks on this button 430, comments associated with votes are displayed (e.g., under the respective image portion or in a separate window). For example, suppose a user votes on the first portion 410 as representing their favorite Baywatch cast member. The user also wants to associate a comment with their vote of the first portion 410, such as “test comment 1”. In one embodiment, the user associates a comment with their vote by clicking on the comment button 330 (shown in
Various implementations of the systems and techniques described here can be realized in digital electronic circuitry, integrated circuitry, specially designed ASICs (application-specific integrated circuits), computer hardware, firmware, software, and/or combinations thereof. These various implementations can include one or more computer programs that are executable and/or interpretable on a programmable system including at least one programmable processor, which may be special or general purpose, coupled to receive data and instructions from, and to transmit data and instructions to, a storage system, at least one input device, and at least one output device. Such computer programs (also known as programs, software, software applications or code) may include machine instructions for a programmable processor, and may be implemented in any form of programming language, including high-level procedural and/or object-oriented programming languages, and/or in assembly/machine languages. A computer program may be deployed in any form, including as a stand-alone program, or as a module, component, subroutine, or other unit suitable for use in a computing environment. A computer program may be deployed to be executed or interpreted on one computer or on multiple computers at one site, or distributed across multiple sites and interconnected by a communication network.
A high level block diagram of a computing device is shown in
One skilled in the art will recognize that an implementation of an actual computing device will contain other components as well, and that
Those skilled in the art will recognize that the methods and systems of the present disclosure can be implemented in many manners and as such are not to be limited by the foregoing exemplary embodiments and examples. In other words, functional elements being performed by single or multiple components, in various combinations of hardware and software or firmware, and individual functions, can be distributed among software applications at either the first or second computers or server or both. In this regard, any number of the features of the different embodiments described herein can be combined into single or multiple embodiments, and alternate embodiments having fewer than, or more than, all of the features described herein are possible. Functionality can also be, in whole or in part, distributed among multiple components, in manners now known or to become known. Thus, myriad software/hardware / firmware combinations are possible in achieving the functions, features, interfaces and preferences described herein. Moreover, the scope of the present disclosure covers conventionally known manners for carrying out the described features and functions and interfaces, as well as those variations and modifications that can be made to the hardware or software or firmware components described herein as would be understood by those skilled in the art now and hereafter.
The foregoing Description is to be understood as being in every respect illustrative and exemplary, but not restrictive, and the scope of the invention disclosed herein is not to be determined from the Description, but rather from the claims as interpreted according to the full breadth permitted by the patent laws. It is to be understood that the embodiments shown and described herein are only illustrative of the principles of the present invention and that various modifications may be implemented by those skilled in the art without departing from the scope and spirit of the invention. Those skilled in the art could implement various other feature combinations without departing from the scope and spirit of the invention.