KR102117452B1 - Electronic Device and the Method for Producing Contents - Google Patents

Abstract

According to an embodiment of the present invention, a content producing method by an electronic device comprises the operations of: accessing a website provided by a server through a web browser, downloading a resource including a plurality of scene templates from the server, and storing the resource in a memory of the electronic device; identifying, when an attachment-related request for a plurality of images is acquired, each of attached images based on the resource; arranging the identified attached images in the plurality of scene templates, respectively, based on the resource to generate a plurality of preview images; displaying the generated preview images on the web browser based on the resource; and uploading the plurality of attached images to the server in association with the plurality of scene templates so that when a storage-related request for the plurality of attached images is acquired, the server produces content by using the plurality of attached images based on the resource. According to the present invention, the content producing method can easily produce content based on pictures and videos.

Description

Electronic device and its method for producing content

Various embodiments disclosed in this document are related to a photo or video-based content production technology.

With the development of IT technology and multimedia technology, non-professional individuals can also produce digital content using photographed pictures and videos (original video), and distribute, share, or sell the digital content.

However, non-professional individuals can create digital content at a level that simply connects the original photo and video, and through high-quality digital content through various editing tasks such as extracting a part of the photo and video or combining it with various scenes. It can be difficult to produce.

Therefore, individuals (or small and medium-sized businesses) who desire high-quality digital content pay high costs and request professional production companies to produce content. However, digital content produced by a professional production company may be produced differently from the client's intention, and if the client requests supplementation, the production period may be very long.

To prevent this problem, many providers are providing web-based video production services that facilitate the production of high-quality digital content using photos and videos.

Korean Registered Patent No. 10-1982221 Korean Patent Publication No. 10-2008-0090218

Conventional web-based video production service uploads photos or videos one by one to the server and then synthesizes them with the background layer (or scene template), so that the photos and videos are combined with the background layer to display the preview video for it. It can take.

Various embodiments disclosed in this document may provide an electronic device capable of easily producing content based on photos and videos and a method for producing the content.

An electronic device according to an embodiment disclosed in the present disclosure includes an input circuit; A communication circuit capable of communicating with a server providing a designated web site; Memory; And a processor for controlling a web browser, wherein the processor accesses the website through the communication circuit and the web browser, and a plurality of scene templates from the server through the website. Download the resource including the (download) and store it in the memory, and obtain an attachment-related request for a plurality of attached images through the input circuit, check each attached image based on the resource, and to the resource Based on the arrangement of the respective attached images in the plurality of scene templates, a plurality of preview images are generated and stored in the memory, and the generated preview images are displayed on the web browser based on the resource, and the input is When a request for storage of the plurality of attached images is obtained through a circuit, the plurality of attached images stored in the memory based on the resource is generated so that the server produces content based on the plurality of attached images. The plurality of scene templates may be uploaded to the server.

In addition, the method for producing content by an electronic device according to an embodiment disclosed in this document accesses a website provided by a server through a web browser and downloads a resource including a plurality of scene templates from the server downloading and storing in the memory of the electronic device; When acquiring a request for attachment to a plurality of attached images, checking respective attached images based on the resource; Generating a plurality of preview images by arranging respective attached images identified in the plurality of scene templates based on the resource; Displaying the generated preview images on the web browser based on the resource; When a request for storage of the plurality of attached images is obtained, the plurality of attached images are associated with the plurality of scene templates so that the server produces content using the plurality of attached images based on the resource. By doing so, it may include an operation of uploading to the server.

According to various embodiments disclosed in this document, content can be easily produced based on pictures and videos. In addition, various effects that can be directly or indirectly identified through this document may be provided.

1 is a view for explaining a method for producing content by an electronic device according to an embodiment.
2 is a block diagram of an electronic device according to an embodiment.
3 shows a method for producing content according to an embodiment.
4 illustrates a UI screen of a process of attaching a plurality of images according to an embodiment.
5 illustrates a UI screen including generated preview images according to an embodiment.
6 is a diagram for describing resources related to each scene template according to an embodiment.
7A and 7B show editing interface screens for a preview image according to an embodiment.
8A and 8B show a UI screen in the process of exchanging attached images synthesized in two scene templates according to an embodiment.
9 is a diagram for explaining a method of synthesizing an attached image to a scene template according to an embodiment.
10 illustrates a UI screen associated with attaching an image according to an embodiment.
11 and 12 illustrate a UI screen related to preview image display according to an embodiment.
In connection with the description of the drawings, the same or similar reference numerals may be used for the same or similar components.

1 is a view for explaining a method for producing content by an electronic device according to an embodiment.

Referring to FIG. 1, the server 100 may be a web server providing a web site for a content production service. For example, the server 100 may store a resource defining a video template and area information in which each of the attached (or selected) images is synthesized (or attached) to each scene template. The video template may include video properties (eg, video name, duration, background music) and a plurality of scene templates. The scene template is prepared for each content subject (or category) (eg, proposal, wedding, stone feast, 60th birthday party, and corporate promotion), and images may be synthesized (or attached or overlapped) in a designated area of the scene template. have. The scene template may include scene attributes (eg, scene number, exposure time, song lyrics, recommended photo type) and a plurality of layers (eg, text layer, foreground layer, background layer). Each layer may include layer properties (eg, layer order, coordinates, and size blend mode) required when synthesizing the preview image. The resource may include instructions for generating, editing, and storing a plurality of preview images based on a plurality of images synthesized in each scene template, for example. The server 100 may access the website and provide (download or transmit) the resource to the electronic device 200 that transmits a request for content creation.

The electronic device 200 is a PC, a laptop, a smart phone (smart phone), a tablet (tablet), a wearable computer (wearable computer), such as the server 100 associated with the web / mobile site connection or installation of services-only applications and It can mean any terminal device that can be executed. The electronic device 200 accesses a website provided by the server 100, downloads the resource from the server 100, and provides a content creation (or generation) service by the server 100 based on the resource. It can be provided (or it can create content). Operations for generating content by the electronic device 200 referred to in this document (for example, an operation for generating, storing, and editing a preview image based on an image) may be performed based on a resource provided by the server 100 have. However, some operations for generating content of the electronic device 200 included in this document may be described without reference to resources for convenience of description.

According to an embodiment, the electronic device 200 accesses a website provided by the server 100 through a web browser (for example, a general-purpose web browser or a service-only application), and from the server 100 through the website You can display the list of video templates provided. The electronic device 200 transmits the selected video template information to the server 100 when video template information (for example, a video template related to a proposal, a wedding, a stone feast, a 60th birthday, and a corporate promotion) is selected from a list of displayed video templates. I can send it. The server 100 may provide the electronic device 200 with a resource for content creation including a plurality of scene templates 210 corresponding to a content-related topic. The electronic device 200 may download a resource for content creation from the server 100 and store it in its own memory (eg, at least one of a nonvolatile memory and a volatile memory). When the electronic device 200 confirms a request for attaching an image to be used for creating the content, the electronic device 200 may provide an interface for attaching the image through a web browser in response to the attach request. When the plurality of attached images 220 (eg, photos, videos) to be attached (hereinafter referred to as “attached images”) is selected through the provided interface, the electronic device 200 checks each of the attached images 220. Can be. The electronic device 200 generates a plurality of preview images 230 by synthesizing (or overlaying) each attached image identified on the basis of the resource into the plurality of scene templates 210, and generates the generated preview images 230. The preview images 230 may be displayed on a web browser. The electronic device 200 may store the generated preview images 230 in its own memory.

According to an embodiment of the present disclosure, when any one preview image among a plurality of preview images is selected by the user, the electronic device 200 may provide an editing interface for the selected preview image. When at least one preview image among the plurality of preview images is edited through the editing interface, the electronic device 200 stores edited information on the at least one preview image and an edited attached image corresponding to the edit information in its own memory. Then, at least one preview image being edited can be displayed on a web browser. The editing information may include, for example, at least one of a rotation angle, an enlargement ratio, inversion-related information, and coordinate information. The coordinate information may include, for example, (position) coordinate information of an attached image synthesized on a scene template.

According to an embodiment, when the electronic device 200 confirms a request for storage of a plurality of attached images by a user, the electronic device 200 associates the plurality of attached images 220 with the plurality of scene templates 210, respectively. The server 100 may be uploaded and stored. The electronic device 200 may upload a plurality of attached images 220 (original), edited attached images (edit), and the edit information to the server 100 in association with the plurality of scene templates 210. . Thereafter, the server 100 generates content based on the uploaded plurality of attached images 220, edit information, the edited attached image, and the plurality of scene templates 210 and stores the generated content in a database. have. The generated content can be downloaded by the electronic device 200 and distributed or shared.

According to the above-described embodiment, the electronic device 200 selects an attached image for content generation or generates a preview image itself without transmitting or receiving the original or edited image of the attached image to the server 100 separately in the process of editing. Can be. Accordingly, the electronic device 200 may solve the conventional inconvenience of delay caused by transmitting and receiving the attached image to and from the server to generate a preview image in the attachment and editing steps related to production.

2 is a block diagram of an electronic device according to an embodiment.

Referring to FIG. 2, the electronic device 200 according to an embodiment may include an input circuit 210, a communication circuit 220, a display 230, a memory 240, and a processor 250. In one embodiment, the electronic device 200 may omit some components or further include additional components. In addition, some of the components of the electronic device 200 are combined to be configured as one entity, and the functions of the corresponding components before combining may be performed in the same way.

The input circuit 210 may detect or receive a user input. For example, the input circuit 210 may include at least one of a touch sensor, a mechanical button, a mouse, and a keyboard.

The communication circuit 220 may support establishment of a communication channel or a wireless communication channel between the electronic device 200 and another device (eg, the server 100), and performance of communication through the established communication channel. The communication channel may be, for example, a communication channel such as a local area network (LAN), Fiber　to　the　home (FTTH), x-Digital　Subscriber　Line (xDSL), WiFi, Wibro, 3G or 4G.

The display 230 may display various contents (for example, text, video, video, icons, and/or symbols, etc.). The display 230 may include, for example, a liquid crystal display (LCD), a light emitting diode (LED) display, an organic light emitting diode (OLED) display, or an electronic paper display. The display 230 may display a web browser and the web site according to a command of the processor 250.

The memory 240 may store various data used by at least one component (eg, the processor 250) of the electronic device 200. The data may include, for example, input data or output data for software and related commands. For example, the memory 240 may store at least one instruction (for example, a resource provided by the server 100) for a content production service. The memory 240 may include volatile memory or nonvolatile memory.

The processor 250 may control at least one other component (eg, hardware or software component) of the electronic device 200, and may perform various data processing or operations. The processor 250 includes, for example, a central processing unit (CPU), a graphics processing unit (GPU), a microprocessor, an application processor, an application specific integrated circuit (ASIC), and field programmable gate arrays (FPGA). )), and may have a plurality of cores. The processor 250 may control a web browser (eg, a general-purpose web browser or a service-only application) to access the server 100 through a web browser and receive a web-based content production service.

The processor 250 accesses a website provided to the server 100 through a communication circuit 220 (hardware) and a web browser (software), and displays a list of video templates provided by the server 100 through the website. It is possible to acquire and display the acquired video template list (for example, text referring to a content-related topic) in a web browser. The video template list may be related to content subject information of at least one of a proposal, a wedding, a stone feast, a 60th birthday party, and a corporate promotion, for example.

The processor 250 may check video template information selected (eg, clicked) by the user through the input circuit 210 from the video template list, and transmit the checked video template information to the server 100.

The processor 250 may download a resource for content creation corresponding to the selected video template information from the server 100 and store it in the memory 240. In this regard, the server 100 provides (or transmits) a resource for producing content including a video template corresponding to video template information (eg, subject information or template unique number) to the electronic device 200. )can do. The video template may include video properties (eg, video name, duration, background music) and a plurality of scene templates. The scene template is prepared for each content subject (or category) (eg, proposal, wedding, stone feast, 60th birthday party, and corporate promotion), and the attached image is synthesized (or attached or overlapped) in a designated area of the scene template. Can be. The scene template may include scene attributes (eg, scene number, exposure time, song lyrics, recommended photos) and a plurality of layers (eg, text layer, foreground layer, background layer). Each layer may include layer attributes (eg, layer order, coordinates, and size blend mode) required when synthesizing the preview image. For example, the resource may be, for example, a video template including a plurality of scene templates, and attached (or selected) region information to which each attached image is synthesized (or attached) to each scene template. . For example, the resource may include instructions for generating, editing, and storing a plurality of preview images based on a plurality of attached images synthesized in each scene template. The server 100 may access the website and provide (download or transmit) the resource to the electronic device 200 that transmits a request for content creation.

When the processor 250 confirms a request for attaching an image to be used for producing the content, the processor 250 may provide an interface for attaching the image based on a resource through a web browser. When a plurality of attached images 220 (eg, photos and videos) are selected through the provided interface, the processor 250 may check the plurality of attached images 220 based on a resource. The processor 250 generates a plurality of preview images 230 by synthesizing (or overlaying) each identified attached image on the plurality of scene templates according to a specified placement rule based on the resource, The generated preview images 230 may be stored in the memory 240. The electronic device 200 may display the generated preview images 230 in a web browser. For example, the processor 250 associates each of the attached images with a plurality of scene templates in a specified order (eg, the order of attachment of the images), and attaches each of the attached images to a designated area in each scene template associated with each attached image. It can be synthesized (or combined or overlapped) to display.

When the processor 250 generates each preview image, each attachment image is automatically edited (eg, enlarged, reduced, or cropped) according to a specified placement rule based on a resource, and each edited attachment image is edited in each scene. Each of the preview images can be generated by arranging them after placing them in a designated area of the template. For example, when the designated area of the scene template is an aspect ratio area (for example, a horizontally long rectangle) and the attached image is a horizontal picture, the processor 250 fills the attached area (horizontal picture) in the designated area so that there is no margin. Can be filled. For another example, if the designated area of the scene template is an aspect ratio area and the attached image is a vertical picture, the processor 250 aligns the top and bottom of the vertical picture with the top and bottom of the designated area and centers the vertical picture in the designated area. Can be placed on. As another example, when the designated area of the scene template is a vertical proportion area (for example, a vertically long rectangle) and the attached image is a vertical picture, the processor 250 fills the specified area (vertical picture) in the designated area so that there is no margin. Can be filled. As another example, when the designated area of the scene template is a vertical proportion area and the attached image is a horizontal picture, the processor 250 aligns the left and right sides of the horizontal picture with the left and right sides of the designated area and centers the attached image in the center of the designated area. Can be placed.

The processor 250 may fill a margin based on a designated color, a designated image, or an attached image if a margin exists after placing each attached image in a designated area of the scene template. For example, the processor 250 compares an area (designated area) in which each attachment image is to be displayed in each scene template and the size of each attachment image to determine whether the size of the attachment image is smaller than the size of the designated region. Can be. When the size of the attached image is smaller than the size of the designated area, the processor 250 may fill a margin part due to the size difference based on the designated color or the attached image. The processor 250 may, for example, enlarge the attached image at a ratio (enlargement ratio) corresponding to the designated area, and apply a blur effect to the enlarged attached image. The processor 250 may apply a blur effect to the enlarged attached image by adding or subtracting a specified pixel value to each pixel value of the enlarged attached image, for example. The processor 250 may place (or display) each attached image in a designated area, and may place an attached image in which a blur effect is applied to a margin portion of the designated area. In contrast, the processor 250 arranges (or displays) an attachment image with blur effect applied to the entire designated region, and places each attachment image (attachment image without enlargement and blur effect applied) in the center of the designated region. can do. Alternatively, the processor 250 may fill the margin portion with a single color (eg, a color selected by the user) based on the resource. Alternatively, the processor 250 may fill the margin portion with a designated margin image based on the resource. According to the above-described embodiment, the processor 250 may fill the margin part using a designated image or an attached image arranged in each scene template, so that the margin of the scene template Part and attached video (or video) can be supported to match naturally.

The processor 250 may provide an editing interface for the selected preview image when any one of the preview images attached through the input circuit 210 is selected. The editing interface may include, for example, an interface for editing at least one of changing, scaling, rotating, moving coordinates, inverting, aligning, and text input (or changing) the image.

The processor 250 may generate edit information for a preview image (or an image corresponding to the preview image) for the preview image edited through the editing interface, and display at least one preview image being edited on the web browser. have. The edit information may include at least one of a rotation angle, an enlargement ratio, coordinate information, and input text information, for example. The coordinate information may include, for example, coordinate information of an image arranged in a designated area of a scene template. The processor 250 may store the edited preview image and edit information on the preview image in the memory 240 during or during editing of the preview image. The edit information may include at least one of edit information for an attached video according to a specified arrangement rule and edit information generated during a user's editing process.

When the processor 250 obtains a request to store a plurality of attached images through the input circuit 210, the processor 250 uploads and stores the plurality of attached images to the server 100 in association with a plurality of scene templates. Can be. For example, the processor 250 generates an edited image based on the edit information for the plurality of attached images, and associates the plurality of attached images, the edit information and the edited attached image with a plurality of scene templates It can be uploaded to the server 100 and stored. In this case, the server 100 may store the uploaded plurality of attached images, edit information, and edited attached images in a database of the server 100 in association with a plurality of scene templates. Subsequently, the server 100 may generate content by sequentially synthesizing the edited attached images to a plurality of scene templates, and store the generated content in a database. The generated content may be, for example, content that sequentially plays and displays a composite file of a plurality of scene templates and a plurality of attached images (or edited attached images). The generated content may be played together with background music associated with a plurality of scene templates.

The processor 250 may obtain a request related to termination of a web browser (or a disconnect request to a website) before uploading a plurality of attached images to the server 100 in connection with a plurality of scene templates. In this case, the processor 250 may delete a plurality of preview images stored in the memory 240 and edit information related to the plurality of preview images and the edited attached images from the memory 240.

The processor 250 transmits to the attached video (first attached video) and the second preview video corresponding to the first preview video (or included in the first preview video) among the plurality of preview videos through the input circuit 210. A request for an exchange for a corresponding attached video (second attached video) may be obtained. In this regard, the processor 250 may drag the second preview image to the location of the first preview image through the input circuit 210 or sequentially touch the first preview image and the second preview image ( When it is confirmed that touch or click is performed, it may be determined that the first preview image and the second preview image are selected.

The processor 250 may exchange the first attached image corresponding to the first preview image and the second attached image corresponding to the second preview image when the exchange-related request is obtained through the input circuit 210. For example, the processor 250 may remove the attached image of the first image from the first scene template and then synthesize the attached image of the second image to regenerate the first preview image. In addition, the processor 250 may remove the second attached image from the second scene template, and then synthesize the first attached image to regenerate the second preview image. According to a conventional content production method, after selecting a plurality of attached images to be disposed in a plurality of scene templates, when exchanging between two attached images to be disposed in two scene templates among a plurality of scene templates, each scene template Since it is necessary to newly select a photo or video to be associated with, the exchange may take a lot of effort and time. However, according to the above-described embodiment, the processor 250 selects two attached images attached to two scene templates, or drags one of them to synthesize (or attaches) the two scene templates. ) Can be easily exchanged between attached videos.

In the above-described embodiment, as the processor 250 utilizes the hardware acceleration function of the web browser, the server 100 selects an attached video based on a resource from the server 100 and then processes the video according to a request related to storage of the selected attached video. Before transmitting to (100), a preview image may be generated by synthesizing an attachment image and a scene template by itself, without transmitting and receiving an attachment image with the server 100, or an edited preview image may be displayed.

According to various embodiments, the processor 250 may selectively display the generated preview images through a summary view screen or a detailed view screen. For example, when the preview images are generated, the processor 250 may display a preview image list through the summary view screen, and upon receiving a request for a detailed view of the preview image list, a detailed view screen. The summary view screen may include, for example, a preview image list, an edit button for each preview image, or an image attachment button for a scene template. The detailed view screen includes, for example, exposure (or display) time information of each attached video (or scene template) related to each preview video, lyrics information of background music played when each attached video is displayed, each scene The template may include at least one of recommended photo type information to be attached to the template, quality information of each attached image, and duplicate attachment guide information of each attached image. In this regard, each of the plurality of scene templates is associated with background music that is played together during content playback, and the background music may be music with lyrics. Each scene template may be associated with some lyrics (or the contents of the lyrics) of the entire lyrics of the background music. The some lyrics may be lyrics displayed at a playback time of each scene template (time when each template is displayed) during content playback.

In this case, the processor 250 may display some lyrics information related to each scene template in the periphery (eg, lower part) of each scene template. In addition, the processor 250 may provide recommended picture type information such as “hand-held picture” for each scene template in which the lyrics of the background music “I will not let go of this hand” are played. In addition, the processor 250 may check image quality related when each attached image is included in the content, and display the quality information (eg, good, normal, or bad) around each preview image. The processor 250 may provide duplicate attachment guidance information, such as a “duplicate attached picture”, to an overlapped attached image among attached images.

According to the above-described embodiment, the electronic device 200 may generate a preview image itself without transmitting or receiving the original or edited copy of the attached image to the server 100 in the process of selecting or editing the attached image to be included in the content. have. Accordingly, the electronic device 200 may solve the conventional inconvenience of delay caused by transmitting and receiving the attached image to and from the server to generate a preview image in the attachment and editing steps related to production.

Further, according to the above-described embodiment, the electronic device 200 may exchange images combined (or synthesized) with a scene template through click or drag, thereby supporting easier content creation.

In addition, according to the above-described embodiment, the electronic device 200, when each scene template is associated with the lyrics of the background music, the user is attached video (picture or video) more relevant to the lyrics of each scene template ) As it is supported to be placed in each scene template, it is possible to induce the creation of highly complete content.

3 shows a method for producing content according to an embodiment.

Referring to FIG. 3, in operation 310, the electronic device 200 accesses a website provided by a server (eg, the server 100 of FIG. 1) through a web browser, and a plurality of scene templates from the server 100 Resources including templates may be downloaded and stored in a memory (eg, memory 240 of FIG. 2). The scene template is, for example, a background layer provided for each content subject (eg, proposal, wedding, stone feast, 60th birthday, and corporate promotion), and the selected attachment image is synthesized (or attached or overlapped) in a region designated in the scene template. ). The resource may include a resource for content creation, for example, a plurality of scene templates, a background layer associated with each scene template, a foreground layer, and a text layer. For example, the resource may include instructions for generating, editing, and storing a plurality of preview images based on a plurality of attached images synthesized in each scene template.

In operation 320, when the electronic device 200 obtains a request for attaching a plurality of images by a user, the electronic device 200 may check each attached image based on a resource. The plurality of attached images may include at least one of a photo and a video, for example.

In operation 330, the electronic device 200 may generate a plurality of preview images by synthesizing (or attaching or overlapping) each of the identified attached images to the plurality of scene templates based on a resource. For example, the electronic device 200 edits (eg, enlarges, reduces, or crops) each attached image according to a specified placement rule based on the resource, and places each edited attached image in a designated area of each scene template By doing so, each preview image can be generated. In operation 330, the electronic device 200 may store the generated plurality of preview images in the memory 240. Additionally or alternatively, the electronic device 200 may store relevance information between a plurality of attached images and a plurality of scene templates (eg, at least one of an image name or a storage location of an image disposed in each scene template). Can be stored in.

In operation 340, the electronic device 200 may display the generated preview images on the web browser through a display (eg, the display 230 of FIG. 2) based on the resource. In operation 340, when any one preview image is selected from the preview images, the electronic device 200 may provide an editing interface for the selected preview image. When the preview image is edited through the editing interface, the electronic device 200 may display the preview image being edited in a web browser, generate edit information for the preview image, and store it in the memory 240.

In operation 350, when the electronic device 200 obtains a storage-related request for the plurality of attached images (or content), the server 100 generates the content using the plurality of attached images, the Based on a resource, the plurality of attached images may be uploaded to the server 100 in association with the plurality of scene templates. For example, if the electronic device 200 obtains a storage-related request, the electronic device 200 transmits a plurality of attached images stored in the memory 240, edit information on the plurality of attached images, and the edited attached images to the server 100. can do. The edit information may include at least one of edit information for an attached video according to a specified arrangement rule and edit information generated during a user's editing process.

4 illustrates a UI screen 400 in a process of attaching a plurality of images to a video template according to an embodiment.

Referring to FIG. 4, when the request for attaching an image to be used for content creation is confirmed, the electronic device 200 may display an interface for attaching the image through a web browser in response to the attach-related request. For example, when the button 410 related to the image selection to be attached is selected, the electronic device 200 may provide a user interface for selecting a plurality of attached images. When a plurality of attached images are selected (eg, touch, drag or click) through the provided user interface, the electronic device 200 checks the selected attached image, confirms the attached image 420, and the number of selected attached images (431) ) And the total number of attached images 433 to be selected. Additionally, when the request for deletion related to the selected attached images is obtained, the electronic device 200 may delete or remove the attached image corresponding to the deletion related request from among the attached images.

When the attachment request-related button 440 for a plurality of images selected through the user interface is selected (corresponding to “acquisition of an attachment-related request”), the electronic device 200 identifies each attachment to a plurality of scene templates. A plurality of preview images 230 may be generated by synthesizing (or overlapping) the images. For example, the electronic device 200 may generate a plurality of preview images by synthesizing each attachment image with a plurality of scene templates in the order in which the plurality of attachment images are selected.

5 illustrates a UI screen 500 including generated preview images according to an embodiment.

Referring to FIG. 5, the electronic device 200 may display a UI screen 500 including preview images 510 generated through the process of FIG. 4 in a web browser. When the electronic device 200 obtains a storage-related request for a plurality of attached images (or contents) (for example, when the button 520 is selected), the plurality of attached images and edit information for the plurality of attached images And uploading the edited attached images to the server 100 in association with a plurality of scene templates. In addition, if the electronic device 200 obtains a request for content creation based on a plurality of attached images (eg, when the button 530 is selected), the electronic device 200 may transmit a request for content creation to the server 100. When a server (eg, the server 100 of FIG. 1) receives a request for content creation, a plurality of scene templates are based on a plurality of attached images, edit information for each attached image, and edited attached images. Content can be generated by synthesizing the attached images of.

6 is a diagram for describing resources related to each scene template according to an embodiment.

Referring to FIG. 6, the electronic device 200 may generate a preview image 650 by synthesizing the attached images 610 with each scene template 620, 630, and 640 based on resources. For example, the electronic device 200 includes the attached image 610 as a foreground layer 620 (eg, a layer for applying a margin effect), a text layer 630 (eg, including text), and a background layer ( 640) (eg, including an image that is a background of the attached image) and synthesizing (or overlapping) the preview image 650 may be generated.

7A and 7B show editing interfaces 710 and 720 for a preview image according to an embodiment.

Referring to FIG. 7A, while the electronic device 200 displays a plurality of preview images 510, it can be confirmed that any one of the preview images 711 is selected. The electronic device 200 may display an edit button 712 for activating an editing interface for each preview image (eg, 711) under each preview image (eg, 711). According to various embodiments, the edit button 712 may be selectively displayed when each preview image is selected.

Referring to FIGS. 7A and 7B, when the edit button 712 of FIG. 7A is selected, the electronic device 200 may display the editing interface 720 as shown in FIG. 7B based on the resource. The editing interface 720 may include an editing tool area 721, a preview area 722, a text area 723 and a button area 724. The editing tool area 721 includes, for example, changing, scaling, rotating, moving coordinates (or, position), inverting (e.g. flipping left and right), aligning (e.g. centering) and applying effects (e.g. solid color) , Blur effect, application of a margin effect such as image application). The preview area 722 may be an area where a preview image is displayed. The text area 723 may be an area for inputting text to be displayed in the scene template. The electronic device 200 may display a preview image in which the attached image is synthesized with a scene template instead of the attached image in the preview area 722. Hereinafter, the operation of the electronic device 200 when editing the preview image by the editing interface 720 will be described.

According to an embodiment of the present disclosure, when a new attachment image to replace an attachment image currently selected (or attached or synthesized) is selected through the editing tool, the electronic device 200 synthesizes and previews the new attachment image in the scene template The area 722 can be displayed. For example, when the change button of the attached image is selected, the electronic device 200 may provide an interface for selecting the attached image to be replaced. When a new attachment image is selected through the corresponding interface, the electronic device 200 may associate the new attachment image with the scene template, and synthesize the new attachment image in the scene template and display it in the preview area 722. In this process, when two attachment images are selected as an attachment image to be replaced, the electronic device 200 may determine, as a new attachment image, an image in which two attachment images are connected side by side according to the two selected attachment images. .

According to an embodiment, when the attached image displayed in the preview area 722 is dragged (eg, mouse drag, drag gesture (or touch-based drag)), the electronic device 200 attaches the image based on the dragged position. It is possible to change the location coordinates of and edit information of the attached image corresponding to the changed location coordinates.

According to an embodiment, when the electronic device 200 obtains a request related to enlargement or reduction of the attached image displayed on the preview area 722 through the editing tool, the electronic device 200 enlarges or reduces the attached image and adjusts the Editing information of the corresponding attached video may be generated. For example, the electronic device 200 checks a pinch out or pinch in gesture for the attached image displayed in the preview area 722, or when an enlargement or reduction tool is selected, the attached image It can be confirmed that a request related to enlargement or reduction of the request is obtained (or received).

According to an embodiment of the present disclosure, when the electronic device 200 obtains a request related to flipping left and right for an attached image displayed in the preview area 722 through an editing tool (or, when a flip tool is selected among the editing tools), the electronic device 200 attaches The image may be flipped left and right, and edit information corresponding to the inverted attached image may be generated.

According to an embodiment, when the electronic device 200 obtains a request for center alignment through an editing tool (or, when a center alignment tool is selected among editing tools), the electronic device 200 displays the attached image in the preview area 722 or the scene template. Arranged in the center of the designated area, edit information corresponding to the aligned attached image may be generated.

According to one embodiment, the electronic device 200 has a blur effect among margin effects (eg, monochrome/blur/margin image) through an editing tool. When selected (or, if an effect applying tool is selected among editing tools), the attached image may be blurried (blur is applied to the attached image), and the attached image to which the blur effect is applied may be displayed in a margin portion of the scene template. The electronic device 200 may generate edit information corresponding to the attached image displayed in the margin portion.

According to one embodiment, when the alternative text to replace the initial phrase is input through the text area 723, the electronic device 200 synthesizes the input text with the attached image and the scene template, and the text is attached to the synthesized attached image. Corresponding editing information can be generated.

When the "OK" button 724a of the button area 724 is selected, the electronic device 200 may synthesize the edited attached image with the scene template. When the “Cancel” button 724b of the button area 724 is selected, the electronic device 200 may synthesize the attached image before editing with the scene template.

While the preview image displayed on the preview area 722 is being edited using the above-described editing tool, the electronic device 200 does not transmit and receive the attached image to and from the server 100, and previews the preview image being edited ( 722). Accordingly, in the above-described embodiment, it is possible to solve the conventional inconvenience of delays caused by transmitting and receiving the attached image with the server 100 in order to generate a preview image in the editing process (or the editing process of the content) for the attached image. . In addition, according to the above-described embodiment, the preview area and the editing area are divided, thereby eliminating the conventional inconvenience of scrolling the screen to check the edited preview image.

According to various embodiments, the electronic device 200 may process some edits of the preview image based on the server 100. For example, the electronic device 200 transmits the input alternative text to the server 100, generates a text layer for text by the server 100, and acquires the generated text layer from the server 100 ( Or, receive). The electronic device 200 may generate a preview image using the acquired text layer. The electronic device 200 transmits alt text to the server 100 and previews a phrase (for example, after a while (within 1 second)) that delays time before receiving a text layer from the server 100. ).

According to various embodiments, the editing interface screen 720 may be displayed differently according to characteristics of a scene template. For example, when a preview image corresponding to a scene template that does not include an image (eg, a photo) is selected, the editing tool area 721 may not be displayed. For another example, when a preview image corresponding to a scene template that cannot change text is selected, the text area 723 may not be displayed.

8A and 8B show a UI screen 800 in the process of exchanging attached images synthesized in two scene templates according to an embodiment.

Referring to FIG. 8A, the electronic device 200 corresponds to a first preview image 810 among a plurality of preview images 510 (or an attached image included in the first preview image 810 (first attachment) Image) and an attachment image (second attachment image) corresponding to the second preview image 820 may be checked, for example, the electronic device 200 may receive the first through the input circuit 210. When it is confirmed that the preview image 810 and the second preview image 820 are sequentially touched or clicked, the first attached image and the second preview corresponding to the first preview image 810 are It can be confirmed that the exchange between the second attached images corresponding to the image 820 is requested, in this case, the electronic device 200 first attached image from the first scene template (included in the first preview image 810). After removing, the first preview image may be regenerated by synthesizing the second attached image In addition, the electronic device 200 may remove the second attached image from the second scene template (included in the second preview image 820 ). After that, the first preview image may be synthesized to regenerate the second preview image.

According to various embodiments of the present disclosure, when it is determined that the second preview image is dragged to the location of the first preview image through the input circuit 210, the electronic device 200 corresponds to the first preview image 810. It can be confirmed that the exchange between the first attached video and the second attached video corresponding to the second preview video 820 is requested.

Referring to FIG. 8B, when it is confirmed that two preview images are sequentially selected (eg, touch or click), the electronic device 200 displays two attached images corresponding to the two preview images 830 and 840. A pop-up window 850 inquiring whether to exchange or not may be displayed. In this process, the electronic device 200 may display check boxes that are selected for selected preview images and check boxes that are not selected for preview images that are not selected.

9 is a diagram for explaining a method of synthesizing an attached image to a scene template according to an embodiment.

Referring to FIG. 9, the electronic device 200 automatically edits (eg, enlarges, reduces, or crops) each attached image according to a designated placement rule, and places each edited attached image in a designated area of each scene template After previewing, each preview image may be generated.

When the designated area of the scene template is an aspect ratio area (eg, a horizontally long rectangle) and the attached image is a horizontal picture, the electronic device 200 may fill the designated area with the attached image of the horizontal picture so that there is no margin. For example, the electronic device 200 aligns the left and right sides of a horizontal photo (or an attached image of a horizontal photo) with the left and right sides of a designated area, such as the reference image 911, or the reference image 915. You can fit the top and bottom of the horizontal photo to the top and bottom of the designated area. Accordingly, the electronic device 200 may fill a designated area with an attached image of a horizontal picture even if a partial area of the horizontal picture is cut.

If the designated area of the scene template is an aspect ratio area (for example, a rectangle that is longer than vertical), and the attached image is a vertical picture, the electronic device 200 displays a vertical picture (or an attached picture of the vertical picture) as the reference image 920. Align the top and bottom of the top and bottom of the designated area, and vertical pictures (or attached images of vertical pictures) may be arranged in the center of the designated area.

When the designated area of the scene template is a vertical proportion area (eg, a vertically long rectangle) and the attached image is a vertical picture, the electronic device 200 may fill the designated area with the attached image of the vertical picture so that there is no margin. For example, the electronic device 200 aligns the left and right sides of the vertical picture (or the attached picture of the vertical picture) with the left and right sides of the designated area, such as the reference image 931 or the reference picture 935. The top and bottom of the vertical picture can be aligned with the top and bottom of the designated area. Accordingly, the electronic device 200 may fill a designated area with an attached image of a vertical picture even if a partial area of the vertical picture is cut.

When the designated region of the scene template is a vertical ratio region and the attached image is a horizontal photo, the electronic device 200 may align the left and right sides of the attached image with the left and right sides of the designated region and center the attached image in the center of the designated region. have.

10 illustrates a UI screen associated with attaching an image according to an embodiment.

Referring to FIG. 10, when a video template is selected, the electronic device 200 may display an interface 1000 for attaching an image to the selected video template. For example, the electronic device 200 may provide an interface for attaching a love picture, a wedding picture, and a video for each subject of the scene template to be included in the video template. The electronic device 200 displays the number of attached videos (or videos) to be attached for each subject through the interface 1000 (for example, 3 attachments) and the number of attached attached videos (for example, 10 in total). can do.

11 and 12 illustrate a UI screen related to preview image display according to an embodiment.

Referring to FIG. 11, the electronic device 200 generates a plurality of preview images by synthesizing a plurality of scene templates and attachment images selected by a user based on a resource, and the generated preview images 1110, 1120, and 1130 , 1140, 1150, 1160) A screen 1100 (summary view screen) including a list may be displayed through a web browser. The electronic device 200 may provide an interface capable of attaching an image to the preview image list. For example, the electronic device 200 may attach a new image after the [Attach Photo] button under the preview images (eg, 1110) is selected (eg, click), or a preview area (on the preview image or on the scene template). ), when a new image is dragged, a new image can be attached to each scene template. The electronic device 200 may display an [Edit] button capable of editing the attached image corresponding to each preview image in the preview image list.

Referring to FIGS. 11 and 12, when the electronic device 200 confirms a detailed view request for a preview image list (for example, selection of the soft button 1180 of FIG. 11 ), detailed information related to each preview image is provided. The UI screen 1200 can be displayed. The detailed information may be attached to each scene template, exposure information (or display) time information 1210 of each attached video (or scene template), lyrics information 1220 of background music played when each attached video is displayed, and each scene template It may include at least one of recommended picture type information, quality information of each attached image 1230, and duplicate attachment guide information 1240 of each attached image. For example, when each attached image is included in the content, the electronic device 200 may check the image quality of each attached image and display the confirmed quality information (eg, good, normal, bad). For another example, the electronic device 200 may provide recommended picture type information 1240 such as “hand-held picture” for each scene template in which the lyrics of the background music “I won't let go” are played. have. As another example, the electronic device 200 may provide duplicate attachment guide information 1240 such as “duplicate attached picture” for an overlapped attached image among attached images.

According to the above-described embodiment, the electronic device 200 may increase the completeness of the content produced by the user by guiding exposure time information related to each attached image. For example, as the electronic device 200 guides exposure time information related to each preview image, the user places a more preferred photo (attached image) in a scene template with a long exposure time and exposes a less preferred photo. It can help you place it in a short-time scene template. For another example, the electronic device 200 may assist the user to produce high-quality content by checking and guiding the image quality of the attached images based on the final content, not each attached image itself. As another example, the electronic device 200 may prevent a problem of duplicately attaching an image undesirably by a user, as the user attaches a duplicated image among the attached images to the user.

The electronic device 200 may provide an interface capable of changing background music on the UI screen 1200. For example, when the soft button 1250 associated with the preview image list is selected, the electronic device 200 may provide an interface capable of changing background music. When the background music is changed (or attached), the electronic device 200 may display a file name of the background music, a play button of the background music, and a delete button.

It should be understood that various embodiments of the document and terms used therein are not intended to limit the technical features described in this document to specific embodiments, and include various modifications, equivalents, or substitutes of the embodiment. In connection with the description of the drawings, similar reference numerals may be used for similar or related components. A singular form of a noun corresponding to an item may include one or more of the items, unless the context clearly indicates otherwise. In this document, "A or B", "at least one of A and B", "at least one of A or B", "A, B or C", "at least one of A, B and C" and "A, Each of the phrases such as “at least one of B, or C” may include any of the items listed together in the corresponding phrase of the phrase, or any possible combination thereof. “First”, “Second” , Or terms such as "first" or "second" may simply be used to distinguish a component from other components, and do not limit the components in other respects (eg, importance or order). Example: 1) a component is referred to as “coupled” or “connected” to another (eg 2) component, with or without the term “functionally” or “communically” In the case, it means that any of the components can be connected directly to the other component (eg, by wire), wirelessly, or through a third component.

The term "module" as used herein may include units implemented in hardware, software, or firmware, and may be used interchangeably with terms such as, for example, logic, logic blocks, components, or circuits. The module may be an integrally configured component or a minimum unit of the component or a part thereof performing one or more functions. For example, according to an embodiment, the module may be implemented in the form of an application-specific integrated circuit (ASIC).

Various embodiments of the present disclosure may include one or more instructions stored in a storage medium (eg, internal memory or external memory) (memory 240) readable by a machine (eg, electronic device 200). It may be implemented as software (for example, a program) including them. For example, a processor (e.g., processor 250) of a device (e.g., electronic device 200) may invoke and execute at least one of one or more instructions stored from a storage medium. It is possible to operate to perform at least one function according to the at least one instruction called, wherein the one or more instructions may include code generated by a compiler or code executable by an interpreter. The readable storage medium may be provided in the form of a non-transitory storage medium, where'non-transitory' is a device in which the storage medium is tangible, and is a signal (eg, electromagnetic waves). ), and this term does not distinguish between data being stored semi-permanently and temporarily.

According to one embodiment, a method according to various embodiments disclosed in the present document may be provided as being included in a computer program product. Computer program products can be traded between sellers and buyers as products. The computer program product is distributed in the form of a storage medium readable by a device (eg compact disc read only memory (CD-ROM)), or through an application store (eg Play Store ^TM ) or two user devices ( For example, it can be distributed directly between smartphones) and online (eg, downloaded or uploaded). In the case of online distribution, at least a portion of the computer program product may be temporarily stored at least temporarily in a storage medium readable by a device such as a memory of a manufacturer's server, an application store's server, or a relay server, or may be temporarily generated.

According to various embodiments, each component (eg, module or program) of the above-described components may include a singular or a plurality of entities. According to various embodiments, one or more components or operations of the above-described corresponding components may be omitted, or one or more other components or operations may be added. Alternatively or additionally, a plurality of components (eg, modules or programs) may be integrated into one component. In this case, the integrated component may perform one or more functions of each component of the plurality of components the same or similar to that performed by the corresponding component among the plurality of components prior to the integration. . According to various embodiments, operations performed by a module, program, or other component may be executed sequentially, in parallel, repeatedly, or heuristically, or one or more of the operations may be executed in a different order, or omitted Or, one or more other actions can be added.

Claims (9)

In the electronic device,
Input circuit;
A communication circuit capable of communicating with a server providing a designated web site;
Memory; And
It includes a processor that controls the web browser (web browser),
The processor,
Access to the website through the communication circuit and the web browser,
Select a video template through the website above,
Download a resource including a plurality of scene templates included in the selected video template from the server through the website (download) and store in the memory,
When an attachment-related request for a plurality of attachment images is obtained through the input circuit, in response to the attachment-related request, each attachment image is identified based on the resource,
A plurality of preview images are generated by arranging the attached images in the plurality of scene templates based on the resource,
The generated preview images are displayed on the web browser based on the resource,
Uploading the plurality of attached images to the server in association with the plurality of scene templates, so that the server produces content based on the plurality of attached images,
The plurality of preview images,
A first preview image in which a first attachment image among the plurality of attachment images is disposed in a first scene template among the plurality of scene templates, and the plurality of attachment images in a second scene template among the plurality of scene templates And a second preview image in which the second attached image is disposed,
When the first preview image and the second preview image are selected, the processor re-generates the first preview image by arranging the second attached image in the first scene template, and generates the first preview image in the second scene template. 1 An electronic device for reproducing the second preview image by disposing an attached image. The method according to claim 1, wherein the processor,
When an edit-related request for any one preview image among the plurality of preview images is obtained through the input circuit, an attached image disposed in the one preview image is previewed on the website in response to the edit-related request. In the viewing area,
The electronic device displays the image being edited in the preview region while editing the attached image corresponding to the one preview image in the preview region. The method according to claim 1, wherein the processor,
When at least one preview image among the plurality of preview images is edited, edit information on the at least one preview image is stored in the memory,
And uploading the plurality of attached images, the edited image corresponding to the edited preview image, and the edit information to the server in association with the plurality of scene templates. The method according to claim 1, wherein the processor,
The electronic device deletes the plurality of preview images stored in the memory when a request for termination of the web browser is obtained through the input circuit before uploading the plurality of images to the server. delete The method according to claim 1, wherein the processor,
The second preview image is dragged to the position of the first preview image through the input circuit, or the first preview image and the second preview image are sequentially touched or clicked. If it is confirmed, the electronic device determines that the first preview image and the second preview image are selected. The method according to claim 1, wherein the processor,
An electronic device that edits each attached image to a size corresponding to each scene template and places it in each scene template. The method according to claim 1,
The plurality of scene templates are associated with background music,
Each scene template is related to some lyrics of the background music lyrics,
The processor,
When a detailed view request for a preview image is obtained through the input circuit, the electronic device displays detailed information including some of the lyrics related to each scene template around each of the plurality of preview images. In the content production method by the electronic device,
Accessing a website provided by a server through a web browser, downloading a resource including a plurality of scene templates from the server, and storing it in a memory of the electronic device;
When acquiring a request for attachment to a plurality of images, checking respective attachment images based on the resource;
Generating a plurality of preview images by arranging respective attached images identified in the plurality of scene templates based on the resource;
Displaying the generated preview images on the web browser based on the resource;
When the request for storing the plurality of attached images is obtained, the plurality of attached images are associated with the plurality of scene templates so that the server produces content using the plurality of attached images based on the resource. And uploading to the server.
The plurality of preview images,
A first preview image in which a first attachment image among the plurality of attachment images is disposed in a first scene template among the plurality of scene templates, and the plurality of attachment images in a second scene template among the plurality of scene templates And a second preview image in which the second attached image is disposed,
When the first preview image and the second preview image are selected, a processor places the second attached image in the first scene template to regenerate the first preview image, and the first attachment to the second scene template A content production method for reproducing the second preview image by disposing an image.

Images