KR20240031623A - 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법 - Google Patents

개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법 Download PDF

Info

Publication number
KR20240031623A
KR20240031623A KR1020220110537A KR20220110537A KR20240031623A KR 20240031623 A KR20240031623 A KR 20240031623A KR 1020220110537 A KR1020220110537 A KR 1020220110537A KR 20220110537 A KR20220110537 A KR 20220110537A KR 20240031623 A KR20240031623 A KR 20240031623A
Authority
KR
South Korea
Prior art keywords
template
user
design
component
design template
Prior art date
Application number
KR1020220110537A
Other languages
English (en)
Inventor
박정범
박송이
이우철
김재일
Original Assignee
(주)투비소프트
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 (주)투비소프트 filed Critical (주)투비소프트
Priority to KR1020220110537A priority Critical patent/KR20240031623A/ko
Priority to US18/221,885 priority patent/US20240078095A1/en
Priority to JP2023118983A priority patent/JP2024035094A/ja
Publication of KR20240031623A publication Critical patent/KR20240031623A/ko

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/166—Editing, e.g. inserting or deleting
    • G06F40/186—Templates
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/34—Graphical or visual programming
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/36—Software reuse
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Stored Programmes (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

본 발명은 UI(User Interface) 개발자가 개발하고자 하는 UI의 산업 분류, 해당 UI를 사용할 유저의 직업 및 해당 UI가 적용될 타겟 제품과 관련된 플랫폼을 고려하여, UI 개발자에게 UI를 구성하는 각 컴포넌트에 대한 적절한 디자인 템플릿을 추천함으로써, UI 개발자가 보다 손쉽게 자신이 원하는 방향의 UI를 개발할 수 있도록 지원하는 기술에 대한 것이다.

Description

개발 대상 UI의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치 및 그 동작 방법{ELECTRONIC APPARATUS EQUIPPED WITH A UI DEVELOPMENT TOOL CAPABLE OF RECOMMENDING A TEMPLATE FOR A UI COMPONENT BASED ON THE CHARACTERISTICS OF THE UI TO BE DEVELOPED AND THE OPERATING METHOD THEREOF}
본 발명은 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치 및 그 동작 방법에 대한 것이다.
일반적으로, UI(User Interface)를 개발하는 사용자는 UI 개발 툴(tool)을 활용하여 UI를 개발할 때, 다양한 기능을 구현하기 위해서, 버튼, 텍스트 인풋(input) 박스, 메뉴창 등과 같은 다양한 UI 컴포넌트들(component)을 생성하는 경우가 많다.
이와 관련하여, 소정의 UI를 개발하고자 하는 사용자는, 해당 UI가 적용될 산업 분류나 해당 UI를 활용할 유저의 직업 또는 해당 UI가 적용될 타겟 제품과 관련된 플랫폼을 고려하여, 상기 UI를 구성하는 UI 컴포넌트들에 대한 디자인 작업을 수행할 필요가 있다.
예컨대, 중소기업의 지식재산권 담당자를 위한 지식재산권 제도와 관련된 모바일 애플리케이션에 대한 UI를 개발하고자 하는 사용자는, 지식재산권이라는 산업 분류와 중소기업의 지식재산권 담당자라고 하는 직업, 및 모바일 단말기라고 하는 플랫폼에 맞추어서 해당 애플리케이션을 구성하는 UI 컴포넌트들에 대한 디자인 작업을 수행할 필요가 있다.
하지만, UI를 개발하고자 하는 사용자가 UI 컴포넌트에 대한 디자인 작업에 익숙하지 않은 경우, UI 컴포넌트의 디자인을 진행하는데 있어서 많은 어려움을 겪을 수 있다.
따라서, UI 개발자가 개발하고자 하는 UI의 산업 분류, 해당 UI를 사용할 유저의 직업 및 해당 UI가 적용될 타겟 제품과 관련된 플랫폼을 고려하여, UI 개발자에게 UI를 구성하는 각 컴포넌트에 대한 적절한 디자인 템플릿을 추천함으로써, UI 개발자가 보다 손쉽게 자신이 원하는 방향의 UI를 개발할 수 있도록 지원하는 기술에 대한 연구가 필요하다.
본 발명은 UI 개발자가 개발하고자 하는 UI의 산업 분류, 해당 UI를 사용할 유저의 직업 및 해당 UI가 적용될 타겟 제품과 관련된 플랫폼을 고려하여, UI 개발자에게 UI를 구성하는 각 컴포넌트에 대한 적절한 디자인 템플릿을 추천함으로써, UI 개발자가 보다 손쉽게 자신이 원하는 방향의 UI를 개발할 수 있도록 지원하는 기술을 제공하고자 한다.
본 발명의 일실시예에 따른 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치는 사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI(User Interface) 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있는 테이블 저장부, 상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트 - 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미하는 것으로, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있음 - 가 저장되어 있는 템플릿 저장부, 상기 전자 장치에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시하는 질의 메시지 표시부, 상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 상기 테이블 저장부에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인하는 코드 확인부 및 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 상기 템플릿 저장부를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성하는 생성부를 포함한다.
또한, 본 발명의 일실시예에 따른 개발 대상 UI의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치의 동작 방법은 사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI(User Interface) 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있는 테이블 저장부를 유지하는 단계, 상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트 - 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미하는 것으로, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있음 - 가 저장되어 있는 템플릿 저장부를 유지하는 단계, 상기 전자 장치에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시하는 단계, 상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 상기 테이블 저장부에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인하는 단계 및 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 상기 템플릿 저장부를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성하는 단계를 포함한다.
본 발명은 UI 개발자가 개발하고자 하는 UI의 산업 분류, 해당 UI를 사용할 유저의 직업 및 해당 UI가 적용될 타겟 제품과 관련된 플랫폼을 고려하여, UI 개발자에게 UI를 구성하는 각 컴포넌트에 대한 적절한 디자인 템플릿을 추천함으로써, UI 개발자가 보다 손쉽게 자신이 원하는 방향의 UI를 개발할 수 있도록 지원하는 기술을 제공할 수 있다.
도 1은 본 발명의 일실시예에 따른 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치에 대한 구조를 도시한 도면이다.
도 2는 본 발명의 일실시예에 따른 개발 대상 UI의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치의 동작을 설명하기 위한 도면이다.
도 3은 본 발명의 일실시예에 따른 개발 대상 UI의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치의 동작 방법을 도시한 순서도이다.
이하에서는 본 발명에 따른 실시예들을 첨부된 도면을 참조하여 상세하게 설명하기로 한다. 이러한 설명은 본 발명을 특정한 실시 형태에 대해 한정하려는 것이 아니며, 본 발명의 사상 및 기술 범위에 포함되는 모든 변경, 균등물 내지 대체물을 포함하는 것으로 이해되어야 한다. 각 도면을 설명하면서 유사한 참조부호를 유사한 구성요소에 대해 사용하였으며, 다르게 정의되지 않는 한, 기술적이거나 과학적인 용어를 포함해서 본 명세서 상에서 사용되는 모든 용어들은 본 발명이 속하는 기술분야에서 통상의 지식을 가진 사람에 의해 일반적으로 이해되는 것과 동일한 의미를 가지고 있다.
본 문서에서, 어떤 부분이 어떤 구성요소를 "포함"한다고 할 때, 이는 특별히 반대되는 기재가 없는 한 다른 구성요소를 제외하는 것이 아니라 다른 구성요소를 더 포함할 수 있다는 것을 의미한다. 또한, 본 발명의 다양한 실시예들에 있어서, 각 구성요소들, 기능 블록들 또는 수단들은 하나 또는 그 이상의 하부 구성요소로 구성될 수 있고, 각 구성요소들이 수행하는 전기, 전자, 기계적 기능들은 전자회로, 집적회로, ASIC(Application Specific Integrated Circuit) 등 공지된 다양한 소자들 또는 기계적 요소들로 구현될 수 있으며, 각각 별개로 구현되거나 2 이상이 하나로 통합되어 구현될 수도 있다.
한편, 첨부된 블록도의 블록들이나 흐름도의 단계들은 범용 컴퓨터, 특수용 컴퓨터, 휴대용 노트북 컴퓨터, 네트워크 컴퓨터 등 데이터 프로세싱이 가능한 장비의 프로세서나 메모리에 탑재되어 지정된 기능들을 수행하는 컴퓨터 프로그램 명령들(instructions)을 의미하는 것으로 해석될 수 있다. 이들 컴퓨터 프로그램 명령들은 컴퓨터 장치에 구비된 메모리 또는 컴퓨터에서 판독 가능한 메모리에 저장될 수 있기 때문에, 블록도의 블록들 또는 흐름도의 단계들에서 설명된 기능들은 이를 수행하는 명령 수단을 내포하는 제조물로 생산될 수도 있다. 아울러, 각 블록 또는 각 단계는 특정된 논리적 기능(들)을 실행하기 위한 하나 이상의 실행 가능한 명령들을 포함하는 모듈, 세그먼트 또는 코드의 일부를 나타낼 수 있다. 또, 몇 가지 대체 가능한 실시예들에서는 블록들 또는 단계들에서 언급된 기능들이 정해진 순서와 달리 실행되는 것도 가능함을 주목해야 한다. 예컨대, 잇달아 도시되어 있는 두 개의 블록들 또는 단계들은 실질적으로 동시에 수행되거나, 역순으로 수행될 수 있으며, 경우에 따라 일부 블록들 또는 단계들이 생략된 채로 수행될 수도 있다.
도 1은 본 발명의 일실시예에 따른 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치에 대한 구조를 도시한 도면이다.
도 1을 참조하면, 본 발명에 따른 전자 장치(110)는 테이블 저장부(111), 템플릿 저장부(112), 질의 메시지 표시부(113), 코드 확인부(114) 및 생성부(115)를 포함한다.
테이블 저장부(111)에는 사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI(User Interface) 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있다.
예컨대, 테이블 저장부(111)에는 하기의 표 1과 같은 제1 테이블, 하기의 표 2와 같은 제2 테이블 및 하기의 표 3과 같은 제3 테이블이 저장되어 있을 수 있다.
복수의 산업 분류들 산업 분류 코드
법률 분야 산업 분류 코드 1
지식재산권 분야 산업 분류 코드 2
인공지능 분야 산업 분류 코드 3
스마트 공장 분야 산업 분류 코드 4
... ...
복수의 직업들 직업 코드
공무원 직업 코드 1
교육 전문직 직업 코드 2
법률/행정 전문직 직업 코드 3
금융/회계 전문직 직업 코드 4
... ...
복수의 플랫폼들 플랫폼 코드
데스크탑 컴퓨터 플랫폼 코드 1
모바일 단말기 플랫폼 코드 2
태블릿 PC 플랫폼 코드 3
콘솔 비디오 게임기 플랫폼 코드 4
... ...
템플릿 저장부(112)에는 상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트가 저장되어 있다.
여기서, 상기 복수의 UI 컴포넌트들은, 버튼, 텍스트 인풋(input) 박스, 메뉴창 등과 같은, UI 개발 툴을 통해서 사용자가 만들어낼 수 있는 컴포넌트를 의미한다.
그리고, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미한다.
예컨대, '버튼'이라고 하는 UI 컴포넌트가 존재하는 경우, '버튼'에 대한 템플릿 세트는 UI 상에서 '버튼'이라고 하는 UI 컴포넌트를 표현하기 위해서 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미할 수 있다. 예컨대, '버튼'에 대한 템플릿 세트는 '둥근 형상의 템플릿', '사각 형상의 템플릿', '마름모 형상의 템플릿' 따위의 디자인 템플릿들로 구성되어 있을 수 있다.
이때, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있을 수 있다.
예컨대, '버튼'이라고 하는 UI 컴포넌트에 대한 템플릿 세트에 '둥근 형상의 템플릿'이라고 하는 디자인 템플릿이 존재한다고 하는 경우, 이 '둥근 형상의 템플릿'에 대해서는, 상기 표 1과 같은 복수의 산업 분류들 중 '둥근 형상의 템플릿'에 매칭되는 것으로 사전 지정된, '법률 분야'에 대응되는 '산업 분류 코드 1'이 할당되어 있을 수 있고, 상기 표 2와 같은 복수의 직업들 중 '둥근 형상의 템플릿'에 매칭되는 것으로 사전 지정된, '법률/행정 전문직'에 대응되는 '직업 코드 3'이 할당되어 있을 수 있으며, 상기 표 3같은 복수의 플랫폼들 중 '둥근 형상의 템플릿'에 매칭되는 것으로 사전 지정된, '모바일 단말기'에 대응되는 '플랫폼 코드 2'가 할당되어 있을 수 있다.
이렇게, 테이블 저장부(111)에 상기 제1, 제2, 제3 테이블이 저장되어 있고, 템플릿 저장부(112)에 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트가 저장되어 있는 상황에서, 전자 장치(110)에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 질의 메시지 표시부(113)는 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시한다.
이렇게, 상기 질의 메시지가 화면 상에 표시되면, 상기 사용자는 자신이 개발하고자 하는 신규 UI가 적용될 산업 분류, 상기 신규 UI를 사용할 것으로 예상되는 유저의 직업 및 상기 신규 UI가 적용될 타겟 제품과 관련된 플랫폼에 대한 선택 명령을 전자 장치(110) 상에 인가할 수 있다.
이와 관련해서, 상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 전자 장치(110) 상에, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 코드 확인부(114)는 테이블 저장부(111)에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인한다.
생성부(115)는 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 템플릿 저장부(112)를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성한다.
이때, 본 발명의 일실시예에 따르면, 생성부(115)는 템플릿 확인부(116), 선택부(117), 목록 표시부(118) 및 생성 처리부(119)를 포함할 수 있다.
템플릿 확인부(116)는 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 제1 UI 컴포넌트에 대한 생성 명령이 인가된 경우, 템플릿 저장부(111)를 참조하여, 상기 제1 UI 컴포넌트에 대응되는 제1 템플릿 세트에 포함된 복수의 제1 디자인 템플릿들을 확인한다.
선택부(117)는 상기 복수의 제1 디자인 템플릿들 중 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드가 모두 할당되어 있는 적어도 하나의 제2 디자인 템플릿을 추천 템플릿으로 선택한다.
예컨대, 상기 제1 UI 컴포넌트를 '버튼'에 해당되는 UI 컴포넌트라고 하고, 상기 제1 산업 분류 코드를 상기 표 1에서의 '산업 분류 코드 1', 상기 제1 직업 코드를 상기 표 2에서의 '직업 코드 3', 상기 제1 플랫폼 코드를 상기 표 3에서의 '플랫폼 코드 2'라고 하는 경우, 선택부(117)는 템플릿 저장부(111)에 저장되어 있는 '버튼'이라고 하는 상기 제1 UI 컴포넌트에 대한 제1 템플릿 세트에 포함된 복수의 제1 디자인 템플릿들 중 '산업 분류 코드 1', '직업 코드 3', '플랫폼 코드 2'가 할당되어 있는 적어도 하나의 제2 디자인 템플릿을 추천 템플릿으로 선택할 수 있다.
목록 표시부(118)는 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 목록으로 포함된 선택 인터페이스를 구성하여 화면 상에 표시한다.
이때, 본 발명의 일실시예에 따르면, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 각 디자인 템플릿에 대응되는 사전 설정된 임베딩(embedding) 벡터가 추가로 할당되어 있을 수 있다.
여기서, 상기 임베딩 벡터는, 디자인 템플릿들 간의 디자인 유사도에 기반하여 사전 설정된 벡터로서, 디자인 템플릿들 간의 디자인이 서로 유사할수록 해당 디자인 템플릿들에 대응되는 임베딩 벡터 간의 벡터 유사도가 큰 값으로 산출되도록 설정되어 있을 수 있다. 예컨대, 디자인 템플릿 1, 디자인 템플릿 2, 디자인 템플릿 3이 존재한다고 하였을 때, 디자인 템플릿 1과 디자인 템플릿 2 간의 디자인 유사도 높을 경우, 디자인 템플릿 1과 디자인 템플릿 2 간의 임베딩 벡터의 벡터 유사도는 큰 값으로 산출되도록 사전 설정되어 있을 수 있고, 디자인 템플릿 1과 디자인 템플릿 3 간의 디자인 유사도가 낮을 경우, 디자인 템플릿 1과 디자인 템플릿 3 간의 임베딩 벡터의 벡터 유사도는 낮은 값으로 산출되도록 사전 설정되어 있을 수 있다. 이러한 디자인 템플릿에 대한 임베딩 벡터는 각 디자인 템플릿 간의 디자인 유사도에 따라, 개발자에 의해 사전 설정된 벡터로서, CBOW(Continuous Bag-of-Words) 알고리즘과 같은 기계학습 모델을 기반으로 사전 설정될 수 있다.
이때, 본 발명의 일실시예에 따르면, 목록 표시부(118)는 이력 확인부(120), 평균 산출부(121) 및 표시 처리부(121)를 포함할 수 있다.
이력 확인부(120)는 선택부(117)를 통해, 상기 적어도 하나의 제2 디자인 템플릿이 추천 템플릿으로 선택되면, 상기 신규 UI의 개발 시작 명령이 인가된 시점부터 상기 제1 UI 컴포넌트의 생성 명령이 인가되기 전의 시점까지, 상기 신규 UI를 위한 UI 컴포넌트가 생성된 이력이 있는지 확인하여, 상기 신규 UI를 위한 UI 컴포넌트로 적어도 하나의 제2 UI 컴포넌트가 생성된 이력이 있는 것으로 확인되면, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿을 확인한다.
평균 산출부(121)는 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿의 임베딩 벡터와 상기 적어도 하나의 제2 디자인 템플릿의 임베딩 벡터를 기초로, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿과의 벡터 유사도에 대한 평균을 산출한다.
목록 표시 처리부(122)는 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해 산출된 평균이 큰 순서로, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 사전 설정된 방향으로 나열된 형태의 목록을 갖는 상기 선택 인터페이스를 구성하여 화면 상에 표시한다.
이하에서는 이력 확인부(120), 평균 산출부(121) 및 목록 표시 처리부(122)의 동작을 예를 들어 상세히 설명하기로 한다.
먼저, 상기 사용자에 의해 상기 제1 UI 컴포넌트인 '버튼'이라고 하는 UI 컴포넌트의 생성 명령이 인가되었다고 하는 경우, 이력 확인부(120)는 상기 사용자에 의해 상기 신규 UI의 개발 시작 명령이 인가된 시점부터 상기 제1 UI 컴포넌트인 '버튼'이라고 하는 UI 컴포넌트의 생성 명령이 인가되기 전의 시점까지, 이미 상기 신규 UI을 위한 UI 컴포넌트가 생성된 이력이 있는지 여부를 확인할 수 있다.
그 결과, 상기 신규 UI를 위한 UI 컴포넌트로 '텍스트 인풋 박스', '메뉴창'과 같은 적어도 하나의 제2 UI 컴포넌트가 이미 생성된 이력이 있는 것으로 확인된 경우, 이력 확인부(120)는 상기 적어도 하나의 제2 UI 컴포넌트인 '텍스트 인풋 박스', '메뉴창' 각각에 적용된 디자인 템플릿을 확인할 수 있다.
관련해서, 상기 적어도 하나의 제2 UI 컴포넌트인 '텍스트 인풋 박스', '메뉴창' 각각에 적용된 다지인 템플릿으로, '디자인 템플릿 A', '디자인 템플릿 B'가 적용되어 있는 것으로 확인되었다고 가정하자.
그러면, 평균 산출부(121)는 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿인 '디자인 템플릿 A', '디자인 템플릿 B'의 임베딩 벡터와 상기 적어도 하나의 제2 디자인 템플릿의 임베딩 벡터를 기초로, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해, '디자인 템플릿 A', '디자인 템플릿 B'와의 벡터 유사도에 대한 평균을 산출할 수 있다.
관련해서, 상기 제1 UI 컴포넌트에 대해서 추천된 상기 적어도 하나의 제2 디자인 템플릿이 '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3'이라고 가정하는 경우, 평균 산출부(121)는 '디자인 템플릿 A', '디자인 템플릿 B' 각각의 임베딩 벡터와 '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3' 각각의 임베딩 벡터를 기초로, '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3' 각각에 대해, '디자인 템플릿 A', '디자인 템플릿 B'와의 벡터 유사도에 대한 평균을 산출할 수 있다.
구체적으로, 평균 산출부(121)는 '디자인 템플릿 1'에 대해, '디자인 템플릿 A'와의 벡터 유사도, '디자인 템플릿 B'와의 벡터 유사도의 합을 2로 나눔으로써 '디자인 템플릿 1'에 대한 평균을 산출할 수 있고, '디자인 템플릿 2'에 대해, '디자인 템플릿 A'와의 벡터 유사도, '디자인 템플릿 B'와의 벡터 유사도의 합을 2로 나눔으로써 '디자인 템플릿 2'에 대한 평균을 산출할 수 있으며, '디자인 템플릿 3'에 대해, '디자인 템플릿 A'와의 벡터 유사도, '디자인 템플릿 B'와의 벡터 유사도의 합을 2로 나눔으로써 '디자인 템플릿 3'에 대한 평균을 산출할 수 있다.
그 이후, 목록 표시 처리부(122)는 '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3'에 대한 미리보기 이미지를 생성한 후, '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3' 각각에 대해 산출된 평균이 큰 순서로, '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3'에 대한 미리보기 이미지가 사전 설정된 방향으로 나열된 형태의 목록을 갖는 선택 인터페이스를 구성하여 화면 상에 표시할 수 있다.
관련해서, '디자인 템플릿 1', '디자인 템플릿 2', '디자인 템플릿 3'의 순서로 평균이 크게 산출되었고, 상기 사전 설정된 방향이 세로 방향이라고 하는 경우, 목록 표시 처리부(122)는 도 2에 도시된 그림과 같이, '디자인 템플릿 1'의 미리보기 화면(211), '디자인 템플릿 2'의 미리보기 화면(212), '디자인 템플릿 3'의 미리보기 화면(213)이 세로 방향으로 순차적으로 나열된 형태의 목록을 갖는 선택 인터페이스(210)를 구성하여 화면 상에 표시할 수 있다.
즉, 본 발명에 따른 전자 장치(110)는 사용자에 의해 소정의 제1 UI 컴포넌트에 대한 생성 명령이 인가되는 경우, 개발하고자 하는 신규 UI의 산업 분류, 타겟 유저의 직업, 타겟 플랫폼을 고려하여, 상기 제1 UI 컴포넌트에 대한 디자인 템플릿들을 추천하는 선택 인터페이스를 생성하여 화면 상에 표시하되, 상기 신규 UI와 관련해서 이미 생성 완료된 UI 컴포넌트들이 존재하는 경우, 이 UI 컴포넌트들에 적용된 템플릿 디자인을 고려하여, 유사한 디자인을 갖는 추천 템플릿 디자인들이 우선적으로 상기 선택 인터페이스 상에서 나열되어 표시되도록 함으로써, 상기 사용자가 이미 생성 완료된 UI 컴포넌트들에 적용된 디자인과 유사한 디자인의 템플릿을 선택하도록 유도할 수 있다.
이렇게, 목록 표시부(118)를 통해, 상기 선택 인터페이스가 화면 상에 표시된 이후, 상기 사용자로부터, 상기 선택 인터페이스를 통해, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지 중 제3 디자인 템플릿에 대한 미리보기 이미지의 선택 명령이 인가되면, 생성 처리부(119)는 상기 제3 디자인 템플릿에 따른 디자인이 적용된 상기 제1 UI 컴포넌트를 생성한다.
관련해서, 상기 제1 UI 컴포넌트가 '버튼'에 해당되는 컴포넌트라고 하고, 사용자에 의해, 상기 선택 인터페이스를 통해 '디자인 템플릿 3'에 대한 미리보기 이미지의 선택 명령이 인가되었다고 하는 경우, 생성 처리부(119)는 '디자인 템플릿 3'이 적용된 '버튼'과 관련된 UI 컴포넌트를 생성할 수 있다.
본 발명의 일실시예에 따르면, 전자 장치(110)는 일괄 변경부(123)를 더 포함할 수 있다.
일괄 변경부(123)는 상기 사용자에 의해, 상기 신규 UI를 구성하는 UI 컴포넌트의 생성이 진행된 결과, 적어도 하나의 제3 UI 컴포넌트의 생성이 완료된 상태에서, 상기 사용자로부터 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿에 대한 일괄 자동 변경 요청 명령이 수신되면, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿을 확인한 후, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿을, 각 컴포넌트에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경함으로써, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용된 디자인 템플릿에 대한 일괄 자동 변경 처리를 완료한다.
예컨대, 상기 사용자에 의해 상기 신규 UI를 구성하는 UI 컴포넌트에 대한 생성이 진행된 결과, 상기 적어도 하나의 제3 UI 컴포넌트로, '텍스트 인풋 박스', '메뉴창', '버튼'이라고 하는 3개의 UI 컴포넌트들의 생성이 완료된 상태라고 가정하자.
이때, 상기 사용자로부터, '텍스트 인풋 박스', '메뉴창', '버튼'이라고 하는 3개의 UI 컴포넌트들에 대한 디자인 템플릿의 일괄 자동 명령이 수신되면, 일괄 변경부(123)는 '텍스트 인풋 박스', '메뉴창', '버튼'이라고 하는 3개의 UI 컴포넌트들 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿을 확인한 후, '텍스트 인풋 박스', '메뉴창', '버튼'이라고 하는 3개의 UI 컴포넌트들 각각에 대해서 현재 적용되어 있는 디자인 템플릿을, '텍스트 인풋 박스', '메뉴창', '버튼'이라고 하는 3개의 UI 컴포넌트들 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경할 수 있다.
관련해서, '텍스트 인풋 박스'에 대해서는 선택부(117)를 통해서, '디자인 템플릿 1, 디자인 템플릿 2'가 추천되었고, '메뉴창'에 대해서는 선택부(117)를 통해서, '디자인 템플릿 3, 디자인 템플릿 4'가 추천되었으며, '버튼'에 대해서는 선택부(117)를 통해서, '디자인 템플릿 5, 디자인 템플릿 6'이 추천되었다고 가정하자. 그리고, '텍스트 인풋 박스'에 대해서는 생성 처리부(119)를 통해, '디자인 템플릿 1'이 현재 적용되어 있고, '메뉴창'에 대해서는 생성 처리부(119)를 통해, '디자인 템플릿 3'이 현재 적용되어 있으며, '버튼'에 대해서는 생성 처리부(119)를 통해, '디자인 템플릿 6'이 현재 적용되어 있는 상황이라고 가정하자.
이러한 상황에서, 사용자에 의해, '텍스트 인풋 박스', '메뉴창', '버튼'에 적용되어 있는 디자인 템플릿에 대한 일괄 자동 변경 명령이 수신되면, 일괄 변경부(123)는 '텍스트 인풋 박스'에 대해 적용되어 있는 '디자인 템플릿 1'을, 기 추천되었던 '디자인 템플릿 1, 디자인 템플릿 2' 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경할 수 있고, '메뉴창'에 대해 적용되어 있는 '디자인 템플릿 3'을, 기 추천되었던 '디자인 템플릿 3, 디자인 템플릿 4' 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경할 수 있으며, '버튼'에 대해 적용되어 있는 '디자인 템플릿 6'을, 기 추천되었던 '디자인 템플릿 5, 디자인 템플릿 6' 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경할 수 있다.
본 발명의 일실시예에 따르면, 전자 장치(110)는 사전 지정된 유료 사용자만이 본 발명에 따른 상기 UI 개발 툴을 사용할 수 있도록 하기 위한 구성을 더 포함할 수 있다.
이와 관련해서, 질의 메시지 표시부(113)는 해시 함수 저장부(124), 인증 이벤트 발생부(125), 해시 값 생성부(126), 확인 요청부(127) 및 인증 처리부(128)를 포함할 수 있다.
해시 함수 저장부(124)에는 사전 설정된 사용자 인증 서버(10)와 사전 공유하고 있는, p(p는 자연수임)개의 서로 다른 해시 함수들(상기 p개의 해시 함수들 각각에는, p이하의 자연수로 구성된 서로 다른 고유 번호가 할당되어 있음)이 저장되어 있다.
여기서, 사용자 인증 서버(10)는, 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 사전 지정된, 복수의 유료 사용자들 각각의 비밀번호와 각 유료 사용자에 대해서 사전 발급된 개인키에 대응하는 공개키가 저장된 사용자 데이터베이스를 포함하고 있을 수 있다.
관련해서, 사용자 인증 서버(10)는 하기의 표 4와 같은 사용자 데이터베이스를 포함하고 있을 수 있다.
복수의 유료 사용자들 비밀번호 공개키
사용자 1 비밀번호 1 공개키 1
사용자 2 비밀번호 2 공개키 2
사용자 3 비밀번호 3 공개키 3
사용자 4 비밀번호 4 공개키 4
... ... ...
이러한 상황에서, p를 '6'이라고 하는 경우, 해시 함수 저장부(124)에는 하기의 표 5과 같은 '6'개의 서로 다른 해시 함수들이 저장되어 있을 수 있다.
해시 함수들 고유 번호
해시 함수 1 1
해시 함수 2 2
해시 함수 3 3
해시 함수 4 4
해시 함수 5 5
해시 함수 6 6
인증 이벤트 발생부(125)는 상기 사용자에 의해 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 질의 메시지를 화면 상에 표시하기 전에, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인하기 위한 인증 이벤트를 발생시킨다.
해시 값 생성부(126)는 상기 인증 이벤트가 발생되면, 상기 사용자에 대해 사전 발급된 비밀번호를 입력할 것을 요청하는 내용이 포함된 메시지를 화면 상에 표시한 후, 상기 사용자에 의해 제1 비밀번호가 입력되면, 상기 p개의 해시 함수들 중 어느 하나인 제1 해시 함수를 랜덤하게 선택한 후, 상기 제1 비밀번호를 상기 제1 해시 함수에 입력으로 인가하여 제1 해시 값을 생성한다.
관련해서, 상기 사용자를 '사용자 2'라고 하고, '사용자 2'로부터, '사용자 2'에 대해서 사전 발급된 비밀번호인 '비밀번호 2'가 입력되면, 해시 값 생성부(126)는 상기 표 5와 같은 해시 함수들 중 어느 하나인 제1 해시 함수를 '해시 함수 3'과 같이 랜덤하게 선택한 후, '비밀번호 2'를 '해시 함수 3'에 입력으로 인가하여, 제1 해시 값을 생성할 수 있다.
확인 요청부(127)는 상기 제1 해시 함수에 할당되어 있는 제1 고유 번호를 확인하고, 상기 제1 고유 번호를 상기 사용자에 대해서 사전 발급된 제1 개인키로 전자 서명하여 제1 전자 서명 값을 생성한 후, 상기 사용자 인증 서버로, 상기 제1 전자 서명 값과 상기 제1 해시 값을 전송하면서, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송한다.
관련해서, 전술한 에와 같이, 상기 사용자를 '사용자 2'라고 하고, 상기 제1 해시 함수를 '해시 함수 3'이라고 하는 경우, 확인 요청부(127)는 '해시 함수 3'에 할당되어 있는 고유 번호인 '3'을 '사용자 2'에 대해서 사전 발급된 제1 개인키인 '개인키 2'(여기서, '개인키 2'는 '사용자 2'에 대한 공개키인 '공개키 2'에 대응되는 개인키임)로 전자 서명하여 제1 전자 서명 값을 생성할 수 있다. 그러고 나서, 확인 요청부(127)는 사용자 인증 서버(10)로, 상기 제1 전자 서명 값과 상기 제1 해시 값을 전송하면서, '사용자 2'가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송할 수 있다.
이렇게, 전자 장치(110)로부터 사용자 인증 서버(10)에, 상기 제1 전자 서명 값과 상기 제1 해시 값이 전송되면서, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송되면, 사용자 인증 서버(10)는 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지에 대한 확인 과정을 수행할 수 있다.
구체적으로, 사용자 인증 서버(10)는 상기 사용자 데이터베이스에 저장되어 있는 상기 사용자에 대한 상기 제1 비밀번호와 제1 공개키를 추출하고, 상기 제1 전자 서명 값을 상기 제1 공개키로 복호화함으로써 상기 제1 고유 번호를 복원한 후, 상기 p개의 해시 함수들 중 상기 제1 고유 번호가 할당된 상기 제1 해시 함수에 상기 제1 비밀번호를 입력으로 인가해서 생성한 해시 값을, 상기 제1 해시 값과 비교하여, 양 해시 값이 서로 일치하는 것으로 확인되는 경우, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인할 수 있다.
관련해서, 전술한 예와 같이, 상기 사용자를 '사용자 2'라고 하고, 전자 장치(110)로부터 사용자 인증 서버(10)에 상기 제1 전자 서명 값과 상기 제1 해시 값이 수신되었다고 가정하자.
그러면, 사용자 인증 서버(10)는 상기 표 4와 같은 사용자 데이터베이스로부터 '사용자 2'에 대해서 저장되어 있는 '비밀번호 2'와 '공개키 2'를 추출하고, 상기 제1 전자 서명 값을 '공개키 2'로 복호화함으로써, '3'이라고 하는 고유 번호를 복원할 수 있다.
그 이후, 사용자 인증 서버(10)는 상기 표 5와 같은 해시 함수 저장부(124)로부터 '3'이라는 고유 번호가 할당된 '해시 함수 3'을 추출하고, '해시 함수 3'에 '비밀번호 2'를 입력으로 인가하여 해시 값을 생성한 후, 이 해시 값과 전자 장치(110)로부터 수신한 상기 제1 해시 값과 비교하여, 양 해시 값이 서로 일치하는 것으로 확인되는 경우, '사용자 2'가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인할 수 있고, '사용자 2'가 유료 사용자인 것으로 확인되면, 전자 장치(110)로 '사용자 2'가 유료 사용자인 것으로 확인되었음을 지시하는 응답을 전송할 수 있다.
이렇게, 사용자 인증 서버(10)로부터 전자 장치(110)에, 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인되었음을 지시하는 응답이 수신되면, 인증 처리부(128)는, 상기 사용자로 하여금, 상기 신규 UI에 매칭되는 산업 분류, 직업, 플랫폼을 선택할 것을 질의하는 상기 질의 메시지를 화면 상에 표시할 수 있다.
도 3은 본 발명의 일실시예에 따른 개발 대상 UI의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치의 동작 방법을 도시한 순서도이다.
단계(S310)에서는 사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있는 테이블 저장부를 유지한다.
단계(S320)에서는 상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트(상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미하는 것으로, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있음)가 저장되어 있는 템플릿 저장부를 유지한다.
단계(S330)에서는 상기 전자 장치에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시한다.
단계(S340)에서는 상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 상기 테이블 저장부에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인한다.
단계(S350)에서는 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 상기 템플릿 저장부를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성한다.
이때, 본 발명의 일실시예에 따르면, 단계(S350)에서는 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 제1 UI 컴포넌트에 대한 생성 명령이 인가된 경우, 상기 템플릿 저장부를 참조하여, 상기 제1 UI 컴포넌트에 대응되는 제1 템플릿 세트에 포함된 복수의 제1 디자인 템플릿들을 확인하는 단계, 상기 복수의 제1 디자인 템플릿들 중 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드가 모두 할당되어 있는 적어도 하나의 제2 디자인 템플릿을 추천 템플릿으로 선택하는 단계, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 목록으로 포함된 선택 인터페이스를 구성하여 화면 상에 표시하는 단계 및 상기 선택 인터페이스를 통해, 상기 사용자로부터 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지 중 제3 디자인 템플릿에 대한 미리보기 이미지의 선택 명령이 인가되면, 상기 제3 디자인 템플릿에 따른 디자인이 적용된 상기 제1 UI 컴포넌트를 생성하는 단계를 포함할 수 있다.
이때, 본 발명의 일실시예에 따르면, 상기 전자 장치의 동작 방법은 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 각 디자인 템플릿에 대응되는 사전 설정된 임베딩 벡터(상기 임베딩 벡터는, 디자인 템플릿들 간의 디자인 유사도에 기반하여 사전 설정된 벡터로서, 디자인 템플릿들 간의 디자인이 서로 유사할수록 해당 디자인 템플릿들에 대응되는 임베딩 벡터 간의 벡터 유사도가 큰 값으로 산출되도록 설정되어 있음)가 추가로 할당되어 있을 수 있다.
이때, 상기 선택 인터페이스를 구성하여 화면 상에 표시하는 단계는 상기 적어도 하나의 제2 디자인 템플릿이 추천 템플릿으로 선택되면, 상기 신규 UI의 개발 시작 명령이 인가된 시점부터 상기 제1 UI 컴포넌트의 생성 명령이 인가되기 전의 시점까지, 상기 신규 UI를 위한 UI 컴포넌트가 생성된 이력이 있는지 확인하여, 상기 신규 UI를 위한 UI 컴포넌트로 적어도 하나의 제2 UI 컴포넌트가 생성된 이력이 있는 것으로 확인되면, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿을 확인하는 단계, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿의 임베딩 벡터와 상기 적어도 하나의 제2 디자인 템플릿의 임베딩 벡터를 기초로, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿과의 벡터 유사도에 대한 평균을 산출하는 단계 및 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해 산출된 평균이 큰 순서로, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 사전 설정된 방향으로 나열된 형태의 목록을 갖는 상기 선택 인터페이스를 구성하여 화면 상에 표시하는 단계를 포함할 수 있다.
또한, 본 발명의 일실시예에 따르면, 상기 전자 장치의 동작 방법은 상기 사용자에 의해, 상기 신규 UI를 구성하는 UI 컴포넌트의 생성이 진행된 결과, 적어도 하나의 제3 UI 컴포넌트의 생성이 완료된 상태에서, 상기 사용자로부터 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿에 대한 일괄 자동 변경 요청 명령이 수신되면, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿을 확인한 후, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿을, 각 컴포넌트에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경함으로써, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용된 디자인 템플릿에 대한 일괄 자동 변경 처리를 완료하는 단계를 더 포함할 수 있다.
또한, 본 발명의 일실시예에 따르면, 단계(S330)에서는 사전 설정된 사용자 인증 서버(상기 사용자 인증 서버는, 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 사전 지정된, 복수의 유료 사용자들 각각의 비밀번호와 각 유료 사용자에 대해서 사전 발급된 개인키에 대응하는 공개키가 저장된 사용자 데이터베이스를 포함하고 있음)와 사전 공유하고 있는, p(p는 자연수임)개의 서로 다른 해시 함수들(상기 p개의 해시 함수들 각각에는, p이하의 자연수로 구성된 서로 다른 고유 번호가 할당되어 있음)이 저장되어 있는 해시 함수 저장부를 유지하는 단계, 상기 사용자에 의해 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 질의 메시지를 화면 상에 표시하기 전에, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인하기 위한 인증 이벤트를 발생시키는 단계, 상기 인증 이벤트가 발생되면, 상기 사용자에 대해 사전 발급된 비밀번호를 입력할 것을 요청하는 내용이 포함된 메시지를 화면 상에 표시한 후, 상기 사용자에 의해 제1 비밀번호가 입력되면, 상기 p개의 해시 함수들 중 어느 하나인 제1 해시 함수를 랜덤하게 선택한 후, 상기 제1 비밀번호를 상기 제1 해시 함수에 입력으로 인가하여 제1 해시 값을 생성하는 단계, 상기 제1 해시 함수에 할당되어 있는 제1 고유 번호를 확인하고, 상기 제1 고유 번호를 상기 사용자에 대해서 사전 발급된 제1 개인키로 전자 서명하여 제1 전자 서명 값을 생성한 후, 상기 사용자 인증 서버로, 상기 제1 전자 서명 값과 상기 제1 해시 값을 전송하면서, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송하는 단계 및 상기 사용자 인증 서버가, 상기 확인 요청 명령에 대응하여, 상기 사용자 데이터베이스에 저장되어 있는 상기 사용자에 대한 상기 제1 비밀번호와 제1 공개키를 추출하고, 상기 제1 전자 서명 값을 상기 제1 공개키로 복호화함으로써 상기 제1 고유 번호를 복원한 후, 상기 p개의 해시 함수들 중 상기 제1 고유 번호가 할당된 상기 제1 해시 함수에 상기 제1 비밀번호를 입력으로 인가해서 생성한 해시 값을, 상기 제1 해시 값과 비교한 결과, 양 해시 값이 서로 일치하는 것으로 확인함에 따라, 상기 사용자 인증 서버로부터, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인되었음을 지시하는 응답이 수신되면, 상기 질의 메시지를 화면 상에 표시하는 단계를 포함할 수 있다.
이상, 도 2를 참조하여 본 발명의 일실시예에 따른 전자 장치의 동작 방법에 대해 설명하였다. 여기서, 본 발명의 일실시예에 따른 전자 장치의 동작 방법은 도 1을 이용하여 설명한 전자 장치(110)의 동작에 대한 구성과 대응될 수 있으므로, 이에 대한 보다 상세한 설명은 생략하기로 한다.
본 발명의 일실시예에 따른 전자 장치의 동작 방법은 컴퓨터와의 결합을 통해 실행시키기 위한 저장매체에 저장된 컴퓨터 프로그램으로 구현될 수 있다.
또한, 본 발명의 일실시예에 따른 전자 장치의 동작 방법은 다양한 컴퓨터 수단을 통하여 수행될 수 있는 프로그램 명령 형태로 구현되어 컴퓨터 판독 가능 매체에 기록될 수 있다. 상기 컴퓨터 판독 가능 매체는 프로그램 명령, 데이터 파일, 데이터 구조 등을 단독으로 또는 조합하여 포함할 수 있다. 상기 매체에 기록되는 프로그램 명령은 본 발명을 위하여 특별히 설계되고 구성된 것들이거나 컴퓨터 소프트웨어 당업자에게 공지되어 사용 가능한 것일 수도 있다. 컴퓨터 판독 가능 기록 매체의 예에는 하드 디스크, 플로피 디스크 및 자기 테이프와 같은 자기 매체(magnetic media), CD-ROM, DVD와 같은 광기록 매체(optical media), 플롭티컬 디스크(floptical disk)와 같은 자기-광 매체(magneto-optical media), 및 롬(ROM), 램(RAM), 플래시 메모리 등과 같은 프로그램 명령을 저장하고 수행하도록 특별히 구성된 하드웨어 장치가 포함된다. 프로그램 명령의 예에는 컴파일러에 의해 만들어지는 것과 같은 기계어 코드뿐만 아니라 인터프리터 등을 사용해서 컴퓨터에 의해서 실행될 수 있는 고급 언어 코드를 포함한다.
이상과 같이 본 발명에서는 구체적인 구성 요소 등과 같은 특정 사항들과 한정된 실시예 및 도면에 의해 설명되었으나 이는 본 발명의 보다 전반적인 이해를 돕기 위해서 제공된 것일 뿐, 본 발명은 상기의 실시예에 한정되는 것은 아니며, 본 발명이 속하는 분야에서 통상적인 지식을 가진 자라면 이러한 기재로부터 다양한 수정 및 변형이 가능하다.
따라서, 본 발명의 사상은 설명된 실시예에 국한되어 정해져서는 아니되며, 후술하는 특허청구범위뿐 아니라 이 특허청구범위와 균등하거나 등가적 변형이 있는 모든 것들은 본 발명 사상의 범주에 속한다고 할 것이다.
110: 전자 장치
111: 테이블 저장부 112: 템플릿 저장부
113: 질의 메시지 전송부 114: 코드 확인부
115: 생성부 116: 템플릿 확인부
117: 선택부 118: 목록 표시부
119: 생성 처리부 120: 이력 확인부
121: 평균 산출부 122: 목록 표시 처리부
123: 일괄 변경부 124: 해시 함수 저장부
125: 인증 이벤트 발생부 126: 해시 값 생성부
127: 확인 요청부 128: 인증 처리부
10: 사용자 인증 서버

Claims (12)

  1. 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치에 있어서,
    사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI(User Interface) 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있는 테이블 저장부;
    상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트 - 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미하는 것으로, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있음 - 가 저장되어 있는 템플릿 저장부;
    상기 전자 장치에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시하는 질의 메시지 표시부;
    상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 상기 테이블 저장부에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인하는 코드 확인부; 및
    상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 상기 템플릿 저장부를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성하는 생성부
    를 포함하는 전자 장치.
  2. 제1항에 있어서,
    상기 생성부는
    상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 제1 UI 컴포넌트에 대한 생성 명령이 인가된 경우, 상기 템플릿 저장부를 참조하여, 상기 제1 UI 컴포넌트에 대응되는 제1 템플릿 세트에 포함된 복수의 제1 디자인 템플릿들을 확인하는 템플릿 확인부;
    상기 복수의 제1 디자인 템플릿들 중 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드가 모두 할당되어 있는 적어도 하나의 제2 디자인 템플릿을 추천 템플릿으로 선택하는 선택부;
    상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 목록으로 포함된 선택 인터페이스를 구성하여 화면 상에 표시하는 목록 표시부; 및
    상기 선택 인터페이스를 통해, 상기 사용자로부터 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지 중 제3 디자인 템플릿에 대한 미리보기 이미지의 선택 명령이 인가되면, 상기 제3 디자인 템플릿에 따른 디자인이 적용된 상기 제1 UI 컴포넌트를 생성하는 생성 처리부
    를 포함하는 전자 장치.
  3. 제2항에 있어서,
    상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 각 디자인 템플릿에 대응되는 사전 설정된 임베딩(embedding) 벡터 - 상기 임베딩 벡터는, 디자인 템플릿들 간의 디자인 유사도에 기반하여 사전 설정된 벡터로서, 디자인 템플릿들 간의 디자인이 서로 유사할수록 해당 디자인 템플릿들에 대응되는 임베딩 벡터 간의 벡터 유사도가 큰 값으로 산출되도록 설정되어 있음 - 가 추가로 할당되어 있고,
    상기 목록 표시부는
    상기 적어도 하나의 제2 디자인 템플릿이 추천 템플릿으로 선택되면, 상기 신규 UI의 개발 시작 명령이 인가된 시점부터 상기 제1 UI 컴포넌트의 생성 명령이 인가되기 전의 시점까지, 상기 신규 UI를 위한 UI 컴포넌트가 생성된 이력이 있는지 확인하여, 상기 신규 UI를 위한 UI 컴포넌트로 적어도 하나의 제2 UI 컴포넌트가 생성된 이력이 있는 것으로 확인되면, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿을 확인하는 이력 확인부;
    상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿의 임베딩 벡터와 상기 적어도 하나의 제2 디자인 템플릿의 임베딩 벡터를 기초로, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿과의 벡터 유사도에 대한 평균을 산출하는 평균 산출부; 및
    상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해 산출된 평균이 큰 순서로, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 사전 설정된 방향으로 나열된 형태의 목록을 갖는 상기 선택 인터페이스를 구성하여 화면 상에 표시하는 목록 표시 처리부
    를 포함하는 전자 장치.
  4. 제2항에 있어서,
    상기 사용자에 의해, 상기 신규 UI를 구성하는 UI 컴포넌트의 생성이 진행된 결과, 적어도 하나의 제3 UI 컴포넌트의 생성이 완료된 상태에서, 상기 사용자로부터 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿에 대한 일괄 자동 변경 요청 명령이 수신되면, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿을 확인한 후, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿을, 각 컴포넌트에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경함으로써, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용된 디자인 템플릿에 대한 일괄 자동 변경 처리를 완료하는 일괄 변경부
    를 더 포함하는 전자 장치.
  5. 제1항에 있어서,
    상기 질의 메시지 표시부는
    사전 설정된 사용자 인증 서버 - 상기 사용자 인증 서버는, 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 사전 지정된, 복수의 유료 사용자들 각각의 비밀번호와 각 유료 사용자에 대해서 사전 발급된 개인키에 대응하는 공개키가 저장된 사용자 데이터베이스를 포함하고 있음 - 와 사전 공유하고 있는, p(p는 자연수임)개의 서로 다른 해시 함수들 - 상기 p개의 해시 함수들 각각에는, p이하의 자연수로 구성된 서로 다른 고유 번호가 할당되어 있음 - 이 저장되어 있는 해시 함수 저장부;
    상기 사용자에 의해 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 질의 메시지를 화면 상에 표시하기 전에, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인하기 위한 인증 이벤트를 발생시키는 인증 이벤트 발생부;
    상기 인증 이벤트가 발생되면, 상기 사용자에 대해 사전 발급된 비밀번호를 입력할 것을 요청하는 내용이 포함된 메시지를 화면 상에 표시한 후, 상기 사용자에 의해 제1 비밀번호가 입력되면, 상기 p개의 해시 함수들 중 어느 하나인 제1 해시 함수를 랜덤하게 선택한 후, 상기 제1 비밀번호를 상기 제1 해시 함수에 입력으로 인가하여 제1 해시 값을 생성하는 해시 값 생성부;
    상기 제1 해시 함수에 할당되어 있는 제1 고유 번호를 확인하고, 상기 제1 고유 번호를 상기 사용자에 대해서 사전 발급된 제1 개인키로 전자 서명하여 제1 전자 서명 값을 생성한 후, 상기 사용자 인증 서버로, 상기 제1 전자 서명 값과 상기 제1 해시 값을 전송하면서, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송하는 확인 요청부; 및
    상기 사용자 인증 서버가, 상기 확인 요청 명령에 대응하여, 상기 사용자 데이터베이스에 저장되어 있는 상기 사용자에 대한 상기 제1 비밀번호와 제1 공개키를 추출하고, 상기 제1 전자 서명 값을 상기 제1 공개키로 복호화함으로써 상기 제1 고유 번호를 복원한 후, 상기 p개의 해시 함수들 중 상기 제1 고유 번호가 할당된 상기 제1 해시 함수에 상기 제1 비밀번호를 입력으로 인가해서 생성한 해시 값을, 상기 제1 해시 값과 비교한 결과, 양 해시 값이 서로 일치하는 것으로 확인함에 따라, 상기 사용자 인증 서버로부터, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인되었음을 지시하는 응답이 수신되면, 상기 질의 메시지를 화면 상에 표시하는 인증 처리부
    를 포함하는 전자 장치.
  6. 개발 대상 UI(User Interface)의 특성에 기초하여 UI 컴포넌트에 대한 템플릿을 추천할 수 있는 UI 개발 툴이 탑재된 전자 장치의 동작 방법에 있어서,
    사전 지정된 복수의 산업 분류들 각각에 대응되는 산업 분류 코드가 기록된 제1 테이블, 사전 지정된 복수의 직업들에 각각에 대응되는 직업 코드가 기록된 제2 테이블, 및 UI(User Interface) 개발의 대상이 되는 타겟 제품과 관련된 사전 지정된 복수의 플랫폼들 각각에 대응되는 플랫폼 코드가 기록된 제3 테이블이 저장되어 있는 테이블 저장부를 유지하는 단계;
    상기 UI 개발 툴에서 지원되는 것으로 사전 설정된 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트 - 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트는, 각 UI 컴포넌트를 표현하기 위한 사전 제작된 복수의 디자인 템플릿들로 구성된 세트를 의미하는 것으로, 상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 각각으로부터, 각 디자인 템플릿에 매칭되는 것으로 사전 지정된, 적어도 하나의 산업 분류에 대한 산업 분류 코드, 적어도 하나의 직업에 대한 직업 코드 및 적어도 하나의 플랫폼에 대한 플랫폼 코드가 사전 할당되어 있음 - 가 저장되어 있는 템플릿 저장부를 유지하는 단계;
    상기 전자 장치에서 상기 UI 개발 툴이 실행된 이후, 신규 UI를 개발하고자 하는 사용자에 의해, 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 복수의 산업 분류들, 상기 복수의 직업들 및 상기 복수의 플랫폼들 중에서, 상기 신규 UI에 매칭되는 산업 분류, 상기 신규 UI에 매칭되는 타겟 유저의 직업 및 상기 신규 UI에 매칭되는 타겟 제품의 플랫폼을 선택할 것을 질의하는 질의 메시지를 화면 상에 표시하는 단계;
    상기 사용자로부터, 상기 질의 메시지에 대한 응답으로, 상기 신규 UI에 매칭되는 제1 산업 분류, 상기 신규 UI에 매칭되는 제1 직업 및 상기 신규 UI에 매칭되는 제1 플랫폼에 대한 선택 명령이 수신되면, 상기 테이블 저장부에 저장된 상기 제1 테이블, 상기 제2 테이블 및 상기 제3 테이블을 참조하여, 상기 제1 산업 분류에 대응되는 제1 산업 분류 코드, 상기 제1 직업에 대응되는 제1 직업 코드 및 상기 제1 플랫폼에 대응되는 제1 플랫폼 코드를 확인하는 단계; 및
    상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드의 확인이 완료된 이후에, 상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 어느 하나의 UI 컴포넌트에 대한 생성 명령이 인가될 때마다, 상기 템플릿 저장부를 참조하여, 상기 어느 하나의 UI 컴포넌트에 대응되는 템플릿 세트에 포함된 복수의 디자인 템플릿들 중, 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드를 기초로 적어도 하나의 디자인 템플릿을 추천 템플릿으로 선택하여 화면 상에 목록으로 표시한 후, 상기 사용자에 의해 어느 하나의 디자인 템플릿에 대한 선택 명령이 인가되면, 상기 어느 하나의 디자인 템플릿이 적용된 UI 컴포넌트를 생성하는 단계
    를 포함하는 전자 장치의 동작 방법.
  7. 제6항에 있어서,
    상기 생성하는 단계는
    상기 사용자에 의해 상기 복수의 UI 컴포넌트들 중 제1 UI 컴포넌트에 대한 생성 명령이 인가된 경우, 상기 템플릿 저장부를 참조하여, 상기 제1 UI 컴포넌트에 대응되는 제1 템플릿 세트에 포함된 복수의 제1 디자인 템플릿들을 확인하는 단계;
    상기 복수의 제1 디자인 템플릿들 중 상기 제1 산업 분류 코드, 상기 제1 직업 코드 및 상기 제1 플랫폼 코드가 모두 할당되어 있는 적어도 하나의 제2 디자인 템플릿을 추천 템플릿으로 선택하는 단계;
    상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 목록으로 포함된 선택 인터페이스를 구성하여 화면 상에 표시하는 단계; 및
    상기 선택 인터페이스를 통해, 상기 사용자로부터 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지 중 제3 디자인 템플릿에 대한 미리보기 이미지의 선택 명령이 인가되면, 상기 제3 디자인 템플릿에 따른 디자인이 적용된 상기 제1 UI 컴포넌트를 생성하는 단계
    를 포함하는 전자 장치의 동작 방법.
  8. 제7항에 있어서,
    상기 복수의 UI 컴포넌트들 각각에 대한 템플릿 세트에 포함된 복수의 디자인 템플릿들에는, 각 디자인 템플릿에 대응되는 사전 설정된 임베딩(embedding) 벡터 - 상기 임베딩 벡터는, 디자인 템플릿들 간의 디자인 유사도에 기반하여 사전 설정된 벡터로서, 디자인 템플릿들 간의 디자인이 서로 유사할수록 해당 디자인 템플릿들에 대응되는 임베딩 벡터 간의 벡터 유사도가 큰 값으로 산출되도록 설정되어 있음 - 가 추가로 할당되어 있고,
    상기 선택 인터페이스를 구성하여 화면 상에 표시하는 단계는
    상기 적어도 하나의 제2 디자인 템플릿이 추천 템플릿으로 선택되면, 상기 신규 UI의 개발 시작 명령이 인가된 시점부터 상기 제1 UI 컴포넌트의 생성 명령이 인가되기 전의 시점까지, 상기 신규 UI를 위한 UI 컴포넌트가 생성된 이력이 있는지 확인하여, 상기 신규 UI를 위한 UI 컴포넌트로 적어도 하나의 제2 UI 컴포넌트가 생성된 이력이 있는 것으로 확인되면, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿을 확인하는 단계;
    상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿의 임베딩 벡터와 상기 적어도 하나의 제2 디자인 템플릿의 임베딩 벡터를 기초로, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해, 상기 적어도 하나의 제2 UI 컴포넌트 각각에 적용된 디자인 템플릿과의 벡터 유사도에 대한 평균을 산출하는 단계; 및
    상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지를 생성한 후, 상기 적어도 하나의 제2 디자인 템플릿 각각에 대해 산출된 평균이 큰 순서로, 상기 적어도 하나의 제2 디자인 템플릿에 대한 미리보기 이미지가 사전 설정된 방향으로 나열된 형태의 목록을 갖는 상기 선택 인터페이스를 구성하여 화면 상에 표시하는 단계
    를 포함하는 전자 장치의 동작 방법.
  9. 제7항에 있어서,
    상기 사용자에 의해, 상기 신규 UI를 구성하는 UI 컴포넌트의 생성이 진행된 결과, 적어도 하나의 제3 UI 컴포넌트의 생성이 완료된 상태에서, 상기 사용자로부터 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿에 대한 일괄 자동 변경 요청 명령이 수신되면, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿을 확인한 후, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용되어 있는 디자인 템플릿을, 각 컴포넌트에 대해서 추천 템플릿으로 선택되었던 적어도 하나의 디자인 템플릿 중 어느 하나의 디자인 템플릿으로 랜덤하게 변경함으로써, 상기 적어도 하나의 제3 UI 컴포넌트 각각에 적용된 디자인 템플릿에 대한 일괄 자동 변경 처리를 완료하는 단계
    를 더 포함하는 전자 장치의 동작 방법.
  10. 제6항에 있어서,
    상기 질의 메시지를 화면 상에 표시하는 단계는
    사전 설정된 사용자 인증 서버 - 상기 사용자 인증 서버는, 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 사전 지정된, 복수의 유료 사용자들 각각의 비밀번호와 각 유료 사용자에 대해서 사전 발급된 개인키에 대응하는 공개키가 저장된 사용자 데이터베이스를 포함하고 있음 - 와 사전 공유하고 있는, p(p는 자연수임)개의 서로 다른 해시 함수들 - 상기 p개의 해시 함수들 각각에는, p이하의 자연수로 구성된 서로 다른 고유 번호가 할당되어 있음 - 이 저장되어 있는 해시 함수 저장부를 유지하는 단계;
    상기 사용자에 의해 상기 신규 UI의 개발 시작 명령이 인가되면, 상기 질의 메시지를 화면 상에 표시하기 전에, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인하기 위한 인증 이벤트를 발생시키는 단계;
    상기 인증 이벤트가 발생되면, 상기 사용자에 대해 사전 발급된 비밀번호를 입력할 것을 요청하는 내용이 포함된 메시지를 화면 상에 표시한 후, 상기 사용자에 의해 제1 비밀번호가 입력되면, 상기 p개의 해시 함수들 중 어느 하나인 제1 해시 함수를 랜덤하게 선택한 후, 상기 제1 비밀번호를 상기 제1 해시 함수에 입력으로 인가하여 제1 해시 값을 생성하는 단계;
    상기 제1 해시 함수에 할당되어 있는 제1 고유 번호를 확인하고, 상기 제1 고유 번호를 상기 사용자에 대해서 사전 발급된 제1 개인키로 전자 서명하여 제1 전자 서명 값을 생성한 후, 상기 사용자 인증 서버로, 상기 제1 전자 서명 값과 상기 제1 해시 값을 전송하면서, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인지 여부를 확인할 것을 요청하는 확인 요청 명령을 전송하는 단계; 및
    상기 사용자 인증 서버가, 상기 확인 요청 명령에 대응하여, 상기 사용자 데이터베이스에 저장되어 있는 상기 사용자에 대한 상기 제1 비밀번호와 제1 공개키를 추출하고, 상기 제1 전자 서명 값을 상기 제1 공개키로 복호화함으로써 상기 제1 고유 번호를 복원한 후, 상기 p개의 해시 함수들 중 상기 제1 고유 번호가 할당된 상기 제1 해시 함수에 상기 제1 비밀번호를 입력으로 인가해서 생성한 해시 값을, 상기 제1 해시 값과 비교한 결과, 양 해시 값이 서로 일치하는 것으로 확인함에 따라, 상기 사용자 인증 서버로부터, 상기 사용자가 상기 UI 개발 툴을 이용할 수 있는 유료 사용자인 것으로 확인되었음을 지시하는 응답이 수신되면, 상기 질의 메시지를 화면 상에 표시하는 단계
    를 포함하는 전자 장치의 동작 방법.
  11. 제6항 내지 제10항 중 어느 한 항의 방법을 컴퓨터와의 결합을 통해 실행시키기 위한 컴퓨터 프로그램을 기록한 컴퓨터 판독 가능 기록 매체.
  12. 제6항 내지 제10항 중 어느 한 항의 방법을 컴퓨터와의 결합을 통해 실행시키기 위한 저장매체에 저장된 컴퓨터 프로그램.
KR1020220110537A 2022-09-01 2022-09-01 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법 KR20240031623A (ko)

Priority Applications (3)

Application Number Priority Date Filing Date Title
KR1020220110537A KR20240031623A (ko) 2022-09-01 2022-09-01 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법
US18/221,885 US20240078095A1 (en) 2022-09-01 2023-07-14 Electronic apparatus equipped with a ui development tool capable of recommending a template for a ui component based on the characteristics of the ui to be developed and the operating method thereof
JP2023118983A JP2024035094A (ja) 2022-09-01 2023-07-21 開発対象ｕｉの特性に基づいてｕｉコンポーネントに関するテンプレートを推奨できるｕｉ開発ツールが搭載された電子装置およびその動作方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR1020220110537A KR20240031623A (ko) 2022-09-01 2022-09-01 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법

Publications (1)

Publication Number Publication Date
KR20240031623A true KR20240031623A (ko) 2024-03-08

Family

ID=90060586

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020220110537A KR20240031623A (ko) 2022-09-01 2022-09-01 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법

Country Status (3)

Country Link
US (1) US20240078095A1 (ko)
JP (1) JP2024035094A (ko)
KR (1) KR20240031623A (ko)

Also Published As

Publication number Publication date
JP2024035094A (ja) 2024-03-13
US20240078095A1 (en) 2024-03-07

Similar Documents

Publication Publication Date Title
CN109076072B (zh) Web服务图片密码
CN106663175A (zh) 在保护敏感信息的同时外包文档传输任务
CN103930896A (zh) 间接认证
CN103003783A (zh) 功能扩展装置、功能扩展方法、功能扩展程序以及集成电路
CN107995158A (zh) 认证装置、认证方法、电子设备以及记录介质
KR102253577B1 (ko) 사용자 인증 기반의 가상 데스크톱 환경의 제공이 가능한 컴퓨팅 장치
KR20240031623A (ko) 개발 대상 ui의 특성에 기초하여 ui 컴포넌트에 대한 템플릿을 추천할 수 있는 ui 개발 툴이 탑재된 전자 장치 및 그 동작 방법
KR20200050164A (ko) 허가되지 않은 글꼴이 사용된 문서를 수정하여 웹 페이지 상에 게시하는 웹 페이지 관리 서비스 서버 및 그 동작 방법
KR102309558B1 (ko) 날씨와 기상 데이터에 기초한 학습 모델을 통해 커피 메뉴의 추천을 수행하는 커피 메뉴 추천 장치 및 그 동작 방법
JP2022022244A (ja) 情報処理装置、管理データの生成方法及び管理データ
KR102683141B1 (ko) Ui 설계안에 대한 이미지 분석을 통해 ui 컴포넌트 자동 생성 기능을 제공할 수 있는 ui 개발 툴이 탑재된 전자 단말 장치 및 그 동작 방법
CN116917890A (zh) 使用原始和修改的图像的用户认证
KR102300439B1 (ko) 문서에 적용되어 있는 글꼴의 허가 여부를 확인하기 위한 글꼴 확인 서버와 그 동작 방법
CN114138250A (zh) 系统用例的步骤生成方法、装置、设备及存储介质
US20240231774A9 (en) Ui component configuration system apparatus that provides a ui component configuration service that can transform and configure ui components of an application based on device characteristics and the operating method thereof
US12001820B2 (en) Electronic apparatus capable of applying the design of a UI component based on the device's usage environment and the operating method thereof
US12038957B1 (en) Apparatus and method for an online service provider
US11443030B2 (en) Method to encode and decode otherwise unrecorded private credentials, terms, phrases, or sentences
KR102627431B1 (ko) 설문 결과를 통해 학습자에게 맞춤형 학습 콘텐츠를 추천하는 학습 콘텐츠 추천 서버 및 그 동작 방법
KR102518509B1 (ko) 기획서를 작성하고자 하는 사용자의 기획서 작성을 보조하기 위한 기획 서비스 플랫폼 서버 및 그 동작 방법
JP6164954B2 (ja) 認証サーバ、認証方法、およびプログラム
KR102675877B1 (ko) 진본 문서임을 검증하기 위한 2차원 코드가 삽입된 전자 문서를 제공할 수 있는 문서 제공 서버 및 그 동작 방법
KR102602213B1 (ko) 2차원 코드 인식과 생체 정보 인증을 기반으로 상품에 대한 정품 인증 및 부가 정보 제공을 수행하는 전자 단말 장치 및 그 동작 방법
KR102442506B1 (ko) 문서 작성 프로그램의 편집 액션에 대한 단축키를 추천하는 전자 장치 및 그 동작 방법
KR102574299B1 (ko) 2차원 코드를 기반으로 자격증에 대한 진위여부 검증을 수행하는 자격증 검증 서버 및 그 동작 방법