KR102247877B1 - 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치 - Google Patents

온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치 Download PDF

Info

Publication number
KR102247877B1
KR102247877B1 KR1020190032920A KR20190032920A KR102247877B1 KR 102247877 B1 KR102247877 B1 KR 102247877B1 KR 1020190032920 A KR1020190032920 A KR 1020190032920A KR 20190032920 A KR20190032920 A KR 20190032920A KR 102247877 B1 KR102247877 B1 KR 102247877B1
Authority
KR
South Korea
Prior art keywords
image
shopping mall
cropping
canvas
generating
Prior art date
Application number
KR1020190032920A
Other languages
English (en)
Other versions
KR20200112442A (ko
Inventor
이응기
김지영
Original Assignee
카페24 주식회사
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 카페24 주식회사 filed Critical 카페24 주식회사
Priority to KR1020190032920A priority Critical patent/KR102247877B1/ko
Publication of KR20200112442A publication Critical patent/KR20200112442A/ko
Application granted granted Critical
Publication of KR102247877B1 publication Critical patent/KR102247877B1/ko

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06QINFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES; SYSTEMS OR METHODS SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES, NOT OTHERWISE PROVIDED FOR
    • G06Q30/00Commerce
    • G06Q30/06Buying, selling or leasing transactions
    • G06Q30/0601Electronic shopping [e-shopping]
    • G06Q30/0641Shopping interfaces
    • G06Q30/0643Graphical representation of items or shoppers
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/60Editing figures and text; Combining figures or text
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T2210/00Indexing scheme for image generation or computer graphics
    • G06T2210/22Cropping

Landscapes

  • Business, Economics & Management (AREA)
  • Physics & Mathematics (AREA)
  • Accounting & Taxation (AREA)
  • Finance (AREA)
  • Theoretical Computer Science (AREA)
  • Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Development Economics (AREA)
  • General Business, Economics & Management (AREA)
  • Strategic Management (AREA)
  • Marketing (AREA)
  • Economics (AREA)
  • Processing Or Creating Images (AREA)
  • Management, Administration, Business Operations System, And Electronic Commerce (AREA)

Abstract

본 발명의 일 양태는 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위해 이미지를 크롭(crop)하는 방법을 개시하고 있다. 상기 방법은, 상기 온라인 쇼핑몰의 배너디자인에 사용될 제 1 이미지를 입력하는 단계, 상기 제 1 이미지 내에 포함된 객체를 분석하여 분석된 결과를 기반으로 상기 제 1 이미지를 배너 디자인에 사용가능한 형태로 변형시킴에 의해, 제 2 이미지를 생성하는 단계 및 상기 제 2 이미지를 기보유된 기본 템플릿에 삽입하여 배너 디자인을 완성하는 단계를 포함하되, 상기 제 2 이미지를 생성하는 단계는, 상기 제 1 이미지 내에 포함된 객체의 위치 및 크기 중 적어도 하나에 대한 분석 결과를 기반으로 상기 제 1 이미지의 적어도 일부를 크롭함에 의해 상기 제 2 이미지를 생성하는 단계를 포함한다.

Description

온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치{IMAGE CROP METHOD AND APPARATUS FOR GENERATING ONLINE SHOPPING MALL BANNER DESIGN}
본 발명은 배너 디자인 자동 생성 방법에 관한 것으로, 보다 상세하게는, 온라인 쇼핑몰과 연관된 배너 디자인을 자동으로 생성하기 위해 이미지를 크롭(crop)하는 방법에 관한 것이다.
온라인 전자 상거래(쇼핑몰이라고 부를 수 있음)를 운영하는 과정에서 쇼핑몰의 인지도를 높이고 매출을 증대시키기 위해 해당 쇼핑몰에 대한 홍보는 필수불가결한 활동이다. 이러한 쇼핑몰의 홍보활동은 흔히 "프로모션(promotion)"이라 불리는데 이는 "특정 주제를 가지고 행하여지는 다양한 홍보활동"으로 이해할 수 있다.
쇼핑몰 운영자는 프로모션의 효과를 높이기 위하여 다양한 홍보 수단을 이용하는데 그 중에서도 프로모션의 컨셉과 관련 정보를 간결하고 임팩트(impact) 있게 보여주는 배너(banner)는 홍보 수단의 핵심이라 할 수 있다.
따라서, 프로모션의 성과는 배너의 완성도(quality)에 의해 좌우될 만큼 중요한 요소가 되었지만 완성도 높은 배너를 만드는 작업은 디자인을 전문적으로 다루는 전문가의 영역으로, 이 분야의 경험이 부족한 일반인들은 많은 비용을 들여가며 전문가에게 제작을 의뢰하고 있는 것이 현실이다.
이에, 전문가에 의존하지 않고, 배너디자인을 효율적으로 만들기 위한 애플리케이션(application)이 요구되는 실정이다.
상술한 문제점을 해결하기 위한 본 발명의 일 양태에 따른 목적은 온라인 쇼핑몰 관리자가 용이하게 완성도 높은 배너 디자인을 생성할 수 있도록 지원하는 애플리케이션 기반의, 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치를 제공하는 것이다.
상기한 목적을 달성하기 위한 본 발명의 일 양태에 따른, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위해 이미지를 크롭(crop)하는 방법은, 상기 온라인 쇼핑몰의 배너디자인에 사용될 제 1 이미지를 입력하는 단계, 상기 제 1 이미지 내에 포함된 객체를 분석하여 분석된 결과를 기반으로 상기 제 1 이미지를 배너 디자인에 사용가능한 형태로 변형시킴에 의해, 제 2 이미지를 생성하는 단계 및 상기 제 2 이미지를 기보유된 기본 템플릿에 삽입하여 배너 디자인을 완성하는 단계를 포함하되, 상기 제 2 이미지를 생성하는 단계는, 상기 제 1 이미지 내에 포함된 객체의 위치 및 크기 중 적어도 하나에 대한 분석 결과를 기반으로 상기 제 1 이미지의 적어도 일부를 크롭함에 의해 상기 제 2 이미지를 생성하는 단계를 포함할 수 있다.
상기 제 1 이미지는 모델의 존재 여부 및 상기 모델의 신체 중 표시된 신체 부위의 위치, 얼굴의 존재 여부 중 적어도 하나를 분석하여, 상기 모델의 전신을 중심으로 하는 제 1 유형, 상기 모델의 상반신을 중심으로 하는 제 2 유형, 상기 모델의 하반신을 중심으로 하는 제 3 유형 및 상품 아이템을 중심으로 하는 제 4 유형 중 하나로 자동으로 카테고라이징될 수 있다.
상기 제 1 유형 내지 상기 제 4 유형의 이미지는 유형별로 서로 다른 크롭 알고리즘을 이용하여 크롭될 수 있다.
상기 제 2 이미지를 생성하는 단계는, 상기 제 1 이미지 내에 존재하는 적어도 하나의 객체 중 중심이 되는 제 1 객체를 기반으로 상기 제 1 객체가 상기 제 1 이미지의 중심이 되도록 상기 제 1 이미지를 크롭하는 단계를 포함할 수 있다.
상기 제 1 객체로부터 제 1 간격을 두고 상기 제 2 이미지의 경계선이 배치되도록 이미지를 크롭하되, 상기 제 1 객체가 상기 제 2 이미지의 중심에 위치하면서 상기 제 1 객체와 상기 제 2 이미지의 경계선까지의 거리가 상기 제 1 간격이 되도록 상기 제 1 객체의 크기 및 해상도 중 하나를 변경할 수 있다.
상기 제 1 객체의 크기에 대한 파라미터, 및 상기 제 2 이미지의 경계선 설정과 관련된 파라미터는 상기 제 1 이미지와 상기 제 2 이미지를 학습 데이터 셋으로 하여 제 1 딥 러닝(deep learning) 모델을 이용함에 의해 학습될 수 있다.
상기 제 1 이미지가 서로 구분 가능한 복수 개의 이미지를 포함할 때, 상기 복수 개의 이미지를 구분하는 경계선을 추출하여 상기 추출된 경계선을 기반으로 복수 개의 이미지를 개별 이미지로 크롭할 수 있다.
상기 제 1 이미지가 서로 구분 가능한 복수 개의 객체 - 상기 복수 개의 객체는 제 1 객체 및 제 2 객체를 포함함 - 를 포함할 때, 상기 제 1 객체와 상기 제 2 객체 간의 거리 및 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나의 크기를 고려하여 상기 제 1 객체를 중심으로 하는 제 1 독립 이미지와 상기 제 2 객체를 중심으로 하는 제 2 독립 이미지로 크롭할 수 있다.
상기 제 1 독립 이미지와 상기 제 2 독립 이미지로 크롭함에 있어서, (i) 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나의 크기, (ii) 상기 제 2 이미지의 크기 및 (iii) 상기 제 1 객체와 상기 제 2 객체와의 이격거리를 고려하여 상기 제 1 이미지를 크롭할 수 있다.
상기 제 1 독립 이미지와 상기 제 2 독립 이미지의 경계선은 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나로부터 제 2 거리 이상 이격된 영역의 픽셀들 중 주변 픽셀들과의 픽셀값 차이가 임계값 이상 나는 픽셀들을 기반으로 결정될 수 있다.
상기 제 1 이미지와 상기 제 2 이미지를 학습 데이터 셋으로 생성하여 독립 이미지 생성을 위한 객체간 거리의 임계값, 독립 이미지 생성을 위한 객체의 크기 임계값 및 제 2 이미지의 경계와 연관된 임계값을 제 2 딥 러닝 모델을 이용하여 학습시킬 수 있다.
상기한 목적을 달성하기 위한 본 발명의 다른 양태에 따른, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위해 이미지를 크롭하는 장치는, 상기 온라인 쇼핑몰의 배너디자인에 사용될 제 1 이미지를 입력하는 입력부, 및 상기 제 1 이미지 내에 포함된 객체를 분석하여 분석된 결과를 기반으로 상기 제 1 이미지를 배너 디자인에 사용가능한 형태로 변형시킴에 의해, 제 2 이미지를 생성하고, 상기 제 2 이미지를 기보유된 기본 템플릿에 삽입하여 배너 디자인을 완성하는 프로세서를 포함하되, 상기 프로세서는, 상기 제 1 이미지 내에 포함된 객체의 위치 및 크기 중 적어도 하나에 대한 분석 결과를 기반으로 상기 제 1 이미지의 적어도 일부를 크롭(crop)함에 의해 상기 제 2 이미지를 생성할 수 있다.
본 발명의 일 실시예에 따른 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치에 따르면, 기보유된 배너디자인 템플릿에 사용자가 원하는 이미지를 삽입하여 손쉽게 쇼핑몰과 관련된 이미지를 생성하도록 하며, 특히, 장치가 삽입 이미지를 준비하는 과정에서 이미지의 특성에 맞게 자동으로 이미지의 경계를 크롭(crop)하기 때문에, 사용자 편의성을 제고시키는 효과가 있다.
도 1은 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법이 적용되는 시스템을 나타낸 개념도,
도 2는 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법을 개략적으로 나타낸 흐름도,
도 3은 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법에 따라 배너디자인을 제작하는 화면을 나타낸 도면,
도 4는 도 3의 화면에서 캔버스 디자인 요소 테이블과 캔버스가 연동하는 모습을 설명하고 이미지 디자인 요소에 대응하는 메뉴를 나타낸 개념도,
도 5는 도 3의 화면에서 캔버스 디자인 요소 테이블의 표시 선택란을 이용하여 이미지를 삭제하는 과정을 설명하기 위한 개념도,
도 6은 도 3의 화면 내의 캔버스의 텍스트 디자인 요소에 대응하는 메뉴를 나타낸 도면,
도 7은 도 3의 화면 내의 캔버스의 형상 디자인 요소에 대응하는 메뉴를 나타낸 도면,
도 8은 기 저장된 이미지를 업로드하기 위한 화면을 나타낸 도면,
도 9는 입력된 이미지를 자동으로 크롭(crop)하는 과정을 설명하기 위한 흐름도,
도 10은 다수의 이미지가 혼재된 입력 이미지를 개별 이미지로 크롭하는 멀티 크롭 방법을 설명하기 위한 개념도,
도 11은 도 3의 화면에서 복수 개의 캔버스를 생성하여 작업하는 모습을 도시한 도면,
도 12는 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 장치를 나타낸 블록도이다.
본 발명은 다양한 변경을 가할 수 있고 여러 가지 실시예를 가질 수 있는 바, 특정 실시예들을 도면에 예시하고 상세하게 설명하고자 한다.
그러나, 이는 본 발명을 특정한 실시 형태에 대해 한정하려는 것이 아니며, 본 발명의 사상 및 기술 범위에 포함되는 모든 변경, 균등물 내지 대체물을 포함하는 것으로 이해되어야 한다.
제 1, 제 2 등의 용어는 다양한 구성요소들을 설명하는데 사용될 수 있지만, 상기 구성요소들은 상기 용어들에 의해 한정되어서는 안 된다. 상기 용어들은 하나의 구성요소를 다른 구성요소로부터 구별하는 목적으로만 사용된다. 예를 들어, 본 발명의 권리 범위를 벗어나지 않으면서 제 1 구성요소는 제 2 구성요소로 명명될 수 있고, 유사하게 제 2 구성요소도 제 1 구성요소로 명명될 수 있다. 및/또는 이라는 용어는 복수의 관련된 기재된 항목들의 조합 또는 복수의 관련된 기재된 항목들 중의 어느 항목을 포함한다.
어떤 구성요소가 다른 구성요소에 "연결되어" 있다거나 "접속되어" 있다고 언급된 때에는, 그 다른 구성요소에 직접적으로 연결되어 있거나 또는 접속되어 있을 수도 있지만, 중간에 다른 구성요소가 존재할 수도 있다고 이해되어야 할 것이다. 반면에, 어떤 구성요소가 다른 구성요소에 "직접 연결되어" 있다거나 "직접 접속되어" 있다고 언급된 때에는, 중간에 다른 구성요소가 존재하지 않는 것으로 이해되어야 할 것이다.
본 출원에서 사용한 용어는 단지 특정한 실시예를 설명하기 위해 사용된 것으로, 본 발명을 한정하려는 의도가 아니다. 단수의 표현은 문맥상 명백하게 다르게 뜻하지 않는 한, 복수의 표현을 포함한다. 본 출원에서, "포함하다" 또는 "가지다" 등의 용어는 명세서상에 기재된 특징, 숫자, 단계, 동작, 구성요소, 부품 또는 이들을 조합한 것이 존재함을 지정하려는 것이지, 하나 또는 그 이상의 다른 특징들이나 숫자, 단계, 동작, 구성요소, 부품 또는 이들을 조합한 것들의 존재 또는 부가 가능성을 미리 배제하지 않는 것으로 이해되어야 한다.
다르게 정의되지 않는 한, 기술적이거나 과학적인 용어를 포함해서 여기서 사용되는 모든 용어들은 본 발명이 속하는 기술 분야에서 통상의 지식을 가진 자에 의해 일반적으로 이해되는 것과 동일한 의미를 가지고 있다. 일반적으로 사용되는 사전에 정의되어 있는 것과 같은 용어들은 관련 기술의 문맥상 가지는 의미와 일치하는 의미를 가진 것으로 해석되어야 하며, 본 출원에서 명백하게 정의하지 않는 한, 이상적이거나 과도하게 형식적인 의미로 해석되지 않는다.
이하, 첨부한 도면들을 참조하여, 본 발명의 바람직한 실시예를 보다 상세하게 설명하고자 한다. 본 발명을 설명함에 있어 전체적인 이해를 용이하게 하기 위하여 도면상의 동일한 구성요소에 대해서는 동일한 참조부호를 사용하고 동일한 구성요소에 대해서 중복된 설명은 생략한다.
도 1은 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법이 적용되는 시스템을 나타낸 개념도이다. 도 1에 도시된 바와 같이, 본 발명의 일 실시예에 따른 쇼핑몰 관련 이미지 자동 생성 시스템은 쇼핑몰을 운영하는 관리자의 사용자 단말(120), 네트워크(130) 및 쇼핑몰 관리 서버(140)를 포함할 수 있다.
도 1을 참조하면, 쇼핑몰(110)은 인터넷을 통하여 상품 및/또는 서비스을 판매하는 온라인 쇼핑몰을 의미할 수 있다. 쇼핑몰(110)은 인터넷 상의 특정 웹 사이트를 기반으로 동작한다. 본 발명의 실시예에 따르면, 상기 복수 개의 쇼핑몰(110)은 네트워크(130)를 통해 쇼핑몰 관리 서버(140)와 연동한다. 즉, 쇼핑몰(110)의 운영 정보, 상품 정보 등은 쇼핑몰 관리 서버(140) 내부 스토리지 또는 외부의 대용량 데이터베이스에 저장되어 있을 수 있다.
본 발명의 실시예에 따르면, 쇼핑몰 관리 서버(140) 역시 컴퓨팅 장치로 구현될 수 있다. 여기서 말하는 컴퓨터 장치는 서버 급 컴퓨터 단말기로 구현될 수 있다. 상기 컴퓨터 장치는 통상적인 컴퓨터 단말이 가지는 입력 장치, 표시 장치, 네트워킹 장치, 하드디스크, 프로그램을 저장하는 메모리 및 메모리에 저장된 프로그램을 수행시키는 프로세서 등을 구비할 수 있다. 다만, 반드시 서버 급 컴퓨터 단말로 구현되어야 하는 것은 아니다.
사용자 단말(120)은 상기 쇼핑몰(110)의 운영자의 단말기를 포함한다. 단말(120)도 스마트폰, PC 등의 컴퓨팅 디바이스로 구현될 수 있다. 사용자 단말(120)은 상기 쇼핑몰(110)의 상기 특정 웹 사이트에 접속하여 쇼핑몰(110)의 운영과 연관된 신호를 네트워크(130)를 통해 쇼핑몰 관리 서버(140)로 제공함에 의해 쇼핑몰(110)의 운영을 관리한다.
사용자 단말(120)은 자신의 쇼핑몰의 홍보를 위한 배너디자인을 생성할 수 있다. 이때, 쇼핑몰 관리 서버(140)에서 제공하는 배너디자인 제작 툴을 이용하여 쇼핑몰과 관련된 배너디자인(예컨대, 이미지 파일)을 생성할 수 있다. 쇼핑몰 관련 이미지 생성 작업은 사용자 단말(120)에서 이루어질 수도 있고, 쇼핑몰 관리 서버(140)에서 이루어질 수도 있다. 예컨대, 쇼핑몰 관련 이미지 자동 생성과 관련된 애플리케이션(이를 에디봇 배너(edibot banner)라고 부를 수 있음)을 사용자 단말(120)에서 다운받아 사용자 단말(120) 자체적으로 쇼핑몰 관련 이미지를 생성할 수 있다. 또는, 사용자 단말(120)은 쇼핑몰의 배너 디자인에 들어갈 요소의 선택과 관련된 신호를 제공하고, 제공된 신호를 기반으로 서버(140)에서 상기 제작 툴에 의해 배너디자인을 생성할 수도 있다. 따라서, 본 명세서 상에서 이미지 생성 장치는 배너디자인 제작과 관련된 애플리케이션을 다운받은 사용자 단말(120)이 될 수도 있고, 사용자 단말(120)로부터 디자인 생성과 관련된 신호를 받아 자체적으로 상기 배너디자인 제작 툴을 이용하여 이미지를 생성하는 쇼핑몰 관리 서버(140) 또는 배너디자인의 제작에만 특화된 서버(140) 이외의 다른 제3의 장치를 의미할 수 있다.
본 발명의 실시예에 따르면, 사용자 단말(120)은 쇼핑몰 관리 서버(140)가 제공하는 웹 사이트에 접속하여 상기 애플리케이션을 다운로드할 수 있다. 그리고는, 애플리케이션을 실행함으로써 배너디자인 생성을 위한 작업을 시작한다. 사용자 단말(120)은 애플리케이션에 기 보유된 다수의 기본 템플릿 유형 중 적어도 하나를 선택하고, 선택된 기본 템플릿에서 이미지 교체, 텍스트 수정 및/또는 형상 수정을 하거나, 혹은 새로운 이미지, 텍스트 및/또는 형상을 추가하는 등의 과정을 거쳐 새로운 배너디자인을 손쉽게 생성할 수 있다.
여기서, 이미지는 JPG, PNG, BMP, GIF, JPEG, PDF, JPE, TIFF 등 다양한 형식의 이미지를 포함할 수 있다. 다만, GIF 파일은 다수 프레임을 포함하는 움직이는 이미지 파일이므로, 각 프레임을 추출하여 JPG 파일로 변환하는 것이 바람직할 수 있다. 텍스트는 문자(영문, 한문, 국문, ... 등을 포함함), 숫자, 기호, 수식 등을 포함하며, 컴퓨팅 장치에서 처리가능한 형태의 언어를 모두 포함할 수 있다. 형상은 직선 및 화살표 등의 선, 삼각형, 사각형, 원 등의 도형 등을 포함할 수 있다.
네트워크(130)은 쇼핑몰(110)과 쇼핑몰 관리 서버(140)를 연결하는 망으로써, 유선망 및/또는 무선망(인터넷(internet))을 포함할 수 있다.
도 2는 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법을 개략적으로 나타낸 흐름도이다.
도 2를 참조하면, 이미지 생성 장치는 기본 템플릿 유형을 다수 보유하고 있다(S210). 사용자 단말의 경우, 서버로부터 획득되는 배너디자인 제작 애플리케이션의 관한 설치 정보에 기본적으로 포함되어 제공될 수 있다. 또한, 주기적으로 서버를 통한 버전 업(version up)이 되면서 추가적인 기본템플릿 유형에 대한 보강이 이루어질 수 있다. 쇼핑몰 관리 서버에서 이미지 생성 작업이 진행될 때는, 서버와 연동하는 대용량 데이터베이스에 기본 템플릿 유형 정보가 저장되어 있을 수 있다. 또한, 사용자가 쇼핑몰 관리 서버의 배너디자인 제작 툴을 통해 새롭게 제작한 배너디자인 중 적어도 일부는 상기 대용량 데이터베이스에 저장되었다가 기본 템플릿 유형으로 재활용될 수 있다.
기본 템플릿은 기본적으로, 서로 다른 종류의 디자인 요소를 포함한다. 디자인 요소는 기본 템플릿 및/또는 새롭게 생성되는 배너 디자인을 구성하는 요소로써, 이미지 디자인 요소, 텍스트 디자인 요소 및/또는 형상 디자인 요소를 포함한다. 기본 템플릿 및/또는 그로부터 파생되는 배너 디자인은 세 종류의 다지인 요소 중 적어도 둘 이상의 종류의 디자인 요소를 포함하는 것이 바람직하다.
장치는, 보유된 기본 템플릿 유형 중 하나를 선택한다(S220). 자신이 홍보하고자 하는 주제에 적합한 기본 템플릿 유형을 선택한다. 기본 템플릿은 템플릿의 형태를 기반으로 카테고라이징되어 있는 제 1 클래스로 구분되고, 제 1 클래스 내에서 디자인 요소들의 배열을 달리하여 카테고라이징되어 있는 제 2 클래스로 구분된다. 즉, 장치는 제 1 사용자 입력을 기반으로 제 1 클래스 중 하나를 선택하고, 선택된 제 1 클래스의 기본 템플릿들 중 제 2 클래스에서의 제 2 사용자 입력을 기반으로 하나의 기본 템플릿을 선택한다.
장치는 선택된 기본 템플릿을 기반으로 캔버스를 생성한다(S230). 캔버스는 선택된 기본 템플릿을 편집하는 공간이다. 이는 물리적 공간으로 화면상에 구현될 수 있다. 선택된 기본 템플릿을 캔버스로 옮길 때, 가로 및 세로의 사이즈 및 비율을 정할 수 있다. 기본적으로 템플릿이 보유하고 있는 원본 사이즈를 그대로 사용해도 되고, 사용자(쇼핑몰 운영자)의 배너 디자인 사용처에 맞게 원본 사이즈와 다른 사이즈를 갖도록 해도 좋다. 예컨대, 기본 템플릿의 제 1 클래스를 정사각형으로 하여 제 1 기본 템플릿을 선택한 경우, 600x600의 사이즈를 기본적으로 가질 수 있는데, 사용자는 이를 그대로 사용해도 되고, 800x400과 같이 변형된 사이즈로 캔버스 사이즈를 설정해도 된다.
캔버스가 생성되면, 장치는 캔버스 상에서 기본 템플릿에 포함된 디자인 요소 중 적어도 하나를 선택하여 변경하거나, 새로운 디자인 요소를 추가하는 작업을 통해 새로운 배너 디자인을 생성한다(S240). 예컨대, 기본 템플릿이 2개의 이미지, 2개의 텍스트 및 2개의 형상의 배열 조합으로 생성된 경우, 1번 이미지를 장치에 기저장된 다른 이미지로 변경하고, 2번 텍스트의 문구 및 크기를 변경하여 자신이 홍보하고자 하는 주제에 맞는 새로운 이미지를 생성할 수 있다. 즉, 이미지 디자인 요소, 텍스트 디자인 요소, 형상 디자인 요소 중 적어도 하나를 변경하는 작업을 통해 새로운 디자인을 생성할 수 있다. 또는, 이미지, 텍스트 및/또는 형상을 기본 템플릿에 추가함으로써 새로운 디자인을 생성할 수 있다. 즉, 상기 예시적인 기본 템플릿에 1개의 형상을 더 추가하여, 2개 이미지, 2개 텍스트 및 3개의 형상 배열 조합을 갖는 디자인을 새롭게 생성할 수 있다.
이와 같이, 디자인 편집을 위한 캔버스 상에서 자유롭게 디자인 요소의 변경 및 추가 작업을 하면서 재구성된 배너 디자인을 생성할 수 있고, 생성된 배너 디자인이 사용자의 마음에 든 경우, 이를 장치에 저장할 수 있다(S250).
본 발명의 실시예에 따르면, 위의 단계(S240)를 생략하고, 기본 템플릿을 그대로 저장하여 저장된 디자인을 자신의 쇼핑몰 배너 디자인을 직접 사용해도 무방하다.
도 3은 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 방법에 따라 배너디자인을 제작하는 화면을 나타낸 도면이다.
도 3을 참조하면, 장치는 쇼핑몰 연관 이미지 자동 생성 앱(APP: 애플리케이션)을 실행했을 때, 도 2의 과정을 통해 새로운 배너 디자인을 생성할 수 있다. 앱을 실행했을 때, 장치의 화면 좌측에는 이미지를 업로드하기 위한 아이콘과 템플릿 유형을 선택하기 위한 아이콘이 존재할 수 있다. 템플릿 유형 선택을 위한 아이콘을 클릭하면, 제 1 클래스(310)의 템플릿 유형과 제 1 클래스(310)의 하위 클래스의 제 2 클래스(320)의 템플릿들이 표시된다. 제 1 클래스(310)는 기본템플릿의 형상에 따라 구분될 수 있는데, 본 발명의 일 실시예에 따르면, 이는 가로 방향이 긴 직사각형 형태의 가로형 캔버스(예컨대, 1000x600), 띠 형태의 캔버스(예컨대, 1000x100), 정사각형 형태의 캔버스(예컨대, 600x600) 및 세로 방향이 긴 직사각형 형태의 세로형 캔버스(예컨대, 400x600)를 포함할 수 있다. 이는 기보유된 형태로 반드시 이에 한정되는 것은 아니고, 삼각형 형태, 평행사변형 형태, 원형 형태 등 다양한 형태의 제 1 클래스의 캔버스 타입이 추가적으로 존재할 수 있다.
이러한 제 1 클래스(310)의 기본 템플릿 내에는 다수의 제 2 클래스(320)의 템플릿들이 존재한다. 도 3의 실시예와 같이, 정사각형 형태의 기본 템플릿을 선택한 경우, 정사각형 형태를 갖는 다수의 제 2 클래스(320)의 기본 템플릿들이 표시된다. 제 2 클래스(320)의 기본 템플릿들은 디자인 요소의 구성이 다르고, 디자인 요소들의 배치가 다를 수 있다. 제 1 클래스(310)와 제 2 클래스(320)의 대응관계 및 상기 대응관계를 갖는 기본템플릿의 구성은 미리 저장된 것일 수 있다. 또한, 새로운 배너 디자인을 생성함에 의해 생성된 배너디자인이 해당 제 1 클래스(310)와 제 2 클래스(320)에 추가되는 형태로 계속 업데이트될 수 있다.
도 3의 실시예는 정사각형 형태의 제 2 클래스(320)의 템플릿 중 12번 템플릿, 즉, "정사각형 12"의 기본템플릿을 선택했을 때의 상황을 가정한다. "정사각형 12" 템플릿을 선택하면, 이미지/템플릿 선택 창(310, 320)의 우측의 캔버스 공간에 "캔버스 1"이라는 명칭으로 하나의 캔버스(330)가 생성된다. 그리고, 선택된 "정사각형 12"의 기본템플릿이 상기 "캔버스 1"(330) 내에 표시되며, 캔버스 디자인 요소 테이블(360)이 함께 생성된다. 캔버스 디자인 요소 테이블(360)은 특정 캔버스 내에 포함된 디자인 요소의 식별정보를 제공한다. 캔버스 1(330)에는 현재 1개의 이미지, 2개의 텍스트 및 2개의 형상이 포함되어 있는데, 캔버스 디자인 요소 테이블(360)은 이러한 5개의 디자인 요소의 식별정보를 나타낸다.
앞서 설명한 바와 같이, 캔버스 1(330)의 기본템플릿 "정사각형 12"의 5개의 디자인 요소는 이미지 1(340-1), 텍스트 1(340-2), 텍스트 2(340-3), 형상 1(340-4) 및 형상 2(340-5)의 조합으로 이루어져 있다. 이는, 캔버스 디자인 요소 테이블(360)에서, 이미지 1(364-1), 텍스트 1(364-2), 텍스트 2(364-3), 형상 1(364-4) 및 형상 2(364-5)와 각각 대응된다. 사용자는 상기 5개의 디자인 요소 중 하나를 캔버스 1(330) 또는 캔버스 디자인 요소 테이블(360)을 통해 선택하여 선택된 디자인 요소의 크기, 속성, 내용 등을 변경할 수 있다. 또한, 새로운 디자인 요소를 추가할 수도 있다.
캔버스 1(330)의 하단에는 캔버스 1(330)의 전반적인 처리에 대한 메뉴(350)가 표시될 수 있다. 메뉴(350)는 캔버스 사이즈 설정 아이콘, 캔버스 복제 아이콘, 캔버스 다운로드 아이콘 및 캔버스 삭제 아이콘을 포함할 수 있다. 사용자는 캔버스 사이즈 설정 메뉴를 이용하여 현재 제작되는 캔버스의 사이즈 및 비율을 변경할 수 있다. 이 경우, 캔버스 내의 디자인 요소의 크기는 유지되면서 캔버스의 크기만 변할 수 있다. 캔버스 복제 메뉴를 클릭하면 동일한 구성의 캔버스를 복사하여 다른 캔버스에 배치한다. 이에 따라 동일한 캔버스 구성을 다르게 편집할 수 있도록 유도할 수 있다. 캔버스 다운로드 아이콘을 클릭하면 현재까지 진행된 캔버스의 디자인을 이미지 파일 형태(예컨대, jpg, png, tiff, pdf 등)로 다운로드할 수 있다. 캔버스 삭제 아이콘을 클릭하면, 현재까지 편집 중이던 캔버스를 폐기한다.
캔버스 디자인 요소 테이블(360)을 구체적으로 살펴보면, 캔버스 디자인 요소 테이블(360)은 디자인 요소 표시선택란(362)을 포함한다. 이는 각각의 디자인 요소에 대응되도록 하나의 행 또는 열로 구현될 수 있다. 표시선택란(362)은 기본적으로 "온(on)" 상태를 유지한다. 즉, 모든 디자인 요소가 표시되도록 디폴트로 설정되어 있다. 하지만, 표시선택란(362)의 동그라미 아이콘을 클릭하여 없애면, 캔버스(330) 내의 해당 디자인 요소도 제거된다. 다시 말해, 특정 디자인 요소의 표시 또는 삭제 여부를 상기 표시선택란(362)을 통해 결정할 수 있다. 캔버스 디자인 요소 테이블(360)의 하단에는 선택 잠금 아이콘(366)과 선택 삭제 아이콘(368)이 표시될 수 있다. 특정 디자인 요소에 대해 선택 잠금 아이콘(366)을 클릭하면, 상기 특정 디자인 요소에 대한 편집이 제한된다. 즉, 특정 디자인 요소에 대해 더이상의 편집이 필요하지 않다고 생각되면, 상기 선택 잠금 아이콘(366)을 클릭하여 편집이 불가능한 상태를 만들 수 있다. 선택 삭제 아이콘(368)은 특정 디자인 요소를 삭제하는 아이콘이다. 표시선택란(362)의 삭제는 추후에 다시 해당 디자인 요소를 표시할 것으로 선택하면, 다시 표시가 가능한 가역적인 삭제라면, 선택 삭제 아이콘(368)을 통한 삭제는 비가역적인 삭제가 이루어진다.
캔버스 상단에는 각각의 디자인 요소에 대한 편집을 위한 메뉴가 표시되는 공간(370)이 존재한다. 상기 공간(370)에 표시되는 메뉴는 디자인 요소의 종류(예컨대, 이미지 디자인 요소인지, 텍스트 디자인 요소인지, 또는 형상 디자인 요소인지)에 따라 다른 메뉴가 표시된다. 이는 도 4, 도 6 내지 도 7을 통해 상세히 설명한다.
캔버스 상단의 공간(370)의 우측에는 캔버스에 공통으로 적용되는 메뉴가 표시된다. 여기에는, 실행 취소 아이콘, 재실행 아이콘, 텍스트/이미지/형상 추가 아이콘, 배경색 설정 아이콘, 레이어의 전방/후방 표시 설정 아이콘 및 디자인 요소 삭제 아이콘이 포함된다. 레이어 전방/후방 표시 설정 아이콘은 특정 디자인 요소를 다른 디자인 요소보다 앞에 표시할지, 뒤에 표시할지 선택하기 위한 아이콘이다. 즉, 다른 문서 편집 애플리케이션의 "앞으로 가져오기" 또는 "뒤로 보내기" 기능과 유사한 기능을 수행한다.
본 발명의 실시예에 따르면, 캔버스 디자인 요소 테이블의 순서는 레이어를 반영한다. 즉, 가장 위쪽에 위치하는 디자인 요소가 맨 앞 레이어의 디자인 요소이고, 그 다음에 위치하는 디자인 요소가 테이블 상에 하부에 위치하게 된다. 또한, 레이어 전방/후방 표시 설정 아이콘을 클릭함에 따라, 캔버스 디자인 요소 테이블 상에서 특정 디자인 요소의 테이블 내의 위치가 위로 또는 아래로 변경된다. 사용자는 테이블 상의 디자인 요소의 위치를 기반으로 각 디자인 요소의 레이어와 연관된 배열을 파악할 수 있다.
도 4는 도 3의 화면에서 캔버스 디자인 요소 테이블과 캔버스가 연동하는 모습을 설명하고 이미지 디자인 요소에 대응하는 메뉴를 나타낸 개념도이다.
도 4를 참조하면, 장치는 도 3의 캔버스 상에서 기본 템플릿에 대한 편집 작업을 진행할 때, 캔버스 상의 오브젝트(즉, 디자인 요소)를 직접 지정하여 작업하여도 되고, 캔버스 디자인 요소 테이블(360)의 디자인 요소를 지정하여 작업을 진행하여도 된다. 즉, 앞서 설명한 바와 같이, 캔버스(330) 내의 디자인 요소와 캔버스 디자인 요소 테이블(360) 상의 디자인 요소는 서로 연동한다.
캔버스 또는 캔버스 디자인 요소 테이블에서 이미지 1(340-1)를 클릭하면 테이블 상의 이미지 1(364-1)도 함께 지정된다. 반대의 경우도 마찬가지다. 만약 이 디자인 요소가 잠금 상태가 아니라면, 지정된 디자인 요소는 편집 가능한 상태가 된다. 이미지 1(340-1)이 지정된 상태에서, 이미지의 윤곽선을 이용하여 이미지의 크기, 위치 및 회전의 정도를 조정할 수 있다. 사용자 설정에 따라, 기본 템플릿 내의 디자인 요소의 기본 속성은 변하지 않도록 하기 위해, 이미지의 위치는 변경되지 않도록 설정할 수도 있다.
본 발명의 실시예에 따르면, 이미지 디자인 요소를 편집할 때는 적어도 7개의 기능을 포함하는 제 1 메뉴(372-1~372-7)가 공간(370)에 표시될 수 있다. 제 1 메뉴의 첫 번째 아이콘(372-1)은 이미지의 비율 및/또는 사이즈를 변경하는 아이콘이다. 두 번째 아이콘(372-2)은 이미지의 회전각도를 조정하는 아이콘으로, 해당 아이콘을 클릭하여 회전 각도를 입력함으로써 이미지를 일정 각도로 회전시키는 기능을 구현한다. 세 번째 아이콘(372-3)은 투명도 설정 아이콘으로, 이미지의 색상 투명도를 설정하는 아이콘이다. 상기 아이콘(372-3)을 이용하여 0에서 100% 사이의 값을 설정함에 의해 이미지의 투명도를 결정할 수 있다. 네 번째 아이콘(372-4)은 이미지 복제하기 아이콘으로, 현재까지 편집된 이미지와 동일한 이미지를 해당 캔버스 내에서 추가 생성하는 아이콘이다. 이미지가 캔버스 내에 추가되면 캔버스 디자인 요소 테이블에도 추가된다(예컨대, "이미지 1_복사본1"으로).
다섯 번째 및 여섯 번째 아이콘(372-5, 372-6)은 좌우 및 상하 반전을 위한 아이콘이다. 마지막 일곱 번째 아이콘(372-7)은 필터 효과를 부여하기 위한 아이콘이다.
본 발명의 실시예에 따르면, 이미지에 적용되는 필터는 색상 변경을 위한 필터가 있다. 여기에는 흑백, 세피아, 드라마틱, 따뜻한 톤, 차가운 톤, 느와르 등의 효과를 부여하는 필터 등이 포함된다. 또한, 밝기, 대조색 및 흐림 정보를 수치로 조정하는 기능도 부여할 수 있다.
도 5는 도 3의 화면에서 캔버스 디자인 요소 테이블의 표시 선택란을 이용하여 이미지를 삭제하는 과정을 설명하기 위한 개념도이다.
도 5를 참조하면, 장치는 특정 디자인 요소에 대한 표시 선택란(362)에 대한 입력에 따라 캔버스(330) 상에서 해당 디자인 요소를 표시 또는 삭제할 수 있다. 도 5의 실시예에서, 장치는 캔버스 디자인 요소 테이블 상의 이미지 1(364-1)에 대한 표시 선택란(500)에 대한 입력에 반응하여, 표시란(500) 상의 원형의 표시를 삭제함과 동시에, 캔버스(330)에서 이미지 1(340-1)을 삭제하여 공란으로 한다. 표시 선택란(362)을 통해 삭제된 디자인 요소는 추후 다시 표시 선택란(362)에 대한 입력이 있을 때, 다시 살아날 수 있다.
이미지가 삭제되어 공란이 생긴 경우, 장치는 배너 디자인에 적용할 준비가 된 다른 이미지를 공란에 삽입함에 의해 이미지를 교체할 수 있다. 삽입은 이미지를 해당 공란으로 드래그하고 드롭(drag & drop)함에 의해 달성될 수 있다. 교체된 이미지는 삭제된 기본 템플릿 내의 이미지 디자인 요소의 속성(예컨대, 크기/비율, 위치, 투명도 등)을 그대로 상속받게 된다. 사용자는 기본템플릿으로부터 물려받은 속성을 이미지 관련 메뉴를 이용하여 변경할 수 있다.
도 6은 도 3의 화면 내의 캔버스의 텍스트 디자인 요소에 대응하는 메뉴를 나타낸 도면이다.
도 6을 참조하면, 장치는 캔버스(330) 또는 캔버스 디자인 요소 테이블 상에서 특정 텍스트 디자인 요소를 지정하여 그 내용 및/또는 속성을 변경할 수 있다. 도 6의 실시예에 따르면, 장치는 텍스트 2(340-3, 364-3)에 대한 선택 입력에 대응하여 해당 텍스트 디자인 요소를 지정하고, 지정된 텍스트 디자인 요소를 편집 가능한 상태로 변경한다. 사용자는 캔버스 상에서 텍스트(340-3)의 윤곽선을 조정함에 따라 텍스트의 크기, 위치 및 회전 각도를 조정할 수 있고, 텍스트의 윤곽선 내부를 클릭하여 텍스트의 내용을 변경할 수 있다. 텍스트의 내용을 변경할 때, 텍스트의 속성은 기본 템플릿 상의 텍스트 1(340-1)의 속성을 그대로 따른다.
또한, 텍스트 디자인 요소가 지정되면, 장치는 텍스트 편집을 위한 제 2 메뉴를 공간(370)에 표시한다. 제 2 메뉴는 다양한 기능의 아이콘을 포함한다. 아이콘(374-1)은 텍스트의 글꼴을 변경하기 위한 아이콘이다. 아이콘(374-2)은 텍스트의 크기를, 아이콘(374-3)은 텍스트의 글꼴 색상을, 아이콘(374-4)은 텍스트의 글꼴 배경색을 변경하기 위한 아이콘들이다. 또한, 아이콘(374-5)은 텍스트 정렬을 위한 아이콘으로, 이를 이용하여 좌측, 우측 및/또는 중앙 정렬 여부를 결정할 수 있다. 아이콘(374-6)은 볼드체 표현을 위한 아이콘이고, 아이콘(374-7)은 기울이기 표현을 위한 아이콘이며, 아이콘(374-8)은 밑줄을 표현하는 아이콘이다. 아이콘(374-9)은 취소선을 표시하기 위한 아이콘이고, 아이콘(374-10)은 행간 및/또는 자간 설정을 위한 아이콘이다. 아이콘들(374-11~374-13)은 회전, 투명도 및 복제하기 아이콘이다.
이와 같이, 장치는 지정된 디자인 요소의 종류에 따라 서로 다른 메뉴를 화면에 제공하여 사용자가 해당 디자인 요소의 특성에 맞게 편집이 가능하도록 지원한다.
도 7은 도 3의 화면 내의 캔버스의 형상 디자인 요소에 대응하는 메뉴를 나타낸 도면이다.
도 7을 참조하면, 장치는 캔버스(330) 또는 캔버스 디자인 요소 테이블 상에서 특정 형상 디자인 요소를 지정하여 그 크기, 위치 및/또는 속성을 변경할 수 있다. 도 7의 실시예에 따르면, 장치는 형상 1(340-4, 364-4)에 대한 선택 입력에 대응하여 해당 형상 디자인 요소를 지정하고, 지정된 형상 디자인 요소를 편집 가능한 상태로 변경한다. 사용자는 캔버스 상에서 형상(340-4)의 윤곽선을 조정함에 따라 형상의 크기, 위치 및 회전각도를 조정할 수 있다.
또한, 형상 디자인 요소가 지정될 때, 장치는 형상 편집을 위한 제 3 메뉴를 공간(370)에 표시한다. 제 3 메뉴는 5개 기능을 수행하는 아이콘들을 포함한다. 아이콘(376-1)은 형상의 크기 및 비율 조정을 위한 아이콘이고, 아이콘(376-2)은 회전각도 설정을 위한 아이콘이며, 아이콘(376-3)은 배경색 설정을 위한 아이콘이다. 추가적으로, 아이콘(376-4)은 투명도 설정을 위한 아이콘이고, 아이콘(376-5)은 복제하기 아이콘이다.
지금까지 설명한 바와 같이, 사용자는 장치 상의 기능을 이용하여 기본 템플릿에 포함된 특정 디자인 요소에 대한 변경 및 수정 등을 수행할 수 있다. 또한, 디자인 요소의 추가는 상술했던 내용의 응용으로써 유사한 방법으로 실현될 수 있다.
도 8은 기 저장된 이미지를 업로드하기 위한 화면을 나타낸 도면이다.
도 8을 참조하면, 장치는 템플릿 선택을 위한 메뉴 좌측에 이미지를 업로드하는 메뉴를 표시할 수 있다. 특히, 이미지 업로드 아이콘(805)을 클릭하면, 장치 내에 저장되어 있는 파일을 불러오기 위한 기능이 실행되고, 사용자는 장치 내의 소정 폴더에 존재하는 이미지를 불러올 수 있다.
장치는 기저장된 이미지 파일을 불러와서 캔버스에 삽입되기에 적합한 형태로 구분하고 그리고/또는 변형할 수 있다. 이미지의 구분은 4가지로 구분될 수 있다.
본 발명의 실시예에 따르면, 메뉴(810)으로 도시된 바와 같이, 전체 이미지를 보여주는 아이콘 우측으로, 상품 컷, 전신 컷, 상반신 컷, 및/또는 하반신 컷으로 이미지를 구분한다. 다만, 반드시 이와 같이 4가지만으로 구분해야 하는 것은 아니고, 더 적은 수 또는 더 많은 수로 이미지를 구분하는 것도 가능하다.
장치는 사용자 입력에 의해 업로드할 이미지가 선택되고 나면, 자동으로 해당 이미지에 포함되어 있는 객체들를 분석하여 해당 이미지를 상품 컷, 전신 컷, 상반신 컷 및 하반신 컷 중 어느 하나로 구분한다. 전체 아이콘은 4개의 카테고리 중 하나로 구분된 모든 이미지들(812-1, 812-2)을 보여주기 위한 아이콘이다.
상품 컷 아이콘을 클릭하면 상품 컷으로 분리된 이미지가 표시되고, 전신 컷 아이콘을 클릭하면 전신 컷으로 분리된 이미지가 표시된다. 상반신 컷 및 하반신 컷 역시 마찬가지다. 이하, 도 9 및 도 10을 통해 캔버스에 삽입될 이미지를 준비하는 과정을 보다 상세히 설명한다.
도 9는 입력된 이미지를 자동으로 크롭(crop)하는 과정을 설명하기 위한 흐름도이다.
도 9를 참조하면, 장치는 사용자 입력에 의해 배너 디자인에 삽입될 적어도 하나의 이미지를 입력받는다(S910). 그리고는, 입력된 이미지를 분석하여 입력 이미지 내에 인물, 즉, 모델이 존재하는지 판단한다(S912). 모델이 존재한다면, 전신 컷, 하반신 컷 및 상반신 컷 중 하나로 구분될 수 있지만, 모델이 존재하지 않는다면, 상품 컷으로 구분된다(S914). 상품 컷으로 구분된 이미지는, 이미지 내에 존재하는 객체들 중 가장 중심이 되는 객체를 기반으로 이미지를 자동으로 크롭한다. 중심이 되는 객체가 이미지의 중심에 들어오도록 한다. 그리고는, 객체로부터 소정의 간격을 두고 이미지의 경계선이 배치되도록 하여 이미지를 크롭한다. 이때, 원본 이미지에서의 객체의 해상도는 변경될 수 있다. 상기 객체가, 이미지의 중심이 되면서 객체와 이미지 경계선까지의 상기 기설정된 소정 거리를 고려하여 객체의 크기 및 해상도는 변경될 수 있다.
본 발명의 실시예에 따르면, 객체 분석과 관련하여 객체를 어디까지 규정할지(객체의 크기 관련)에 대한 파라미터, 이미지 크롭의 경계선 설정과 관련된 파라미터 등은 입력된 원본 이미지와 실제 캔버스에 삽입되는 이미지를 포함하는 학습 데이터 셋을 기반으로 인공지능 모델(예컨대, 딥 러닝(deep learning) 모델)을 이용하여 학습될 수 있다.
이미지 분석 결과, 모델이 존재하는 경우, 모델의 얼굴이 존재하는지 판단한다(S918). 만약 얼굴이 존재하지 않는다면, 하반신이 전체적으로 보여지는지 판단한다(S920). 하반신이 전체적으로 보여진다면, 해당 이미지를 하반신 컷으로 구분하고(S922), 모델의 하반신을 중심으로 이미지를 크롭한다(S924). 만약, 하반신이 전체적으로 표시되지 않고, 일부만 보여진다면, 해당 이미지는 상품컷으로 구분될 수도 있다(S914).
단계(S918)에서 얼굴이 존재하는 경우, 해당 이미지가 모델의 전신을 보여주는지, 그렇지 않고 전신 중 얼굴을 포함한 일정 부분만 보여주고 있는지 판단한다(S926). 전신을 보여주고 있다면, 해당 이미지는 전신 컷으로 구분된다(S928). 전신 컷으로 구분된 경우, 모델의 전신을 중심으로 이미지를 크롭할 수 있다(S930). 즉, 모델의 허리 부분을 중심으로 전신이 다 표시되도록 이미지를 크롭하는 것이 바람직하다. 단계(S926)에서, 전신이 다 보이지 않는 경우, 해당 이미지는 상반신 컷으로 구분될 수 있다(S932). 상반신 컷으로 구분된 경우, 얼굴을 이미지의 중심에서 약간 위쪽에 위치하도록 하여 이미지를 크롭할 수 있다. 즉, 좌우 방향에 대해서는 중심부에 놓이도록 하고, 상하 방향에서는 중심보다 위쪽에 얼굴이 위치하도록 하여 이미지를 크롭한다.
이미지 크롭이 완료되고 나면, 해당 이미지를 업로드 준비상태로 대기시킨다. 이때, 이미지의 구분된 상태 그대로 할지, 아니면, 현재 자동 구분된 상태를 변경할지 결정할 수 있다(S936). 그대로 현재 상태를 유지하는 경우, 삽입 이미지에 대한 준비 과정이 완료된 것으로 보면 된다(S942). 그렇지 않고 현재의 구분 상태를 변경하고자 하는 경우, 임의로 특정 크롭 알고리즘을 선택할 수 있다(S938). 예컨대, 현재 하반신 컷으로 구분되어 모델의 하반신을 중심으로 크롭된 이미지를 상품 컷으로 변경하고자 하는 경우, 상품 컷의 크롭 알고리즘이 사용되도록 사용자가 직접 선택할 수 있다(S938). 즉, 새롭게 선택된 상품 컷 이미지 크롭 알고리즘에 따라, 하반신을 이미지의 중심으로 하지 않고, 해당 이미지 내에 존재하는 특정 객체(예컨대, 신발, 양말 등)가 중심이 되게 하여 이미지가 크롭되도록 할 수 있다(S940).
본 발명의 다른 실시예에 따르면, 원본 이미지에 대해 수동으로 크롭 작업을 함으로써, 삽입 이미지를 준비시킬 수 있다. 즉, 사용자가 원하는 부분이 의도한 대로 잘 드러날 수 있도록 수동 크롭 모드로 이미지 준비 작업을 진행시킬 수 있다.
추가적으로, 기본 이미지의 크기는 입력 이미지의 크기에 따라 가변될 수도 있지만, 디폴트로는 정해져 있을 수 있다. 예컨대, 600x600 사이즈의 정사각형, 600x400의 직사각형 등 기설정된 이미지 사이즈에 맞춰 이미지의 크롭이 이루어질 수 있다.
도 10은 다수의 이미지가 혼재된 입력 이미지를 개별 이미지로 크롭하는 멀티 크롭 방법을 설명하기 위한 개념도이다.
도 10을 참조하면, 다수의 이미지가 혼재된 입력 이미지가 업로드된 경우, 장치는 해당 이미지를 독립적으로 크롭한다. 위와 같은 다수 이미지가 혼재된 입력 이미지는 실제 쇼핑몰에 업로드된 이미지를 그대로 복사해 온 경우 생성될 수 있다. 즉, 쇼핑몰 상의 상품 이미지들이 표시되어 있는 것을 임의로 복사하여 입력 이미지로 캔버스에 삽입하려고 할 때, 입력 이미지에 포함된 하나하나의 상품과 연관된 개별 이미지들은 개별 이미지의 둘레에 존재하는 경계선을 기반으로 크롭될 수 있다.
즉, 도 10의 실시예에 있어서, 개별 이미지들(1010-1, 1010-2, 1010-3)은 특정 색상(예컨대, 흰 색)의 경계선(1020-1, 1020-2)을 윤곽에 포함하고 있을 수 있고, 장치는 윤곽의 경계선(1020-1, 1020-2)을 기반으로 개별 이미지를 자동으로 크롭하여 캔버스 삽입 준비 상태로 대기시킨다.
본 발명의 다른 실시예에 따르면, 장치는, 객체(인물 객체 및 사물 객체를 모두 포함할 수 있음)를 기반으로 이미지를 크롭할 수 있다. 즉, 다수 이미지가 혼재된 입력 이미지에서 서로 붙어있지 않고 일정 거리 이상 떨어져 있는 두 객체는 서로 별개의 이미지로 구분시켜 크롭할 수 있다. 이때, 객체의 크기가 추가적으로 고려될 수 있다. 기설정된 크기 이상의 객체이면서 두 객체 간의 거리가 떨어져 있는 경우 떨어져 있는 두 객체를 중심으로 이미지를 독립적으로 생성할 수 있다. 이때, 객체 주변의 배경은 색상이 급격하게 변하는 지점을 기준으로 크롭할 수 있다. 즉, 장치는 서로 다른 객체를 기반으로 이미지를 독립화함에 있어서, 픽셀 값을 기반으로 이미지를 크롭할 수 있다. 예컨대, 객체 1과 객체 2가 하나의 입력 이미지 상에 존재함에도 불구하고, 객체 1과 객체 2가 기준 값 이상의 크기를 가지며, 기준 거리 이상 이격되어 있으면, 객체 1을 중심으로 하는 이미지 1과 객체 2를 중심으로 하는 이미지 2를 독립적으로 생성할 수 있다. 이때, 이미지 1 및 이미지 2의 크롭 경계선은 픽셀 값을 기반으로 결정될 수 있다. 예컨대, 객체의 크기와 기본적인 삽입 이미지의 사이즈를 고려할 때, 이미지의 중심부분에 위치한 객체로부터 일정 거리 이상 떨어져 있어 이미지의 경계선이 될 가능성이 높은 영역의 픽셀들 중에서 주변 픽셀과의 픽셀 값의 차이가 임계값 이상 나는 픽셀 부분을 경계선으로 결정하고, 해당 부분을 기반으로 두 이미지를 분리할 수 있다.
이와 같이 다수의 이미지가 혼재된 입력 이미지를 개별 이미지로 크롭시키는 멀티 크롭 알고리즘은 앞서 도 9의 단일 크롭 알고리즘과 같이, 인공지능 모델을 이용하여 적응적으로 학습될 수 있다. 즉, 멀티 크롭 알고리즘에 의해 크롭되기 전의 입력 원본 이미지와 실제 멀티 크롭 알고리즘에 의해 크롭된 후, 사용자에 의해 캔버스로의 삽입에 사용된 개별 이미지를 하나의 학습 데이터 셋으로 생성하여 원본 이미지로부터 개별 이미지로 크롭하는데 사용된 하이퍼 파라미터를 정량화함에 의해, 멀티 크롭 알고리즘을 학습시킬 수 있다. 상기 학습되는 하이퍼 파라미터는 이미지를 크롭하기 위한 객체간 거리의 임계값, 독립적인 객체로 생성가능한 객체 크기 임계값, 삽입 이미지의 사이즈 및/또는 이미지 크롭의 경계를 결정하는 픽셀 값 차이에 대한 임계값을 포함할 수 있다.
본 발명의 실시예에 따르면, 위와 같은 크롭 알고리즘에 의해 준비된 삽입 대기 이미지들은 교체 대상 기본템플릿 상의 이미지의 속성을 그대로 상속받아 삽입된다. 다만, 이때, 삽입 대기 이미지의 해상도를 그대로 유지하면서 삽입되도록 설정할 수도 있고, 교체 대상 기본템플릿 상의 이미지의 사이즈에 맞춰 해상도를 변경하여 삽입되도록 설정할 수도 있다. 이는 삽입 이후에도 이미지의 크기 및 비율을 조정할 수 있기 때문에 비가역적인 것은 아니다.
도 11은 도 3의 화면에서 복수 개의 캔버스를 생성하여 작업하는 모습을 도시한 도면이다.
도 11을 참조하면, 장치는 캔버스 생성 부분에 하나의 캔버스만 생성하여 작업하도록 제한되어 있지 않다. 즉, 장치는 캔버스를 복수 개 생성하여 동시에 편집 작업이 이루어지도록 할 수 있다. 예컨대, "정사각형 12"의 기본 템플릿을 기반으로 제 1 캔버스(330)의 작업을 진행하다가, "세로형 4"의 기본 템플릿을 선택하여 제 2 캔버스(380)를 신규 생성하고, 제 1 캔버스(330)와 제 2 캔버스(380)의 편집을 하나의 화면에서 동시에 처리할 수 있다.
또한, 제 1 캔버스 상의 현재까지의 작업 상황을 복사하여 제 2 캔버스에 배치하고, 후속하는 편집 작업에는 제 1 캔버스 상의 편집과 제 2 캔버스 상의 편집에 차이를 둬서 현재까지의 편집된 이미지를 기반으로 둘 이상의 결과를 획득하도록 할 수 있다.
위와 같은 방법으로 복수 개 생성된 캔버스의 이미지는 배너 미리보기 아이콘(미도시)을 통해 일괄적으로 확인할 수 있으며, 일괄 다운로드도 가능하다.
본 발명의 실시예에 따르면, 장치에는, 캔버스의 편집 과정에서 유효성을 검증하는 기능이 존재한다. 이는 검증 툴에 의해 구현된다. 즉, 편집 과정에서 현재 캔버스의 유효성 검증을 요청하면, 캔버스 내의 각각의 디자인 요소 및 디자인 요소에 관련된 편집 속성과 관련된 기능들(예컨대, 필터, 글꼴, 등)이 html 언어로 표현되는 검증 툴이 제공된다. 사용자는 유효성 검증 요청에 응답된 html 언어 기반의 검증 툴을 이용하여 캔버스의 유효성을 검사할 수 있다. 이를 통해, 각각의 디자인 요소 및 디자인 요소의 편집 기능과 관련된 프로그래밍 언어(상기 html 언어를 포함함)가 적절하게 이루어져 있는지를 확인할 수 있다. 예컨대, 필터의 기능과 관련된 세부기능에 대한 프로그래밍도 상기 검증 툴을 이용하여 수행할 수 있다.
추가적으로, 캔버스의 전체 크기의 적절성도 판단될 수 있는데, 캔버스 외주면에 형성되는 패딩(padding), 보더(border), 여백(margin) 부분까지 고려하여 캔버스의 생성에 문제가 없는지 판단한다. 패딩, 보더 및 여백의 크기는 상기 검증 툴을 이용하여 사용자가 설정할 수 있다. 장치는, 설정된 패딩, 보더 및 여백의 크기에 따라 실제 캔버스의 크기의 유효성을 검증하고, 적절하지 않은 경우, 캔버스 크기를 자동 조정할 수 있다.
도 12는 본 발명의 일 실시예에 따른 쇼핑몰과 연관된 이미지 자동 생성 장치를 나타낸 블록도이다. 도 12에 도시된 바와 같이, 본 발명의 일 실시예에 따른 쇼핑몰 관련 이미지 자동 생성 장치는 통신부(1210), 메모리(1220), 프로세서(1230), 출력부(1240) 및 입력부(1250)를 포함할 수 있다.
도 12를 참조하면, 통신부(1210)는 타 장치와의 통신을 위한 구성요소이다. 이는 안테나 또는 통신과 연관된 전자회로, 통신 프로세서로 구현될 수 있다.
메모리(1220)는 프로세서(1230)에서의 작업과 관련된 프로그램 명령어를 저장하고 있는 저장소이다. 또한, 기본 템플릿 유형, 캔버스에 삽입되기 위한 입력 이미지들 등도 저장하고 있을 수 있다.
프로세서(1230)는 메모리(1220)에 저장된 명령어를 기반으로 입력 이미지를 입력받아 배너 디자인을 생성한다. 프로세서(1230)는 입력 이미지에 대한 영상 분석을 통해 이미지 크롭 작업을 수행하여 캔버스 삽입을 위한 준비를 수행하고, 사용자 입력을 기반으로 선택된 기본 템플릿에 대한 편집을 수행하여 최종 디자인을 생성한다. 또한, 이미지 크롭 알고리즘과 관련하여서는 인공지능 모델을 이용하여 기계학습을 수행함에 의해 보다 정밀한 이미지 크롭이 이루어지도록 제어한다. 프로세서의 이미지 크롭 및 배너 디자인 생성 작업을 앞서 설명한 바와 같다.
출력부(1240)는 화면을 표시하는 디스플레이 수단을 포함한다. 이는 모니터, TV 스크린 등을 포함할 수 있다. 출력부(1240)는 상기 디스플레이 수단을 이용하여 사용자에게 캔버스 상의 편집 상황을 제공하고, 최종 배너 디자인을 표시한다.
입력부(1250)는 사용자 입력을 위한 인터페이스로써, 키보드, 마우스, 터치패드 등을 포함할 수 있고, 사용자 설정, 이미지 선택 등과 같은 사용자 입력을 제공받는다.
이상에서 설명된 시스템 또는 장치는 하드웨어 구성요소, 소프트웨어 구성요소, 및/또는 하드웨어 구성요소 및 소프트웨어 구성요소의 조합으로 구현될 수 있다. 예를 들어, 실시예들에서 설명된 시스템, 장치 및 구성요소는, 예를 들어, 프로세서, 콘트롤러, ALU(arithmetic logic unit), 디지털 신호 프로세서(digital signal processor), 마이크로컴퓨터, FPA(field programmable array), PLU(programmable logic unit), 마이크로프로세서, 또는 명령(instruction)을 실행하고 응답할 수 있는 다른 어떠한 장치와 같이, 하나 이상의 범용 컴퓨터 또는 특수 목적 컴퓨터를 이용하여 구현될 수 있다. 처리 장치는 운영 체제(OS) 및 상기 운영 체제 상에서 수행되는 하나 이상의 소프트웨어 애플리케이션을 수행할 수 있다. 또한, 처리 장치는 소프트웨어의 실행에 응답하여, 데이터를 접근, 저장, 조작, 처리 및 생성할 수도 있다. 이해의 편의를 위하여, 처리 장치는 하나가 사용되는 것으로 설명된 경우도 있지만, 해당 기술분야에서 통상의 지식을 가진 자는, 처리 장치가 복수 개의 처리요소(processing element) 및/또는 복수 유형의 처리 요소를 포함할 수 있음을 알 수 있다. 예를 들어, 처리 장치는 복수 개의 프로세서 또는 하나의 프로세서 및 하나의 콘트롤러를 포함할 수 있다. 또한, 병렬 프로세서(parallel processor)와 같은, 다른 처리 구성(processing configuration)도 가능하다.
소프트웨어는 컴퓨터 프로그램(computer program), 코드(code), 명령(instruction), 또는 이들 중 하나 이상의 조합을 포함할 수 있으며, 원하는 대로 동작하도록 처리 장치를 구성하거나 독립적으로 또는 결합적으로(collectively) 처리 장치를 명령할 수 있다. 소프트웨어 및/또는 데이터는, 처리 장치에 의하여 해석되거나 처리 장치에 명령 또는 데이터를 제공하기 위하여, 어떤 유형의 기계, 구성요소(component), 물리적 장치, 가상 장치(virtual equipment), 컴퓨터 저장 매체 또는 장치, 또는 전송되는 신호 파(signal wave)에 영구적으로, 또는 일시적으로 구체화(embody)될 수 있다. 소프트웨어는 네트워크로 연결된 컴퓨터 시스템 상에 분산되어서, 분산된 방법으로 저장되거나 실행될 수도 있다. 소프트웨어 및 데이터는 하나 이상의 컴퓨터 판독 가능 기록 매체에 저장될 수 있다.
실시예들에 따른 방법은 다양한 컴퓨터 수단을 통하여 수행될 수 있는 프로그램 명령 형태로 구현되어 컴퓨터 판독 가능 매체에 기록될 수 있다. 상기 컴퓨터 판독 가능 매체는 프로그램 명령, 데이터 파일, 데이터 구조 등을 단독으로 또는 조합하여 포함할 수 있다. 상기 매체에 기록되는 프로그램 명령은 실시예를 위하여 특별히 설계되고 구성된 것들이거나 컴퓨터 소프트웨어 당업자에게 공지되어 사용 가능한 것일 수도 있다. 컴퓨터 판독 가능 기록 매체의 예에는 하드 디스크, 플로피 디스크 및 자기 테이프와 같은 자기체(magnetic media), CD-ROM, DVD와 같은 광기록 매체(optical media), 플롭티컬 디스크(floptical disk)와 같은 자기-광 매체(magneto-optical media), 및 롬(ROM), 램(RAM), 플래시 메모리 등과 같은 프로그램 명령을 저장하고 수행하도록 특별히 구성된 하드웨어 장치가 포함된다. 프로그램 명령의 예에는 컴파일러에 의해 만들어지는 것과 같은 기계어 코드뿐만 아니라 인터프리터 등을 사용해서 컴퓨터에 의해서 실행될 수 있는 고급 언어 코드를 포함한다. 상기된 하드웨어 장치는 실시예의 동작을 수행하기 위해 하나 이상의 소프트웨어 모듈로서 작동하도록 구성될 수 있으며, 그 역도 마찬가지이다.
이상과 같이 실시예들이 비록 한정된 실시예와 도면에 의해 설명되었으나, 해당 기술분야에서 통상의 지식을 가진 자라면 상기의 기재로부터 다양한 수정 및 변형이 가능하다. 예를 들어, 설명된 기술들이 설명된 방법과 다른 순서로 수행되거나, 및/또는 설명된 시스템, 구조, 장치, 회로 등의 구성요소들이 설명된 방법과 다른 형태로 결합 또는 조합되거나, 다른 구성요소 또는 균등물에 의하여 대치되거나 치환되더라도 적절한 결과가 달성될 수 있다.
그러므로, 다른 구현들, 다른 실시예들 및 특허청구범위와 균등한 것들도 후술하는 특허청구범위의 범위에 속한다.

Claims (12)

  1. 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위해 이미지를 크롭(crop)하는 방법에 있어서,
    상기 온라인 쇼핑몰의 배너디자인에 사용될 제 1 이미지를 입력하는 단계;
    상기 제 1 이미지 내에 포함된 객체를 분석하여 분석된 결과를 기반으로 상기 제 1 이미지를 배너 디자인에 사용가능한 형태로 변형시킴에 의해, 제 2 이미지를 생성하는 단계; 및
    상기 제 2 이미지를 기보유된 기본 템플릿에 삽입하여 배너 디자인을 완성하는 단계를 포함하되,
    상기 제 2 이미지를 생성하는 단계는, 상기 제 1 이미지 내에 포함된 객체의 위치 및 크기 중 적어도 하나에 대한 분석 결과를 기반으로 상기 제 1 이미지의 적어도 일부를 크롭함에 의해 상기 제 2 이미지를 생성하는 단계를 포함하고,
    상기 제 1 이미지가 서로 구분 가능한 복수 개의 객체 - 상기 복수 개의 객체는 제 1 객체 및 제 2 객체를 포함함 - 를 포함할 때, 상기 제 1 객체와 상기 제 2 객체 간의 거리 및 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나의 크기를 고려하여 상기 제 1 객체를 중심으로 하는 제 1 독립 이미지와 상기 제 2 객체를 중심으로 하는 제 2 독립 이미지로 크롭하는 멀티 크롭 알고리즘을 인공지능 모델을 이용하여 학습시키되,
    상기 멀티 그롭 알고리즘의 학습을 위해, (i) 크롭되기 전의 입력 원본 이미지와 (ii) 상기 멀티 그롭 알고리즘에 의해 크롭된 후 사용자에 의해 캔버스 - 캔버스는 상기 기본 템플릿의 편집을 위한 공간임 - 로의 삽입에 사용된 독립이미지를 하나의 학습 데이터 셋으로 형성하고,
    상기 하나의 학습 데이터 셋 내의 원본이미지로부터 독립이미지로 크롭하는데 사용된 하이퍼 파라미터(hyper parameter)를 정량화함에 의해 상기 멀티 크롭 알고리즘이 학습되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  2. 제 1 항에 있어서,
    상기 제 1 이미지는 모델의 존재 여부 및 상기 모델의 신체 중 표시된 신체 부위의 위치, 얼굴의 존재 여부 중 적어도 하나를 분석하여,
    상기 모델의 전신을 중심으로 하는 제 1 유형;
    상기 모델의 상반신을 중심으로 하는 제 2 유형;
    상기 모델의 하반신을 중심으로 하는 제 3 유형; 및
    상품 아이템을 중심으로 하는 제 4 유형 중 하나로 자동으로 카테고라이징되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  3. 제 2 항에 있어서,
    상기 제 1 유형 내지 상기 제 4 유형의 이미지는 유형별로 서로 다른 크롭 알고리즘을 이용하여 크롭되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  4. 제 1 항에 있어서,
    상기 제 2 이미지를 생성하는 단계는, 상기 제 1 이미지 내에 존재하는 적어도 하나의 객체 중 중심이 되는 제 1 객체를 기반으로 상기 제 1 객체가 상기 제 1 이미지의 중심이 되도록 상기 제 1 이미지를 크롭하는 단계를 포함하는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  5. 제 4 항에 있어서,
    상기 제 1 객체로부터 제 1 간격을 두고 상기 제 2 이미지의 경계선이 배치되도록 이미지를 크롭하되,
    상기 제 1 객체가 상기 제 2 이미지의 중심에 위치하면서 상기 제 1 객체와 상기 제 2 이미지의 경계선까지의 거리가 상기 제 1 간격이 되도록 상기 제 1 객체의 크기 및 해상도 중 하나를 변경하는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  6. 제 5 항에 있어서,
    상기 제 1 객체의 크기에 대한 파라미터, 및 상기 제 2 이미지의 경계선 설정과 관련된 파라미터는 상기 제 1 이미지와 상기 제 2 이미지를 학습 데이터 셋으로 하여 제 1 딥 러닝(deep learning) 모델을 이용함에 의해 학습되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  7. 제 1 항에 있어서,
    상기 제 1 이미지가 서로 구분 가능한 복수 개의 이미지를 포함할 때, 상기 복수 개의 이미지를 구분하는 경계선을 추출하여 상기 추출된 경계선을 기반으로 복수 개의 이미지를 개별 이미지로 크롭하는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  8. 삭제
  9. 제 1 항에 있어서,
    상기 제 1 독립 이미지와 상기 제 2 독립 이미지로 크롭함에 있어서, (i) 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나의 크기, (ii) 상기 제 2 이미지의 크기 및 (iii) 상기 제 1 객체와 상기 제 2 객체와의 이격거리를 고려하여 상기 제 1 이미지를 크롭하는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  10. 제 1 항에 있어서,
    상기 제 1 독립 이미지와 상기 제 2 독립 이미지의 경계선은 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나로부터 제 2 거리 이상 이격된 영역의 픽셀들 중 주변 픽셀들과의 픽셀값 차이가 임계값 이상 나는 픽셀들을 기반으로 결정되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  11. 제 10 항에 있어서,
    상기 제 1 이미지와 상기 제 2 이미지를 학습 데이터 셋으로 생성하여 독립 이미지 생성을 위한 객체간 거리의 임계값, 독립 이미지 생성을 위한 객체의 크기 임계값 및 제 2 이미지의 경계와 연관된 임계값을 제 2 딥 러닝 모델을 이용하여 학습시키는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 방법.
  12. 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위해 이미지를 크롭하는 장치에 있어서,
    상기 온라인 쇼핑몰의 배너디자인에 사용될 제 1 이미지를 입력하는 입력부;
    상기 제 1 이미지 내에 포함된 객체를 분석하여 분석된 결과를 기반으로 상기 제 1 이미지를 배너 디자인에 사용가능한 형태로 변형시킴에 의해, 제 2 이미지를 생성하고, 상기 제 2 이미지를 기보유된 기본 템플릿에 삽입하여 배너 디자인을 완성하는 프로세서를 포함하되,
    상기 프로세서는, 상기 제 1 이미지 내에 포함된 객체의 위치 및 크기 중 적어도 하나에 대한 분석 결과를 기반으로 상기 제 1 이미지의 적어도 일부를 크롭(crop)함에 의해 상기 제 2 이미지를 생성하고,
    상기 프로세서는, 상기 제 1 이미지가 서로 구분 가능한 복수 개의 객체 - 상기 복수 개의 객체는 제 1 객체 및 제 2 객체를 포함함 - 를 포함할 때, 상기 제 1 객체와 상기 제 2 객체 간의 거리 및 상기 제 1 객체 및 상기 제 2 객체 중 적어도 하나의 크기를 고려하여 상기 제 1 객체를 중심으로 하는 제 1 독립 이미지와 상기 제 2 객체를 중심으로 하는 제 2 독립 이미지로 크롭하는 멀티 크롭 알고리즘을 인공지능 모델을 이용하여 학습시키되,
    상기 프로세서는, 상기 멀티 그롭 알고리즘의 학습을 위해, (i) 크롭되기 전의 입력 원본 이미지와 (ii) 상기 멀티 그롭 알고리즘에 의해 크롭된 후 사용자에 의해 캔버스 - 캔버스는 상기 기본 템플릿의 편집을 위한 공간임 - 로의 삽입에 사용된 독립이미지를 하나의 학습 데이터 셋으로 형성하고,
    상기 하나의 학습 데이터 셋 내의 원본이미지로부터 독립이미지로 크롭하는데 사용된 하이퍼 파라미터(hyper parameter)를 정량화함에 의해 상기 멀티 크롭 알고리즘이 학습되는, 온라인 쇼핑몰과 연관된 배너 디자인 생성을 위한 이미지 크롭 장치.




KR1020190032920A 2019-03-22 2019-03-22 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치 KR102247877B1 (ko)

Priority Applications (1)

Application Number Priority Date Filing Date Title
KR1020190032920A KR102247877B1 (ko) 2019-03-22 2019-03-22 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR1020190032920A KR102247877B1 (ko) 2019-03-22 2019-03-22 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치

Publications (2)

Publication Number Publication Date
KR20200112442A KR20200112442A (ko) 2020-10-05
KR102247877B1 true KR102247877B1 (ko) 2021-05-04

Family

ID=72809094

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020190032920A KR102247877B1 (ko) 2019-03-22 2019-03-22 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치

Country Status (1)

Country Link
KR (1) KR102247877B1 (ko)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20230029564A (ko) 2021-08-24 2023-03-03 주식회사 아이클레이브 이미지 학습 모델 기반의 커머셜 디자인 생성 방법 및 장치

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR102580427B1 (ko) * 2020-11-16 2023-09-19 씨제이올리브네트웍스 주식회사 가상 피팅 서비스를 제공하는 방법 및 이를 위한 시스템

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR101720584B1 (ko) * 2015-12-29 2017-03-29 주식회사 카카오 썸네일 이미지 생성 방법, 서버 및 컴퓨터 프로그램
JP2018196008A (ja) * 2017-05-18 2018-12-06 楽天株式会社 画像処理装置、画像処理方法、及びプログラム

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20130078676A (ko) * 2011-12-30 2013-07-10 삼성전자주식회사 디스플레이장치 및 그 제어방법
KR101508977B1 (ko) * 2012-08-16 2015-04-08 네이버 주식회사 이미지 분석에 의한 이미지 자동 편집 장치, 방법 및 컴퓨터 판독 가능한 기록 매체
KR20160095662A (ko) * 2015-01-08 2016-08-12 (주) 애드잇 광고 배너 자동 제작방법 및 광고 배너 자동 제작서버

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR101720584B1 (ko) * 2015-12-29 2017-03-29 주식회사 카카오 썸네일 이미지 생성 방법, 서버 및 컴퓨터 프로그램
JP2018196008A (ja) * 2017-05-18 2018-12-06 楽天株式会社 画像処理装置、画像処理方法、及びプログラム

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20230029564A (ko) 2021-08-24 2023-03-03 주식회사 아이클레이브 이미지 학습 모델 기반의 커머셜 디자인 생성 방법 및 장치

Also Published As

Publication number Publication date
KR20200112442A (ko) 2020-10-05

Similar Documents

Publication Publication Date Title
US10242331B2 (en) Supplemental system for business intelligence systems to provide visual identification of meaningful differences
CN109614424B (zh) 页面布局生成方法、装置、计算设备和介质
CN111930381B (zh) 一种支持SaaS多租户系统的个性化页面配置方法
US8799829B2 (en) Methods and systems for background uploading of media files for improved user experience in production of media-based products
US8799756B2 (en) Systems and methods for generating autoflow of content based on image and user analysis as well as use case data for a media-based printable product
WO2019127824A1 (zh) 可视化图表页面实现方法、装置、终端设备及存储介质
CN109408764B (zh) 页面区域划分方法、装置、计算设备和介质
US10691875B2 (en) Populating visual designs with web content
US9880709B2 (en) System and method for creating and displaying previews of content items for electronic works
US10372304B2 (en) Facilitating object set replication
US10732942B2 (en) Automatically categorizing and validating user-interface-design components using a design-component-neural network
KR102247877B1 (ko) 온라인 쇼핑몰 배너 디자인 생성을 위한 이미지 크롭 방법 및 장치
KR102246537B1 (ko) 온라인 쇼핑몰 배너 디자인 자동 생성 방법 및 장치
US20160314502A1 (en) System and method for streamlining the design and development process of multiple advertising units
US10558745B2 (en) Information processing apparatus and non-transitory computer readable medium
CN116438530A (zh) 基于用户动作自动配置定制产品选项的系统和方法
JP6623603B2 (ja) 情報処理装置及びプログラム
US9779529B2 (en) Generating multi-image content for online services using a single image
US9244651B2 (en) Document revision control
JP7398417B2 (ja) 画像の効率的な管理及び変更のためのシステム及び方法
US10802664B2 (en) Dynamic layout design
CN112637633B (zh) 节目生成方法和节目生成装置
US10915599B2 (en) System and method for producing transferable, modular web pages
US9448703B2 (en) Information processing device, method, and storage medium for excluding a region selection in a form
JP4336813B2 (ja) 画像記述システムおよび方法

Legal Events

Date Code Title Description
E701 Decision to grant or registration of patent right
GRNT Written decision to grant