Stacked media elements with selective parallax effects

Abstract

This application relates to stacked media elements with a selective parallax effect. According to one embodiment, a method is obtained that includes obtaining a media composition for display on an electronic display device. The media composition includes a plurality of layers, where each layer includes a visual element. The method further includes selecting at least some of the layers of the media composition to which a parallax effect is to be applied, and determining the amount of the total parallax effect to be applied to the selected layers. Additionally, the method includes determining the appropriate offset amount to be applied to each selected layer one by one, and shifting the selected layers their respective appropriate amounts in one or more directions. Furthermore, the method includes displaying the media composition on the electronic display device that exhibits the parallax effect.

Description

[0001] This application is a divisional application of the invention patent application with the application date of March 24, 2020, the application number of 202010210545.0, and the invention name of "Stacked Media Elements with Selective Parallax Effect". Technical Field

[0002] This disclosure generally relates to displaying visual media elements, and more particularly, to displaying stacked media elements that achieve a selective parallax effect. Background Art

[0003] Visual media elements such as images and videos are used in marketing and promoting media compositions such as movies, films, and television shows. However, once these visual media elements are combined, they do not allow user interaction or modification, and thus cannot provide a fully immersive viewing experience to promote such media compositions. Summary of the Invention

[0004] In some specific embodiments, a method is obtained that includes obtaining a media composition for display on an electronic display device. The media composition includes a plurality of layers, where each layer includes at least one visual element. The method further includes selecting at least some of the layers of the media composition to which to apply a parallax effect, and determining the amount of the total parallax effect to be applied to the selected layers. Additionally, the method includes determining an appropriate offset amount to be applied to each of the selected layers one by one, and shifting the selected layers by their respective appropriate offset amounts in one or more directions. Furthermore, the method includes displaying the media composition on the electronic display device that exhibits the parallax effect.

[0005] Particular specific embodiments provide at least the following advantages. The media composition may include visual elements that are selectively included to which to apply a parallax effect. The visual elements may be text, images, animations, videos, or any other type of visual element. Additionally, a video may add transparency to it to allow the underlying layer to be seen through the undesirably opaque portions of the video, thereby allowing a viewer of the media composition to have a more immersive experience when the parallax effect is applied to these layers.

[0006] The details of one or more specific embodiments are set forth in the following drawings and detailed description. Other features, aspects, and potential advantages will be apparent from the detailed description, the drawings, and the claims. Brief Description of the Drawings

[0007] Figures 1A - 1E A top view showing a parallax effect applied to a set of stacked visual elements in a media composition in one example.

[0008] Figures 2A - 2BShows a top view of a parallax effect applied to another set of stacked visual elements in one example.

[0009] Figures 3A - 3C Shows a side view of a parallax effect applied to a set of stacked visual elements in one example.

[0010] Figures 4A - 4E Shows a parallax effect applied to a set of stacked visual elements in one example.

[0011] Figures 5A - 5E Shows a parallax effect applied to a set of stacked visual elements in another example.

[0012] Figures 6A - 6B Shows a method for adding transparency to a video element according to one example.

[0013] Figures 7A - 7B Shows another method for adding transparency to a video element according to one example.

[0014] Figure 8 Is a flowchart of an exemplary process for applying a parallax effect to a set of stacked visual elements.

[0015] Figure 9 Is a flowchart of an exemplary process for providing transparency to a video.

[0016] Figure 10 Is a flowchart of another exemplary process for providing transparency to a video.

[0017] Figure 11 Is implementable Figures 1A - 10 Of the features and processes of an exemplary computing device.

[0018] Like reference symbols in the various figures indicate like elements. Detailed Description

[0019] As used herein, a visual element describes a media object that can be displayed within a media composition on a two-dimensional electronic display device. As is known to those skilled in the art, in a number of examples, visual elements can include video, still images, a series of images that form a single animated image, or any other visual attributes, components, modules, and / or portions that can be displayed within a media composition. A media composition can have any format capable of providing the data necessary to display a set of visual elements, such as a widget, a video file, another proprietary format, etc. A media composition includes more than one visual element, such as one video and one still image, two still images and one animated image, multiple videos with a static banner, etc., and a media composition can have any size, purpose, run-time length, or other attributes provided by the format chosen for storing the media composition.

[0020] The parallax effect can be described as a displacement or shift of an observed object that varies according to the angle at which the object is observed. In other words, the parallax effect (which makes it appear to the observer that the object has moved) is caused by observing the object along different lines of sight.

[0021] While it may be desirable to impart a parallax effect to objects displayed on an electronic display device (such as a computer monitor, a television, etc.), such electronic display devices do not have the ability to allow viewing of objects in a two-dimensional display from multiple angles. Instead, these electronic display devices present objects within a two-dimensional media composition from a single angle, regardless of how the user observes the electronic display device. The viewing angle is determined by the designer of the media composition and does not change. Thus, according to various embodiments described herein, another technique that does not rely on changing the user's viewing angle can be used to provide a parallax effect for a media composition.

[0022] In the description of the present invention, a parallax effect for a media composition is achieved by shifting (e.g., offsetting) one or more visual elements relative to a set of visual elements within the media composition in one or more lateral directions perpendicular to the two-dimensional plane on which the visual elements within the media composition are displayed. In certain methods, the shift is gradually applied to the visual elements of a selected subset of elements within the media composition.

[0023] Adding a parallax effect

[0024] Figures 1A - 1E Illustrated is a parallax effect applied to a set of stacked visual elements within a media composition in one example. Now refer to Figure 1A, which shows a top view of a media composition in a first configuration 100 having an intermediate input position (represented as a black circle centered within a white circle). The media composition includes a set of stacked visual elements that together provide a basis for the media composition. The extent of the media composition (the total area shown) is set by a frame 114 that defines the visible region of the media composition (in one approach, the visible region is defined by the width and height of the frame 114). The frame 114 is shown as a rectangular shape, but can have any two-dimensional shape chosen by the designer of the media composition, such as circular, oval, triangular, pentagonal, hexagonal, etc. Additionally, the size and shape of the frame 114 can be chosen to be integrated into a graphical user interface (GUI).

[0025] Each of the visual elements is included in a single layer stacked within the media composition such that the media composition includes multiple layers, where each layer includes a visual element. In the description of the present invention, layers and visual elements may be used interchangeably to describe objects within the media composition. In Figure 1A the example, a set of visual elements in stacked order includes a background layer 102, layer 1 104, layer 2 106, layer 3 108, layer 4 110, and a fixed layer 112.

[0026] The frame 114, x-y axes, and input position indicator are for descriptive purposes only and are not reproduced within the media composition in one approach. In another approach, the frame 114 may be visible to indicate the boundary around the media composition.

[0027] The background layer 102 is the lowest layer within the media composition and, in Figures 1A - 1E the example, is shown as a static image (with cross-hatching in this example), but can be a video, a set of images forming an animated image, or some other type of visual element known in the art. As shown, the background layer 102 has been deselected by the designer of the media composition to apply a parallax effect, thereby presenting the background layer 102 as static or fixed. In other words, the background layer 102 is not affected by the parallax effect. However, in other configurations, the background layer 102 may be selected to have the parallax effect applied to it, as Figures 2A - 2B shown.

[0028] Referring again to Figures 1A - 1E , layer 1 104 is positioned above the background layer 102 within the media composition and is shown as a small cloud image located in the upper left portion of the media composition. In this example, the small cloud is a single image that has been selected to have the parallax effect applied and will thus shift position within the frame 114 in response to the input position.

[0029] Layer 2 106 is positioned above the background layer 102 and offset from layer 1 104. Layer 2 106 is shown as a medium cloud image in the upper right portion of the media composition. In this example, the medium cloud is a single image that has been selected to apply a parallax effect and will therefore shift position within the frame 114 in response to the input position.

[0030] Layer 3 108 is positioned above the background layer 102 and layer 2 106 and offset from layer 1 104. Layer 3 108 is shown as a large cloud in the middle lower portion of the media composition. In this example, the large cloud is a video (which will play its entire length once the media composition is activated) that has been selected to apply a parallax effect and will therefore shift position within the frame 114 in response to the input position. As shown, the video is restricted within the bounds of the cloud edges and one or more of the underlying layers are visible between the ridges of the cloud. Additionally, the video will play over time, as demonstrated by the change in the shadow area of the large cloud when viewed in different configurations as Figures 1A - 1E shown. This is intended to demonstrate that the parallax effect can be applied even when videos and animations are active and playing within the media composition.

[0031] Layer 4 110 is positioned above the background layer 102 and layer 3 108 and offset from layer 1 104 and layer 2 106. Layer 4 110 is shown as a person in the lower left center portion of the media composition. The person is a single image that has been selected to apply a parallax effect and will therefore shift position within the frame 114 in response to the input position.

[0032] The fixed layer 112 is positioned above the background layer 102 in the lower left portion of the media composition. The fixed layer 112 is shown as a rectangular static image that has been deselected by the designer, such as to apply a parallax effect. In this example, the fixed layer 112 will not shift position within the frame 114 in response to the input position, thereby presenting the fixed layer 112 as static or immobile.

[0033] As shown, the background layer 102 has been selected by the designer of the media composition to be static and not affected by the parallax effect. However, in other configurations, the parallax effect can also be applied to the background layer 102, as Figures 2A - 2B shown. Additionally, in Figures 1A - 1E the background layer 102 is shown as having the same dimensions as the frame 114, but is not limited thereto and, conversely, can have any dimensions and shape desired by the designer. If the background layer 102 has transparent portions, the default display content will be shown behind the transparent portions of the background layer 102 when not covered by other upper layers.

[0034] In one method, an input location can be used to indicate the amount of a parallax effect applied to a media composition. When the input location is in the middle (centered within the circle), the media composition is displayed in its unaltered form (e.g., no parallax effect is applied). In response to the input location moving to the left side of the circle (as Figure 1B shown), moving to the right side of the circle (as Figure 1C shown), moving to the top of the circle (as Figure 1D shown), and moving to the bottom of the circle (as Figure 1E ) shown, different parallax effects can be applied to the media composition.

[0035] In another method, a parallax effect can be applied to a media composition in one or more directions in response to a trigger or condition being met with or without user input. Any trigger can be used to cause the application of the parallax effect, such as (for example) an application starting on a computing system, a user selecting a media composition or another part of a graphical user interface on a display, a certain period of time having elapsed, a certain time of day having arrived, periodically, and so on. Any user input device and input type can be used to make a selection via the GUI, such as making a selection using a mouse, hovering a mouse over a part of the GUI, making a selection or hovering using a touchpad, making a selection or hovering in response to detecting a user's eye gaze using an eye-tracking device, an accelerometer or other motion sensor indicating movement of the computing device, a light sensor indicating a change in the environment in which the computing device is placed, or other input devices and methods of detecting input known in the art.

[0036] In one example, the trigger can include moving a ribbon of a GUI that displays one or more media compositions, and when moving the ribbon, a parallax effect can be applied to selected visual elements of one or more media compositions. This example does not require user interaction with any specific media composition. Instead, the trigger relies on interaction with a secondary GUI that is displaying one or more media compositions.

[0037] Any layer in a media composition may include animated and / or video content having a predetermined length. In one method, once the animated and / or video has played its entire content, the animated and / or video may stop. In another method, a default static image that occupies the same region in the media composition as the animated and / or video may be displayed. The default static image may be selected by the designer as or automatically set to the first frame of the animated and / or video. In another method, once the animated and / or video has played its entire content, the animated and / or video may automatically restart at its beginning and play continuously or for a predetermined number of loops without interruption. According to another method, the animated and / or video may be designed to start and end with the same or substantially similar image, thus providing continuous play without any interruption or ending effect (referred to as "looping").

[0038] The total amount of parallax effect applied to a media composition may be predetermined or may be based on some parameters of the media composition, such as the size of frame 114 relative to the total canvas size, the size of individual layers within the media composition, etc.

[0039] Now referring to Figure 1B , which shows a top view of the media composition in a second configuration 116 having a left input position (represented as a black circle to the left of the white circle). As shown, each of the layers selected for the parallax effect (layer 1 104, layer 2 106, layer 3 108, and layer 4 110, referred to herein as "parallax layers") has been shifted to the right, while the layers not selected for the parallax effect (background layer 102 and fixed layer 112) remain in their original positions in Figure 1A .

[0040] The amount of offset (e.g., shift) applied to different parallax layers may vary from one layer to the next and may be based on the amount of directional input (e.g., whether the input position is entirely to the left of the circle edge or partially to the left with more room to push left before reaching the circle edge). In Figure 1B , layer 1 104 is shown shifted the least amount, while layer 4 110 is shifted the greatest amount. This is according to one embodiment, where the amount of parallax effect (shift) applied to each individual layer is determined based on the layer's position within the stack of visual elements comprising the media composition. Since layer 1 104 is closest to the bottom of the stack (and is selected to have the parallax effect applied to it, unlike background layer 102), it receives the least amount of offset to reproduce the effect of a distant object in the field of view. If background layer 102 were not a fixed layer, it would be shifted the least amount in Figure 1B . In contrast, layer 4 110 is the farthest from the bottom of the stack and thus receives the greatest amount of offset to reproduce the effect of a nearby object in the field of view.

[0041] In one method, the offsets applied to the parallax layers are evenly distributed across multiple parallax layers. In Figures 1A - 1E , there are four parallax layers, so each progressive parallax layer receives an additional 25% of the total parallax effect (25% shift for layer 1 104, 50% shift for layer 2 106, 75% shift for layer 3 108, 100% shift for layer 4 110). If there are ten parallax layers, each progressive parallax layer will receive an additional 10% of the total parallax effect (10% for the first layer, 20% for the second layer, …, 90% for the ninth layer, 100% for the tenth layer). As those skilled in the art will understand, any other uniform distribution method for the parallax effect can be used in the embodiments described herein.

[0042] In another method, the offsets applied to the parallax layers can be distributed across multiple parallax layers according to an algorithm or formula. According to one exemplary algorithm, the amount of parallax effect applied to each layer can be determined based on a formula of increasing fractional percentages: such as, (1 / 10) 10% shift for layer 1 104, (1 / 10 + 2 / 10) 30% shift for layer 2 106, (1 / 10 + 2 / 10 + 4 / 10) 70% shift for layer 3 108, 100% shift for layer 4 110. In another example, the distribution of the shift can be reversed such that layer 4 110 receives the least amount of offset and layer 1 104 receives the greatest amount of offset.

[0043] According to another embodiment, the offsets applied to each parallax layer can be set by the designer of the media composition, where the amount of the effect is related or not related to the stacking order. For example, layer 3 108 can apply an 80% shift, layer 1 104 can apply a 60% shift, and all other parallax layers apply only a 20% shift. Additionally, in the methods described herein, it is not required that all 100% of the available parallax effect be applied to any layer.

[0044] Now refer to Figure 1C , which shows a top view of the media composition in a third configuration 118 with a right input position (represented as a black circle to the right of the white circle). As shown, each of the parallax layers has been shifted to the left, while the layers with the parallax effect deselected (background layer 102 and fixed layer 112) remain in their original positions in Figure 1A .

[0045] In Figure 1C , layer 1 104 is shown shifted the least amount, while layer 4 110 is shifted the greatest amount. This is according to one embodiment where the offset applied to each individual layer is determined based on the layer's position within the stack of visual elements of the media composition.

[0046] Now refer to Figure 1D, which shows a top view of the media composition in a fourth configuration 120 having a top input position (represented as a black circle on top of a white circle). As shown, each of the parallax layers has been shifted downward, while the layers with the parallax effect deselected (background layer 102 and fixed layer 112) remain in their Figure 1A original positions in.

[0047] In Figure 1D , layer 1 104 is shown to have shifted the least amount, while layer 4 110 has shifted the greatest amount. This is according to an embodiment where the offset applied to each individual layer is determined based on the layer's position within the stack of visual elements that make up the media composition.

[0048] Now referring to Figure 1E , a top view of the media composition is shown in a fifth configuration 122 having a bottom input position (represented as a black circle at the bottom of a white circle). As shown, each of the parallax layers has been shifted upward, while the layers with the parallax effect deselected (background layer 102 and fixed layer 112) remain in their Figure 1A original positions in.

[0049] In Figure 1E , layer 1 104 is shown to have shifted the least amount, while layer 4 110 has shifted the greatest amount. This is according to an embodiment where the offset applied to each individual layer is determined based on the layer's position within the stack of visual elements that make up the media composition.

[0050] Figures 2A - 2B Shows the parallax effect applied to a set of stacked visual elements in a media composition in one example. Now referring to Figure 2A , which shows a top view of the media composition in a configuration 200 having an intermediate input position. The media composition includes a set of stacked visual elements that together provide a basis for the media composition. The extent of the media composition (the total area shown) is set by a frame 204 that defines the visible region of the media composition. In Figure 2A 's example, the set of visual elements includes, in stacked order, a background layer 202, layer 1 104, layer 2 106, a fixed layer 206, layer 3 108, and layer 4 110.

[0051] The background layer 202 is the lowest layer in the media composition and is in Figures 2A - 2BIn [the figure], an image (with cross-hatching in this example) is shown as being larger than the frame 204, but it can be a video, a set of images forming an animated image, or some other type of visual element known in the art. As shown, in this example, the background layer 202 is selected such that, for example, a parallax effect is applied by the designer of the media composition, and thus it will shift position within the frame 204 in response to the input position. Additionally, since it is larger than the frame 204 (the portion of the background layer 202 that extends beyond the edges of the frame 204), some portions of the background layer 202 are not visible. However, as the parallax effect is applied to the media composition, some or all of these portions can become visible at different times when the input position is moved.

[0052] Layer 1 104 is positioned above the background layer 202 in the media composition and is shown as a small cloud image in the upper left portion of the media composition. In this example, the small cloud is a single image that has been selected to have a parallax effect applied, and thus it will shift position within the frame 204 in response to the input position.

[0053] Layer 2 106 is positioned above the background layer 202 and offset from Layer 1 104. Layer 2 106 is shown as a medium cloud image in the upper right portion of the media composition. In this example, the medium cloud is a single image that has been selected to have a parallax effect applied, and thus it will shift position within the frame 204 in response to the input position.

[0054] The fixed layer 206 is positioned above the background layer 202 in the middle-right portion of the media composition. The fixed layer 206 is shown as a static image of the sun partially hidden behind the small cloud. In this example, the fixed layer 206, for example, is deselected by the designer to have a parallax effect applied. Thus, in this example, the fixed layer 206 will not shift position within the frame 204 in response to the input position, presenting the fixed layer 206 as static or unmoving. Additionally, the positioning of this fixed layer 206 indicates that a parallax effect can be applied to layers above and / or below any fixed layer in the media composition, and the parallax layers will shift above and below the fixed layer 206 in response to the input position.

[0055] Layer 3 108 is positioned above background layer 102, layer 2 106, and fixed layer 206, and is offset from layer 1 104. Layer 3 108 is shown as a large cloud in the mid - lower portion of the media composition. The large cloud is a video (which plays its entire length once the media composition is activated). In this example, layer 3 108 is selected to apply a parallax effect and will thus shift position within frame 204 in response to the input position. As shown, the video is restricted within the bounds of the cloud's edges and between the ridges of the cloud, and one or more layers positioned below (e.g., layer 2 106 and fixed layer 206) are visible. Additionally, the video will play over time, as demonstrated by the change in the shadow area of the large cloud when viewed in different configurations as Figures 2A - 2B shown. This is intended to show that the parallax effect can be applied to a media composition while the video and animation are active and playing.

[0056] Layer 4 110 is positioned above background layer 102 and layer 3 108, and is offset from layer 1 104, layer 2 106, and fixed layer 206. Layer 4 110 is shown as a person in the lower - left - center portion of the media composition. The person is a single image that has been selected to apply a parallax effect and will thus shift position within frame 204 in response to the input position.

[0057] Now refer to Figure 2B , which shows a top view of the media composition in another configuration 208 with a down - left input position. As shown, each of the layers that have the parallax effect selected (background layer 202, layer 1 104, layer 2 106, layer 3 108, and layer 4 110, referred to herein as "parallax layers") has shifted right and up, while the layer that has the parallax effect deselected (fixed layer 206) remains in its original position in Figure 2A .

[0058] The offset applied to different parallax layers can vary from one layer to the next and can be based on the amount of directional input (e.g., whether the input position is completely to the left of the circle's edge or partially to the left with more room to push left before reaching the circle's edge). In Figure 2B , background layer 202 is shown shifted the least amount, while layer 4 110 is shifted the greatest amount. This is according to one embodiment where the amount of parallax effect applied to each individual layer is determined based on the layer's position within the stack of visual elements of the media composition. Since background layer 202 is closest to the bottom of the stack, it receives the least amount of offset to reproduce the effect of a distant object in the field of view. In contrast, layer 4 110 is the farthest from the bottom of the stack and closest to the imaginary observer of the stack, and thus receives the greatest amount of offset to reproduce the effect of a nearby object in the field of view.

[0059] In one method, the offsets applied to the parallax layers are evenly distributed across the plurality of parallax layers. In another method, the offsets applied to the parallax layers are distributed across the plurality of parallax layers according to an algorithm or formula. According to another embodiment, the offset applied to each parallax layer can be set by the designer of the media composition, where the amount of the effect is not limited to being achieved according to the stacking order. For example, the background 202 can have a 100% parallax effect, while all other parallax layers only have a 20% shift applied.

[0060] As Figure 2B can be seen, as layer 3 108 shifts, it obscures more of the fixed layer 206 compared to Figure 2A . Additionally, as Figure 2B shows, when layer 2 106 shifts, the background layer 202 is exposed between the rays of the sun of the fixed layer 206. In other words, the space between the rays of the sun in the fixed layer 206 is transparent and shows whatever is positioned below. This is true regardless of whether the layer is an image, an animated image, a video, or any other type of visual content.

[0061] Now refer to Figures 3A - 3C , which shows a side view of the parallax effect applied to a set of stacked visual elements in one example. The x - y plane is shown as unfolded, where the x - axis is still in the width direction and the y - axis extends into the page, and for clarity, a small amount of perspective is added to the layers. Additionally, the spacing between the layers is magnified to help understand how the parallax effect works on a layer - by - layer basis.

[0062] As shown, the background layer 102, layer 1 104, layer 2 106, layer 3 108, and layer 4 110 are selected to have the parallax effect applied to them (referred to as "parallax layers" in the description of Figures 3A - 3C ), while the fixed layer 112 is deselected from having the parallax effect applied to it. Of course, which layers are selected for the parallax effect and which are deselected are chosen by the designer or user of the media composition, and any layer in the media composition can selectively have the parallax applied to it in various configurations.

[0063] In Figure 3A the configuration 300 shown, the line of sight 302 is positioned perpendicular to the x - y plane and intersects the frame 114 at its center point in both the x - direction and the y - direction. The line of sight 302 is used to indicate the logical viewing perspective of the media composition and how that logical viewing perspective moves and tilts in response to changes in the input position, which will be simulated by the parallax effect applied after receiving the change in the input position.

[0064] Now refer to Figure 3B, which shows configuration 304, where the line of sight 302 tilts to the right in response to an input position pointing to the right. In other methods, an input position to the right may cause the line of sight 302 to tilt to the left or some other direction, as long as it is reproducible consistently. Looking through the frame 114 along the line of sight 302 from this perspective, the positions of the various parallax layers will appear to change relative to Figure 3A the positions shown therein. Once the line of sight 302 is repositioned perpendicular to the frame 114, the perceived shift of the positions of the parallax layers relative to the line of sight 302 and the frame 114 can be simulated by transposing each parallax layer in Figure 3B to the left horizontally by a different amount (the amount of this movement depends on the stacking order of the layers). This is called the horizontal movement of the parallax layers.

[0065] In Figure 3C , this horizontal movement of the parallax layers is shown in configuration 306, where the line of sight 302 is again positioned perpendicular to the frame 114 while the input position still points to the right. Configuration 306 shows how the parallax layers shift horizontally to the left to simulate the parallax effect. As shown, each of the parallax layers has been shifted to the left by an appropriate amount according to its corresponding stacking order, such that the positions of the parallax layers are changed relative to the frame 114 while the position of the fixed layer 112 remains unchanged. In this example, the offset for the background layer 102 is the smallest, the offset for layer 4 110 is the largest, and those for layer 2 106 and layer 3 108 are intermediate amounts.

[0066] In Figure 3C it can be seen that layer 3 108 and layer 4 110 are now positioned below the fixed layer 112, while layer 2 106 has moved closer to the line of sight 302. The amount of movement for each layer is indicated by the dashed arrows on the left side of the figure, while the fixed layer 112 is shown as having "no movement". The indication of movement, the frame 114, the line of sight 302, the x - y axes, and the input position indicator are for descriptive purposes only and are not reproduced in the media composition in one method.

[0067] Applied to the Figures 3A - 3C parallax layers in, the parallax effect can be modified and updated in real - time as the input position is changed. For example, receiving a rotational input (where the input position rotates around a circle) may cause the parallax effect to move omnidirectionally around the line of sight 302, thereby continuously moving the positions of the parallax layers within the frame 114 in response to the change in the input position with a circular effect.

[0068] Now referring to Figures 4A - 4E , in one example, the parallax effect is shown as being applied to a set of stacked visual elements in a media composition. Figure 4AConfiguration 400 with an intermediate input position (represented as a black circle centered within a white circle) of stacked elements is shown. The x-y plane is shown unfolded, where the x-axis is in the width direction and the y-axis extends into the page, with a small amount of perspective added to the layers for clarity. Additionally, the spacing between the layers is magnified to assist in understanding how the parallax effect functions on a layer-by-layer basis.

[0069] The line of sight 414 is shown intersecting the circular image 406 at its center point and is positioned perpendicular to the frame 412. This line of sight 414 logically shows how the media composition would be seen through the frame 412 on an electronic display device. The extent (total area displayed) of the media composition is set by the frame 412 that determines the visible area of the media composition (in one method, the visible area is determined by the width and height of the frame 412). The frame 412 is shown as a rectangular shape but can have any two-dimensional shape chosen by the designer of the media composition, such as circular, oval, triangular, pentagonal, hexagonal, etc. Additionally, the size and shape of the frame 412 can be chosen to be integrated into the GUI, as described previously.

[0070] Each of the visual elements is included in a single layer stacked within the media composition, such that the media composition includes multiple layers, where each layer includes a visual element. In the description of the present invention, layers and visual elements may be used interchangeably to describe the objects within the media composition. In Figure 4A the example, the stacked elements include, starting from the lowest layer: rectangular image 402, rectangular video 404, circular image 406, circular image 408, and rectangular video 410. All of these layers are chosen to apply the parallax effect, except for the circular image 406. Additionally, as shown, the frame 412 is centered over the circular image 406 but conceptually can be located inside, above, or below any layer, as it only indicates the visible area of the media composition.

[0071] The frame 412, x-y axes, and input position indicator are for descriptive purposes only and are not reproduced in the media composition in one method. In another method, the frame 412 can be visible to indicate the boundary around the media composition.

[0072] Now refer to Figure 4B which shows a top view of the media composition in configuration 400 with an intermediate input position in Figure 4A . As visible in Figure 4B , the rectangular video 410 is positioned above the upper left corner of the circular image 406. The circular image 406 is positioned adjacent to the circular image 408 and overlaps with the rectangular image 402 and the rectangular video 404. Additionally, in configuration 400, the circular image 408 also overlaps with the rectangular video 404.

[0073] Now refer to Figure 4C which shows a side view of a media composition in Configuration 416 having a left input position. As shown, in this Configuration 416, the line of sight 414 has two parts: an upper part extending above the circular image 406 and a lower part extending below the circular image 406. The two parts of the line of sight 414 are tilted to the left in response to the left-pointing input position and are positioned closer to the elements on the left side of the media composition and farther from the elements on the right side of the media composition. In other methods, a left input position may cause the line of sight 414 to tilt to the left or some other direction, as long as it is reproducible consistently. This Configuration 416 is an example of a bisected parallax effect, where the origin of the parallax effect is positioned at a point within each layer of the media composition (in this example, coinciding with the circular image 406), rather than being positioned at the lowest or highest layer as described previously. In other methods, the origin of the parallax effect may be positioned anywhere - between, within, above, or below the layers of the media composition.

[0074] From this perspective, looking through the frame 412 along the line of sight 414, the positions of the various parallax layers will appear to change relative to Figure 4A the positions shown in Figure 4C . Once the line of sight 414 is repositioned perpendicular to the frame 412, the perceived shift of the parallax layers relative to the line of sight 414 and the frame 412 can be simulated by laterally transposing each parallax layer in Figure 4C to the right by different amounts (the amount of this movement depends on the stacking order of the layers above and below the origin at the circular image 406).

[0075] Now refer to Figure 4D where this lateral movement of the parallax layers is shown in Configuration 418, where the line of sight 414 is again positioned perpendicular to the frame 412 while the input position still points to the left. Configuration 418 shows how the parallax layers shift laterally to the right to simulate the parallax effect. As shown, each of the parallax layers has been shifted to the right by an appropriate amount according to its corresponding stacking order above and below the origin at the circular image 406. The amount of movement of each layer relative to the frame 412 is indicated by the dashed arrows on the left side of the figure, while the circular image 406 is shown as having "no movement". In this example, the offset amounts for the circular image 408 and the rectangular video 404 are the smallest, and the offset amounts for the rectangular video 410 and the rectangular image 402 are the largest.

[0076] In Figure 4E a top view of Configuration 418 can be seen, where all the parallax layers shift to the right in response to the left input position. The circular image 408 is now positioned away from the circular image 406 (they are no longer adjacent) and is above the rectangular video 404. Additionally, the layering of the elements relative to Figure 4BUnchanged, where the rectangular video 410 is positioned above the circular image 406, which in turn is positioned above the rectangular image 402 and the rectangular video 404.

[0077] Applied to Figures 4A - 4E The parallax effect of the parallax layer in can be modified and updated in real time as the input position is changed. For example, receiving a rotational input (where the input position rotates around a circle) can cause the parallax effect to move gimbal-wise around the line of sight 414, thereby continuously moving the position of the parallax layer within the frame 412 in response to changes in the input position having a circular effect. The indication of movement, frame 412, line of sight 414, x-y axes, and input position indicator are for descriptive purposes only and are not reproduced in the media composition in one method.

[0078] Figures 5A - 5E Shows a parallax effect applied to a set of stacked visual elements in a media composition in one example. Figure 5A Shows a configuration 500 with an intermediate input position of the stacked elements. The x-y plane is shown unfolded, where the x-axis is in the width direction and the y-axis extends into the page, and a small amount of perspective is added to each layer for clarity. Additionally, the spacing between the layers is magnified to help understand how the parallax effect works on a layer-by-layer basis.

[0079] The line of sight 514 is shown intersecting the circular image 506 at its center point and is positioned perpendicular to the frame 512. This line of sight 514 logically shows how the media composition would be seen through the frame 512 on an electronic display device. The extent of the media composition (the total area displayed) is set by the frame 512 that determines the visible region of the media composition (in one method, the visible region is determined by the width and height of the frame 512). The frame 512 is shown as a rectangular shape but can have any two-dimensional shape chosen by the designer of the media composition, such as circular, oval, triangular, pentagonal, hexagonal, etc. Additionally, the size and shape of the frame 512 can be chosen to be integrated into the GUI, as described previously.

[0080] Each of the visual elements is included in a single layer stacked in the media composition, such that the media composition includes multiple layers, where each layer includes a visual element. In the description of the present invention, layers and visual elements may be used interchangeably to describe the objects in the media composition. In Figure 5AIn the example of , the stacked elements include, starting from the lowest layer: rectangular image 502, rectangular video 504, circular image 506, circular image 508, and rectangular video 510. All of these layers are selected to apply a parallax effect, except for circular image 506. In addition, as shown, frame 512 is centered on circular image 506, but conceptually can be located inside, above, or below any layer because it only indicates the viewable area of ​​the media composition.

[0081] The frame 512, xy axes, and input position indicator are for descriptive purposes only and are not reproduced in the media composition in one approach. In another approach, the frame 512 may be visible to indicate a border around the media composition.

[0082] Reference now Figure 5B , which is Figure 5A A top view of the media composition is shown in configuration 500 with an intermediate input position. Figure 5B 5 , rectangular video 510 is positioned above the upper left corner of circular image 506. Circular image 506 is positioned adjacent to circular image 508 and overlaps rectangular image 502 and rectangular video 504. Furthermore, in configuration 500, circular image 508 also overlaps rectangular video 504.

[0083] Reference now Figure 5C , which shows a side view of the media composition in a configuration 520 with a right input position. As shown, in this configuration 520, the sight line 514 is tilted to the right in response to the input position pointing to the right, and is centered through the center point of the circular image 506. This tilt of the sight line 514 makes the rectangular video 510 positioned above the circular image 506 and the rectangular video 504 positioned below the circular image 506 appear to be farther away from the sight line 514, so that the circular image 508 positioned above the circular image 506 and the rectangular image 502 positioned below the circular image 506 appear to be closer to the sight line 514. In other methods, the right input position can cause the sight line 514 to tilt to the left or some other direction, as long as it is always reproducible. This configuration 520 is an example of a parallax effect, the origin of which is positioned at a point within each layer of the media composition (in this example, coinciding with the circular image 506), rather than being positioned at the lowest or highest layer as described above. In other approaches, the origin of the parallax effect can be positioned anywhere - between, within, above or below the layers of the media composition.

[0084] From this perspective, along line of sight 514 through frame 512, the positions of the various parallax layers will appear relative to Figure 5A Once the sight line 514 is positioned perpendicular to the frame 512 again, the Figure 5CEach parallax layer in [[ ]] is laterally transposed in an appropriate direction by a different amount (the amount of this movement depends on the stacking order of the layers above and below the origin at the circular image 506) to simulate this perceived shift in the position of the parallax layer relative to the line of sight 514 and the frame 512.

[0085] Now referring to Figure 5D , this lateral movement of the parallax layer is shown in configuration 522, where the line of sight 514 is again positioned perpendicular to the frame 512, and the input position still points to the right. Configuration 522 shows how the parallax layer positioned above the origin layer (circular image 506) is laterally shifted to the left, while the parallax layer positioned below the origin layer is laterally shifted to the right to simulate the parallax effect. As shown, each of the parallax layers has been shifted by an appropriate amount according to its corresponding stacking order above and below the origin at the circular image 506. The amount of movement of each layer relative to the frame 512 is indicated by the dashed arrows on the left side of the figure, while the circular image 506 is shown as having "no movement". In this example, the offsets for the circular image 508 and the rectangular video 504 are minimal, and the offsets for the rectangular video 510 and the rectangular image 502 are maximal.

[0086] In Figure 5E , a top view of configuration 522 can be seen, where all the parallax layers are shifted in response to the input position moving to the right. The circular image 508 now overlaps the circular image 506 (they are no longer just adjacent to each other) and is positioned above the rectangular video 504. Additionally, the layering of the elements relative to Figure 5B remains unchanged, where the rectangular video 510 is positioned above the circular image 506, which in turn is positioned above the rectangular image 502 and the rectangular video 504.

[0087] Applied to the Figures 5A - 5E parallax layer in [[ ]], the parallax effect can be modified and updated in real time as the input position is changed. For example, receiving a rotational input (where the input position rotates around the circle) can cause the parallax effect to move omnidirectionally around the line of sight 514, thereby continuously moving the position of the parallax layer within the frame 512 in response to changes in the input position with a circular effect. The indication of movement, the frame 512, the line of sight 514, the x - y axes, and the input position indicator are for descriptive purposes only and are not reproduced in the media composition in one method.

[0088] Figures 1A - 1E , Figures 2A - 2B , Figures 3A - 3C , Figures 4A - 4E and Figures 5A - 5EAny of the methods and techniques described herein can be used to produce a layered stacked media asset that can be reproduced by one or more computing products known in the art for rendering graphics. The computing product may be capable of displaying packages, zip files, containers, files, images, videos, etc. The media asset includes all the data and information required to render and play the media composition while providing a parallax effect for the visual elements selected therein in response to an input position. The media asset includes images, animations, and video dimensions, blend mode effects to be used on a per-layer basis, loop information, positioning information for each visual element, and the shift of the visual elements in response to a changing input position.

[0089] In addition, in some methods, the media asset includes a default image for each visual element, which includes animations and videos of the media composition where applicable, and these animations and videos are displayed in some cases in place of the animation or video content. In one method, the default image is displayed while the animation or video is loading. This is useful for ensuring that the media composition does not lack visual elements in cases where processing power, processing capabilities, network bandwidth, or other computing resources inhibit the seamless integration of the parallax effect for one or more visual elements of the media composition. In other words, if there are loading issues with the video or animation, the default image included in the media file can be displayed until the video or animation is successfully loaded.

[0090] The media asset also includes configuration information that describes how the visual elements in the media composition change in response to an input position, in particular how the parallax effect is applied to each visual element, whether the visual elements are static, how much parallax effect is applied to the media composition, the types of visual elements included in the media composition, and any other information used to produce the media composition.

[0091] Adding Transparency to a Video

[0092] Now refer to Figures 6A - 6B , which shows a method for adding transparency to a video 600 according to one example. In this example, the video 600 includes the word "FUN" that changes while the video is playing, as shown by the changing shaded letters "F", "U", and "N" in Figures 6A to 6B . Of course, in the specific implementations described herein, any video content can be used as a basis to create a video including transparency, starting from an original video that does not natively include transparency or an alpha channel. In addition, any type of digital format or container can be used to store the video, as known to those skilled in the art, such as Audio Video Interleave (AVI), Flash Video Format (FLV), Matroska Multimedia Container (MKV), Windows TM Media Video (WMV), Apple TM QuickTime TMVideos such as MOV (Moving Picture Experts Group 4 (MP4)). Video content changes over time to create an illusion of motion and is thus not a static image.

[0093] Refer again to Figure 6A , the original video 600 includes the letters "F" 602, "U" 604, and "N" 606 surrounded by a background 608, which can be opaque or otherwise include opaque moving video information. For inclusion in a media composition, in this example, transparency is desired around the word rather than showing the background 608 from the original video 600. It is desired to include only these letters as a video surrounded by transparency to allow the layers and content behind and between the letters to be seen once the media composition is combined. In other words, these letters will float above any other layers positioned behind the letters without extraneous video content obscuring the underlying layers. However, with a typical video, this opaque background would be visible and obscure any layers positioned below the video.

[0094] To overcome this deficiency, a method is described for providing transparency or an alpha channel to a video 600 that lacks transparency in its native definition or format. The method starts with the original video 600 and then, as Figure 6B shown, creates an auxiliary video track 618 that includes visual information only for the portions of the original video 600 to be reproduced, where the visual information is all white (#FFFFFF) in the auxiliary video track 618. In this example, the portions to be reproduced are the letters "F" 610, "U" 612, and "N" 614, which are shown as all white. However, in various methods, any color can be used to indicate the portions of the video 600 to be reproduced.

[0095] The remaining portion 616 of the auxiliary video track 618 that does not contain any visual information is shown as all black (#000000) in Figure 6B . However, in various methods, any color other than the color used to reproduce the desired video portions (e.g., the letters "F" 610, "U" 612, and "N" 614) can be used to indicate the portions of the video 600 to be reproduced.

[0096] Once the auxiliary video track 618 is created, it is added to the original video 600 and stored as a single entity (e.g., a file) on a computer-readable medium. The multi-track video can be reproduced using a filter that is configured to read the auxiliary video track 618 and reproduce only the portions of the original video 600 that coincide with the desired portions indicated by the auxiliary video track 618. This can be done by using the filter to detect the white portions of the auxiliary video track 618. In a method where different colors are used for the letters "F", "U", and "N" in the auxiliary video track 618, the filter detects that color instead of white to determine which portions of the original video 600 are to be reproduced.

[0097] Reference Figures 7A - 7B , according to multiple examples, another method for adding transparency to a video is shown. Figure 7A An example of a video 700 including the word "FUN" with a black background is shown. In this method, a filter is configured that can be applied to the video 700 to provide transparency or an alpha channel to the portions of the video 700 that match a pre-determined hue.

[0098] In one example, all portions of the video 700 that are black (#000000) will become transparent when reproduced, while all portions of the video 700 that are white (#FFFFFF) will be reproduced as opaque. Any other hue in the video 700 (such as red, blue, green, their chromaticities, and any grayscale) will be reproduced as semi-transparent based on the amount of the hue included in the video. For example, when the filter is applied to the video 700, pure blue (#0000FF), pure red (#FF0000), and pure green (#00FF00) can each be reproduced as 33% transparent (and 67% opaque).

[0099] As Figure 7A shown, once the filter is applied, the portions 702 of the letters "F", "U", and "N" will be reproduced as opaque, the portions 704 surrounding the letters will be reproduced as transparent, and the portions 706 of the letters "F", "U", and "N" will be reproduced as semi-transparent depending on the specific hue and filter settings.

[0100] In another example, when the filter is applied to the video 700, pure blue (#0000FF), pure red (#FF0000), and pure green (#00FF00) can each be reproduced as 67% transparent (and 33% opaque).

[0101] As the color of video 700 changes over time as the video is played, the completely transparent and completely opaque portions of video 700 will also change to match the change in hue, thereby providing a lifelike reproduction of transparency. This method is particularly applicable to adding effects such as smoke, lens flares, and highlights to a media composition, among other pre-existing elements.

[0102] In one method, the video can be modified before applying the filter to produce a better rendering of the transparent portions. In one example, the pixel colors in video 708 can be flattened, reduced, and / or compressed to increase the portions of the video that are all white and thus become transparent when rendered. This increase in the white portions of the video allows the desired black portions to be the only visible portions of the video with less translucent content. In one embodiment, the brightness of the video can be increased, thereby increasing the percentage of the video that contains all-white pixels. In another embodiment, the brightness of the video can be decreased, thereby increasing the percentage of the video that contains all-black pixels.

[0103] This modification of the hue of the pixels can be particularly useful for editing videos that include noise (where the hue is spread across portions of video 700 that are desired to become transparent when the filter is applied).

[0104] As is known to those skilled in the art, any other modification or processing of the video can be performed before providing transparency, while still allowing transparency to be added to the video. This allows non-native video formats to have an alpha channel added to them for media compositions that include layers of elements.

[0105] Figure 7B An example of video 708 is shown that includes the word "FUN" with a white background. In this method, a filter is configured that can be applied to video 708 to provide transparency or an alpha channel to portions of video 708 that match one or more predetermined hues. However, in this example, all portions of video 708 that are black (#000000) will become opaque (and visible in their original form) when reproduced, while all portions of video 708 that are white (#FFFFFF) will be reproduced as transparent. Any other hues in video 708 (such as red, blue, green, their chromaticities, and any grayscale) will be reproduced as semi-transparent based on the amount of hue included in the video. For example, when the filter is applied to video 708, pure blue (#0000FF), pure red (#FF0000), and pure green (#00FF00) can each be reproduced as 67% transparent (and 33% opaque).

[0106] As Figure 7BAs shown, once the filter is applied, portions 702 of the letters "F", "U", and "N" will be reproduced as opaque, portions 704 surrounding the letters will be reproduced as transparent, and portions 706 of the letters "F", "U", and "N" will be reproduced as translucent depending on the specific hue and filter settings.

[0107] In another example, when the filter is applied to video 700, pure blue (#0000FF), pure red (#FF0000), and pure green (#00FF00) can each be reproduced as 33% transparent (and 67% opaque).

[0108] As the colors of video 708 change over time as the video is played, the completely transparent portions and the completely opaque portions of video 708 will also change to match the change in hue, thus providing a lifelike reproduction of transparency. In addition to other pre-existing elements, this method is particularly applicable to adding effects to media compositions, such as smoke, dimness, and wear caused by age.

[0109] In one method, the video can be modified before applying the filter to produce a better rendering of the transparent portions. In one example, the pixel colors in video 708 can be flattened, reduced, and / or compressed to increase the portions of the video that are all white and thus become transparent when rendered. This increase in the white portions of the video allows the desired black portions to be the only visible portions of the video with less translucent content. In one embodiment, the brightness of the video can be increased, thereby increasing the percentage of the video that contains all-white pixels. In another embodiment, the brightness of the video can be decreased, thereby increasing the percentage of the video that contains all-black pixels.

[0110] This modification of the hue of the pixels can be particularly useful for editing videos that include noise (the hue is spread in the portions of video 708 that are desired to become transparent when the filter is applied).

[0111] As is known to those skilled in the art, any other modification or processing of the video can be performed before providing transparency, while still allowing transparency to be added to the video. This allows non-native video formats to add an alpha channel for media compositions that include element layers.

[0112] Example process

[0113] To enable the reader to clearly understand the technical concepts described herein, the following processes describe specific steps performed in a particular order. However, one or more steps of a particular process may be rearranged and / or omitted while remaining within the scope of the technology disclosed herein. Additionally, different processes and / or their steps may be combined, recombined, rearranged, omitted, and / or performed in parallel to create different processing flows that are also within the scope of the technology disclosed herein. Further, although some details of the technology disclosed herein may be omitted or briefly summarized in the following processes for clarity, the details described in the above paragraphs may be combined with the process steps described below to obtain a more complete and comprehensive understanding of these processes and the technology disclosed herein.

[0114] Figure 8 FIG. 4 is a flowchart of an exemplary process for applying a parallax effect to a set of stacked visual elements. In operation 802, media assets describing a media composition are obtained. The media assets may include some or all of the data and information required to render and play the media composition, as well as information describing the parallax effect to be applied to the media composition (or its layers). In one embodiment, the parallax effect may be responsive to an input position. The media assets include positioning information for each visual element and a shift for the visual element in response to a change in the input position (or some other trigger or condition). The media composition includes a plurality of layers, where each layer includes visual elements. In various examples, the media composition may include video elements, image elements, animations, etc., and may be any type of media composition known in the art.

[0115] In one example, the media composition may be received from another electronic device (such as a mobile phone, laptop computer, media server, home media television device, etc.). In another example, the media composition may be created based on individual visual elements, including layering and positioning information to present a complete media composition. Such media compositions may be created using an application dedicated to designing, combining, and creating media compositions.

[0116] In operation 804, at least some of the layers in the media composition are selected to which the parallax effect is to be applied. In one example, the selection of which layers to apply the parallax effect to may be received as input from a designer or user. In another example, the selection of the layers to which the parallax effect is applied may be made automatically based on historical preferences, the design and layout of the media composition, or some other basis for selecting specific layers to which to apply the parallax effect as would be understood by one of ordinary skill in the art. In one example, all of the layers of the media composition may be automatically selected as the default setting to which the parallax effect will be added.

[0117] In operation 806, the amount of the total parallax effect to be applied to the selected layer is determined. The amount of the total parallax effect can be determined based on the frame size, the canvas size, the size of one or more layers of the media composition, or any other parameter related to the media composition and / or the GUI in which the media composition will be displayed.

[0118] As shown in operation 808, an appropriate offset is determined to be applied to each of the selected layers one by one. The determined appropriate offset does not exceed the amount of the total parallax effect. In one method, the offset can be determined based on the input position. The input position can be received through a user input device such as a mouse, a touchpad, a remote controller, etc.

[0119] In operation 810, the selected layer is shifted in its corresponding appropriate offset along one or more directions. In one method, one or more shifting directions can be determined based on the input position. In another method, one or more shifting directions can be continuously rotated to provide a gimbal effect for the media composition.

[0120] As shown in operation 812, the media composition showing the parallax effect is displayed. The media composition can be displayed on an electronic display device and, in some methods, can be displayed in a GUI that displays other media compositions for selection therefrom.

[0121] Figure 9 is a flowchart of an exemplary process for providing transparency to a video. In operation 902, a video is obtained. In one example, the video can be created, received from another electronic device, retrieved from a storage medium, or obtained in some other way. In one method, the native definition or format of the video lacks transparency.

[0122] In operation 904, it is determined which first parts of the video will be reproduced without change and, thus, which second parts of the video will become transparent. This determination can be based on user input of selecting a hue from the video, and all hues that match the selected hue are marked as becoming transparent. In another example, the determination can be made automatically by selecting the video background to become transparent. In other examples, different parts of the video can be selected according to the video content included therein to achieve transparency.

[0123] As shown in operation 906, an auxiliary video track including visual information is created that is only for the first part of the video to be reproduced. In the auxiliary video track, in two examples, the first part of the video contains a single hue, such as white (#FFFFFF) or black (#000000), while the remaining part of the auxiliary video track does not include any visual data. However, in various methods, any color can be used for the auxiliary video track to indicate the first part of the video to be reproduced.

[0124] In operation 908, the video is modified to include an auxiliary video track, creating a multi-track video with the original video track and the auxiliary video track.

[0125] In operation 910, the multi-track video is stored as a single entity (e.g., a file) on a storage medium. In various ways, the auxiliary video track can be reproduced below the original video, above the original video, or on one side of the original video.

[0126] In operation 912, the modified video with transparency in its second part is displayed by applying a filter to the multi-track video. The filter is configured to read the auxiliary video track, detect the first part of the auxiliary video track having a specified color (e.g., white or black), and reproduce only the first part of the modified video that coincides with the first part of the auxiliary video track.

[0127] Figure 10 is a flowchart of another exemplary process for providing transparency to a video. In operation 1002, a video is obtained. In one example, the video can be created from scratch, assembled using media content available to the processor, received from another electronic device, retrieved from a storage medium, or obtained in some other way. In one method, the video lacks transparency in its native definition or format when it is obtained.

[0128] In operation 1004, based on the color of the first part, it is determined which first parts of the video will be reproduced without change and, thus, which second parts of the video will become transparent. All the first parts of the video have the same color.

[0129] In one method, this determination is made by determining the dominant background color of the video. In one method, the dominant background color is determined by selecting the most common pixel color in the video that is not within the central 50% of the video (e.g., along the edges of the video and thus most likely not the subject or main focus of the video). In one example, the dominant background color can be white. In another example, the dominant background color can be black.

[0130] Once the dominant background color is determined, all parts of the video that include the dominant background color are selected as the second part of the video. In this example, the inverse color of the dominant background color is selected to represent the first part of the video that will be reproduced without change. For example, white is the inverse of black, purple is the inverse of green, yellow is the inverse of blue, etc.

[0131] In optional operation 1006, the video is modified or edited to add a second portion of the video (a specific amount of pixels in the video) that has a reverse color of the color of the first portion to create a modified video. This modification increases the second portion of the video that is made transparent and increases the first portion of the video that will be reproduced without change.

[0132] In operation 1008, during playback, transparency is added to the video (or modified video) by rendering all second portions of the video transparent, rendering all first portions of the video opaque, and rendering all other portions of the video semi-transparent according to the specific hue of the other portions.

[0133] Graphical user interface

[0134] The present disclosure has described above various graphical user interfaces (GUIs) for implementing various features, processes, or workflows. These GUIs can be presented on various electronic devices, including but not limited to laptop computers, desktop computers, computer terminals, television systems, tablets, e-book readers, and smart phones. One or more of these electronic devices may include a touch-sensitive surface. The touch-sensitive surface can process multiple simultaneous input points, including processing data related to the pressure, degree, or position of each input point. Such processing can facilitate gestures made with multiple fingers, which include pinching and swiping.

[0135] When the present disclosure refers to "selecting" a user interface element in a GUI, these terms are understood to include clicking, hovering, and / or pausing over a user interface element using a mouse, touchpad, or other input device, or touching, tapping, or gesturing on a user interface element using one or more fingers or a stylus. User interface elements can be virtual buttons, menus, selectors, switches, sliders, brushes, knobs, toggle switches, thumbnails, links, icons, radio boxes, check boxes, and any other mechanism for receiving input from a user or providing feedback to a user.

[0136] Privacy

[0137] It is well known that the use of personally identifiable information should follow privacy policies and practices that are generally recognized as meeting or exceeding industry or government requirements for maintaining user privacy. Specifically, personally identifiable information data should be managed and processed to minimize the risk of inadvertent or unauthorized access or use, and the nature of the authorized use should be clearly explained to users.

[0138] Exemplary system architecture

[0139] Figure 11 is implementable Figures 1A - 10Block diagram of an exemplary computing device 1100 of features and processes. The computing device 1100 may include a memory interface 1102, one or more data processors, image processors, and / or central processing units 1104, and a peripheral device interface 1106. The memory interface 1102, one or more processors 1104, and / or the peripheral device interface 1106 may be separate components or may be integrated into one or more integrated circuits. The various components in the computing device 1100 may be coupled by one or more communication buses or signal lines.

[0140] Sensors, devices, and subsystems may be coupled to the peripheral device interface 1106 to facilitate multiple functions. For example, a motion sensor 1110, a light sensor 1112, and a proximity sensor 1114 may be coupled to the peripheral device interface 1106 to facilitate orientation, lighting, and proximity functions. Other sensors 1116 may also be connected to the peripheral device interface 1106, such as a Global Navigation Satellite System (GNSS) (e.g., a GPS receiver), a temperature sensor, a biometric sensor, a magnetometer, or other sensing devices, to facilitate related functions.

[0141] A camera subsystem 1120 and an optical sensor 1122 (such as a Charge-Coupled Device (CCD) or a Complementary Metal-Oxide Semiconductor (CMOS) optical sensor) may be utilized to facilitate camera functions, such as taking photos and video clips. The camera subsystem 1120 and the optical sensor 1122 may be used to collect images of a user to be used during user authentication, for example, by performing facial recognition analysis.

[0142] Communication functions may be facilitated by one or more wireless communication subsystems 1124, which may include radio frequency receivers and transmitters and / or optical (e.g., infrared) receivers and transmitters. The specific design and implementation of the communication subsystem 1124 may depend on the communication network through which the computing device 1100 is intended to operate. For example, the computing device 1100 may include a communication subsystem 1124 designed to operate over a GSM network, a GPRS network, an EDGE network, a Wi-Fi or WiMax network, and a Bluetooth TM network. Specifically, the wireless communication subsystem 1124 may include a host protocol such that the device 100 may be configured as a base station for other wireless devices.

[0143] An audio subsystem 1126 may be coupled to a speaker 1128 and a microphone 1130 to facilitate voice-enabled functions, such as speaker recognition, voice reproduction, digital recording, and telephone functions. The audio subsystem 1126 may be configured to facilitate, for example, processing voice commands, voiceprint discrimination, and voice authentication.

[0144] The I / O subsystem 1140 may include a touch surface controller 1142 and / or other input controllers 1144. The touch surface controller 1142 may be coupled to a touch surface 1146. The touch surface 1146 and the touch surface controller 1142 may detect contact and movement or interruptions thereof using, for example, any of a variety of touch-sensitive technologies, including but not limited to capacitive, resistive, infrared, and surface acoustic wave technologies, as well as other proximity sensor arrays or other elements for determining one or more points of contact with the touch surface 1146.

[0145] One or more other input controllers 1144 may be coupled to other input / control devices 1148, such as one or more buttons, rocker switches, thumb wheels, infrared ports, USB ports, and / or pointing devices (such as a stylus). One or more buttons (not shown) may include up / down buttons for volume control of the speaker 1128 and / or the microphone 1130.

[0146] In one particular implementation, pressing and holding a button for a first duration can unlock the touch surface 1146; and pressing and holding the button for a second duration longer than the first duration can turn on or off the power of the computing device 1100. Pressing and holding the button for a third duration can activate a voice control or voice command module that enables the user to speak commands into the microphone 1130 so that the device executes the spoken commands. The user may customize the functions of one or more buttons. For example, virtual buttons or soft buttons and / or a keyboard may also be implemented using the touch surface 1146.

[0147] In some particular implementations, the computing device 1100 may present recorded audio and / or video files, such as MP3, AAC, and MPEG files. In some particular implementations, the computing device 1100 may include the functionality of an MP3 player, such as an iPod TM .

[0148] The memory interface 1102 may be coupled to a memory 1150. The memory 1150 may include high-speed random access memory and / or non-volatile memory, such as one or more disk storage devices, one or more optical storage devices, and / or flash memory (e.g., NAND, NOR). The memory 1150 may store an operating system 1152, such as Darwin, RTXC, LINUX, UNIX, OS X, WINDOWS, or an embedded operating system (such as VxWorks).

[0149] The operating system 1152 may include instructions for handling basic system services and for performing hardware-related tasks. In some specific implementations, the operating system 1152 may be a kernel (e.g., a UNIX kernel). In some specific implementations, the operating system 1152 may include instructions for performing voice authentication. For example, the operating system 1152 may implement a parallax effect in a media composition and provide transparency for a video, as referenced Figures 1A - 10 as described.

[0150] The memory 1150 may also store communication instructions 1154 to facilitate communication with one or more additional devices, one or more computers, and / or one or more servers. The memory 1150 may include graphical user interface instructions 1156 that facilitate graphical user interface processing; sensor processing instructions 1158 that facilitate sensor-related processing and functions; telephone instructions 1160 that facilitate telephone-related processes and functions; electronic message instructions 1162 that facilitate electronic message-related processes and functions; web browsing instructions 1164 that facilitate web browsing-related processes and functions; media processing instructions 1166 that facilitate media processing-related processes and functions; GNSS / navigation instructions 1168 that facilitate GNSS- and navigation-related processes and instructions; and / or camera instructions 1170 that facilitate camera-related processes and functions.

[0151] The memory 1150 may store software instructions 1172 to facilitate other processes and functions, such as the parallax effect and video transparency processes and functions referenced Figures 1A - 10 as described.

[0152] The memory 1150 may also store other software instructions 1174, such as network video instructions that facilitate network video-related processes and functions; and / or network shopping instructions that facilitate network shopping-related processes and functions. In some specific implementations, the media processing instructions 1166 are divided into audio processing instructions and video processing instructions to respectively facilitate audio processing-related processes and functions and video processing-related processes and functions.

[0153] Each of the instructions and applications identified above may correspond to a set of instructions for performing one or more of the above functions. These instructions need not be implemented as separate software programs, processes, or modules. The memory 1150 may include additional instructions or fewer instructions. Additionally, various functions of the computing device 1100 may be implemented in hardware and / or software, including in one or more signal processing and / or application specific integrated circuits.

Claims

1. A method for displaying a user interface object, comprising: at a computing device in communication with a display device and one or more input devices including an eye tracking device: displaying via the display device a user interface object including a plurality of layers, wherein a first layer of the plurality of layers includes a first visual element, and a second layer of the plurality of layers includes a second visual element, and wherein the plurality of layers of the user interface object are displayed in a first configuration in which a parallax effect is not applied to the plurality of layers; while displaying the user interface object including the plurality of layers in the first configuration, detecting, via the eye tracking device, a user's gaze corresponding to a user selection of the user interface object, including detecting a hover of the user's gaze; and in response to detecting the user's gaze corresponding to a user selection of the user interface object, displaying via the display device the user interface object including the plurality of layers in a second configuration different from the first configuration in which the parallax effect is applied to the plurality of layers.

2. The method according to claim 1, wherein detecting the hover of the user's gaze via the eye tracking device includes detecting a hover of the user's gaze over the user interface object.

3. The method according to claim 1, wherein the first layer is the first visual element, and wherein the second layer is the second visual element.

4. The method according to claim 1, wherein the first layer includes a third visual element different from the first visual element, wherein the second layer includes a fourth visual element different from the second visual element, wherein in the first configuration, the parallax effect is not applied to the plurality of layers, including not applied to the first visual element, the second visual element, the third visual element, and the fourth visual element, and wherein in the second configuration, the parallax effect is applied to the plurality of layers, including applied to the first visual element, the second visual element, the third visual element, and the fourth visual element.

5. The method according to claim 1, wherein the user interface object includes one or more additional layers, and wherein: when the plurality of layers of the user interface object are displayed in the first configuration in which the parallax effect is not applied to the plurality of layers, the parallax effect is not applied to the one or more additional layers; and when the plurality of layers of the user interface object are displayed in the second configuration in which the parallax effect is applied to the plurality of layers, the parallax effect is not applied to the one or more additional layers.

6. The method according to claim 1, wherein: the first layer of the plurality of layers is located at a first layer position in the user interface object, the second layer of the plurality of layers is located at a second layer position in the user interface object, and the first layer position in the user interface object is after the second layer position.

7. The method according to claim 6, wherein: In the user interface object, the first layer position is after the second layer position and includes the second visual element obscuring a part of the first visual element, such that displaying the user interface object including the multiple layers via the display device includes displaying the second visual element obscuring the part of the first visual element.

8. The method according to claim 1, wherein, the parallax effect applied to the multiple layers includes a first amount of parallax effect applied to the first layer and a second amount of parallax effect applied to the second layer, wherein the first amount of the parallax effect applied to the first layer is different from the second amount of the parallax effect applied to the second layer.

9. The method according to claim 8, wherein, the first amount of the parallax effect applied to the first layer is greater than the second amount of the parallax effect applied to the second layer.

10. The method according to claim 8, wherein, the first amount of the parallax effect applied to the first layer is less than the second amount of the parallax effect applied to the second layer.

11. The method according to claim 1, wherein: based on the determination that the directional input amount associated with the user's gaze corresponding to the user selection of the user interface object is a first directional input amount, the parallax effect applied to the multiple layers is a first parallax effect amount; and based on the determination that the directional input amount associated with the user's gaze corresponding to the user selection of the user interface object is a second directional input amount different from the first directional input amount, the parallax effect applied to the multiple layers is a second parallax effect amount different from the first parallax effect amount.

12. The method according to claim 1, wherein, the user's gaze corresponding to the user selection of the user interface object corresponds to a first position of the gaze, and wherein the method includes: when displaying the user interface object including the multiple layers via the display device in the second configuration with the parallax effect applied to the multiple layers, detecting, via the eye tracking device, a change of the gaze from corresponding to the first position to corresponding to a second position; and in response to detecting the change of the gaze, displaying, via the display device, the user interface object including the multiple layers in a third configuration different from the second configuration, wherein in the third configuration, a second parallax effect is applied to the multiple layers.

13. A non-transitory computer-readable medium storing instructions that, when executed by one or more processors of a computing device in communication with a display device and one or more input devices including an eye tracking device, cause the computing device to perform the method according to any one of claims 1-12.

14. A system for displaying a user interface object, comprising: one or more processors; and a memory storing instructions that, when executed by the one or more processors, cause the one or more processors to perform the method according to any one of claims 1-12.

Images