Progressive information panels in a graphical user interface
Approaches are described for an interface element that displays progressively more information about a search result in a listing of search results. In an embodiment, a user interacts with a search result, for example by utilizing a gesture on a touch-sensitive display, and a supplemental content item is generated and displayed using, in one example, a subset of available supplemental information associated with the search result. The display of the supplemental content item is accompanied by an animation is some embodiments whereby the supplemental content item visually “slides” over to replace the search result.
1. A computing device, comprising:
at least one processor;
a touch-sensitive display; and
memory including instructions that, when executed by the at least one processor, cause the computing device to:
receive a set of search results including a first result and a second result, wherein the first result is associated with a first region of the display and the second result is associated with a second region of the display;
present, on the display, at least the first result and the second result;
detect a first interaction with the first region;
determine, based at least in part on a unique identifier associated with the first result, that the first result is associated with first supplemental content;
generate a first supplemental content element including the first supplemental content;
present, on the display, a first animation comprising the first result appearing to slide in a first direction substantially simultaneously with the first supplemental content element appearing to slide in the first direction and visually replacing the first result, wherein the second region is unchanged;
detect a second interaction with the first region;
determine, based at least in part on the unique identifier associated with the first result, that the first result is associated with additional supplemental content;
generate, in response to the second interaction, a second supplemental content element including the additional supplemental content; and
present, on the display, a second animation comprising the first supplemental content element appearing to slide in the first direction substantially simultaneously with the second supplemental content element appearing to slide in the first direction and visually replacing the first supplemental content element, wherein the second region is unchanged.
2. The computing device of claim 1 , wherein the first supplemental content element includes an interface configured to initiate a purchasing action at an e-commerce store.
3. The computing device of claim 1 , wherein the first supplemental content comprises at least one of: nutritional information, apparel sizing information, a plurality of images associated with the first result, one or more playable content items associated with the first result, augmented reality visualizations, or product specifications associated with the first result.
4. A computer-implemented method, comprising:
receiving, at an electronic device having a touch-sensitive display, a set of search results including a first result and a second result, wherein the first result is associated with a first region of the display and the second result is associated with a second region of the display;
presenting, on the display, at least the first result and the second result;
detecting a first interaction with the first region;
determining, based at least in part on a unique identifier associated with the first result, that the first result is associated with first supplemental content;
generating a first supplemental content element including the first supplemental content;
presenting, on the display, a first animation comprising the first result appearing to slide in a first direction substantially simultaneously with the first supplemental content element appearing to slide in the first direction and visually replacing the first result, wherein the second region is unchanged;
detecting a second interaction with the first region;
determining, based at least in part on the unique identifier associated with the first result, that the first result is associated with additional supplemental content;
generating, in response to the second interaction, a second supplemental content element including the additional supplemental content; and
presenting, on the display, a second animation comprising the first supplemental content element appearing to slide in the first direction substantially simultaneously with the second supplemental content element appearing to slide in the first direction and visually replacing the first supplemental content element, wherein the second region is unchanged.
5. The method of claim 4 , wherein the first supplemental content element includes an interface configured to initiate a purchasing action at an e-commerce store.
6. The method of claim 1 , wherein the second supplemental content element includes an interface configured to initiate a purchasing action at an e-commerce store.
7. The method of claim 4 , further comprising:
determining that the first result corresponds to a first category, based at least in part on the unique identifier; and
selecting the first supplemental content based at least in part on the first category.
8. The method of claim 4 , wherein the first supplemental content comprises at least one of: nutritional information, apparel sizing information, a plurality of images associated with the first result, one or more playable content items associated with the first result, augmented reality visualizations, or product specifications associated with the first result.
9. The method of claim 4 , wherein the first result is associated with a first title to be displayed on the display along with the first result.
10. The method of claim 4 , wherein the first supplemental content element is generated in response to at least one of displaying the first result or detecting the first interaction.
11. A non-transitory computer-readable storage medium including instructions that, when executed by at least one processor of a computing system, cause the at least one processor to:
receive, at an electronic device having a touch-sensitive display, a set of search results including a first result and a second result, wherein the first result is associated with a first region of the display and the second result is associated with a second region of the display;
present, on the display, at least the first result and the second result;
detect a first interaction with the first region;
determine, based at least in part on a unique identifier associated with the first result, that the first result is associated with first supplemental content;
generate a first supplemental content element including the first supplemental content;
present, on the display, a first animation comprising the first result appearing to slide in a first direction substantially simultaneously with the first supplemental content element appearing to slide in the first direction and visually replacing the first result, wherein the second region is unchanged;
detect a second interaction with the first region;
determine, based at least on the unique identifier associated with the first result, that the first result is associated with additional supplemental content;
generate, in response to the second interaction, a second supplemental content element including the additional supplemental content; and
present, on the display, a second animation comprising the first supplemental content element appearing to slide in the first direction substantially simultaneously with the second supplemental content element appearing to slide in the first direction and visually replacing the first supplemental content element, wherein the second region is unchanged.
12. The non-transitory computer-readable storage medium of claim 11 , wherein the first supplemental content element includes an interface configured to initiate a purchasing action at an e-commerce store.
13. The non-transitory computer-readable storage medium of claim 12 , wherein the second supplemental content element includes an interface configured to initiate a purchasing action at an e-commerce store.
14. The non-transitory computer-readable storage medium of claim 11 , wherein the instructions when executed further cause the at least one processor to:
determine that the first result corresponds to a first category, based at least in part on the unique identifier; and
select the first supplemental content based at least in part on the first category.
15. The non-transitory computer-readable storage medium of claim 11 , wherein the first supplemental content comprises at least one of: nutritional information, apparel sizing information, a plurality of images associated with the first result, one or more playable content items associated with the first result, augmented reality visualizations, or product specifications associated with the first result.
16. The non-transitory computer-readable storage medium of claim 11 , wherein the first result is associated with a first title to be displayed on the display along with the first result.
17. The non-transitory computer-readable storage medium of claim 11 , wherein the first interaction comprises at least one of touch input, touch pressure detection, touch duration detection, voice input, input associated with gaze detection, or input with a pointing device communicably connected to the electronic device.