Computer-implemented method of generating a content recommendation interface

There is provided a computer-implemented method of generating a content recommendation interface for a user of an electronic device, the method executable by the electronic device. The content recommendation interface presents a first GUI comprising three simultaneously presented visual-interface elements disposed within the first GUI: a first interface element comprising an omnibox, a second interface element comprising at least one icon representing user-selected content, and a third interface element comprising at least one recommendation icon, the first recommendation icon associated with recommended content selected, by the recommendation server, from a plurality of potentially recommendable content items. The method further comprises, in response to an indication of a first user-interaction with the first GUI into one of a first direction and a second direction, selectively presenting a first version and a second version of a second GUI, respectively.

The present application claims priority to Russian Patent Application No. 2016118519, filed May 12, 2016, entitled “A COMPUTER-IMPLEMENTED METHOD OF GENERATING A CONTENT RECOMMENDATION INTERFACE”, the entirety of which is incorporated herein by reference.

FIELD

The present technology relates to recommendation systems, and more particularly, to a computer-implemented method of generating a content recommendation for a user of an electronic device.

BACKGROUND

Various global or local communication networks (the Internet, the World Wide Web, local area networks and the like) offer a user a vast amount of information. The information includes a multitude of contextual topics, such as but not limited to, news and current affairs, maps, company information, financial information and resources, traffic information, games and entertainment related information. Users use a variety of client devices (desktop, laptop, notebook, smartphone, tablets and the like) to have access to rich content (like images, audio, video, animation, and other multimedia content from such networks) via a browser application, to retrieve, present and traverse information across the World Wide Web.

Browser applications, such as Google™ Chrome™, Microsoft™ Edge™, Mozilla™ Firefox™, Apple™ Safari™ and Opera™, usually includes interface elements such as an address bar to input a Uniform Resource Identifier (URI) of the desired resource, a viewport to display the resource, a refresh button to reload the current resource, back and forward buttons to go back to the previous and respective resources, a search bar to input terms into a search engine, a home button to return to the user's homepage, among others.

The volume of available information through various Internet resources has grown exponentially in the past couple of years. Several solutions have been developed in order to allow a typical user to find the information that the user is looking for. One example of such a solution is a search engine that can be accessed by the browser application. Examples of the search engines include Google™ search engine, Yandex™ search engine, Yahoo!™ search engine and the like. The user can access the search engine interface and submit a search query associated with the information that the user is desirous of locating on the Internet. In response to the search query, the search engine provides a ranked list of search results. The ranked list of search results is generated based on various ranking algorithms employed by the particular search engine that is being used by the user performing the search. The overall goal of such ranking algorithms is to present the most relevant search results at the top of the ranked list, while less relevant search results would be positioned on less prominent positions of the ranked list of search results (with the least relevant search results being located towards the bottom of the tanked list of search results).

The search engines typically provide a good search tool for a search query that the user knows apriori that she/he wants to search. In other words, if the user is interested in obtaining information about the most popular destinations in Italy (i.e. a known search topic), the user could submit a search query: “The most popular destinations in Italy?” The search engine will then present a ranked list of Internet resources that are potentially relevant to the search query. The user can then browse the ranked list of search results in order to obtain information she/he is interested in as it related to places to visit in Italy. If the user, for whatever reason, is not satisfied with the uncovered search results, the user can re-run the search, for example, with a more focused search query, such as “The most popular destinations in Italy in the summer?”, “The most popular destinations in the South of Italy?”, “The most popular destinations for a romantic getaway in Italy?”.

There is another approach that has been proposed for allowing the user to discover content and, more precisely, to allow for discovering and/or recommending content that the user may not be expressly interested in searching for. In a sense, such systems recommend content to the user without an express search request based on explicit or implicit interests of the user.

As a person skilled in the art of the present technology may appreciate, a quality of a user experience may not be solely defined by how relevant information content may be to a given user. Accordingly, how the information content is presented to a user may also be an important aspect of the user experience. In some instances, how the information content is presented to a user may be appreciated independently of how the information has been generated, selected and/or recommended. Multiple approaches as to how the information content is presented to a user via an electronic device have been developed. As a quantity of information content that can be presented to the user is virtually limitless attempts have been made to provide users with more intuitive navigational access to the information content, as an example, via specialized recommendation websites and software applications.

Moreover, the proliferation of devices with different screen sizes combined with the proliferation of multiple applications to access content, browse content, search content, all offering different interfaces and requiring switching between different applications may not only require more time, gestures, put a strain on the battery and require more processing power, but may also impoverish user experience.

US 2014095967 A1 discloses a method and apparatus for displaying information. When a terminal receives a request for starting a browser, the terminal obtains quick links and web applications that are cached in local database of the terminal and displays the obtained quick links by combinations of webpage icons and webpage titles in a middle screen display interface of a start page of the browser for the requester. When receiving a request for switching display interfaces of the start page of the browser, the terminal displays a search box in the start page of the browser or the obtained web applications by combinations of application icons and application titles in the start page of the browser.

SUMMARY

Developers of the present technology have appreciated certain technical drawbacks associated with the existing systems and methods of generating a content recommendation interface for a user of an electronic device. It is an object of the present technology to ameliorate at least some of the inconveniences present in the prior art, in particular by limiting a number of interactions required by a user to in a way that (1) limits a number of gestures a user has to physically conduct with an electronic device; and (2) limits disrupting a navigation experience of the user with browser content; and (3) aggregates searching, links and recommended content in a single browsing application interface.

The present technology thereby results, amongst other benefits, in an improved navigation experience by limiting a number of interactions required by the user to interact with a browser application, for example, but without being limited to, accessing network resources, searching for network resources and accessing recommended content. The limited number of interactions may result in (1) reducing a number of gestures a user has to physically conduct with an electronic device; (2) reducing disruption of a navigation experience of the user while interacting with the browser application; and/or (3) more intuitive interaction of the user with the browser application and the recommended content.

In one aspect, implementations of the present technology provide a computer-implemented method of generating a content recommendation interface for a user of an electronic device, the method executable by the electronic device, the electronic device having a processor and a user-interface device coupled to the processor, the processor being configured to execute a browser application, the electronic device further comprising a network interface for connecting to a recommendation server via a communication network, the method comprising: receiving, via the user-interface device, a first user-indication for activating the browser application; responsive to the first user-indication, generating on the user-interface device a first graphical user interface (GUI) of the browsing application, the first GUI comprising three simultaneously presented visual-interface elements disposed within the first GUI: a first interface element comprising an omnibox, the omnibox configured to receive at least one of a network address and a search query, the first interface element being located substantially in a center of the first GUI; a second interface element comprising at least one icon representing user-selected content, each of the at least one icons being linked to an associated network resource accessible via the communication network, the second interface element being spaced a first distance away, in a first direction, from the first interface element; a third interface element comprising at least one recommendation icon, the first recommendation icon associated with recommended content selected, by the recommendation server, from a plurality of potentially recommendable content items, the third interface element being spaced a second distance away, in a second direction, from the first interface element, the second direction being opposite to the first direction; receiving, via the user-interface device, an indication of a first user-interaction with the first GUI; responsive to determining the first user-interaction being a user-gesture associated with the first direction, generating a second GUI, to be displayed in place of the first GUI, the second GUI including: a portion of the first interface element located at an extremity of the second GUI located in the first direction; and the second interface element located such that the first distance is collapsed; and not including the third interface element; responsive to determining the first user-interaction being the user-gesture associated with the second direction, generating the second GUI, to be displayed in place of the first GUI, the second GUI including: the third interface element, such that at least one recommendation icon includes a first recommendation icon and at least a second recommendation icon, the first recommendation icon to be displayed in its entirety and the at least the second recommendation icon to be at least partially displayed; and not including the first interface element and the second interface element.

In some implementations, the method may further comprise determining a proportion of the first GUI dedicated to the second interface element and the third interface element; and wherein the determining is based on a parameter of the user-interface device.

In some implementations, the method may further comprise determining the first distance and the second distance; and wherein the determining is based on a parameter of the user-interface device.

In some implementations, the method may further comprise receiving, from the recommendation server, an indication of the recommended content selected, by the recommendation server, from the plurality of potentially recommendable content items, the selection having been executed specifically for the user.

In some implementations, the recommendation icon is linked to an associated recommended content item available from an associated network resource accessible via the communication network.

In some implementations, responsive to the first user-interaction being a touch user-gesture on the recommendation icon of the third interface element, accessing the associated network resource linked to the recommendation icon by generating the third GUI, the third GUI being part of a new window of the browser application.

In some implementations, the method may further comprise, responsive to the first user-interaction being a touch user-gesture on the omnibox, generating the second GUI, the second GUI including: the first interface element being located substantially in a center of the second GUI; the second interface element; and an application keyboard for inputting a text in the omnibox.

In some implementations, responsive to the first user-interaction being a touch user-gesture on the icon of the second interface element, accessing the associated network resource linked to the icon by generating a third GUI, the third GUI being part of a new window of the browser application.

In some implementations, the method may further comprise displaying an edit screen of the second interface element on the second GUI responsive to a long press user-gesture on the second interface element.

In some implementations, the method may further comprise executing an animated transition between the first GUI and the second GUI responsive to the user-gesture.

In some implementations, the method may further comprise determining a parameter of the animated transition, the parameter including at least a speed of transition, the determining comprising: receiving a first location and a first time of the user-gesture; receiving a second location and a second time of the user-gesture; determining the speed of transition by computing the difference between the second location and the first location and the difference between the second time and the first time of the user-gesture.

In some implementations, the determining the first user-interaction being the user-gesture associated with the first direction comprises: receiving a first location of the user gesture; receiving a second location of the user gesture; and computing a difference between the second location and the first location of the user gesture.

In some implementations, the determining the first user-interaction being the user-gesture associated with the second direction comprises: receiving a first location of the user gesture; receiving a second location of the user gesture; and computing the difference between the second location and the first location of the user gesture.

In some implementations, responsive to receiving an indication of the user rotating the electronic device to a second orientation, displaying a subset of the first GUI as the first GUI.

In some implementations, responsive to receiving an indication of the user rotating the electronic device to the second orientation, displaying a superset of the first GUI as the first GUI.

In some implementations, the method may further comprise receiving, via the user-interface device, an indication of a second user-interaction with the second GUI, the second GUI including the third interface element and not including the first interface element and the second interface; responsive to determining the second user-interaction with the second GUI being the user-gesture associated with the second direction, generating on the second interface element, a third recommendation icon and at least a fourth recommendation icon, the third recommendation icon to be displayed in its entirety and the at least the fourth recommendation icon to be at least partially displayed.

In some implementations, the third recommendation icon is the second recommendation icon.

In another aspect, there is provided a system for generating a content recommendation interface for a user of an electronic device, the method executable by the electronic device, the electronic device having at least one processor and a user-interface device coupled to the processor, the processor being configured to execute a browser application, the electronic device further comprising a network interface for connecting to a recommendation server via a communication network, the processor structured and configured to: receive, via the user-interface device, a first user-indication for activating the browser application; responsive to the first user-indication, generate on the user-interface device a first graphical user interface (GUI) of the browsing application, the first GUI comprising three simultaneously presented visual-interface elements disposed within the first GUI: a first interface element comprising an omnibox, the omnibox configured to receive at least one of a network address and a search query, the first interface element being located substantially in a center of the first GUI; a second interface element comprising at least one icon representing user-selected content, each of the at least one icons being linked to an associated network resource accessible via the communication network, the second interface element being spaced a first distance away, in a first direction, from the first interface element; a third interface element comprising at least one recommendation icon, the first recommendation icon associated with recommended content selected, by the recommendation server, from a plurality of potentially recommendable content items, the third interface element being spaced a second distance away, in a second direction, from the first interface, the second direction being opposite to the first direction; receive, via the user-interface device, an indication of a first user-interaction with the first GUI; responsive to determining the first user-interaction being a user-gesture associated with the first direction, generate a second GUI, to be displayed in place of the first GUI, the second GUI including a portion of the first interface element located at an extremity of the second GUI located in the first direction; and the second interface element located such that the first distance is collapsed; and not including the third interface element; responsive to determining the first user-interaction being the user-gesture associated with the second direction, generate the second GUI, to be displayed in place of the first GUI, the second GUI including: the third interface element, such that at least one recommendation icon includes a first recommendation icon and at least a second recommendation icon, the first recommendation icon to be displayed in its entirety and the at least the second recommendation icon to be at least partially displayed; and not including the first interface element and the second interface element.

In other aspects, various implementations of the present technology provide a non-transitory computer-readable medium storing program instructions for interacting with a content element of a content stream, the program instructions being executable by a processor of a computer-based system to carry out one or more of the above-recited methods.

In other aspects, various implementations of the present technology provide a computer-based system, such as, for example, but without being limitative, an electronic device comprising at least one processor and a memory storing program instructions for interacting with a browser application, the program instructions being executable by one or more processors of the computer-based system to carry out one or more of the above-recited methods.

In the context of the present specification, unless expressly provided otherwise, a “computer system”, an “electronic device”, a “mobile device”, “a device”, a “server”, a “remote server”, and a “computer-based system” are any hardware and/or software appropriate to the relevant task at hand. Thus, some non-limiting examples of hardware and/or software include computers (servers, desktops, laptops, netbooks, etc.), smartphones, tablets, network equipment (routers, switches, gateways, etc.) and/or combination thereof.

In the context of the present specification, unless expressly provided otherwise, the expression “computer-readable medium” and “memory” are intended to include media of any nature and kind whatsoever, non-limiting examples of which include RAM, ROM, disks (CD-ROMs, DVDs, floppy disks, hard disk drives, etc.), USB keys, flash memory cards, solid state-drives, and tape drives.

In the context of the present specification, a graphical user interface (GUI) may refer to an interface displayed on at least a portion of a screen of an electronic device allowing a user to interact with the electronic device through graphical icons and visual indicators. A user may interact with the graphical interface through direct manipulations of the graphical elements of the GUI. A graphical user interface may comprise at least one interface element, and an interaction with the graphical user interface may generate or make appear other graphical user interfaces.

In the context of the present specification an icon refers to an element of a graphical user interface, and may include images, videos, animation, text, widgets and any other content part of the graphical user interface.

In the context of the present specification, a content recommendation may refer to any algorithm able to recommend content to a user via a recommendation server. The recommendation server may use machine leanings algorithms such as artificial neural networks, bayesian statistics, gaussian process regression, decision trees and the like to recommend content to the user.

In the context of the present specification, a browser application may refer to a software application implemented on a mobile device used for retrieving, presenting and traversing information resources such as web pages, images, videos and other content on the World Wide Web. The browser application may refer to a stand alone application (app) or may be part of another application allowing viewing web content on the device. The browser application may comprise a user interface, a layout engine, a rendering engine, a JavaScript interpreter, a UI backend, a networking component and a data persistence component.

In the context of the present specification, unless expressly provided otherwise, an “indication” of an information element may be the information element itself or a pointer, reference, link, or other indirect mechanism enabling the recipient of the indication to locate a network, memory, database, or other computer-readable medium location from which the information element may be retrieved. For example, an indication of a document could include the document itself (i.e. its contents), or it could be a unique document descriptor identifying a file with respect to a particular file system, or some other means of directing the recipient of the indication to a network location, memory address, database table, or other location where the file may be accessed. As one skilled in the art would recognize, the degree of precision required in such an indication depends on the extent of any prior understanding about the interpretation to be given to information being exchanged as between the sender and the recipient of the indication. For example, if it is understood prior to a communication between a sender and a recipient that an indication of an information element will take the form of a database key for an entry in a particular table of a predetermined database containing the information element, then the sending of the database key is all that is required to effectively convey the information element to the recipient, even though the information element itself was not transmitted as between the sender and the recipient of the indication.

In the context of the present specification, an interface element located “substantially in a center” may refer to an interface element part of a GUI located in a middle region or close to a middle region within the GUI displayed by a browser application. An interface element located at an “extremity” may refer to an interface element part of GUI located at an edge region or close to an edge region within the GUI displayed by a browser application. Interface elements may be located substantially in a center or at an extremity of the GUI of a browser application may not be necessarily be located as such relative to the displayable area of the screen of the device, as a device could run one or more programs simultaneously splitting the display screen in one or more areas, and a browser may only occupy a subset of the displayable area of the screen of the device. An interface element spaced a first distance away, in a first direction from another interface element may refer to an interface element that is at a certain distance in a certain direction on a certain axis, such as, but not limited to, the upward (bottom to top) or downward (top to bottom) direction on the vertical axis. A user-gesture associated with the first direction may refer to a user-gesture, such as a swipe movement, made to interact with the interface element, the swipe movement being along the same axis as the interface element, the swipe movement can be in the same direction (i.e. the first direction) or an opposite direction (i.e. the second direction) and will depend on how the device or the software on the device is implemented.

It should also be noted that, unless otherwise explicitly specified herein, the drawings are not to scale.

DETAILED DESCRIPTION

Referring toFIG. 1, there is shown a computer system100there is shown a computer system100suitable for use with some implementations of the present technology. In some embodiments, the computer system100is implemented as an electronic device210(shown atFIG. 2) in the form of a mobile device. The computer system100comprises various hardware components including one or more single or multi-core processors collectively represented by processor110, a graphics processing unit (GPU)111, a solid-state drive120, a random access memory130, a display interface140, and an input/output interface150. The computer system100may be a smartphone such as, but not limited to, an iPhone™ from Apple or Galaxy™ from Samsung. The computer system100may also be a tablet, such as, but not limited to, an iPad™ from Apple or Galaxy Tab™ from Samsung. Generally speaking, the computer system100may be, amongst other things, be an “electronic device”, a “mobile device”, “a device”, are any hardware and/or software appropriate to the relevant task at hand. As a person in the art of the present technology may appreciate, multiple variations as to how the computer system100is implemented may be envisioned without departing from the scope of the present technology.

Communication between the various components of the computer system100may be enabled by one or more internal and/or external buses160(e.g. a PCI bus, universal serial bus, IEEE 1394 “Firewire” bus, SCSI bus, Serial-ATA bus, ARINC bus, etc.), to which the various hardware components are electronically coupled. A display interface140may be coupled to a display (not shown) via a cable or a bus. The display may also equally be referred to as a screen.

The input/output interface150may be coupled to a touchscreen190and/or to the one or more internal and/or external buses160. The touchscreen190may be part of the display. In some embodiments, the touchscreen190is the display. The computer100with the touchscreen190may be referred to as a user-interface device. In the embodiments illustrated inFIG. 1, the touchscreen190comprises touch hardware194(e.g., pressure-sensitive cells embedded in a layer of a display allowing detection of a physical interaction between a user and the display) and a touch input/output controller192allowing communication with the display interface140and/or the one or more internal and/or external buses160. In some embodiments, the input/output interface150may be connected to a keyboard (not shown) allowing the user to interact with the computer system100in addition of the touchscreen190.

According to implementations of the present technology, the solid-state drive120stores program instructions suitable for being loaded into the random access memory130and executed by the processor110and/or the GPU111for allowing a user to interact with a content element of a content stream by executing a content stream display application. In some embodiments, the content stream display application may equally be referred to as a recommendation application. For example, the program instructions may be part of a library or an application.

Generally, but not limitatively, the computer system100may execute an operating system, such as Apple iOS™ 9 for Apple iPhone™ devices, or Android Marshmallow™ for Samsung™ Galaxy™ devices. Moreover, a browser application215(depicted inFIG. 1) may be implemented on top of the operating system according to programming standards and languages such as, but not limited to Swift or Objective-C for iOS devices or Android Java for devices running Android OS.

Generally speaking, the purpose of the browser application215is to enable a user (such as a user170depicted inFIG. 2) to interact with (or otherwise visualize) a content stored in the memory (such as random access memory130) of the computer system100, as will be described in greater detail herein below.

How the browser application215is implemented is not particularly limited. The browser application215can be an application downloaded from a so-called app store, such as, but not limited to, an App Store™ from Apple and/or Google Play™ Store from Google and installed/executed on the computer system100. It should be expressly understood that the browser application215can be accessed using any other suitable means.

Turning now toFIG. 2, there is shown a networked computing environment200suitable for use with some implementations of the present technology. The networked computing environment200comprises an electronic device210running the browser application215. The electronic device210can be associated with a user170. In some embodiments, the electronic device210is implemented so as to include at least some of the components of the computer system100. Throughout the present document, the electronic device210may equally be referred to as the computer system100and vice-versa. The networked computing environment200may comprise a server222in communication with the electronic device210via a communication network220. The networked computing environment200may contain more servers and/or more electronic devices without departing from the scope of the present technology. The number of servers and the type of architecture is therefore not limitative to the scope of the present technology.

In one embodiment, a communication channel (not depicted) between the electronic device210and the server222may be established to allow data exchange. Such data exchange may occur on a continuous basis or, alternatively, upon occurrence of certain events. For examples, in the context of (i) generating content recommendations to be presented to the user170; and/or (ii) responding to user interactions with various interface elements. In some embodiments, the server222may generate data, such as, but not limited to, data allowing recommended content elements to be presented to the user170. The data generated by the server222may be transmitted to the electronic device210. Once received, the data may be processed by the electronic device210so as to create a recommended content stream to be presented on the touchscreen190of the electronic device210. In some embodiments, the user170, through the electronic device210, may interact with the one or more recommended content elements (or other elements of the browser application215and/or cause an action in connection with one or more recommended content elements of the content stream. As a result, the electronic device210may transmit data relating to such action to the server222. The server222, upon receiving the data from the electronic device210may undertake additional actions, such as a storing of the received data and/or providing new recommended content elements to the user170and/or provide the user170with suggested resource links in response to search queries or usage history.

The server222may be implemented as a conventional computer server and may comprise some or all of the features of the computer system100depicted atFIG. 1. In an example of an embodiment of the present technology, the server222can be implemented as a Dell™ PowerEdge™ Server running the Microsoft™ Windows Server™ operating system. Needless to say, the server222can be implemented in any other suitable hardware and/or software and/or firmware or a combination thereof. In the depicted non-limiting embodiment of present technology, the server222is a single server. In alternative non-limiting embodiments of the present technology, the functionality of the server222may be distributed and may be implemented via multiple servers.

The implementation of the server222is well known to a person skilled in the art of the present technology. However, briefly speaking, the server222comprises a communication interface (not depicted) structured and configured to communicate with various entities (such as the electronic device210, for example and other electronic devices potentially coupled to the network) via the network. The server222further comprises at least one computer processor (e.g., a processor110of the server222) operationally connected with the communication interface and structured and configured to execute various processes.

Merely as an example and not as a limitation, in those embodiments of the present technology where the electronic device210is implemented as a wireless communication device (such as a smartphone or a tablet), the communication link can be implemented as a wireless communication link (such as but not limited to, a 3G communication network link, a 4G communication network link, Wireless Fidelity, or WiFi® for short, Bluetooth® and the like). As a person skilled in the art of the present technology may appreciate, multiple variations may be envisioned without departing from the scope of the present technology.

Reference is now made toFIG. 3wherein a first graphical user interface (GUI)300is displayed on the electronic device210for example via the browser application215running on the electronic device210. The first GUI300may be directly presented to the user170when the user170activates the browser application215. In some embodiments, the first GUI300may be presented to the user170after receiving an indication, from a button on the browser application215or from another application (not depicted). The first GUI300may generally comprise three visual-interface elements: at least a portion of a first interface element310located in the middle, at least a portion of a second interface element320located at the top, and at least a portion of the third interface element330located at the bottom. The first GUI300may further comprise a first button302, a second button304and a background306.

The first interface element310may comprise a logo312, in this example the Yandex™ logo; an omnibox314and a microphone icon315that forms part of the omnibox314. The logo312may be a static image, a dynamic image or a video. The logo312may be an interactive element associated with an action; in this example the logo312is associated with a hyperlink directed to the Yandex™ search engine website. In some embodiments, the logo312may be associated with other actions of the browser application215, or may not be associated with any action. In other embodiments, there may be no logo312. The omnibox314may be directly linked to a search engine, such as the Yandex™ search engine, and may be configured to allow the user170to interact with the omnibox to input a search query and/or a network address, such as a Uniform Resource Locator (URL) of a website to access. In the depicted embodiment, the omnibox314is a combination of an address bar of the browser application215and a search engine input field. The microphone icon315may be used for entering a voice input via the electronic device210, which will be explained in detail below.

The part of the second interface element320displayed in the first GUI300may comprise a first icon321, a second icon322, a third icon323and a fourth icon324. Each one of the first icon321, the second icon322, the third icon323and the fourth icon324may comprise only a graphical representation, only a textual representation or a combination of graphical and textual representation of the associated network resource. In some embodiments, each one of the first icon321, the second icon322, the third icon323and the fourth icon324may be a static graphical representation, such as an image, or a dynamic graphical representation, such as an animated image. In the example ofFIG. 3, the first icon321may be the Facebook™ logo, the second icon322be a cloud icon with the text “weather” written below, the third icon323may be an e-mail icon with the text “e-mail” written below and the fourth icon324may be a shopping cart icon with no text written below. Each one of the first icon321, the second icon322, the third icon323and the fourth icon324may be linked to a respective network resource accessible via the communication network220. In the example depicted herein, each one of the first icon321, the second icon322, the third icon323and the fourth icon324may include hyperlinks to different websites, the first icon321may link to www.facebook.com, the second322icon may link to pogoda.yandex.ru, the third icon323may link to mail.yandex.com and the fourth icon324may link to market.yandex.ru. In some embodiments, at least one of the first icon321, the second icon322, the third icon323and the fourth icon324may be an icon or button for interacting with the first interface element310, such as, but not limited to, displaying user options or for navigating through the first GUI300, the second GUI400and the second GUI500.

In some embodiments of the present technology, the user170selects content of the links associated with the first icon321, the second icon322, the third icon323and the fourth icon324while consulting a network resource (not depicted). This selection can be executed by means of adding network resources to the first icon321, the second icon322, the third icon323and the fourth icon324directly while consulting a network resource in a window (not depicted) of the browser application215.

The part of the third interface element330displayed on the first GUI300may comprise at least a portion of a first recommendation icon340that may be associated with a recommended content (not numbered). The recommended content associated with the first recommendation icon340may have been selected by a recommendation server, such as the server222, from a plurality of potentially recommendable content items (not depicted). In the example depicted herein, the recommendation server is the Yandex™ Zen™ recommendation engine, and the first recommendation icon340is associated with a recommended content (not numbered) which may comprise a logo342, the logo342coming from the source of the recommended content and a title of the recommended content344.

In the example ofFIG. 3, the second interface element320is located at the top, and the third interface element330is located at the bottom of the screen190of the electronic device210(“top” and “bottom” being in the orientation depicted inFIG. 3). However, in alternative embodiments, the second interface element320can be located at one of a left and a right of the first interface element310and the third interface element330can be located at the other one of the left and the right of the first interface element310.

In some embodiments, even though the second interface element320and the third interface element330are not entirely visible to the user170, the user170may still interact with the second interface element320and the third interface element330in a similar way that she/he would have had if the second interface element320and the third interface element330were displayed in their entirety.

In some embodiments, where the electronic device210implements the touchscreen190, the user170may interact with the first GUI300by completing a swiping gesture on the screen of the electronic device210. The swiping gesture may be oriented in a first direction, the downward direction, from top to bottom (with respect to a point of view of the user170holding the electronic device210vertically) so as to cause a first visual transition resulting in a second GUI400(shown inFIG. 4) comprising the second interface element320and/or the first interface element310to be displayed (partially or entirely) instead of the first GUI300. In some embodiments, the first direction may be the upward direction, from bottom to top (with respect to a point of view of the user170holding the electronic device210vertically).

Conversely, a swiping gesture oriented in a second direction, the upward direction, from bottom to top causes a second visual transition resulting in a second GUI500(shown inFIG. 5) comprising the third interface element330to be displayed (partially or entirely) instead of the simultaneous display of the first interface element310, the second interface element320and the third interface element330as on the first GUI300. In some embodiments, the second direction may be the downward direction, from top to bottom (with respect to a point of view of the user170holding the electronic device210vertically).

As a result, in some embodiments, the user170may navigate through the first interface element310, the second interface element320and the third interface element330forming the first GUI300by swiping in the first direction and/or the second direction, the first direction and the second direction being, in the embodiment illustrated atFIG. 3, along a vertical direction (e.g., upward direction and downward direction). Other variations as to how the user170may interact with the browser application (not depicted) may also be envisioned, such as, but not limited to swiping in other directions, providing feedback via the camera of the electronic device210without departing from the scope of the present technology.

Turning now toFIG. 4, the second GUI400presented after the user170executed a user-gesture associated with the first direction, the downward direction, is depicted. The second GUI400may comprise the portion of the second interface element320, as visible in the first GUI300, and another portion of the second interface element420, which was not visible in the first GUI300. The part of the second interface element320and the other part of the second interface element420make up the entire second interface element430. The second GUI400may have appeared after the user170made a swipe gesture associated with the first direction, the downward direction (not depicted). The second GUI400may be displayed such that a first distance (not numbered) between the first interface element310and the second interface element320(as depicted inFIG. 3) is collapsed, and such that the second GUI400does not include the third interface element330and the logo213. As such, the entire second interface element430may include the part of the second interface element320, with the part of the second interface element320comprising the first icon321, the second icon322, the third icon323and the fourth icon324, and may comprise the other part of the second interface element420, which comprises a fifth icon425, a sixth icon426, a seventh icon427and an eighth icon428. Generally, the other part of the second interface element420may have the same visual appearance as the part of the second interface element320, as the other part of the second interface element420is a continuation of the part of the second interface element320. As with the part of the second interface element320, the fifth icon425, the sixth icon426, the seventh icon427and the eighth icon428of the other part of the second interface element420may each comprise only a graphical representation, only a textual representation or a combination of graphical and textual representation of an associated network resource.

In some embodiments, each one of the fifth icon425, the sixth icon426, the seventh icon427and the eighth icon428may be a static graphical representation such as an image. In some embodiments, each one of the fifth icon425and the sixth icon426, the seventh icon427and the eighth icon428may be a dynamic graphical representation, such as, but not limited to a short video or GIF. In this example, the fifth icon425may be a newspaper icon linking to website news.yandex.ru, and the sixth icon426may be the Google logo with Gmail written below linking to mail.google.com. The seventh icon427may be the Macrumors logo linking to www.macrumors.com and the eighth icon428may be a lightbulb picture with the USTPO acronym linking to www.uspto.gov. In the example depicted herein, the second GUI400with the entire second interface element430may be used to associate and display the favorite or bookmarked network resources or websites of the user170, the history of internet browsing of the user170and/or other websites chosen by the user170for having a quick access to those websites in the form of icons. The icons (e.g. each one of the first icon321, the first icon321, the second icon322, the third icon323, the fourth icon324, the fifth icon425, the sixth icon426, the seventh icon427and the eighth icon428) of the entire the second interface element430may also be referred to as static icons, meaning they are associated with user-selected content and/or based on an action associated with the user, such as, but not limited to, previously consulted websites. There may be a pre-defined number of icons that can be chosen to be a portion of the second GUI400. In some embodiments, the pre-defined number of icons may depend on parameters associated with the electronic device210, such as, but not limited to, screen size, resolution and/or orientation.

Turning now toFIG. 5, there is depicted another version of the second GUI400, the second GUI500, being displayable after the user170has executed a user-gesture associated with the second direction, the upward direction, on the first GUI300. The second GUI500may comprise a logo520and an entire third interface element510, meaning the third interface element510may occupy the rest of the display space taken by the browser application215on the touchscreen190of the electronic device210. In the example depicted herein, the logo520is the Yandex™ Zen™ logo, placed above the entire third interface element510. In some embodiments, the logo520may be another interactive element associated with an action. In other embodiments, the logo520may be omitted altogether or be placed at a different location (for example, below the third interface element510or within the third interface element510).

The entire third interface element510may comprise an entire first recommendation icon540and a portion of a second recommendation icon550. The entire first recommendation icon540may include the part of the first recommendation icon340displayed on the first GUI300and the rest of the first recommendation icon (not numbered), which was not visible on the first GUI300. A recommendation icon can be referred to as a dynamic recommendation icon, meaning the icon and its content may be defined and suggested by way of a machine-learning algorithm without user-actions or with minimal user-actions. Generally, the entire third interface element510may be a recommended content stream (not numbered) comprising at least one recommendation icon associated with the recommended content. A recommendation icon may be displayed in the form of a card, where dynamic content and data types from different sources may be displayed in a standardized interactive format to facilitate browsing recommended content in a recommended content stream. The entire first recommendation icon540may be associated with recommended content and may comprise a logo342, the logo342coming from the source of the recommended content. In some embodiments, the logo342may be omitted or be placed at a different location. The entire first recommendation icon540may comprise a title of the recommended content344. The entire first recommendation icon540may further comprise an excerpt of the recommended content546. The entire first recommendation icon540may further comprise an option button548, the option button548giving access to options for the recommended content (not depicted). The entire first recommendation icon540may act as a hyperlink (not depicted) to the recommended content, which the user170may access by tapping on any part of the entire first recommendation icon540, which may trigger the browser application215to open a third GUI (not depicted) for displaying the recommended content item as hosted by the source of the recommended content item (in the depicted illustration, a web page with the recommended article). In some embodiments, a recommendation icon could be divided in more recommendation icons. In other embodiments, a recommendation icon could expand to reveal more content, responsive to a user-gesture such as, but not limited to, a long press gesture or a double tap touch gesture. In some embodiments, a user-gesture may be determined to be a long press if a touch user-gesture is over a pre-determined threshold of time.

In some embodiments, the hyperlink (not depicted) may trigger the electronic device210to open an application associated with the recommended content. Positioned underneath the entire first recommendation icon540may be a portion of a second recommendation icon550being part of the entire third interface element510. As with the entire first recommendation icon540, the part of a second recommendation icon550may be associated with another recommended content (not numbered) and may comprise a logo552, a title554and a portion of an excerpt of the other recommended content556. In some embodiments, the entire third interface element510may comprise other recommended content than news articles, such as social media posts, RSS feeds, electronic messages, information associated with the user and its localisation such as weather, traffic, directions, or any other relevant information.

Reference is now made toFIG. 6which schematically depicts a recommended content stream600associated with the third interface element330. As depicted inFIG. 6, at any given time at least a portion of the recommended content stream600(namely, the content element n) is displayed on the electronic device210(for example by the browser application215), while other portions of the recommended content stream600(namely content element n−1 and content element n+1) are available for displaying.

In order to facilitate understanding of how the recommended content stream600is structured and how the user170may interact with the recommended content stream600, a recommendation icon602is represented as a content element n, which may be, as an example, the second recommendation icon550, after the user has swiped his/her finger to display the entire content of the second recommendation icon550. A previous recommendation icon604and a next recommendation icon606are also represented. The previous recommendation icon604is represented as a content element n−1, which may be the first recommendation icon540. The next recommendation icon606is represented as a content element n+1, which may be a third recommendation icon (not numbered).

The recommendation icons602,604,606are aligned so as to define a vertical recommended content stream600when a user, for example the user170, holds the electronic device210. The recommendation icon602represented by content element n is defined by a rectangle positioned so that it is entirely displayed on the screen of the electronic device210. As a result, the recommendation icon602represented by content element n may be defined as being an active content element as it is entirely visible to the user170. In addition, the user170may also interact with the recommendation icon602, for example to provide feedback associated with the recommendation icon602and/or to cause an action in relation with recommendation icon602.

In the example ofFIG. 6, a bottom portion of the recommendation icon604and a top portion of the recommendation icon606are also visible. In some embodiments, even though the recommendation icons604and606are not entirely visible to the user170, the user170may still interact with the recommendation icons604and606in a similar way than she/he would have had with the recommendation icon602. In some embodiments, the user170may interact with the recommended content stream600by completing a swiping gesture on the touch hardware194of the electronic device210. The swiping gesture may be oriented in the second direction from bottom to top (with respect to a point of view of a user holding the electronic device210vertically) so as to cause a third visual transition resulting in the recommendation icon606to be displayed (partially or entirely) instead of the recommendation icon602.

Conversely, a swiping gesture associated with the first direction from top to bottom causes a fourth visual transition resulting in the recommendation icon604to be displayed (partially or entirely) instead of the recommendation icon602. As a result, in some embodiments, the user170may navigate through multiple recommendation icons forming the recommended content stream600by scrolling the recommended content stream600in the first direction and/or the second direction, the first direction and the second direction being, in the embodiment illustrated atFIG. 6, along the vertical direction (e.g., upward direction and downward direction). Other variations as to how the user170may interact with the recommended content stream600are also envisioned without departing from the scope of the present technology, including embodiments where the user170interacts with the recommended content stream600and/or the recommendation icons602,604,606through interfaces of the electronic devices210other than the touchscreen190(for example, via voice commands, remote visual gestures, mouse, keyboard, a pointing device, etc).

In some embodiments, the recommended content stream600may be organized so that the recommendation icons602,604,606comprising the recommended content elements are organized in a particular fashion, for example, but without being limitative, in a chronological order or in a priority order, such as an order of relevancy to the user170. Alternatively, recommendation icons602,604,606could be organized by source clusters such as news first, blogs posts next, etc. In some embodiments, the organization of the recommended contents may be chosen by the user170so as to display certain categories of recommended content before others. As an example, the recommendation icon602may be associated with current information, the recommendation icon604may be associated with older information and the recommendation icon606will be associated with newer information. Other variations as to how the content elements may be ordered may be envisioned without departing from the scope of the present technology, including an embodiment wherein the recommendation icons are simply not organized in any fashion.

In some embodiments, the browser application215running on the electronic device210may comprise a content aggregator type module capable of sourcing media content from any suitable number of data sources. In some embodiments, the sourcing is directly conducted by the electronic device210. In some alternative embodiments, the sourcing is conducted by the server222and/or jointly by the electronic device210and the server222. The sourced media content may be processed by the electronic device210and/or the server222to generate recommendation icons associated with content elements, such as the recommendation icons602,604,606. In some embodiments, such media content may be referred to as media asset. The sourced content may be any suitable media such as, for example, printed media, video media and/or audio media. In such embodiments, the recommended content stream600may define a media asset feed. In some alternative embodiments, the recommendation icons associated with content elements may be generated from other resources, for example from one or more social networks. Other variations may also be envisioned as to what type of information and/or source of information may be used to generate the content elements without departing from the scope of the present technology.

In some embodiments, each one of the recommendation icons602,604,606comprises information which allows the user170to determine whether she/he wishes to learn more about a topic associated with the information. For example, one of the recommendation icons602,604,606may represent a succinct article. When viewed by the user170, the one of the recommendation icons602,604,606comprises enough information so that the user170is enabled to make a judgment as to whether she/he wants to take an action in connection with the one of recommendation icons602,604,606.

In yet some alternative embodiments, the recommendation icon602,604,606associated with the content element may be divided into portions, each one of the portions being associated with a different media asset and/or a different piece of information and/or a different type of information. Alternatively, multiple media assets and/or pieces of information and/or types of information may be presented on a single content element. Multiple variations and arrangements may be therefore envisioned without departing from the scope of the present technology.

Turning now toFIG. 7, there is depicted the second GUI500after the user170has swiped in the second direction, the upward direction, and slightly swiped in the first direction, the downward direction, which may have caused appearance of: a more cards button730and a back button740. In the example depicted herein, the second GUI500ofFIG. 7includes a third recommendation icon710and a portion of a fourth recommendation icon720. The third recommendation icon710comprises a source logo712, a title714, a text715, a picture716and an options button718. The part of the fourth recommendation icon720comprises a source logo722, a title724and a text725. Superimposed at the bottom of the part of the fourth recommendation icon720are the more cards button730and the back button740, the more cards button730and the back button740appearing when the user170executed a short swipe in the first direction. The more cards button730may be associated with an action to display more recommendation icons cards by the recommendation system of the browser application215. The back button740may be associated with an action to automatically scroll back to the first GUI300.

Turning now toFIG. 8, there is depicted the first GUI300with the user170having selected the omnibox314of the first interface element310in accordance with an embodiment of the present technology. The browser application215of the electronic device210, having received a touch user-gesture indication on the omnibox314, may display an application keyboard830for the user170to type a search request or a URL. The omnibox314may further comprise a microphone icon315, the microphone icon315for entering a voice input via the microphone of the electronic device210. The application keyboard830may be a default application keyboard from the OS of the electronic device210, a default application keyboard of the browser application215, or another application keyboard allowing the user to input a text query. In some embodiments, the application keyboard830may not be present, as the electronic device210may have detected that a physical keyboard (not depicted) has been attached to the electronic device210.

Turning now toFIG. 9a-9c, there is depicted an embodiment where the user170has selected the microphone icon315of the first GUI300to input a voice input via the electronic device210. A voice input screen900, which is part of the browser application215, may be presented to the user170. The voice input screen900may comprise a cancel icon910, a text indication920reading “Speak now”, a microphone icon930, a done button940and an application keyboard button950. The user170may speak into the microphone (not depicted) of the electronic device210to input a voice-based command. The user170may receive a feedback animation icon960while she/he is speaking, as depicted inFIG. 9b. The feedback animation icon960may indicate that the electronic device210is receiving the voice input. The user170may then select a done button940to indicate that she/he has finished speaking her/his voice request, and the browser application215may then process the voice request by displaying a processing text970and an animated progress icon980, as depicted inFIG. 9c. The animated progress icon980may indicate how far the browser application215is in the processing of the voice request, the animated progress icon980being in the form of a microphone with a progress bar vertically filling the animated progress icon980. In some embodiments, the voice input screen900may appear on a portion of the first GUI300. In other embodiments, the user170may speak requests other than search requests, such as action requests to access the second interface element320or the third interface element330.

Turning now toFIG. 10, there is depicted a search term1020being typed in the omnibox314of the first GUI300in accordance with an embodiment of the present technology. After having received a touch user-gesture indication on the omnibox314as depicted inFIG. 8, the user170may start entering the search term1020via the application keyboard630in the omnibox314. The omnibox314, having received an indication of keying events on the application keyboard630, may replace the microphone icon315by a second icon1030, the second icon1030being associated with an action to delete the search term1020. The omnibox314may further comprise a third icon1040, the third icon1040being an icon to indicate to switch tabs in the browser application215. As the search term1020is being typed in the omnibox314, the browser application215may display search suggestions1010associated with the search term1020. In this example, the search term has been typed as “how to” and a list of search suggestions1010are presented, the list containing search suggestions1010related to the search term1020such as “how to install mod”, “how to survive”, “how to be single”, “how to write a motivation letter”, “how to basic”, “how to get away with murder”, “how to green” and “how to be single”. The user170may select a suggested term1015if the suggested term1015is related to what the user170planned on typing.

Reference is now made toFIG. 11, which depicts a scenario where the user170has performed a long press on any one of the first icon321, the second icon322, the third icon323, the fourth icon324, the fifth icon425and the sixth icon426of the second GUI400in accordance with an embodiment of the present technology. The user170may want to add, move, modify or delete at least one icon associated with a network resource in the entire second interface element430by performing a long press on any one of the icons, and responsive to the long press, the browser application215may display a first icon indicator1110and a second icon indicator1120on each one of the first icon321, the second icon322, the third icon323, the fourth icon324, the fifth icon425and the sixth icon426. The first icon indicator1110may be located on the top left corner of the icon and indicate an action to delete the respective icon from the entire second interface element430. The second icon indicator1120may be located at the bottom right of the icon and depict a pin icon, which indicates an action to pin the icon on the entire second interface element430such that the pinned icon remains on the entire second interface element430. The user170may return to the second GUI400by tapping on a portion of the second GUI400other than one of the first icon321, the second icon322, the third icon323, the fourth icon324, the fifth icon425and the sixth icon426.

Turning now toFIG. 12a-12c, there is depicted a first transition between the first GUI300and the second GUI400in accordance with an embodiment of the present technology. The user170may want to move to the entire second interface element430of the browser application215to select a predefined icon (one of the first icon321, the second icon322, the third icon323, the fourth icon324, the fifth icon425and the sixth icon426) to access a network resource. The user170may start to swipe, from any place within the limits of the screen (not depicted) of the electronic device210, in the first direction, the downward direction. As the user170starts sliding her/his finger in the first direction for a first pre-defined threshold number of pixels, the part of the second interface element320and the third interface element330may start to animate by moving in the first direction, as depicted inFIG. 12a, and as the finger moves a certain pre-defined threshold number of pixels, a first space1210may start to shrink and the logo312may start to slowly fade out. Animation, as referred in the context of the present technology, may refer to the process of making the illusion of motion and change in user-interface elements by means of rapid display of a sequence of static user-interface elements that differ from each other. As the user170continues to move her/his finger in the first direction for a second pre-defined threshold number of pixels, as depicted inFIG. 12b, the part of the second interface element320may continue to move down, revealing the other part of the second interface element420and the omnibox314may continue to move down. At this stage, the logo312and the third interface element330may have disappeared, with the first space1210shrinking to become the second space1220. As the user170continues to move his finger in the first direction for a third pre-defined threshold number of pixels, as depicted inFIG. 12c, the entire second interface element430may now have appeared, and the part of the third interface element330may have disappeared from the screen of the electronic device210. Finally, the first transition may end with second GUI400, as depicted inFIG. 4. As it may be understood, if the user changes her/his mind and starts moving her/his finger in the second direction, the opposite of the process described herein may happen.

Turning now toFIG. 13a-13c, there is depicted a second transition between the first GUI300and the second GUI500in accordance with an embodiment of the present technology. Starting from the first GUI300, the user170may want to find recommended content to peruse, such as a news articles. As with the situation inFIG. 12a-12c, the user170may start to swipe, from any place within the limits of the screen of the electronic device210, in the second direction, the upward direction, to make a second transition to the second GUI500. As the user170starts swiping her/his finger in the second direction for a third pre-defined threshold number of pixels, the part of the second interface element320and the third interface element330may start to animate by moving in the second direction, hiding a portion of the second interface element320and revealing another part of the third interface element330. At the same time the space1310may start to shrink and the logo312may start to slowly fade out. As the user170continues to move her/his finger in the second direction for a fifth pre-defined threshold number of pixels, as depicted inFIG. 12b, the space1310may shrink into the space1320and the part of the second interface element320may continue to move up to disappear from the screen of the electronic device210, revealing more of the other part of the third interface element330as the omnibox314also continues to move up. As the user170continues to move her/his finger in the second direction for a sixth pre-defined threshold number of pixels, as depicted inFIG. 12c, the entire second interface element420may now have appeared, and the part of the third interface element330may have disappeared. Finally, the second transition may end with second GUI500, as depicted inFIG. 5. As it may be understood, if the user changes her/his mind and starts moving her/his finger in the second direction, the opposite of the process described herein may happen.

FIG. 12a-12candFIG. 13a-13cwere examples of the first transition from the first GUI300to the second GUI400and the second transition from the first GUI300to the second GUI500respectively. As it may be understood, the transitions were described as discrete steps, but may appear as continuous transition animations when implemented on the electronic device210.

Reference is now made toFIG. 14, which depicts an example of how the browser application215and/or the electronic device210may be configured to provide response to user gestures on the first GUI300of the electronic device210in accordance with an embodiment of the present technology.

Generally, the user170may interact with the electronic device210and the browser application215via touch-based input events such as tapping, pinching, panning or dragging, swiping, rotating, long press, or pressure press on the screen of the electronic device210with her/his fingers or with an electronic pencil. In the example depicted herein, the user170may generally interact with the electronic device210by tapping on an interface element, such as interface element310,320and330, or swiping to go from one of the interface elements310,320and330to another interface element310,320and330.

The browser application215may be configured in such a way as to provide scrolling animation in response to a swiping event, as described previously inFIG. 12a-candFIG. 13a-c. Generally, but not limitatively, the electronic device210may be able to return the following information in the case of a touch event: the view or windows in which the touch occurred, the location of the touch in (x,y) coordinates within the view or window, the approximate radius of the touch and the force of the touch, a timestamp indicating when the touch occurred, the number of times the user tapped on screen, and the phase of the touch indicating if the touch began, moved or ended, all depending on how the electronic device210is implemented.

As an example, the first GUI300may have coordinates1411associated the first interface element310, coordinates1412associated with the second interface element320and coordinates1413associated with the third interface element330. Each one of the first interface element310, the second interface element320and the third interface element330may be aware where each other is located, and may respond to a swipe user-gesture by moving relative to each other and transmit feedback information such as coordinates and time to each other. To detect a swipe movement, the browser application215may be implemented to detect a first location1422(x1, y1, t1) of the finger1150of the user170on the screen of the electronic device210and store it in memory, detect at least one mid location (xn, yn, tn) (not depicted) of the finger1150and detect an end location1426(x2, y2, t2) of the finger1150of the user170to compute at least one delta value (between the first location and the end location). Based on this information, the browser application215is configured to determine: if a swipe movement distance1420is in a given direction, such as the upward direction1425, if it is over a pre-determined threshold of distance and/or time.

As described respectively inFIG. 12a-candFIG. 13a-c, the different interface elements may start transitioning responsive to the swipe gesture being over a pre-determined threshold of distance in pixels and/or over a pre-determined threshold of time. Generally, the movement and the distance traveled by the different interface elements310,320and330during an animated transition may be proportional to the distance traveled by the finger of1150of the user170during the swiping movement, such as the swipe movement distance1420. The speed of the animation may depend on or be proportional to the difference of time associated with the start location (such as start location1422) and the end location (such as end location1426) of the swipe movement. In some alternative embodiments, the speed of the animation does not need to depend on the swipe movement. The browser application215may be configured to, if the finger1150of the user170during the swipe movement has traveled a distance that is over a threshold of distance and/or time, complete the animation starting from the first GUI300going to the second GUI400or the second GUI500, and vice versa. In the opposite case, if the finger1150of the user170during the swipe movement has traveled the distance that is under a threshold of distance and/or time, the animation may return to where it started (e.g. to the first GUI300if the user170wanted to display the second GUI400).

In some embodiments, the finger1150of the user170may start to swipe from the start location1422, and the browser application215may be configured to consider the rest of the distance1415as 100% of the screen, such that the swipe movement distance1420is considered relatively to the rest of the distance1415having the same effect as if the user170started to swipe from the bottom of the screen distance1410and covered a longer swiping distance, which allows a better user experience.

The user170may further scroll by swiping her/his finger through the second GUI500to see new recommendation icons associated with new recommended content selected by the recommendation server, as explained inFIG. 6.

FIG. 15shows a flowchart illustrating a computer-implemented method1500for generating a GUI in a browser application for a user of an electronic device. In some embodiments, the method1500may be (completely or partially) implemented on the browser application215running the electronic device210.

Step1502: Receiving a First User-Indication for Activating the Browser Application

The method1500starts at a step1502by receiving, via the user-interface device, a first user-indication for activating the browser application. The first user-indication may come directly from the user170pressing the icon of the browser application215on her/his electronic device210, or may come from another application the user170is running on her/his electronic device210. In some embodiments, the user170may have started the browser application on her/his electronic device210via another electronic device, such as a computer, a tablet, a wearable device, etc.

Step1504: Generating a First Graphical User Interface (GUI) of the Browsing Application, the First GUI Comprising Three Simultaneously Presented Visual-Interface Elements Disposed within the First GUI

At a step1504, responsive to the first user-indication, the electronic device210may start the browser application215and generate a first GUI300of the browser application215, the first GUI300comprising three simultaneously presented visual interface elements disposed within the first GUI: a first interface element310being an omnibox314, the omnibox314configured to receive any one of a network address and a search query, the first interface element310being located substantially in a center of the first GUI300, a second interface element320being at least one icon representing user-selected content, each of the at least one icons being linked to an associated network resource accessible via the communication network220, the second interface element320being spaced a first distance away, in a first direction, from the first interface element310and a third interface element330being at least one recommendation icon, the first recommendation icon340associated with recommended content selected, by the server222, from a plurality of potentially recommendable content items, the third interface element330being spaced a second distance away, in a second direction, from the first interface element310, the second direction being opposite to the first direction.

In some embodiments, if the user170has the electronic device210rotated in landscape mode, only a subset of the first GUI may be displayed, such as first interface element310and the second interface element320, not including the third interface element330. The method1500may then proceed to step1506.

Step1506: Receiving an Indication of a First User-Interaction with the First GUI

A step1506, after a certain period of time, the user170may want to interact with the first GUI300for a variety of reasons: the user170may want to access a network resource via the omnibox314, make a search via the omnibox314, access a network resource in the second interface element320or access recommended content in the third interface element330. The browser application215may receive an indication of a first user-interaction with the first GUI. The method1500may then go to a step1510, a step1512, a step1514, a step1516or a step1518.

STEP1510: responsive to the first user-interaction being a user-gesture associated with the first direction, generating a second GUI, to be displayed in place of the first GUI, the second GUI including the first interface element and the second interface element.

The user170may want to actuate the browser application215to the second interface element320to access a previously saved icon linked to a network resource. The user170may swipe the screen in the first direction, a downward direction. At a step1510, responsive to the user-interaction being a user-gesture associated with the first direction, the browser application215may generate a second GUI400, wherein the first GUI300may transition to the second GUI400in the form of an animation, as explained inFIG. 12a-12c. The second GUI400includes the omnibox314located at an extremity of the second GUI400located in the first direction; and the entire second interface element430located such that the first distance is collapsed. Furthermore, the second GUI400does not include the third interface element330.

The user170may then access the desired network resource by tapping on the icon associated with the network resource, and third GUI (not depicted) may be generated by the browser application215, the third GUI being part of a new window of the browser application215. In some embodiments, the user170may want to move, delete or modify a icon on the entire second interface element430, and may do so by performing a long press user-gesture on any part of the second interface element420, as described inFIG. 11.

Step1512: Responsive to the First User-Interaction being the User-Gesture Associated with the Second Direction, Generating the Second GUI, to be Displayed in Place of the First GUI, the Second GUI Including the Third Interface Element.

The user170may want to explore the third interface element330to access a recommendation icon associated with a recommended content. The user170may swipe the screen in the second direction, an upward direction. At a step1512, responsive to the user-interaction being the user-gesture associated with the second direction, the browser application215may generate a second GUI500to be displayed in in place of the first GUI300, the second GUI500including the entire third interface element510, such that at least one recommendation icon includes a first recommendation icon540and at least a second recommendation icon550, the first recommendation icon540to be displayed in its entirety and the at least the second recommendation icon550to be at least partially displayed. Furthermore, the second GUI500does not include the first interface element310and the second interface element320. The user170may then continue swiping to access other recommendation icons, or may tap on a recommendation icon to access the recommended content that is associated with a network resource, and in response a third GUI may be generated by the browser application, the third GUI being part of a new window of the browser application215.

Step1514: Responsive to the First User-Interaction being a Touch User-Gesture on the Omnibox, Generating the Application Keyboard

The user170may touch the omnibox314to type a search request or a network resource address. At a step1514, in response, the browser application215may generate the application keyboard830to be part of the first GUI800, the first GUI800including the first interface element310being located substantially in a center of the first GUI800, the second interface element320and the application keyboard830to input a text in the omnibox314, as depicted inFIG. 8.

Step1516: Responsive to the First User-Interaction being a Touch User-Gesture on a Icon of the Second Interface Element, Generating a Third GUI

The user170may want to access a network resource associated with a icon of the second interface element320, and may directly touch the icon from the first GUI300. At a step1516, responsive to the first user-interaction being a touch user-gesture on the icon of the second interface element320, the browser application215may be configured to access the associated network resource linked to the icon by generating a third GUI, the third GUI being part of a new window of the browser application215. In some embodiments, the user170may directly want to access a network resource associated with a icon displayed on the second interface element320, visible from the first GUI300. Instead of swiping to the second GUI400, the user may directly touch the icon to access network resource linked to the static.

Step1518: Responsive to the First User-Interaction being a Touch User-Gesture on the Recommendation Icon of the Third Interface Element, Generating a Third GUI

The user170may want to access a network resource associated with the first recommendation icon340on the second interface element420, and may directly touch the icon from the first GUI300. At a step1518, responsive to the first user-interaction being a touch user-gesture on the recommendation icon of the third interface element, the browser application215may be configured to access the associated network resource linked to the recommendation icon by generating a third GUI, the third GUI being part of a new window of the browser application. In some embodiments, the user170may directly want to access a recommended content associated with a first recommendation icon340part of the third interface element330visible from the first GUI300. Instead of swiping to the second GUI500, the user may directly touch the first recommendation icon340to access network resource linked to the recommended content associated with the first recommendation icon340.

While the above-described implementations have been described and shown with reference to particular steps performed in a particular order, it will be understood that these steps may be combined, sub-divided, or re-ordered without departing from the teachings of the present technology. Accordingly, the order and grouping of the steps is not a limitation of the present technology.

As such, the methods and systems implemented in accordance with some non-limiting embodiments of the present technology can be represented as follows, presented in numbered clauses.

CLAUSE 1. A computer-implemented method (1500) of generating a content recommendation interface for a user (170) of an electronic device (210), the method (1500) executable by the electronic device (210), the electronic device (210) having a processor (110) and a user-interface device coupled to the processor (110), the processor (110) being configured to execute a browser application (215), the electronic device (210) further comprising a network interface for connecting to a recommendation server (222) via a communication network (220), the method (1500) comprising: receiving, via the user-interface device, a first user-indication for activating the browser application (215); responsive to the first user-indication, generating on the user-interface device a first graphical user interface (GUI) (300) of the browsing application, the first GUI (300) comprising three simultaneously presented visual-interface elements disposed within the first GUI (300): a first interface element (310) comprising an omnibox (314), the omnibox (314) configured to receive any one of a network address and a search query (1020), the first interface element (310) being located substantially in a center of the first GUI (300); a second interface element (320) comprising at least one icon representing user-selected content, each of the at least one icons being linked to an associated network resource accessible via the communication network (220), the second interface element (320) being spaced a first distance away, in a first direction, from the first interface element (310); a third interface element (330) comprising at least one recommendation icon, the first recommendation icon (340) associated with recommended content selected, by the recommendation server (222), from a plurality of potentially recommendable content items, the third interface element (330) being spaced a second distance away, in a second direction, from the first interface element (310), the second direction being opposite to the first direction; receiving, via the user-interface device, an indication of a first user-interaction with the first GUI (300); responsive to determining the first user-interaction being a user-gesture associated with the first direction, generating a second GUI (400), to be displayed in place of the first GUI (300), the second GUI (400) including: a portion of the first interface element (310) located at an extremity of the second GUI (400) located in the first direction; and the second interface element (320) located such that the first distance is collapsed; and not including the third interface element (330); responsive to determining the first user-interaction being the user-gesture associated with the second direction, generating the second GUI (500), to be displayed in place of the first GUI (300), the second GUI (500) including: the third interface element (330), such that at least one recommendation icon includes a first recommendation icon (540) and at least a second recommendation icon (550), the first recommendation icon (540) to be displayed in its entirety and the at least the second recommendation icon (550) to be at least partially displayed; and not including the first interface element (310) and the second interface element (320).

CLAUSE 2. The method (1500) of claim1, further comprising determining a proportion of the first GUI (300) dedicated to the second interface element (320) and the third interface element (330); and wherein the determining is based on a parameter of the user-interface device.

CLAUSE 3. The method (1500) of claim2, further comprising determining the first distance and the second distance; and wherein the determining is based on a parameter of the user-interface device.

CLAUSE 4. The method (1500) of claim1, further comprising receiving, from the recommendation server (222), an indication of the recommended content selected, by the recommendation server (222), from the plurality of potentially recommendable content items, the selection having been executed specifically for the user.

CLAUSE 5. The method (1500) of claim4, wherein the recommendation icon is linked to an associated recommended content item available from an associated network resource accessible via the communication network.

CLAUSE 6. The method (1500) of claim5, wherein responsive to the first user-interaction being a touch user-gesture on the recommendation icon of the third interface element (330), accessing the associated network resource linked to the recommendation icon by generating the third GUI, the third GUI being part of a new window of the browser application (215).

CLAUSE 7. The method (1500) of claim1, wherein the method (1500) further comprises, responsive to the first user-interaction being a touch user-gesture on the omnibox (314), generating the second GUI, the second GUI including: the first interface element (310) being located substantially in a center of the second GUI; the second interface element (320); and an application keyboard (830) for inputting a text in the omnibox (314).

CLAUSE 8. The method (1500) of claim1, wherein responsive to the first user-interaction being a touch user-gesture on the icon of the second interface element (320), accessing the associated network resource linked to the icon by generating a third GUI, the third GUI being part of a new window of the browser application (215).

CLAUSE 9. The method (1500) of claim1, further comprising displaying an edit screen of the second interface element (320) on the second GUI responsive to a long press user-gesture on the second interface element (320).

CLAUSE 10. The method (1500) of claim1, further comprising executing an animated transition between the first GUI (300) and the second GUI (400,500) responsive to the user-gesture.

CLAUSE 11. The method (1500) of claim5, further comprising determining a parameter of the animated transition, the parameter including at least a speed of transition, the determining comprising: receiving a first location and a first time (1422) of the user-gesture; receiving a second location (1426) and a second time (1426) of the user-gesture; determining the speed of transition by computing the difference between the second location (1426) and the first location (1422) and the difference between the second time (1426) and the first time (1422) of the user-gesture.

CLAUSE 12. The method (1500) of claim1, wherein the determining the first user-interaction being the user-gesture associated with the first direction comprises: receiving a first location of the user-gesture; receiving a second location of the user-gesture; and computing a difference between the second location and the first location of the user-gesture.

CLAUSE 13. The method (1500) of claim1, wherein the determining the first user-interaction being the user-gesture associated with the second direction comprises: receiving a first location of the user-gesture; receiving a second location of the user-gesture; and computing the difference between the second location and the first location of the user-gesture.

CLAUSE 14. The method (1500) of claim1, wherein responsive to receiving an indication of the user (170) rotating the electronic device (210) to a second orientation, displaying a subset of the first GUI (300) as the first GUI (300).

CLAUSE 15. The method (1500) of claim1, wherein responsive to receiving an indication of the user (170) rotating the electronic device (210) to the second orientation, displaying a superset of the first GUI (300) as the first GUI (300).

CLAUSE 16. The method (1500) of claim1, further comprising:

receiving, via the user-interface device, an indication of a second user-interaction with the second GUI (500), the second GUI (500) including the third interface element (330) and not including the first interface element (310) and the second interface element (320);

responsive to determining the second user-interaction with the second GUI (500) being the user-gesture associated with the second direction, generating on the second interface element (320), a third recommendation icon (710) and at least a fourth recommendation icon (720), the third recommendation icon (710) to be displayed in its entirety and the at least the fourth recommendation icon (720) to be at least partially displayed.

CLAUSE 17. The method (1500) of claim15, wherein the third recommendation icon (710) is the second recommendation icon (550).

CLAUSE 18. A system (200) for generating a content recommendation interface for a user (170) of an electronic device (210), the electronic device (210) having at least one processor (110) and a user-interface device coupled to the processor (110), the processor (110) being configured to execute a browser application (215), the electronic device (210) further comprising a network interface for connecting to a recommendation server (222) via a communication network (220), the processor (110) being structured and configured to: receive, via the user-interface device, a first user-indication for activating the browser application (215); responsive to the first user-indication, generate on the user-interface device a first graphical user interface (GUI) (300) of the browsing application, the first GUI (300) comprising three simultaneously presented visual-interface elements disposed within the first GUI (300): a first interface element (310) comprising an omnibox (314), the omnibox (314) configured to receive any one of a network address and a search query (1020), the first interface element (310) being located substantially in a center of the first GUI (300); a second interface element (320) comprising at least one icon representing user-selected content, each of the at least one icons being linked to an associated network resource accessible via the communication network (220), the second interface element (320) being spaced a first distance away, in a first direction, from the first interface element (310); a third interface element (330) comprising at least one recommendation icon, the first recommendation icon (340) associated with recommended content selected, by the recommendation server (222), from a plurality of potentially recommendable content items, the third interface element (330) being spaced a second distance away, in a second direction, from the first interface element (310), the second direction being opposite to the first direction; receive, via the user-interface device, an indication of a first user-interaction with the first GUI (300); responsive to determining the first user-interaction being a user-gesture associated with the first direction, generate a second GUI (400), to be displayed in place of the first GUI (300), the second GUI (400) including: a portion of the first interface element (310) located at an extremity of the second GUI (400) located in the first direction; and the second interface element (320) located such that the first distance is collapsed; and not including the third interface element (330); responsive to determining the first user-interaction being the user-gesture associated with the second direction, generate the second GUI (500), to be displayed in place of the first GUI (300), the second GUI (500) including: the third interface element (330), such that at least one recommendation icon includes a first recommendation icon (540) and at least a second recommendation icon (550), the first recommendation icon (540) to be displayed in its entirety and the at least the second recommendation icon (550) to be at least partially displayed; and not including the first interface element (310) and the second interface element (320).

It should be expressly understood that not all technical effects mentioned herein need to be enjoyed in each and every embodiment of the present technology. For example, embodiments of the present technology may be implemented without the user enjoying some of these technical effects, while other embodiments may be implemented with the user enjoying other technical effects or none at all.