Device and method for changing display of page header and search bar according to web page scrolling, and recording medium

Abstract

The present disclosure presents an electronic device for changing a page header and search bar display method according to web page scrolling. The electronic device according to one embodiment of the present disclosure comprises: one or more processors; and one or more memories on which instructions to be executed by the one or more processors are stored, wherein, when the instructions are executed, the one or more processors can acquire a request of user for access to a first web page of an e-commerce service, generate web page information to be used in outputting the first web page including first content, a page header and a search bar, and transmit the web page information to a terminal of the user.

Description

Device, method, and recording medium for changing the display of a page header and a search bar according to the scrolling of a web page

[0001] The present disclosure relates to a technique for changing the display of a page header and a search bar as a web page is scrolled.

[0002] With the widespread use of the Internet, e-commerce services are expanding rapidly. This phenomenon is occurring in tandem with a decrease in the proportion of product purchases made through traditional offline stores, while the proportion of purchases made via e-commerce platforms using computers or smartphones is rising sharply.

[0003] Web pages provided by e-commerce services typically include page headers and search bars. However, if page headers and search bars occupy a significant portion of the web page, the actual content area available for display to users may be reduced. For example, when web pages are displayed on small screens such as smartphones, a large area occupied by page headers and search bars can lead to a decrease in the display area for content. In such cases, the actual product list may not be visible on the smartphone screen, degrading the user experience and making product browsing cumbersome, which could result in an increased abandonment rate. Therefore, it is required to display page headers and search bars while still securing sufficient content display area to avoid compromising the user experience.

[0004] To address the issue where page headers and search bars occupy a large area within a web page, thereby reducing the content display area, the transparency of the page headers and search bars can be adjusted. For example, if the transparency of the page headers and search bars exceeds a certain level, the content overlaid by them may be visible to the user. Additionally, when certain conditions are met, the display of the search bar within the web page can be removed or restored to secure additional content display area.

[0005] Furthermore, to encourage users to focus more on the content and increase the purchase rate of related products, it is necessary to apply visual effects to the content displayed on the web page. For example, visual effects can be applied by adjusting the transparency of text within the content over time or by gradually enlarging the size of images included in the content. Through this, users become more focused on the content, which can lead to an increase in product purchase rates.

[0006] The present disclosure proposes a method for changing the display method of a page header and a search bar as a web page is scrolled. A method according to one embodiment of the present disclosure includes: obtaining a user's access request for a first web page of an e-commerce service; generating web page information used for outputting the first web page, which includes a first content, a page header, and a search bar; and transmitting the web page information to the user's terminal. The web page information may include information such that, when the first web page is output, the transparency of the page header and the search bar changes based on the position where the page header and the search bar are overlaid on the first content as the first web page is scrolled on the screen of the user's terminal.

[0007] In one embodiment, the web page information may include information that reduces the transparency of the page header and the search bar as the distance from the top of the first content to the top of the page header increases as the first web page is scrolled.

[0008] In one embodiment, the web page information may include information that causes the page header and the search bar to be displayed at a fixed location on the screen of the user's terminal.

[0009] In one embodiment, the web page information may include information for setting the color of the page header to a color corresponding to a first portion of the first content that the page header overlays, and for setting the color of the search bar to a color corresponding to a second portion of the first content that the search bar overlays.

[0010] In one embodiment, the web page information may include information that, when the search bar reaches the bottom of the first content while the first web page is scrolling in a first direction, the search bar is moved in a second direction opposite to the first direction, and the search bar is gradually deleted from the top of the search bar at the point where the display of the search bar touches the page header.

[0011] In one embodiment, the web page information may include information for displaying the search bar when the distance from the top of the first content to the top of the page header is shorter than the distance to the first point of the first content, and for removing the display of the search bar while the first web page is scrolled in the first direction when the distance from the top of the first content to the top of the page header is longer than or equal to the distance to the first point of the first content, and for maintaining or restoring the display of the search bar while the first web page is scrolled in the second direction.

[0012] In one embodiment, the web page information may include information for deleting the display of the search bar only when there exists a point in time where the instantaneous speed is greater than or equal to a first threshold speed while the first web page is scrolled in the first direction, and for maintaining or restoring the display of the search bar only when there exists a point in time where the instantaneous speed is greater than or equal to a second threshold speed while the first web page is scrolled in the second direction.

[0013] In one embodiment, the web page information may include information that causes the speed at which the display of the search bar is deleted to be faster than the speed at which the display of the search bar is restored.

[0014] In one embodiment, the first content includes a target image and a target text, and the web page information may include information that causes the target text to be displayed while the transparency of the target text decreases over time after a first point in time when the display of the target image on the screen of the user's terminal is completed.

[0015] In one embodiment, the target text includes a main text and a subtext, and the web page information may include information such that the display of the subtext begins to change at a third time point after a second time point after the display of the main text begins to change, and that the main text and the subtext are each moved in a second direction and placed at each of a plurality of preset positions in the target image.

[0016] In one embodiment, the web page information may include information such that a second point where the display of the main text begins is located in the second direction from a third point where the display of the subtext begins, and a point where the movement of the main text ends is located in the second direction from a point where the movement of the subtext ends.

[0017] In one embodiment, the web page information may include information for gradually enlarging the target image from its basic size to a size of a preset ratio over a preset period after the output of the target image to the screen of the user's terminal is completed.

[0018] A method according to one embodiment further includes the step of applying an object identification model to the target image to identify at least one object from the target image, and the web page information may include information that causes the target image to be magnified with the target object among the at least one identified object.

[0019] A method according to one embodiment further includes the step of calculating the importance of each of the plurality of objects based on the information of the first content when a plurality of objects are identified from the target image, and the web page information may include information that causes one object selected in order of importance among the plurality of objects to be enlarged at each period, or causes the target image to be enlarged centering on the object with the highest importance.

[0020] In one embodiment, the web page information may include information such that when a user input is received in which the first content of the screen of the user’s terminal is displayed in a target area where the first content is displayed, the second content different from the first content is moved in the third direction, and the output of the second content is gradually displayed from the first side of the target area to the second side of the second content, and while the second content is displayed, the output of the first content is gradually terminated from the first side of the first content to the second side of the first content.

[0021] The present disclosure proposes an electronic device for changing the display method of a page header and a search bar as a web page is scrolled. An electronic device according to one embodiment of the present disclosure comprises: one or more processors; and one or more memories stored in instructions to be executed by the one or more processors. When the instructions are executed, the one or more processors are configured to obtain a user's access request for a first web page of an e-commerce service, generate web page information used for outputting the first web page including a first content, a page header, and a search bar, and transmit the web page information to the user's terminal. The web page information may include information that, when the first web page is output, the transparency of the page header and the search bar is changed based on the position where the page header and the search bar are overlaid on the first content as the first web page is scrolled on the screen of the user's terminal.

[0022] The present disclosure proposes a non-transient computer-readable recording medium that records instructions for changing the display method of a page header and a search bar as a web page is scrolled. Instructions recorded on a recording medium according to one embodiment of the present disclosure may be instructions to be executed by one or more processors or to be performed on a computer. When executed by one or more processors, the instructions may cause one or more processors to obtain a user's access request for a first web page of an e-commerce service, generate web page information used for outputting said first web page including a first content, a page header and a search bar, and transmit said web page information to said user's terminal. The web page information may include information that, when the first web page is output, the transparency of said page header and the search bar is changed based on the position where said page header and the search bar are overlaid on said first content as the first web page is scrolled on the screen of said user's terminal.

[0023] According to at least one embodiment of the present disclosure, the transparency of the page header and the search bar may change based on the position where the page header and the search bar are overlaid on the first content as the first web page is scrolled.

[0024] According to at least one embodiment of the present disclosure, the display of the search bar may be deleted while the first web page is scrolled in a first direction, and the display of the search bar may be maintained or restored while the first web page is scrolled in a second direction.

[0025] According to at least one embodiment of the present disclosure, after the display of the target image of the first content on the first web page is completed, the target text of the first content may be displayed with transparency decreasing over time.

[0026] According to at least one embodiment of the present disclosure, the size of the target image of the first content on the first web page can be gradually enlarged.

[0027] The effects according to the technical concept of the present disclosure are not limited to those mentioned above, and other unmentioned effects will be clearly understood by a person skilled in the art from the description in the specification.

[0028] FIG. 1 illustrates an environment in which an electronic device according to one embodiment of the present disclosure can be applied.

[0029] FIG. 2 is a block diagram of an electronic device according to one embodiment of the present disclosure.

[0030] FIG. 3 is a flowchart schematically illustrating a method for changing the display of a page header and a search bar according to the scrolling of a first web page according to one embodiment of the present disclosure.

[0031] FIGS. 4a to 4c are drawings illustrating the process of changing the transparency of a page header and a search bar on a first web page according to one embodiment of the present disclosure.

[0032] FIGS. 5A and 5B are drawings illustrating the process of deleting the display of a search bar on a first web page according to one embodiment of the present disclosure.

[0033] FIGS. 6a and 6b are drawings illustrating the process of deleting and restoring the display of a search bar on a first web page according to one embodiment of the present disclosure.

[0034] FIGS. 7a to 7d are drawings illustrating the process of displaying text on a first web page according to one embodiment of the present disclosure.

[0035] FIGS. 8A and 8B are drawings illustrating the process of applying a visual effect to an image on a first web page according to one embodiment of the present disclosure.

[0036] FIGS. 9a and 9b are drawings illustrating the process of deleting the display of a first content and newly displaying a second content on a first web page according to one embodiment of the present disclosure.

[0037] The various embodiments described in this disclosure are illustrative for the purpose of clearly explaining the technical concept of this disclosure and are not intended to limit it to specific embodiments. The technical concept of this disclosure includes various modifications, equivalents, alternatives, and embodiments selectively combined from all or part of each embodiment described in this disclosure. Furthermore, the scope of the technical concept of this disclosure is not limited to the various embodiments presented below or the specific descriptions thereof.

[0038] Terms used in this disclosure, including technical or scientific terms, may have the meaning generally understood by those skilled in the art to which this disclosure pertains, unless otherwise defined.

[0039] Expressions used in this disclosure, such as “comprising,” “may compose,” “possessing,” “possessing,” “having,” and “possessing,” mean that the subject feature (e.g., function, operation, or component, etc.) exists and do not exclude the existence of other additional features. That is, such expressions should be understood as open-ended terms implying the possibility of including other embodiments.

[0040] Singular expressions used in this disclosure may include a plural meaning unless the context otherwise indicates, and this applies likewise to singular expressions described in the claims.

[0041] Expressions such as "first," "second," or "first," "second" used in this document are used to distinguish one object from another when referring to multiple objects of the same kind, unless the context implies otherwise, and do not limit the order or importance of said objects.

[0042] Expressions used in this document such as “A, B, and C”, “A, B, or C”, “A, B, and / or C”, “at least one of A, B, and C”, “at least one of A, B, or C”, “at least one of A, B, and / or C”, etc., may mean each of the listed items or all possible combinations of the listed items. For example, “at least one of A or B” may refer to (1) at least one A, (2) at least one B, and (3) at least one A and at least one B.

[0043] The expression “based on” as used in this disclosure is used to describe one or more factors affecting an act or action of a decision or judgment described in the phrase or sentence containing this expression, and this expression does not exclude additional factors affecting said act or action of a decision or judgment.

[0044] As used in the present disclosure, the expression that a certain component (e.g., a first component) is "connected" or "connected" to another component (e.g., a second component) may mean that the certain component is not only directly connected or connected to the other component, but is also connected or connected through a new other component (e.g., a third component).

[0045] As used in this disclosure, the expression "configured to" may have meanings such as "set to," "capable of," "modified to," "made to," or "capable of." This expression is not limited to the meaning of "specifically designed in hardware." For example, a processor configured to perform a specific operation may mean a generic-purpose processor capable of performing that specific operation by executing software, or a special-purpose computer structured through programming to perform that specific operation.

[0046] Hereinafter, various embodiments described in this disclosure will be explained with reference to the attached drawings. In the attached drawings and the description thereof, identical or substantially equivalent components may be given the same reference numerals. Furthermore, in the description of the various embodiments below, the description of identical or corresponding components may be omitted, but this does not mean that such components are not included in the embodiments.

[0047] FIG. 1 illustrates an environment in which a device according to one embodiment of the present disclosure may be applied. In one embodiment, an electronic device (110) may be connected to a user terminal (120) via a network and may communicate with each other. The electronic device (110) may be an electronic device that provides an e-commerce service. That is, the electronic device (110) may be a device operated under the management of an entity operating the e-commerce service (e.g., an operator).

[0048] In one embodiment, the electronic device (110) may manage information regarding a user using an e-commerce service. The information regarding a user managed by the electronic device (110) may include, for example, user account information, user name information, age information, address information, or contact information. The management of information regarding a user may collectively refer to a series of actions involving control over and processing such information. For example, the management of information regarding a user may include actions such as storing, updating, or modifying such information.

[0049] In one embodiment, the electronic device (110) may manage information regarding goods in an e-commerce service. An e-commerce service may represent a service that provides users with the ability to purchase goods such as items, food, or products, and furthermore, may include a service that mediates the sale of goods by some users to other users. The information regarding goods managed by the electronic device (110) may include, for example, information regarding the identification of the goods, the name of the goods, information regarding the goods, the price of the goods, the capacity of the goods, the size of the goods, the weight of the goods, the attributes of the goods, or information regarding the category or unit price. In this case, the item may be a sales unit of a product, and even in the case of the same product, it may be provided to users as different items. For example, even in the case of the same product, it may be sold as a different item by varying the sales unit quantity and price. Therefore, there may exist different items that share product information. The management of information regarding goods may collectively refer to a series of actions involving having control authority over and processing that information. For example, the management of information regarding goods may include actions such as storing, updating, or modifying that information.

[0050] In one embodiment, the electronic device (110) may manage various information to be provided to a user utilizing an e-commerce service. The electronic device (110) may manage various data necessary to provide an e-commerce service based on requests from an operator operating the e-commerce service or a user utilizing the e-commerce service. For example, it may create, modify, store, or provide to the user data regarding various web pages associated with the e-commerce service, namely, search result web pages, product list web pages, event web pages, product detail web pages (or product detail web pages), product sales web pages, and landing web pages based on the user's access request. Regarding the management method of the electronic device (110), the electronic device (110) may manage information associated with the provision of the e-commerce service based on user input.

[0051] In one embodiment, the electronic device (110) may provide web page information to the user terminal (120) that is used to display a web page related to the e-commerce service based on a request from a user using the e-commerce service. The user terminal (120) may output a web page on a screen using the web page information received from the electronic device (110). Here, the web page may include a web page related to the user logging into the e-commerce service, a web page providing various information about products that the user can purchase, a product list web page providing a list of products searched in various ways requested by the user, a shopping cart web page for purchasing products in a shopping list (e.g., shopping cart), a product detail description web page (or product detail description web page) providing detailed information about individual products, a product sales web page for purchasing individual products, etc. The operation of providing web page information may include an operation of providing at least some of all data generated during the process of the user using the e-commerce service to the user terminal (120).

[0052] In one embodiment, the electronic device (110) may manage transactions regarding e-commerce services provided to a user, that is, transactions regarding online products (e.g., goods or services). That is, the electronic device (110) may manage a series of processes such as enabling the user to search for, select, purchase, and pay for products and request delivery. As such processing, the electronic device (110) may provide information regarding products and delivery to a customer so that the user can search for, select, purchase, and pay for products and request delivery, and may receive the user's purchase, payment, and delivery requests from the user. In addition, regarding operations that the electronic device (110) may perform, it should be noted that even if such operations are not mentioned in this disclosure, if they are general operations that a server providing known e-commerce services may perform, applying the technical concept of this disclosure by referring to such operations is not excluded from the scope of this disclosure.

[0053] The aforementioned electronic device (110) may be implemented as one or more computing servers. For example, all functions of the electronic device (110) may be implemented in a single computing server. As another example, the first function of the electronic device (110) may be implemented in a first computing server, and the second function may be implemented in a second computing server. As yet another example, multiple computing servers may be used, each implementing all functions or specific functions of the electronic device (110). The aforementioned computing server may be a desktop computer, a laptop computer, an application server, a proxy server, or a cloud server, but is not limited thereto, and any type of server equipped with computing functions may be a computing server.

[0054] In one embodiment, the user terminal (120) may be a device for a user to use an e-commerce service. The user terminal (120) may be implemented as a terminal capable of transmitting and receiving various information to and from an electronic device (110) via a network. For example, the user terminal (120) may be one of a desktop computer, a laptop computer, a portable communication terminal (smartphone, etc.), a portable multimedia server, a wearable server, or an HMD. However, the type of user terminal (120) is not limited thereto, and the user terminal (120) may be any server capable of receiving information from a user or outputting information to a user, and communicating with an electronic device (110) or other servers via a network.

[0055] In one embodiment, the user terminal (120) can provide information received from the electronic device (110) to the user and can receive input from the user and transmit it to the electronic device (110). Specifically, the user terminal (120) can obtain input from the user instructing the call of various web pages and generate a command instructing the call of various web pages in response to the obtained input. The user terminal (120) can transmit the command instructing the call of various web pages to the electronic device (110). The input obtained from the user may include various forms of input, such as a click using a mouse, a touch using a touchpad or touch screen, voice recognition, and other electronic inputs. The user terminal (120) can receive information on various web pages from the electronic device (110) and output web pages through the received information on various web pages.

[0056] In one embodiment, the network may serve to connect the electronic device (110) with the user terminal (120) or other external server. For example, the network may provide a connection path so that the user terminal (120) or other external server can be connected to the electronic device (110) and transmit and receive packet data with the electronic device (110). The network may be implemented as any type of wired or wireless network, such as, for example, a Local Area Network (LAN), a Wide Area Network (WAN), a Mobile Radio Communication Network, or a Wibro (Wireless Broadband Internet).

[0057] In one embodiment, the electronic device (110) and the user terminal (120) may operate as a single device. The user terminal (120) may be included in the electronic device (110) as a whole or part of the electronic device (110). In this case, for example, the various information exchanged between the electronic device (110) and the user terminal (120) via a network may be the various information exchanged between each component within a single server.

[0058] FIG. 2 is a block diagram of a server according to one embodiment of the present disclosure. In one embodiment, an electronic device (200) (e.g., the electronic device (110) of FIG. 1) may process information regarding an e-commerce service. The electronic device (200) may include one or more processors (210), one or more memories (220), and a communication interface (230) as components. At least one of the components of the electronic device (200) may be omitted, or other components may be added to the electronic device (200). In one embodiment, additionally or alternatively, some components may be implemented as a single or multiple entities. In the present disclosure, one or more processors (210) may be referred to as processors (210). Unless the context clearly indicates otherwise, the expression processors (210) may mean a set of one or more processors. In the present disclosure, one or more memories (220) may be referred to as memories (220). The expression "memory" (220) may mean a set of one or more memories unless the context clearly indicates otherwise. In one embodiment, at least some of the components inside and outside the electronic device (200) may be connected to each other via a bus, GPIO (General Purpose Input / Output), SPI (Serial Peripheral Interface), or MIPI (Mobile Industry Processor Interface), etc., to exchange information (data, signals, etc.).

[0059] In one embodiment, the processor (210) of the electronic device (200) can control at least one component of the electronic device (200) connected to the processor (210) by running software (e.g., instructions, programs, etc.). Additionally, the processor (210) can perform various operations such as computation, processing, data generation, and processing related to the present disclosure. Additionally, the processor (210) can load data, etc. from memory (220) or store it in memory (220). The processor (210) can control a communication interface (230) to request various information from a user terminal (120) and receive various information from the user terminal (120).

[0060] In one embodiment, the memory (220) of the electronic device (200) may store various information (data). The information stored in the memory (220) may include software (e.g., instructions, programs, etc.) as information acquired, processed, or used by at least one component of the electronic device (200). The memory (220) may include volatile and / or non-volatile memory. In the present disclosure, instructions or programs are software stored in the memory (220) and may include an operating system for controlling the resources of the electronic device (200), an application, and / or middleware that provides various functions to the application so that the application can utilize the resources of the electronic device (200). In one embodiment, the memory (220) may store instructions that cause the processor (210) to perform calculations when executed by the processor (210). The memory (220) may store at least a portion of information received from a database through a communication interface (230) and / or information transmitted to a database through a communication interface (230). Specifically, the memory (220) can store information regarding e-commerce services and instructions executed by the processor (210).

[0061] In one embodiment, the communication interface (230) can perform wireless or wired communication between the electronic device (200) and a database or other external device. For example, the communication interface (230) can perform wireless communication according to methods such as eMBB (enhanced Mobile Broadband), URLLC (Ultra Reliable Low-Latency Communications), MMTC (Massive Machine Type Communications), LTE (Long-Term Evolution), LTE-A (LTE Advance), NR (New Radio), UMTS (Universal Mobile Telecommunications System), GSM (Global System for Mobile communications), CDMA (Code Division Multiple Access), WCDMA (Wideband CDMA), WiBro (Wireless Broadband), WiFi (Wireless Fidelity), Bluetooth, NFC (Near Field Communication), GPS (Global Positioning System), or GNSS (Global Navigation Satellite System). For example, the communication interface (230) can perform wired communication according to methods such as USB (Universal Serial Bus), HDMI (High Definition Multimedia Interface), RS-232 (Recommended Standard-232), or POTS (Plain Old Telephone Service). In one embodiment, the electronic device (200) may be implemented by integrating with another server. In this case, the communication interface (230) may function as a connection circuit or interface connecting the electronic device (200) and the other server.

[0062] A user terminal according to one embodiment of the present disclosure (e.g., the user terminal (120) of FIG. 1) may also include one or more processors, one or more memories, and a communication interface as components. At least one of the components of the user terminal may be omitted, or other components may be added to the user terminal. In one embodiment, additionally or substantially, some components may be implemented as an integrated unit or as a single or multiple entity. One or more processors of the user terminal may control at least one component of the user terminal connected to the processor by running software (e.g., instructions, programs, etc.). One or more memories of the user terminal may store various information (data). The communication interface of the user terminal may perform wireless or wired communication between the user terminal and a database or other external device.

[0063] FIG. 3 is a flowchart schematically illustrating a method for changing the display of a page header and a search bar according to a scroll of a first web page according to an embodiment of the present disclosure. The method for changing the display of a page header and a search bar according to a scroll of a first web page according to an embodiment of the present disclosure may include an operation (S310), an operation (S320), and / or an operation (S330).

[0064] In operation (S310), the electronic device (110) can obtain a user's request to access the first web page of the e-commerce service.

[0065] In one embodiment, the user terminal (120) may transmit a request for access to a first web page to the electronic device (110) based on user input. The first web page may represent a web page for purchasing at least one target product. For example, the target product may be a product sold by a pre-set candidate retailer (e.g., 'A brand', 'B brand', etc.). As another example, the target product may be a product classified into a pre-set candidate category (e.g., 'luxury' category) and may be a product with a selling price of at least a pre-set price (e.g., 100,000 won). However, the criteria for determining the target product are not limited to the examples above. Additionally, user input may include user input to the user terminal (120), for example, user input that touches or taps at least a part of an interface that causes a request for access to the first web page to be transmitted.

[0066] In operation (S320), the electronic device (110) can generate web page information (hereinafter referred to as 'first web page information') used for outputting a first web page including first content, a page header, and a search bar.

[0067] In one embodiment, the first content may include either an image or a video, and the video may be composed of a plurality of image frames. A page header may be located at the top of the first web page. The page header may represent an interface that provides an identity (e.g., brand identity) associated with the first web page. A search bar may represent an interface that allows a user to search for specific information (e.g., brand).

[0068] In one embodiment, the first web page information may include information that, when the first web page is displayed, the opacity of the page header and search bar changes based on the position where the page header and search bar are overlaid on the first content as the first web page is scrolled on the screen of the user terminal (120). In other words, the page header and search bar may be overlaid on the content (e.g., the first content) in the first web page. In this case, the lower the opacity of the page header and search bar, the lower the visibility of the content overlaid by the page header and search bar in the first web page may be. Conversely, the higher the opacity of the page header and search bar, the higher the visibility of the content overlaid by the page header and search bar in the first web page may be.

[0069] In one embodiment, the electronic device (110) may reduce the transparency of the page header and search bar as the first web page is scrolled in a first direction when the first web page is displayed on the user terminal (120). Conversely, the electronic device (110) may increase the transparency of the page header and search bar as the first web page is scrolled in a second direction opposite to the first direction. Here, the first direction may represent a downward direction and the second direction may represent an upward direction, but is not limited thereto.

[0070] In operation (S330), the electronic device (110) can transmit the first web page information to the user terminal (120). The user terminal (120) can receive the first web page information from the electronic device (110). Based on the first web page information, the user terminal (120) can output the first web page on the screen of the user terminal (120).

[0071] FIGS. 4a to 4c are drawings illustrating the process of changing the transparency of a page header and a search bar on a first web page according to one embodiment of the present disclosure.

[0072] In one embodiment, the electronic device (110) may generate first web page information such that the first web page includes first content (411), a page header (421), and a search bar (431). At this time, the electronic device (110) may cause the first content (411) and the page header (421) to be displayed on the first web page when the first web page is output from a user terminal (120). Additionally, the electronic device (110) may adjust whether the search bar (431) is displayed on the first web page or not. FIGS. 4a to 4c mainly describe examples in which the search bar (431) is displayed on the first web page.

[0073] In one embodiment, the electronic device (110) may enable the page header (421) and the search bar (431) to be displayed at fixed locations on the screen of the user terminal (120) when the first web page is output from the user terminal (120). First, a status bar may be displayed in the top area of ​​the screen (401) of the user terminal (120). In the status bar, for example, an icon indicating the remaining battery level of the user terminal (120), the current time, an icon indicating the communication status, etc., may be displayed. In this specification, the case where the status bar is included in the page header (421) is mainly described. However, it is not limited thereto, and for example, the status bar may be separated from the page header (421) and displayed in the top area of ​​the screen (401, 402, 403) of the user terminal (120) without a change in transparency.

[0074] In one embodiment, the electronic device (110) may display a page header (421) in the top area of ​​the screen (401) of the user terminal (120). The electronic device (110) may display a search bar (431) in a position adjacent to the page header (421) on the screen (401) of the user terminal (120). Specifically, the electronic device (110) may display the search bar (431) in a second direction adjacent to the page header (421) on the screen (401) of the user terminal (120).

[0075] In one embodiment, the electronic device (110) may cause the transparency of the page header (421) and the search bar (431) to change based on the position where the page header (421) and the search bar (431) are overlaid on the first content (411) as the first web page is scrolled on the screen (401, 402, 403) of the user terminal (120). Specifically, the electronic device (110) may cause the transparency of the page header (421) and the search bar (431) to decrease as the distance from the top of the first content (411) to the top of the page header (421) increases as the first web page is scrolled on the user terminal (120). Conversely, the electronic device (110) can increase the transparency of the page header (421) and the search bar (431) as the distance from the top of the first content (411) to the top of the page header (421) decreases.

[0076] At this time, the first web page on the user terminal (120) can be scrolled based on user input. For example, when the first web page is displayed on the user terminal (120), the user terminal (120) can scroll the first web page in a second direction opposite to the first direction in response to receiving user input swiping in a first direction. Similarly, the user terminal (120) can scroll the first web page in the first direction in response to receiving user input swiping in the second direction.

[0077] In one embodiment, the electronic device (110) may change the transparency of the page header (421) and the search bar (431) from a first transparency value to a second transparency value as the first web page is scrolled on the screen of the user terminal (120) when the first web page is displayed on the user terminal (120). For example, the first transparency value may be 80% and the second transparency value may be 0%, but is not limited thereto. For example, the electronic device (110) may make the transparency of the page header (421) and the search bar (431) each become a first transparency value (e.g., 80%) when the top of the page header (421) coincides with the top of the first content (411). Additionally, the electronic device (110) can make the transparency of the page header (421) and the search bar (431) each a second transparency value (e.g., 0%) when the bottom of the search bar (431) matches the bottom of the first content (411).

[0078] In one embodiment, the electronic device (110) can cause the transparency of the page header (421) and the search bar (431) to change linearly as the first web page is scrolled on the screen of the user terminal (120) when the first web page is displayed on the user terminal (120). In other words, the electronic device (110) can determine the transparency of the page header (421) and the search bar (431) inversely proportional to the distance from the top of the first content (411) to the top of the page header (421) as the first web page is scrolled. Specifically, the electronic device (110) may change the transparency of the page header (421) and the search bar (431) when the page header (421) moves in a first direction from a first position of the page header (421) where the top of the page header (421) aligns with the top of the first content (411) to a second position of the page header (421) where the bottom of the search bar (431) aligns with the bottom of the first content (411). At this time, the electronic device (110) may not change the transparency of the page header (421) and the search bar (431) when the page header (421) moves further in the first direction beyond the second position. For example, when the page header (421) is placed in the first position, the first distance from the top of the first content (411) to the top of the page header (421) may be '0'. When the page header (421) is placed in a second position, the second distance from the top of the first content (411) to the top of the page header (421) may represent a reference distance (e.g., L-x1-x2) obtained by subtracting the sum (e.g., x1+x2) of the length of the page header (421) in the first direction (or second direction) and the length of the search bar (431) in the first direction (or second direction) (e.g., x2) from the length of the first content (411) in the first direction (or second direction) (e.g., L).As described above, the transparency of the page header (421) and the search bar (431) can be changed within a range from a first transparency value (e.g., 80%) to a second transparency value (e.g., 0%). The first transparency value may correspond to a first distance (e.g., '0'), and the second transparency value may correspond to a reference distance (e.g., L-x1-x2). In this case, if the distance from the top of the first content (411) to the top of the page header (421) is the target distance, the transparency of the page header (421) and the search bar (431) can be determined according to the following mathematical formula 1.

[0079] [Mathematical Formula 1]

[0080]

[0081] In the above mathematical formula 1, OP may represent the transparency of the page header (421) and the search bar (431). However, in the above example, the transparency of the page header (421) and the search bar (431) is described as changing linearly in inverse proportion to the distance from the top of the first content (411) to the top of the page header (421), but this is not limited thereto, and the transparency may change non-linearly from a first transparency value (e.g., 80%) to a second transparency value (e.g., 0%).

[0082] Referring to FIG. 4a, the user terminal (120) can output a first web page on a screen (401) based on first web page information. At this time, the top of the page header (421) on the screen (401) may coincide with the top of the first content (411), and the transparency of the page header (421) and the search bar (431) may be set to a first transparency value (e.g., 80%). In this case, the area of ​​the first content (411) overlaid by the page header (421) and the search bar (431) may be exposed to the user, thereby improving the user experience.

[0083] Next, referring to FIG. 4b, the user terminal (120) can scroll the first web page in a first direction based on user input and output the scrolled first web page on the screen (402). At this time, the top of the page header (421) on the screen (402) is separated from the top of the first content (411), so the transparency of the page header (421) and the search bar (431) can be set to a transparency value between a first transparency value (e.g., 80%) and a second transparency value (e.g., 0%).

[0084] Referring to FIG. 4c, the user terminal (120) can scroll the first web page in a first direction based on user input and output the scrolled first web page on the screen (403). At this time, the bottom of the search bar (431) on the screen (402) may coincide with the bottom of the first content (411). That is, the top of the search bar (431) on the screen (402) is separated from the top of the first content (411) by a reference distance, so that the transparency of the page header (421) and the search bar (431) may be set to a second transparency value (e.g., 0%).

[0085] In one embodiment, the electronic device (110) may adjust the colors of the page header (421) and the search bar (431) when the first web page is displayed on the user terminal (120). That is, the electronic device (110) may adjust the colors of the page header (421) and the search bar (431) as the first web page is scrolled in a first direction or a second direction. Specifically, the electronic device (110) may set the color of the page header (421) to a color corresponding to a first portion of the first content (411) that the page header (421) overlays. Similarly, the color of the search bar (431) may be set to a color corresponding to a second portion of the first content (411) that the search bar (431) overlays. The color corresponding to a partial area (e.g., a first partial area or a second partial area) of the first content (411) may represent the average color value of the partial area (e.g., a first partial area or a second partial area) of the first content (411). The average color value of the partial area of ​​the first content (411) may represent the average of the color values ​​of each pixel included in the first content (411). However, it is not limited thereto, and the color corresponding to the partial area of ​​the first content (411) may represent the color value that appears most frequently in the partial area of ​​the first content (411). By adjusting the colors of the page header (421) and the search bar (431) to colors corresponding to the partial area of ​​the first content (411), the user can more easily identify the area of ​​the first content (411) that the page header (421) and the search bar (431) overlay, thereby improving the user experience.

[0086] FIGS. 5A and 5B are drawings illustrating the process of deleting the display of a search bar on a first web page according to one embodiment of the present disclosure.

[0087] Referring to FIG. 5a, the user terminal (120) can output the first web page on the screen (501) based on the first web page information. At this time, the bottom of the search bar (531) on the screen (501) may coincide with the bottom of the first content (511). When the first web page is output to the user terminal (120), the electronic device (110) can cause the display of the search bar (531) to be deleted from the first web page when the search bar (531) reaches the bottom of the first content (511) while the first web page is being scrolled in the first direction.

[0088] In one embodiment, the electronic device (110) may cause the display of the search bar (531) on the first web page to be deleted at once (or at one point) when the search bar (531) reaches the bottom of the first content (511) while the first web page is being scrolled in a first direction. In another embodiment, the electronic device (110) may cause the display of the search bar (531) on the first web page to be gradually deleted from the top of the search bar (531) at the point where it touches the page header (521) while the search bar (531) reaches the bottom of the first content (511) while the first web page is being scrolled in a first direction. Referring to FIG. 5b, the user terminal (120) may delete the display of the search bar (531) that overlaps with the area where the page header (521) is displayed while moving the search bar (531) in a second direction on the screen (501). In this case, as the display of the search bar (531) on the screen (501) is gradually erased, the area of ​​the first content (511) overlaid by the search bar (531) can be gradually displayed. For example, the speed at which the display of the search bar (531) is erased may be 100 pixels / second, but is not limited thereto.

[0089] FIGS. 6a and 6b are drawings illustrating the process of deleting and restoring the display of a search bar on a first web page according to one embodiment of the present disclosure.

[0090] In one embodiment, the electronic device (110) may always display a search bar (631) when the distance from the top of the first content (e.g., the first content (411) of FIG. 4 or the first content (511) of FIG. 5) to the top of the page header (621) is shorter than the distance to the first point of the first content. In other words, the electronic device (110) may always display a search bar (631) when the top of the page header (621) is located in a second direction (e.g., upward direction, 682) relative to the first point of the first content. As will be described later, the electronic device (110) may or may not display a search bar (631) when the top of the page header (621) is located in a first direction (e.g., downward direction, 681) relative to the first point of the first content. Here, the first point of the first content may indicate a location where the page header (621) is overlaid on the first content when the bottom of the search bar (631) aligns with the bottom of the first content. In other words, the first point of the first content may indicate a location (or point) located at a reference distance in the second direction (682) from the top of the first content.

[0091] In one embodiment, the electronic device (110) may remove the display of the search bar (631) while the first web page is scrolled in the first direction (681) when the distance from the top of the first content to the top of the page header (621) is longer than or equal to the distance to the first point of the first content, and may maintain or restore the display of the search bar (631) while the first web page is scrolled in the second direction (682). In other words, the electronic device (110) may maintain the display of the search bar (631) if the search bar (631) was displayed on the first web page at the time the first web page begins to be scrolled in the first direction (681). Additionally, the electronic device (110) may restore the display of the search bar (631) if the search bar (631) was not displayed on the first web page at the time the first web page begins to be scrolled in the first direction (681).

[0092] Referring to FIGS. 6a and 6b, a first web page may be displayed on the screen (601, 602) of a user terminal (120), and the top of the page header (621) may be located in a first direction relative to a first point of the first content. On the screen (601) of the user terminal (120), the first web page may be scrolled in a first direction (681) based on user input. In this case, the user terminal (120) may remove the display of the search bar (631) while the first web page is scrolled in the first direction (681) on the screen (601). Subsequently, the user terminal (120) may not continue to display the search bar (631) even when the scrolling of the first web page in the first direction (681) on the screen (601) ends and there is no movement of the first web page. A first web page can be scrolled in a second direction (682) based on user input on the screen (602) of the user terminal (120). In this case, the user terminal (120) can maintain or restore the display of the search bar (631) while the first web page is scrolled in the second direction (682) on the screen (602). Subsequently, the user terminal (120) can maintain the display of the search bar (631) even when the scrolling of the first web page in the second direction (682) on the screen (601) ends and there is no movement of the first web page.

[0093] In one embodiment, the electronic device (110) may cause the display of the search bar (631) on the first web page to be restored while the first web page is scrolled in the second direction (682), so that the display of the search bar (631) on the first web page is displayed at once (or at one point in time). In another embodiment, the electronic device (110) may cause the display of the search bar (631) on the first web page to be restored while the first web page is scrolled in the second direction (682), so that the display of the search bar (631) on the first web page is gradually displayed from the bottom of the page header (621). Referring to FIG. 6b, the user terminal (120) may move the search bar (631) in the first direction (681) so that the search bar (631) is gradually displayed from the bottom of the page header (621) on the screen (602). In this case, the display of the content area overlaid with the search bar (631) can be gradually erased as it is displayed from the bottom of the search bar (631) on the screen (602). For example, the speed at which the display of the search bar (631) is restored may be 50 pixels / second, but is not limited to this.

[0094] In one embodiment, the electronic device (110) can make the speed at which the display of the search bar (631) is deleted faster than the speed at which the display of the search bar (631) is restored when the first web page is displayed on the screen (601, 602) of the user terminal (120).

[0095] In one embodiment, the electronic device (110) may delete the display of the search bar (631) only when there exists a point in time where the instantaneous speed while the first web page is scrolled in the first direction (681) is greater than or equal to the distance from the top of the first content to the top of the page header (621) is longer than or equal to the distance to the first point of the first content. Here, the instantaneous speed may represent the scrolling speed at each point in time while the first web page is scrolled. For example, the first threshold speed may be 50 pixels / second, but is not limited thereto. If there exists a point in time where the instantaneous speed while the first web page is scrolled in the first direction (681) is greater than the first threshold speed, the electronic device (110) may delete the display of the search bar (631) to increase the content area displayed on the screen (601) by determining that the user has a high intention to view additional products by scrolling on the first web page.

[0096] On the other hand, the electronic device (110) may maintain or restore the display of the search bar (631) only when there is a point in time when the instantaneous speed while the first web page is scrolled in the second direction (682) is greater than or equal to the second threshold speed. Here, the second threshold speed may be the same as or different from the first threshold speed. For example, the second threshold speed may be 100 pixels / second, but is not limited thereto. When there is a point in time when the instantaneous speed while the first web page is scrolled in the second direction (682) is greater than or equal to the second threshold speed, the electronic device (110) may determine that the user has a low intention to view additional products by scrolling on the first web page, and may maintain or restore the display of the search bar (631) to make it easier for the user to search for products.

[0097] FIGS. 7a to 7d are drawings illustrating the process of displaying text on a first web page according to one embodiment of the present disclosure.

[0098] In one embodiment, the electronic device (110) may cause the transparency of the text (e.g., target text) of the first content (711) to change over time when the first web page is displayed on the user terminal (120). The first content (711) may include a target image and target text. For example, the first content (711) may be composed of a single image or may be composed of multiple image frames. If the first content (711) is composed of a single image, the target image may represent a single image, and if it is composed of multiple image frames, the target image may represent the first image frame. Specifically, the electronic device (110) may cause the target text to be displayed with the transparency of the target text decreasing over time after a first point in time when the display of the target image of the first content (711) on the screen (701) of the user terminal (120) is completed. For example, the electronic device (110) may cause the transparency of the target text to change from a third transparency value to a fourth transparency value over time. For example, the third transparency value may be 80% and the fourth transparency value may be 0%, but is not limited thereto. Furthermore, the electronic device (110) may cause the position where the target text is displayed to change over time. For example, the electronic device (110) may set the target text to move in a second direction over time, and may stop further movement after the target text reaches a preset position of the first content (711). The process of the transparency and position of the target text being moved will be described in more detail below.

[0099] In one embodiment, the target text included in the first content (711) may consist of a main text and a subtext. At this time, when the first web page is output on the user terminal (120), the electronic device (110) may cause the display of the main text to change at a second time point and the display of the subtext to change at a third time point after the second time point. Here, the second time point at which the main text is displayed and the third time point at which the subtext is displayed may each be calculated based on the time point when the output of the first web page begins on the user terminal (120). When the first web page is output on the user terminal (120), the electronic device (110) may cause the main text to be fully displayed at the time when the output of the first web page begins, and the subtext to be not displayed or only partially displayed. At this time, the electronic device (110) may cause the display position of the main text to change from the second time point and the display position of the subtext to change from the third time point after the second time point. The electronic device (110) can move the main text and sub-text, respectively, in a second direction so that they are placed at each of a plurality of preset locations in the target image. If the sub-text is not fully displayed or only partially displayed at the start of outputting the web page, the electronic device (110) can cause the sub-text to be gradually displayed as the display location of the sub-text moves in a second direction. At this time, the electronic device (110) can cause the second point where the display of the main text begins to be located in a second direction from the point where the display of the sub-text begins, and the point where the movement of the main text ends to be located in a second direction from the point where the movement of the sub-text ends. The electronic device (110) can set the transparency of the text (e.g., main text or sub-text) to decrease as the display location of the text (e.g., main text or sub-text) moves in a second direction and moves further away from the bottom of the first content (711).

[0100] Hereinafter, a method for displaying main text and subtext is described in more detail using an interface (e.g., a first interface (741) or a second interface (742)). In one embodiment, a first web page may include a first interface (741) and a second interface (742). Main text may be displayed on the first interface (741), and subtext may be displayed on the second interface (742). Additionally, the transparency of the interface (e.g., the first interface (741) or the second interface (742)) may indicate the transparency of the text (e.g., main text or subtext) displayed on the interface.

[0101] Referring to FIG. 7a, a user terminal (120) can output a first web page containing a first content (711) on a screen (701) based on first web page information. At this time, a first interface (741) in which the main text of the first content (711) is displayed and a second interface (742) in which the subtext of the first content (711) is displayed can be output on the screen (701). At this time, the transparency of both the first interface (741) and the second interface (742) can be set to a first transparency value (e.g., 80%). In other words, both the main text and the subtext can be displayed on the first web page with a first transparency value. At this time, the position of the first interface (741) can be located in a second direction from the position of the second interface (742). In other words, at the time the first web page is output, the point where the main text is displayed can be located in a second direction from the point where the subtext is displayed. After the first web page is displayed on the user terminal (120), a second time point may pass during which the display of the main text changes. When the second time point has passed, the user terminal (120) may change the display position of the main text by moving the first interface (741) where the main text is displayed in a second direction. At this time, while the first interface (741) moves in the second direction, the position of the second interface (742) may not change.

[0102] Next, FIG. 7b illustrates a screen (702) at a third point in time where the position of the subtext changes after the first web page is displayed on the user terminal (120). In the screen (702), the transparency of the first interface (741) is set to be less than the first transparency value (e.g., 80%), and the second interface (742) is not moved and can remain set to the first transparency value (e.g., 80%). When the third point in time has elapsed, the user terminal (120) can change the display position of the subtext by moving the second interface (742), where the subtext is displayed, in a second direction. Meanwhile, the user terminal (120) can also continue to move the first interface (741) even after the third point in time has elapsed.

[0103] FIG. 7c illustrates a screen (703) at a fourth point in time when the position of the first interface (741) displaying the main text reaches a preset third position after the first web page is output on the user terminal (120). In the screen (703), the transparency of the first interface (741) is set to a second transparency value (e.g., 0%), and the transparency of the second interface (742) can be set to be smaller than the first transparency value (e.g., 80%). When the fourth point in time has elapsed, the user terminal (120) may stop the movement of the first interface (741) because the first interface (741) displaying the main text has reached the preset third position. Meanwhile, the user terminal (120) may continue to move the second interface (742) even after the fourth point in time has elapsed.

[0104] FIG. 7d illustrates a screen (704) at a fifth point in time when, after the first web page is displayed on the user terminal (120), the position of the second interface (742) where subtext is displayed reaches a preset fourth position. Since the position of the first interface (741) in the screen (704) does not change from the preset third position, the transparency of the first interface (741) can be maintained at a second transparency value (e.g., 0%), and the second interface (742) can also be set to a second transparency value (e.g., 0%). When the fifth point in time has elapsed, the user terminal (120) can stop the movement of the second interface (742) because the second interface (742) where subtext is displayed has reached the preset fourth position. Eventually, when the fifth point in time has elapsed, the movement of both the first interface (741) and the second interface (742) can be stopped. At this time, the location of the first interface (741) may be located in a second direction from the location of the second interface (742). In other words, the point where the movement of the main text ends may be located in a second direction from the point where the movement of the sub-text ends.

[0105] FIGS. 8A and 8B are drawings illustrating the process of applying a visual effect to an image on a first web page according to one embodiment of the present disclosure.

[0106] In one embodiment, when a first web page is displayed on a user terminal (120), the electronic device (110) may cause the target image of the first content (811) to be gradually enlarged from its basic size to a size of a preset ratio for a preset period after the output of the target image of the first content (811) on the screen (801, 802) of the user terminal (120) is completed. FIG. 8a illustrates the screen (801) of the user terminal (120) where the target image is displayed at its basic size, and FIG. 8b illustrates the screen (802) of the user terminal (120) where the target image is displayed at a size of a preset ratio. In other words, the electronic device (110) may cause the target image to be displayed at its basic size again after the target image on the screen (801, 802) of the user terminal (120) has been enlarged to a preset ratio, thereby causing the target image to be enlarged again. At this time, the preset period may be 5 seconds, but is not limited thereto. The preset ratio may be 1.3 times, but is not limited thereto. The function of enlarging the size of the target image may be applied only when the first content (811) consists of a single image. In other words, when the first content (811) consists of a video (i.e., multiple image frames), the function of enlarging the size of the target image may not be performed. Instead of enlarging the size of the image, the electronic device (110) may cause the image frames constituting the video to be continuously displayed on the screen of the user terminal (120).

[0107] In one embodiment, the electronic device (110) may cause the target image to be enlarged based on the center point of the first content (811) when the first web page is displayed on the user terminal (120). Here, the center point of the first content (811) may represent the center of the area of ​​the first web page where the first content (811) is displayed, but is not limited thereto.

[0108] In one embodiment, the electronic device (110) may cause the target image to be enlarged around an object identified from the target image, rather than around the center point of the first content (811). Specifically, the electronic device (110) may identify at least one object from the target image by applying an object identification model to the target image of the first content (811). Here, the object identification model may include a neural network, which is a type of machine learning model and is one or more models having a machine learning structure designed to extract an object included in an image in response to an input of an image. The object identification model may also calculate the importance of at least one object included in the image in response to receiving the image and information regarding the image as input data. More specifically, the electronic device (110) may input the target image of the first content (811) and information regarding the first content (811) as input data to the object identification model, and receive at least one object identified from the target image and the importance of each of the at least one object as output data. Information regarding the first content (811) may include information such as products for sale, sales period, and brands for sale. For example, the electronic device (110) can use information regarding the first content (811) to identify products for sale that the first content (811) intends to sell. The electronic device (110) can input the target image and the products for sale of the first content (811) into an object identification model. The object identification model can identify objects from the target image that have a high degree of relevance to the products for sale. Additionally, the object identification model can calculate a higher importance value for objects identified from the target image as their degree of relevance to the products for sale increases.

[0109] In one embodiment, the electronic device (110) can cause a target image to be enlarged around a target object among at least one object. For example, the electronic device (110) can determine a target object among at least one object. The electronic device (110) can calculate the importance of each of at least one object identified in the target image using an object identification model and can determine the object with the highest importance as the target object. Referring to FIG. 8a, when a first web page is displayed on a user terminal (120), the electronic device (110) can cause the target image to be enlarged around a target object (e.g., object (851)) among at least one object identified from the target image. Enlarging the target image around a target object may indicate that it is enlarged based on the center of the area of ​​the first web page where the target object is displayed.

[0110] In one embodiment, when a plurality of objects are identified from a target image of a first content (811), the electronic device (110) can calculate the importance of each of the plurality of objects based on the information of the first content (811). When the first web page is displayed on the user terminal (120), the electronic device (110) can cause one object selected in order of importance among the plurality of objects to be enlarged in each cycle, or cause the target image to be enlarged around the object with the highest importance. For example, referring to FIG. 8a, the electronic device (110) can determine that the importance of the object (851) identified from the target image is higher than the importance of the object (852). For example, when the first web page is displayed on the user terminal (120), the electronic device (110) can cause the target image to be enlarged around the object (851) with high importance in the first cycle, and the target image to be enlarged around the object (852) with low importance in the second cycle following the first cycle. The electronic device (110) can cause the target image to be enlarged around the object of high importance (851) in the third cycle following the second cycle. As another example, the electronic device (110) can cause the target image to be enlarged around the object of highest importance (851) among the objects (851, 852) identified in the target image.

[0111] FIGS. 9a and 9b are drawings illustrating the process of deleting the display of a first content and newly displaying a second content on a first web page according to one embodiment of the present disclosure.

[0112] In one embodiment, when the electronic device (110) receives a user input swiping from a first side to a third side direction in a target area where a first content (911) of the screen of a user terminal (120) is displayed, it may move a second content (912) different from the first content (911) in the third direction so that the second content (912) is gradually displayed from the first side of the target area to the second side of the second content (912). Here, the first side may represent the right side and the second side may represent the left side, but is not limited thereto. If the first side is the right side and the second side is the left side, the third direction may represent a direction toward the left. Referring to FIG. 9a, the user input swiping in the third direction may represent, for example, a user input dragging and dropping from point (971) to point (972), but is not limited thereto. In other words, the electronic device (110) can cause other content (e.g., second content (912)) to be displayed in the same target area according to user input swiping in a third direction (or swiping in a fourth direction opposite to the third direction) in the target area of ​​the screen of the user terminal (120) where the first content (911) is displayed when the first web page is displayed on the user terminal (120). When the second content (912) is displayed in the target area of ​​the screen of the user terminal (120), the second content (912) may be displayed on the screen while moving in the third direction. At this time, the first content (911) that was being displayed in the area of ​​the screen of the user terminal (120) where the second content (912) is displayed may gradually be terminated from being displayed. In other words, the electronic device (110) can cause the output of the first content (911) to gradually end from the first side of the first content (911) to the second side of the first content while the second content (912) is gradually output from the second side of the second content (912).

[0113] Similarly, when the electronic device (110) receives a user input swiping from the second side to the first side in the fourth direction in the target area where the first content (911) on the screen of the user terminal (120) is displayed, the first content (911) can be moved in the fourth direction so that the output of the first content (911) gradually ends from the first side of the first content (911) on the first side of the target area. At this time, the third content (not shown) can be gradually displayed in the area where the first content (911) was displayed on the screen of the user terminal (120). In other words, while the output of the first content (911) gradually ends from the first side of the first content (911), the electronic device (110) can be made so that the output of the third content (not shown) gradually ends from the second side of the third content (not shown) to the first side of the third content.

[0114] In one embodiment, the electronic device (110) may perform the following functions when the first web page is output to a user terminal (120): a function to change the display of the page header and search bar in the first web page described in FIGS. 4a through 6b, and to delete and restore the display of the search bar; a function to display the target text of the first content in the first web page described in FIGS. 7a through 7d; a function to apply a visual effect to the target image of the first content in the first web page described in FIGS. 8a through 8b; a function to delete the display of the first content and display other content (e.g., second content) in the first web page described in FIGS. 9a through 9b. It should be understood that the present embodiment may also be implemented through at least one or a combination of two or more of these multiple functions.

[0115] The methods according to the present disclosure may be computer-implemented methods. The computer may include, for example, a device capable of performing processing. Although each step of the methods in the present disclosure is illustrated and described in a predetermined order, the steps may be performed in any combination according to the present disclosure, in addition to being performed sequentially. In one embodiment, at least some of the steps may be performed in parallel, iteratively, or heuristically. The present disclosure does not exclude variations or modifications to the methods. In one embodiment, at least some of the steps may be omitted, or other steps may be added.

[0116] Various embodiments of the present disclosure may be implemented as software recorded on a machine-readable recording medium. The software may be software for implementing the various embodiments of the present disclosure described above. The software may be inferred from the various embodiments of the present disclosure by programmers skilled in the art to which the present disclosure pertains. For example, the software may be machine-readable instructions (e.g., code or code segments) or a program. The machine may be a device capable of operating according to instructions called from the recording medium, for example, a computer. In one embodiment, the machine may be a device according to the embodiments of the present disclosure. In one embodiment, the processor of the machine may execute the called instructions to cause the components of the machine to perform functions corresponding to those instructions. In one embodiment, the processor may be a processor according to the embodiments of the present disclosure. The recording medium may mean any type of recording medium in which data is stored that can be read by the machine. The recording medium may include, for example, ROM, RAM, CD-ROM, magnetic tape, floppy disk, optical data storage device, etc. In one embodiment, the recording medium may be memory. In one embodiment, the recording medium may be implemented in a distributed form in a networked computer system, etc. Software may be stored and executed in a distributed manner in a computer system, etc. The recording medium may be a non-transitory recording medium. A non-transitory recording medium refers to a tangible medium that exists regardless of whether data is stored semi-permanently or temporarily, and does not include a signal that propagates transitorily.

[0117] Although the technical concept of the present disclosure has been described by various embodiments above, the technical concept of the present disclosure includes various substitutions, modifications, and alterations that can be made within the scope of understanding of those skilled in the art to which the present disclosure pertains. Furthermore, it should be understood that such substitutions, modifications, and alterations may be included within the scope of the appended claims. Embodiments according to the present disclosure may be combined with one another. Each embodiment may be combined in various ways depending on the circumstances, and embodiments created by combining also fall within the scope of the present disclosure.

Claims

1. In a method performed by an electronic device, A step of obtaining a user's access request for a first web page of an e-commerce service; A step of generating web page information used for outputting the first web page, including the first content, the page header, and the search bar; and A step of transmitting the above web page information to the user's terminal Includes, The above web page information is, Information including, when the first web page is displayed, that the transparency of the page header and the search bar changes based on the position where the page header and the search bar are overlaid on the first content as the first web page is scrolled on the screen of the user's terminal. method.

2. In Paragraph 1, The above web page information is, Information including, as the first web page is scrolled, to reduce the transparency of the page header and the search bar as the distance from the top of the first content to the top of the page header increases, method.

3. In Paragraph 1, The above web page information is, Information including the page header and the search bar so that they are displayed at a fixed location on the screen of the user's terminal, method.

4. In Paragraph 1, The above web page information is, Information including setting the color of the page header to a color corresponding to a first partial area of ​​the first content that the page header overlays, and setting the color of the search bar to a color corresponding to a second partial area of ​​the first content that the search bar overlays. method.

5. In Paragraph 1, The above web page information is, Information including, when the search bar reaches the bottom of the first content while the first web page is scrolling in the first direction, moving the search bar in the second direction opposite to the first direction, and gradually deleting from the top of the search bar at the point where the display of the search bar touches the page header. method.

6. In Paragraph 5, The above web page information is, If the distance from the top of the first content to the top of the page header is shorter than the distance to the first point of the first content, the search bar is displayed, and Information including, when the distance from the top of the first content to the top of the page header is longer than or equal to the distance to the first point of the first content, removing the display of the search bar while the first web page is scrolled in the first direction, and maintaining or restoring the display of the search bar while the first web page is scrolled in the second direction. method.

7. In Paragraph 6, The above web page information is, The display of the search bar is deleted only when there exists a point in time where the instantaneous speed is greater than or equal to the first threshold speed while the first web page is scrolled in the first direction, and Information including information for maintaining or restoring the display of the search bar only when there exists a point in time where the instantaneous speed is greater than or equal to the second threshold speed while the first web page is scrolled in the second direction. method.

8. In Paragraph 6, The above web page information is, Information including that the speed at which the display of the search bar is deleted is faster than the speed at which the display of the search bar is restored. method.

9. In Paragraph 1, The above first content includes a target image and a target text, and The above web page information is, Information including, after a first point in time when the display of the target image on the screen of the user's terminal is completed, the target text is displayed while the transparency of the target text decreases over time. method.

10. In Paragraph 9, The above target text includes a main text and a subtext, and The above web page information is, Information including that at a third point in time after a second point in time when the display of the main text changes, the display of the sub-text begins to change, and each of the main text and the sub-text is moved in a second direction and placed at each of a plurality of preset positions in the target image. method.

11. In Paragraph 10, The above web page information is, The second point where the display of the main text begins is located in the second direction compared to the third point where the display of the sub-text begins, and Information including that the point where the movement of the main text ends is located in the second direction rather than the point where the movement of the sub-text ends. method.

12. In Paragraph 9, The above web page information is, Information including, after the output of the target image on the screen of the user's terminal is completed, to gradually enlarge the target image from its basic size to a size of a preset ratio over a preset period, method.

13. In Paragraph 12, The above method is, The method further includes the step of applying an object identification model to the target image to identify at least one object from the target image, and The above web page information is, Information comprising a target image that is magnified around a target object among at least one of the identified objects, method.

14. In Paragraph 12, The above method is, When a plurality of objects are identified from the target image, the method further includes a step of calculating the importance of each of the plurality of objects based on the information of the first content. The above web page information is, Information including, for each cycle, that one object selected in order of importance among the plurality of objects is enlarged, or that the target image is enlarged centering on the object with the highest importance. method.

15. In Paragraph 1, The above web page information is, When a user input is received in which the user swipes from the first side to the second side in the third direction in the target area where the first content is displayed on the screen of the user's terminal, the second content, which is different from the first content, is moved in the third direction and gradually displayed starting from the second side of the second content from the first side of the target area. Information including that while the second content is being output, the output of the first content is gradually terminated from the first side of the first content to the second side of the first content. method.

16. One or more processors; and It includes one or more memories in which instructions to be executed by the above one or more processors are stored, and An electronic device configured such that, upon execution of the above instructions, one or more processors enable the execution of a method according to any one of claims 1 to 15.

17. A non-transient computer-readable recording medium having recorded instructions that cause one or more processors to perform an operation when executed by one or more processors, The above instructions are configured to cause one or more processors to execute a method according to any one of claims 1 to 15, a non-transient computer-readable recording medium.

Images