KR101588592B1 - 객체관계 매핑 기반 하이브리드 앱 개발 시스템 및 그 방법 - Google Patents

Abstract

본 발명은 모바일 앱 프로그래밍 프로세스를 자동 완성하고, 코드를 자동으로 생성한 후, 자동으로 하이브리드 앱으로 변환하는 것에 의해 하이브리드 앱을 제작할 수 있도록 하는 객체관계 매핑 기반 하이브리드 앱 개발 시스템 및 그 방법에 관한 것으로,
상기 하이브리드 앱 개발 시스템은, 화면 구성을 위한 단위 유닛을 생성하는 유닛 빌더부; 상기 사용자 인터페이스를 패널 단위로 분리하고, 상기 단위 유닛을 상기 패널에 등록하여 프론트-엔드(front-end)를 완성한 후, 각각의 단위 유닛에 프로세스를 부여하고 코드를 생성한 후, 하이브리드 앱으로 변화하는 하이브리드 앱 생성부; 및 상기 단위 유닛을 상기 유닛 빌더부로부터 제공받아 상기 하이브리드 앱 생성부에 제공하고, 상기 단위 유닛을 상기 사용자 인터페이스 빌더부에서 생성, 수정 또는 삭제가 가능하도록 관리하는 백오피스 (backoffice) 서비스부;를 포함하여 구성되어,
플랫폼에 독립적으로 구동될 수 있는 하이브리드 앱을 용이하게 제작할 수 있도록 한다.

Description

객체관계 매핑 기반 하이브리드 앱 개발 시스템 및 그 방법{HYBRID APPLICATION DEVELOPMENT SYSTEM BASED ON OBJECT RELATIONAL MAPPING AND THE METHOD THEREOF}

본 발명은 객체관계 매핑 방식을 적용한 앱 저작도구에 관한 것으로, 더욱 상세하게는, 기업 내 IT 서비스 확장을 위해 모바일 채널 기반 정보서비스 구축을 하고자 할 때, 시스템 분석과 설계 단계에서 작성된 디자인 산출물을 가지고 하이브리드 앱 프로그래밍 프로세스를 자동 완성하고, 코드를 자동으로 생성한 후, 자동으로 하이브리드 앱으로 변환하는 것에 의해 하이브리드 앱을 자동으로 작성할 수 있도록 하는 시스템통합(SI) 프로젝트용 통합개발환경(IDE: Integrated Development Environment) 솔루션인 객체관리 매핑 기반 하이브리드 앱 개발 시스템 및 그 방법에 관한 것이다.

최근의 소프트웨어 아키텍처 설계 트랜드는 모델 기반 설계 방식을 기본으로 분석모델을 설계모델과 연결하는 아키텍처(Architecture)로 정의하는 방식인 도메인 주도 설계(DDD: Domain Driven Design)가 대세이다. DDD를 기반에 둔 설계 시 도메인 객체 관계(DOR: Domain Object Relation)는 설계 도메인 모델과 서비스 객체의 관계를 정의하는 방식이라고 개념화된다.

현재 인터넷 시장은 기존 유선 인터넷 시장에 스마트폰 보급으로 인해 성장세가 급증하는 무선인터넷 시장까지 포함한다. 모바일 앱 서비스로 대변되는 무선인터넷 시장은 애플의 iOS, 구글의 안드로이드, 블랙베리, 노키아의 심비안 및 메모(Maemo), 윈도우 모바일과 윈도우 폰7까지 서로 다른 OS를 가진 기기들이 사용되며, 각각의 OS에 맞는 애플리케이션(Native App)을 작성하기 위해서는 전혀 다른 언어/플랫폼들을 이해해야 하는 문제점을 가진다. 대표적으로 애플 iOS의 경우 오브젝티브-C(Objective-C)와 코코아 터치(Cocoa Touch)를, 안드로이드는 자바와 안드로이드 프레임워크들에 대한 학습을 필요로 한다.

또한, 모바일 기반의 서비스를 제공하는 회사들은 모든 플랫폼용 네이티브 앱(Native App)을 만들기에는 투자비용이 너무 크게 드는 문제점을 가진다. 그리하여 아이폰이 국내 출시된 후 많은 업체들이 아이폰용 앱을 앞 다투어 출시했다. 다음 해에 들어서는 다양한 안드로이드 폰들이 출시되면서 안드로이드 용 앱까지 추가 개발을 진행하고 있다. 자원이 충분한 회사라면 앱을 각각의 플랫폼용으로 만드는 게 가능하겠지만, 그렇지 못한 스타트업 초기 벤처기업들이나, 중소기업들에서는 어려운 선택일 수밖에 없다. 국내의 경우 핸드폰 시장 점유율 1위인 SKT가 안드로이드에만 집중하고 있어 아이폰/안드로이드 운영체제를 동시에 지원해야 하는 상황에 직면하게 된다.

이와 같이 많은 인터넷 업체들에게도 크로스 플랫폼(Cross Platform) 적용은 어려운 상황이 된다. 특히 SI 프로젝트 개발 작업을 수행하는 중소기업 입장에서는 부족한 인력 수급과 개발단가로 인한 문제에 직면하게 된다. 2011년 소프트웨어 산업연감 보고서를 살펴보면, 국내 소프트웨어 시장의 주류는 SI/SM 중심이라고 할 수 있다. 하지만, 비정상적 갑/을 문화와 영세한 기업 규모는 소프트웨어 개발자 및 기업의 미래를 낙관하기 힘들게 한다.

반면, 국내 소프트웨어 개발 생산성을 높일 수 있는 사회적 교육시스템은 전무한 실정이다. 개발자들이 자생적으로 오픈소스를 공부하거나, 커뮤니티 활동을 통해 진화를 모색하고 있으나, 그 힘은 아직 매우 부족 하다. 2011년 11,510 개의 공공프로젝트가 발주되었는데, 모두 기간이 1년이라고 가정한다면 프로젝트 당 평균 14명 정도가 일을 했을 정도로 참여 개발자 수가 적다. 3D 직종으로 인식되고 있고 대박 성공 신화의 기회가 점점 줄어드는 만큼, 앞으로 개발자 유입이 줄어 인력의 수급이 어렵게 되고, 이에 따라 개발품질도 점점 떨어지는 것은 피할 수 없는 문제가 되고 있다.

따라서 본 발명은 상술한 종래기술의 문제점을 해결하기 위한 것으로, 기업 내 IT 서비스 확장을 위해 모바일 채널 기반 정보서비스 구축을 하고자 할 때 시스템 분석과 설계 단계에서 작성된 디자인 산출물을 가지고 별도의 코딩작업 없이 하이브리드 앱 프로그래밍 프로세스를 자동 완성할 수 있도록 하는 시스템통합(SI) 프로젝트용 통합개발환경(IDE: Integrated Development Environment) 솔루션인 객체관리매핑(ORM) 기반 하이브리드 앱 개발 시스템 및 그 방법을 제공하는 것을 목적으로 한다.

또한, 본 발명은 기업 내에 기 구축된 모바일 채널 기반 정보서비스에 프론트 엔드(Front End) 만을 필요에 맞게 변경할 경우, 일반적인 구성요소로 단기간에 업그레이드 산출물을 완성할 수 있도록 하는 객체관리매핑 기반 하이브리드 앱 개발 시스템 및 그 방법을 제공하는 것을 다른 목적으로 한다.

또한 본 발명은 고객사에게 빠른 개발 방식과 자원 투자 최소화를 위한 비용 절감 및 목표하는 개발 산출물과 가장 일치되게 작업할 수 있도록 하여, 소프트웨어 개발공급을 주 업무로 하는 중소기업의 경우 업무 리스크에 따르는 기업 운영 위험요소를 획기적으로 감소시킬 수 있도록 하는 객체관리매핑 기반 하이브리드 앱 개발 시스템 및 그 방법을 제공하는 것을 또 다른 목적으로 한다.

상술한 목적을 달성하기 위한 본 발명의 객체관리 매핑 기반 하이브리드 앱 개발 시스템은, 화면 구성을 위한 단위 유닛을 생성하는 유닛 빌더부; 상기 단위 유닛을 상기 유닛 빌더부로부터 제공받아 상기 하이브리드 앱 생성부에 제공하고, 상기 단위 유닛을 상기 사용자 인터페이스 빌더부에서 생성, 수정 또는 삭제가 가능하도록 관리하는 백오피스 (backoffice) 서비스부; 및 상기 사용자 인터페이스를 패널 단위로 분리하고, 상기 단위 유닛을 상기 패널에 등록하여 프론트-엔드(front-end)를 완성한 후, 각각의 단위 유닛에 프로세스를 부여하고 코드를 생성한 후, 하이브리드 앱으로 변화하는 하이브리드 앱 생성부;를 포함하여 구성되는 것을 특징으로 한다.

상기 구성 중 상기 유닛 빌더부와 상기 하이브리드 앱 생성부는 공통된 통합된 환경을 제공하기 위해 클라이언트 프레임워크(client framework)을 기반으로 하는 클라이언트 시스템으로 구성될 수 있다.

상기 클라이언트 프레임워크는, 하이브리드 클라이언트-서버(HCS) 프레임워크를 포함할 수 있다.

상기 유닛은 상기 유닛 빌더부에서 정의된 디자인 가이드를 준수하여 생산되고, 상기 백오디스 서비스부로 전송되어 사용자 인터페이스 빌더부에서 사용되도록 리소스로 관리될 수 있다.

상기 하이브리드 앱 생성부는, 사용자 인터페이스 화면을 패널 단위로 분리하고, 상기 단위 유닛을 상기 패널에 등록하여 프론트-엔드 (front-end)를 완성하는 사용자 인터페이스(UI) 빌더부; 상기 완성된 프론트-엔드의 각 단위 유닛들에 사용자 이벤트에 대한 액션을 정의하는 프로세스 빌더부; 상기 프로세스 빌더부의 정의에 따라 코드를 생성하는 코드 생성부; 및 상기 생성된 코드를 포함하는 앱을 하이브리드 앱으로 변환하는 하이브리드 앱 변환부;를 포함하여 구성되는 것을 특징으로 한다.

상기 사용자 인터페이스 빌더부는, 화면 기획을 기반으로 화면의 레이아웃(layout)을 설정하고, 설정된 레이아웃을 기반으로 레벨-깊이(level-depth)를 정한 후 확장된 레이아웃 패널(layout panel)을 구성하며, 구성된 레이아웃 패널에 유닛을 적용시키고, 적용시킨 유닛의 세부 조정을 행할 수 있도록 구성되는 것을 특징으로 한다.

상기 프로세스 빌더부는, 사용자 이벤트에 대한 액션을 정의하기 위해, 사용자 이벤트에 대한 액션에 관련된 로직을 플로우차트 다이어그램으로 구성하고, 다이어그램의 레벨-깊이 (level-depth) 를 조정하고, 로직을 CRUD (create, read, update, delete) 단위로 세분화한 모델을 생성하고, 모델을 사용자 인터페이스 빌더부에서 생성한 사용자 인터페이스 화면의 특정 유닛에 매핑하는 코드를 생성하도록 구성되는 것을 특징으로 한다.

상기 코드 생성부는, 상기 프로세스 빌더부에서 상기 사용자 인터페이스 화면의 특정 유닛에 매핑된 코드를 추출한 후, 상기 프로세스 절차에 따른 코드를 조합하여, 전체 사용자 인터페이스 화면을 생성하는 코드를 생성하도록 구성되는 것을 특징으로 한다.

상기 하이브리드 앱 변환부는, 상기 코드생성부에서 생성된 사용자 인터페이스 화면의 코드를 하이브리드 앱 코드로 변환하도록 구성되는 것을 특징으로 한다.

상기 백오피스 서비스부는, 상기 단위 유닛을 사이트, 사용자 및 도메인 별로 각각 관리하도록 구성되는 서버 시스템으로 구성될 수 있다.

상기 백오피스 서비스부는, 상기 유닛이 유닛 빌더부에서 등록된 것인지 여부를 확인한 후, 유닛이 등록된 경우에만 관리를 행하도록 구성될 수도 있다.

상술한 본 발명의 객체관계 매핑은, 프로세스를 대상으로 하는 관계 프로세스 모델링(relational process modeling)이 적용되는 것을 특징으로 한다.

상술한 목적을 달성하기 위한 본 발명의 객체관리 매핑 기반 하이브리드 앱 개발 방법은, 하이브리드 앱의 화면 인터페이스의 각각의 단위 유닛들을 생성하는 유닛빌더과정; 상기 단위 유닛들을 상기 유닛 빌더부로부터 제공받아 하이브리드 앱 생성부에 제공하고, 상기 단위 유닛을 사용자 인터페이스 빌더부에서 생성, 수정 또는 삭제가 가능하도록 관리하는 백오피스 서비스과정; 및 상기 단위 유닛들을 사용자 인터페이스 화면의 분할된 패널들에 할당한 후, 액션에 대한 기능을 프로세스로 정의한 후 코드를 생성하고, 생성된 코드를 모바일 앱 코드로 변환하여 하이브리드 앱을 생성하는 하이브리드 앱 생성과정;을 포함하여 이루어지는 것을 특징으로 한다.

상기 하이브리드 앱 생성과정은, 상기 단위 유닛들을 제공받아 사용자 인터페이스 화면의 각 분할된 패널에 할당하여 사용자 인터페이스를 생성하는 사용자 인터페이스 빌더과정; 상기 각각의 패널에 분할된 각각의 유닛들에 액션에 대한 기능을 프로세스로 정의하여 코드를 생성하는 프로세스 빌더과정; 상기 프로세서 빌더 과정에 의해 생성된 사용자 인터페이스 화면의 코드를 조합하여 상기 사용자 인터페이스 화면을 나타내는 웹 코드를 생성하는 코드생성과정; 및 상기 웹 코드를 하이브리드 앱 코드로 변환하는 하이브리드 앱 변환과정;을 포함하여 이루어지는 것을 특징으로 한다.

상술한 구성의 본 발명은, 시스템통합(SI) 프로젝트용 통합개발환경(IDE: Integrated Development Environment) 솔루션인 객체관리매핑 기반 모바일 앱 개발 시스템 및 그 방법을 제공하는 것에 의해 기업 내 IT 서비스 확장을 위해 모바일 채널 기반 정보서비스 구축을 하고자 할 때 시스템 분석과 설계 단계에서 작성된 디자인 산출물을 가지고 별도의 코딩작업 없이 모바일 앱 프로그래밍 프로세스를 자동 완성할 수 있도록 하는 효과를 제공한다.

또한, 본 발명은 기업 내에 기 구축된 모바일 채널 기반 정보서비스에 프론트 엔드(Front End) 만을 필요에 맞게 변경할 경우, 일반적인 구성요소로 단기간에 업그레이드 산출물을 완성할 수 있도록 하는 효과를 제공한다.

또한 본 발명은 고객사에게 빠른 개발 방식과 자원 투자 최소화를 위한 비용 절감 및 목표하는 개발 산출물과 가장 일치되게 작업할 수 있도록 하여, 소프트웨어 개발공급을 주 업무로 하는 중소기업의 경우 업무 리스크에 따르는 기업 운영 위험요소를 획기적으로 감소시킬 수 있도록 하는 효과를 제공한다.

또한, 본 발명은 퍼블리싱 (publishing) 공정을 단축함으로써, 초급 개발자를 적극 활용가능하고, 프로젝트 비용을 절감할 수 있고, 퍼블리셔의 작업 딜레이 문제를 해결할 수 있는 효과가 있다. 또한, 서버-측 프레임워크 개발 방식을 개선하고, 프론트 뷰 프로세스 (front view process) 및 로직 처리를 개선할 수 있는 효과를 제공한다.

도 1은 본 발명의 일 실시예에 따르는 객체관리 매핑 기반 모바일 앱 개발시스템의 구성을 나타내는 도면.
도 2는 본 발명에 따른 전체 아키텍처에 관한 상세 구성도.
도 3은 본 발명에 따른 클라이언트 프레임워크의 동작 방식을 나타내기 위한 도면.
도 4는 본 발명에 따른 클라이언트 프레임워크를 구성하는 소프트웨어 아키텍처에 관한 상세 구성도.
도 5는 본 발명에 따른 유닛 빌더의 동작 방식을 나타내기 위한 도면.
도 6은 본 발명에 따른 사용자 인터페이스 빌더부의 동작 방식을 나타내기 위한 도면.
도 7은 본 발명에 따른 백오피스 서비스부의 개념을 나타내기 위한 도면.
도 8은 본 발명에 따른 백오피스 서비스부를 구성하는 소프트웨어 아키텍처에 관한 상세 구성도.
도 9는 본 발명에 따른 프로세스 빌더부의 개념을 나타내기 위한 도면.
도 10은 본 발명에 따른 프로세스 빌더부를 이용한 가상 동작 화면을 나타내기 위한 도면.
도 11은 본 발명의 객체관리 매핑 기반 모바일 앱 개발 방법의 처리과정을 나타내는 순서도.

하기에서 본 발명을 설명함에 있어서, 관련된 공지 기능 또는 구성에 대한 구체적인 설명이 본 발명의 요지를 불필요하게 흐릴 수 있다고 판단되는 경우에는 그 상세한 설명을 생략할 것이다.

본 발명의 개념에 따른 실시 예는 다양한 변경을 가할 수 있고 여러 가지 형태를 가질 수 있으므로 특정 실시 예들을 도면에 예시하고 본 명세서 또는 출원서에 상세하게 설명하고자 한다. 그러나 이는 본 발명의 개념에 따른 실시 예를 특정한 개시 형태에 대해 한정하려는 것이 아니며, 본 발명의 사상 및 기술 범위에 포함되는 모든 변경, 균등물 내지 대체물을 포함하는 것으로 이해되어야 한다.

어떤 구성요소가 다른 구성요소에 "연결되어" 있다거나 "접속되어" 있다고 언급된 때에는, 그 다른 구성요소에 직접적으로 연결되어 있거나 또는 접속되어 있을 수도 있지만, 중간에 다른 구성요소가 존재할 수도 있다고 이해되어야 할 것이다. 반면에, 어떤 구성요소가 다른 구성요소에 "직접 연결되어" 있다거나 "직접 접속되어" 있다고 언급된 때에는, 중간에 다른 구성요소가 존재하지 않는 것으로 이해되어야 할 것이다. 구성요소들 간의 관계를 설명하는 다른 표현들, 즉 "~사이에"와 "바로 ~사이에" 또는 "~에 이웃하는"과 "~에 직접 이웃하는" 등도 마찬가지로 해석되어야 한다.

본 명세서에서 사용한 용어는 단지 특정한 실시예를 설명하기 위해 사용된 것으로, 본 발명을 한정하려는 의도가 아니다. 단수의 표현은 문맥상 명백하게 다르게 뜻하지 않는 한, 복수의 표현을 포함한다. 본 명세서에서, "포함하다" 또는 "가지다" 등의 용어는 설시된 특징, 숫자, 단계, 동작, 구성요소, 부분품 또는 이들을 조합한 것이 존재함을 지정하려는 것이지, 하나 또는 그 이상의 다른 특징들이나 숫자, 단계, 동작, 구성요소, 부분품 또는 이들을 조합한 것들의 존재 또는 부가 가능성을 미리 배제하지 않는 것으로 이해되어야 한다.

또한, 본 명세서에서 단어 "예시적인" 은 "예로서, 일례로서, 또는 예증으로서 역할을 한다."라는 것을 의미하기 위해 이용된다. "예시적"으로서 본 명세서에서 설명된 임의의 양태들은 다른 양태들에 비해 반드시 선호되거나 또는 유리하다는 것으로서 해석되어야 하는 것만은 아니다.

본 명세서에서, 용어 "애플리케이션" 은 또한 오브젝트 코드, 스크립트, 바이트 코드, 마크업 언어 화일들, 및 패치들과 같은 실행가능 컨텐츠를 갖는 화일들을 포함할 수도 있다. 또한, 본 명세서에서 언급된 "애플리케이션" 은 또한 오픈될 필요가 있을 수도 있는 문서들 또는 액세스될 필요가 있는 다른 데이터 화일들과 같이, 성질상 실행가능하지 않는 화일들을 포함할 수도 있다.

본 명세서에서 단어 "프론트-엔드(front-end)"는 인터페이스에 대응할 수 있으며 이용하는 클라이언트와 상호작용하는 프로그램이라는 것을 의미하기 위해 이용된다. 반대로 백-엔드(back-end)는 클라이언트와는 직접 대면하지는 않으나, 프론트-엔드와 연동하여 기술적인 기능을 하는 프로그램을 의미한다. 프론트-엔드와 백-엔드는 프로그램 인터페이스와 서비스의 최초 사용자와 관련된 특성 (여기서 '사용자' 란 사람 또는 프로그램이 될 수 있다) 을 나타낸다. 프론트-엔드 응용프로그램은 사용자들과 직접 상호작용을 하는 프로그램이고, 백-엔드 응용프로그램은 보통 요구되는 자원들에 가깝게 있거나, 또는 요구되는 자원들과 교신할 수 있는 능력을 가지는 등 프론트-엔드 서비스를 간접적으로 지원한다. 백-엔드 응용프로그램은 프론트-엔드와 직접 상호 작용할 수 있지만, 보다 일반적인 것은 중간에 또 다른 프로그램이 개입되어 프론트-엔드와 백-엔드의 활동을 조정한다.

예를 들어, 프론트-엔드 응용프로그램 (혹은 전단 계층 도메인) 은 사용자와 직접 인터페이스할 수 있으며, 요구된 데이터를 얻거나 요구된 서비스를 수행하기 위하여 원격지의 다른 컴퓨터에 위치한 백-엔드 프로그램으로 요구를 전달한다. 클라이언트/서버 컴퓨팅 모델과 비교한다면, 프론트-엔드는 클라이언트로, 백-엔드는 서버로 이해할 수도 있다.

본 발명에 적용되는 기술의 동향을 살펴보면, 최근 개발의 편리성, 개발 기간의 단축 및 개발 용역비의 절감이라는 과제를 해결하기 위해 근래의 데이터베이스 제품군들이 차용하는 개념으로 객체-관계 매핑 (Object Relational Mapping ; ORM) 기술이 많은 관심을 받고 있다. 상기 ORM은 객체와 관계 모델링 구현물 사이, 그리고 이 구현물을 서포트 하는 시스템간의 변환 프로세스이다. 즉 객체와 테이블, 시스템(RDBMS)을 변형 및 연결해 주는 작업을 수행하며, ORM을 이용한 개발은 객체와 데이터베이스의 변형에 유연하게 대처할 수 있도록 해준다.

이러한 ORM의 특장점으로는, ORM을 이용하는 경우 CRUD(Create, Read, Update, Delete)를 위해 긴 SQL 문장을 작성할 필요가 없으며, 쿼리 작성 시 ORM 툴(HQL 등)을 이용하면 한층 쉽게 쿼리를 만들 수 있다. 또 JDBC와 관련한 복잡한 코드 작업으로부터 벗어날 수 있도록 한다.

또한, ORM을 적용하는 경우 관계형 모델과 관련된 성능 오버헤드를 수반하지 않고도 요구 사항에 적합한 도메인 모델을 생성할 수 있으며, 로우와 컬럼이 아닌 오브젝트의 관점에서 작업을 수행하는 것을 가능하게 한다.

ORM은 변경 사항을 자동으로 감지하므로, 전체 개발 라이프 사이클에 걸쳐 에러의 가능성을 줄일 수 있다. 또한, 데이터 베이스 벤더 별로 제공되는 SQL 구문에 대한 종속성을 줄이고 호환성을 향상시켜 주며, SQL 구문은 ORM 툴에 의해 추상화 가능하게 된다.

따라서 본 발명은 ORM의 개념을 차용하여 기존 데이터베이스가 대상이 아닌 프로세스를 대상으로 하는 관계형 프로세스 모델링(Relational Process Modeling)을 적용한다.

다이어그램/UI 드로윙(Drawing)을 위한 WebCanvas/WebGL에 대한 기술 검토해 보면, 기존 웹의 드로우(Draw) 기능을 사용한다면, 더욱 효과적인 UI 구성 및 개발이 가능하므로, 본 발명에는 HTML5의 WebCanvas/WebGL 등의 웹 기술의 도입이 고려되었다.

상기 WebCanvas는 Canvas 위에 선, 도형, 텍스트, 이미지와 같은 그래픽을 표현할 수 있고, 색깔, 그림자, 패턴과 같은 여러 효과를 적용할 수 있도록 한다.

상기 WebGL은 오픈 그래픽 라이브러리인 OpenGL에 기반한 웹 표준 그래픽 라이브러리이다. WebGL을 이용하면 브라우저에 별도의 플러그 인 없이 완벽하게 하드웨어 가속되는 3D그래픽을 표현할 수 있게 된다. 주요 브라우저 벤더사인 애플, 구글, 모질라 및 오페라와 하드웨어 업체인 AMD 및 nVidia 등이 WebGL Working Group 멤버로 활동하고 있다. 그리고 구굴의 웹 용 3D API인 O3D 플러그 인 기술을 포기하고 WebGL을 선택하였다.

또한, 모바일 애플리케이션 개발은 네이티브 애플리케이션 개발, 웹 애플리케이션 개발, 하이브리드 애플리케이션 개발 등을 포함한다.

네이티브 애플리케이션은 특정 플랫폼에서 가장 빠른 속도와 최적화된 기능 구현이 가능한 장점을 가진다. 개발 방식으로는 해당 스마트폰 플랫폼에 따라 상이하다. 예를 들어, 아이폰에서 애플리케이션을 개발하려면우선 맥OS를 사용할 수 있어야 한다. 그리고 오브젝티브 C언어를 학습하고, Xcode 개발 환경을 이해한 후 iOS의 각종 SDK까지 익혀야 한다. 아이폰과 동일한 애플리케이션을 안드로드폰에서 사용해야 한다면 자바를 학습하고 안드로이드 플랫폼의 특성과 각종 SDK를 습득한 후 이클립스 환경에서 개발행야한다. 따라서 네이티브 애플리케이션은 하나의 특정 모바일 플랫폼에 최적화된 애플리케이션을 개발할 경우에는 효과적이지만 다양한 플랫폼이 혼재된 B2B나 B2C 환경에서의 개발 생산성은 높지 않다.

다음으로 웹 애플리케이션 기술은 호환성과 높은 생산성을 요구하는 애플리케이션 개발에 적당하다. 아이폰의 사파리나 안드로이드의 크롬 브라우저에서 특정 URL을 입력하면 모방리 웹 페이지에 접속할 수 있다. 주요한 컨텐츠는 원격지 서버에 웹 프로그램 형태로 게시하고 단말에 설치된 애플리케이션은 이러한 컨텐츠를 HTTP 프로토콜 위에서 실행한다. 이런 구조를 갖기 때문에 표준 HTML 규약을 지원하는 웹브라우저가 탑재된 모든 스마트폰 플랫폼에서 작동이 가능한 애플리케이션을 손쉽게 작성할 수 있게 된다. 또한 앱 개발이 주로 HTML, 자바스크립트, CSS 등으로 이뤄지므로 상대적으로 개발자 확보 및 교육에도 유리하다. 하지만 이 방식은 하드웨어 제어가 어렵고 앱 실행 속도가 느리다는 치명적인 단점을 갖는다.

하이브리드 앱 개발 방식은 웹킷 기반의 웹컴포넌트 기술과 HTML5 기반의 웹 기술로서 네이티브 애플리케이션의 성능과 웹 애플리케이션의 호환성을 동시에 만족한다. 이 방식은 하드웨어 제어 및 비즈니스 로직과의 유기적인 연계가 가능하며 동일한 소스 코드르 사용해 다양한 플랫폼(아이폰, 안드로이드, 원도우폰 7, 바다, 심비안, 팜프리, 블랙베리 등)에서 작동하는 애플리케이션을 손쉽게 개발할 수 있도록 지원한다. 하이브리드 모바일 애플리케이션 개발은 최근 주목 받는 멀티플랫폼 기반의 앱 개발방법이다. 하이브리드 앱은 웹킷(WebKit) 기술을 바탕으로 HTML5, 자바스크립트, CSS 등으로 만들어지며 뛰어난 확장성과 호환성을 제공한다.

이러한 검토를 바탕으로 본 발명은 객체관계 매핑 기반 하이브리드 앱 개발 시스템 및 그 방법을 제공한다.

이하, 본 발명의 실시예를 나타내는 첨부 도면을 참조하여 본 발명을 더욱 상세히 설명한다.

도 1은 본 발명의 일 실시예에 따르는 객체관리 매핑 기반 하이브리드 앱 개발시스템의 구성을 나타내는 도면이다.

도 1에 도시된 바와 같이, 본 발명의 전체적인 아키텍처는 도시한 바와 같이 유닛 빌더부(120), 사용자 인터페이스를 패널 단위로 분리하고, 상기단위 유닛을 상기 패널에 등록하여 프론트-엔드(front-end)를 완성한 후, 각각의 단위 유닛에 프로세스를 부여하고 코드를 생성한 후, 하이브리드 앱으로 변화하는 하이브리드 앱 생성부(115), 공통된 통합된 환경을 제공하기 위해 클라이언트 프레임워크(client framework)(160) 및 백오피스 서비스부(140)를 포함하여 구성된다.

또한, 상기 하이브리드 앱 생성부(115)는 사용자 인터페이스(UI) 빌더부(130), 프로세스 빌더부(150), 코드생성부(170) 및 하이브리드 앱 변환부(175)를 포함하여 구성된다. 상기 클라이언트 프레임워크 (client framework)(160)는 공통된 통합된 환경을 제공하기 위해 상기 유닛 빌더부(120), 사용자 인터페이스(UI) 빌더부(130), 프로세스 빌더부(150) 및 코드생성부(170) 각각의 기본 프레임으로 구비된다.

일 실시형태에서, 사용자는 설계된 디자인 (110)을 기초로 유닛 빌더부(120) 에서 화면 구성을 위한 단위 유닛을 생성하고, 유닛 빌더부(120)에서 생성된 유닛을 사용자 인터페이스 (UI) 빌더부(130)에서 그래픽 사용자 인터페이스를 이용하여 사용자의 선택에 따라 화면에 구성할 수 있다. 일 실시형태에서 프로세스 빌더부(150)는 유닛 빌더부(120) 및 사용자 인터페이스 빌더부(130)에서 완성된 프론트-엔드와 서버 측과의 매핑을 통해 사용자 이벤트에 대한 액션을 정의할 수 있다. 일 실시형태에서, 클라이언트 프레임워크(160)는 공통된 통합 환경을 제공하기 위해 하이브리드 클라이언트/서버 (Hybrid Client/Server ; HCS) 프레임워크를 기반으로 할 수도 있다. 일 실시형태에서, 코드 생성부(170)는 완성된 프론트-엔드에 대한 코드를 생성할 수 있다. 그리고 상기 하이브리드 앱 변환부(175)는 웹키트(WebKit)를 기반으로 HTML5, 자바스크립트, CSS 등으로 만들어져, 생성된 앱 어플리케이션을 웹키트 플랫폼에 의해 iOS, 안드로이드 또는 WP7 등의 특정 플랫폼 중 하나의 플랫폼에 적합한 하이브리드 앱 어플리케이션으로 변환하도록 구성된다.

도 2는 본 발명에 따른 전체 아키텍처에 관한 상세 구성도를 나타내는 도면이다. 도 2를 참조하면, 본 발명의 플랫폼 아키텍처(300)는 사용자 인터페이스(UI) 빌더 툴킷 API(Application Programming Interfaces)(301), 유닛 빌더 툴킷 API(302), 프로세스 빌더 툴킷 API(303), 모듈 매니저(310), 구조 해석 엔진(320), 코드 생성 엔진(330), 하이브리드 앱 변환 엔진(335), 확장 모듈 및 툴킷 레이어(340), 보관 레이어(350), 리포지터리 레이어(360), 인터페이스 레이어(370) 및 네트워크 레이어(380)를 포함할 수 있다.

사용자 인터페이스 빌더 툴킷 API(301), 유닛 빌더 툴킷 API(302) 및 프로세스 빌더 툴킷 API(303)는 각각의 용도에 맞는 도구 모음 프로그램을 제공한다. 이들은 상용 라이브러리와 그것을 효율적으로 이용하기 위한 보조 프로그램을 포함할 수 있으며, 그래픽 라이브러리 툴킷도 포함할 수 있다.

모듈 매니저(310)는 사용자 인터페이스 빌더 툴킷 API(301), 유닛 빌더 툴킷 API(302), 프로세스 빌더 툴킷 API(303)을 관리가능하다. 모듈 매니저(310)에서는, 코드의 생성을 위해 워크플로우를 응용하는 것을 기본으로 하지만, UML을 응용하여 코드를 생성할 수도 있다. 워크플로우는 업무가 복잡해지고 분기가 많아져도 모듈이나 클래스별로 작업할 수 있기 때문에 업무 프로세스를 이해하고 논리적으로 정리하기 쉽다. 워크플로우를 단위로 분할하면 업무는 CRUD의 최소단위로 구현부가 나뉘게 되며, 기본적인 또는 특수한 컴포넌트들을 사용하고 조합한다면, 코딩을 최소한으로 사용하면서 작업할 수 있다. 또한, 네트워크 및 데이터베이스와 관련하여, 모바일 개발에 있어서는 서비스의 형태를 RESTful로 구현하는 것이 바람직하다.

상기 구조 해석 엔진(320)는 UI 빌더 구조, 유닛 빌더 구조, 프로세스 빌더 구조 및 모듈 구조를 해석한다.

상기 코드 생성 엔진(330)은 다이나믹 스크립트, HTML5, CSS3, 자바스크립트 프로젝트 파일, 자바 등의 코드를 생성한다.

상기 하이브리드 앱 변환 엔진(335)은 상술한 하이브리드 앱 변환부(175)를 구성하는 것으로서, 웹키트 엔진(WebKit engine)을 구비하여, HTML5, 자바스크립트 API, CSS 등을 통해 플랫폼과 독립적으로 작성된 앱을 웹키트 엔진을 통해 개별적인 플랫폼에 적합한 하이브리드 앱으로 변환하도록 구성된다.

상기 웹키트는 웹브라우저를 만드는 기반을 제공하는 오픈소스 응용 프로그램 프레임워크이다. 일반적으로 사파리, 크롬, 돌핀 등의 웹브라우저는 웹키트를 지원한다. 하이브리드 애플리케이션에서 디바이스제어는 웹키트 기반의 PhoneGap으로 단말기를 통합접근(Bottom-Up)한다.

웹 페이지 로딩속도를 개선하기 위하여 웹페이지를 로컬에서 실행하는 PhoneGap을 적용하여 화면 로딩 시 일반 웹철럼 HTML 소스를 네트워크를 통하여 가져올 필요가 없도록 한다. 그리고 Ajax를 통하여 UI와 데이터를 분리한다. 또한 서버 측에는 가볍고 사용하기 편한 Json 유형의 데이터를 사용한다.

한편, 다수의 레이어로 구성된 시스템 레이어는, 확장 모듈 및 툴킷 레이어(340), 리포지터리 레이어(350), 인터페이스 레이어(370) 및 네트워크 레이어(380)를 포함한다. 확장 모듈 및 툴킷 레이어(340)는 모듈 및 툴킷을 관리한다. 리포지터리 레이어(350)는 조직적인 방법으로 수집된 각종 자료를 모아서, 그 내용을 유지하는 중심 저장소로서의 역할을 한다. 각종 정보들을 관리하며 요소자료, 입출력 내용, 처리방법, 자료의 내부관계 등과 같이 응용업무 개발에 사용된 시스템의 각종 부품을 모아 놓은 정보 데이터베이스의 역할을 한다. 리포지터리 레이어(350)를 통해 사용자가 직접 또는 소프트웨어를 통해 특정 정보나 파일, 문서 등을 얻을 수 있으며, 또한 정보를 통신망에 분산시켜 놓을 수도 있고 한 곳에 집합시켜 놓을 수도 있다. 각종 정보의 통합관리, 활용도 제고, 유지보수의 용이성의 관점에서 메타데이터 (Metadata) 와도 관련된다. 인터페이스 레이어(370)는 사용자 인터페이스를 구성 및 관리하며 문자 방식 사용자 인터페이스(CUI), 메뉴 방식 사용자 인터페이스, 그래픽 사용자 인터페이스(GUI) 등과 같은 인터페이스를 운영 체계와 상호 작용할 수 있도록 관리할 수 있다. 네트워크 레이어(370)는 통신망을 이용하여 루틴을 행하고, 시스템과의 커넥션을 꾀할 수 있다.

이와 같이, 사용자가 사용할 수 있는 계층과 하드웨어와 긴밀한 관계가 있는 시스템의 계층으로 나누어 관리함으로써 사용자가 시스템에 대하여 무리한 요구를 했을 때에도 시스템이 파괴되는 일 없이 안정한 관리를 행할 수 있다.

도 3 내지 도 10은 도 1을 통해 설명한 아키텍처를 구성하는 각 요소에 관한 것으로 이하, 아키텍처의 각 구성을 상세히 설명한다.

도 3은 본 발명에 따른 클라이언트 프레임워크(160)의 동작 방식을 나타낸 도면이다. 도 3에 도시된 바와 같이, 본 발명의 예시적인 실시 형태에서 클라이언트 프레임워크의 워크플로우는, 라우터(410)에서 라우팅 경로와 처리 메소드를 등록하고, API 호출 시 보여질 뷰(view)(420)를 결정하여 준다. 뷰(420)가 결정된 후, 뷰에 맞는 템플릿(440)이 제공되고, 그에 따른 모델/컬렉션(430)이 만들어진다. 컬렉션이 바인딩되면, 데이터는 정렬, 필터링 또는 그룹화되어 데이터소스(450)로 될 수 있다.

일 실시 형태에서, 클라이언트 프레임워크는 단일화된 개발 프레임워크를 제공할 수 있다. 개발 환경에서 각각의 소프트웨어들은 갖추어야 할 기본적인 조건들을 명시한 사용자 인터페이스 규격을 준수해야 하므로, 개발자들은 언어에 종속될 수밖에 없으며, 이는 개발 프레임워크와 깊은 연관 관계가 있다. 예를 들면, C++ 언어를 사용하는 개발자는 MFC를 주로 사용하고, 비주얼 베이직(Visual Basic)을 사용하는 개발자는 비주얼 베이직 개발 환경을 사용한다. 자바 역시 자바 프레임워크를 사용한다. 이와 같은 이유 때문에 개발 언어가 곧 개발 도구를 의미하게 된다. 그러나 본 발명에 따른 클라이언트 프레임워크는 언어가 개발 환경에 종속되어 버리는 현상을 막기 위해, 클라이언트 응용 프로그램의 개발에 사용될 수 있는 공통된 라이브러리들의 묶음을 제공할 수 있다. 이에 따라, 개발자들은 자신에게 필요한 라이브러리를 자신의 언어로 사용할 수 있으며, 각각의 언어가 갖는 고유한 기능은 계속해서 사용하되 지원하는 기능에 차이가 없도록 함이 가능해진다.

일 실시형태에서, 클라이언트 프레임워크(160)는 공통된 통합 환경을 제공하기 위해 하이브리드 클라이언트/서버 프레임워크를 기반으로 할 수도 있다. 네이티브 개발자 자원이 충분하지 않고 디바이스 연동이 필요한 경우, 범용적이고 표준화된 하이브리드 프레임워크의 사용이 요구된다. 이는 표준화의 관점에서 안전성이 보장되고 레퍼런스의 부족 문제를 해결할 수 있기 때문이다. 하이브리드 클라이언트/서버 프레임워크를 이용함으로써 모바일 웹과 네이티브 애플리케이션을 혼용한 기능을 구현할 수 있다.

일 실시형태에서, 클라이언트 프레임워크(160)에 대응하는 소프트웨어의 제작을 위한 요구 환경은 하기 표 1 과 같이 정의할 수 있다.

도 4는 클라이언트 프레임워크(160) 를 구성하는 소프트웨어 아키텍처에 관한 상세 구성도를 나타내기 위한 도면이다. 도 4를 참조하면, 본 발명의 클라이언트 프레임워크(160)의 아키텍처는 사용자 인터페이스 레이어(510), 비즈니스 레이어(520), BMO.COCKTAIL API(530), BMO.COCKTAIL 브릿지(540) 및 네이티브 도구(550)를 포함할 수 있다.

도 5는 본 발명에 따른 유닛 빌더부(120)의 동작 방식을 나타낸 도면이다. 도 5에 도시된 바와 같이, 본 발명의 예시적인 실시예에서 유닛 빌더부(120)는 디자인 및 퍼블리싱을 지원하기 위해 화면 구성의 가장 작은 단위인 유닛(610)을 생성하며, 디자이너, 퍼블리셔 및 시스템 설계자가 프론트-엔드의 구성을 기준에 부합하는 가장 작은 단위인 유닛(610)으로 작성 작업을 할 수 있도록 도와준다. 일 실시 형태에서, 유닛(610)은 유닛 빌더부(120)에서 정의된 디자인 가이드를 준수하여 생성되고, 사용자 인터페이스 빌더부(130)에서 사용되도록 리소스로 관리되어질 수 있다. 이렇게 제작된 유닛 (610)은 내부적으로 컴포넌트화되어 같은 제품군에서 다양하게 사용되어질 수 있다. 이는 또한 같은 제품군의 백오피스 서비스부(140)에서 관리되어질 수 있다. 백오피스 서비스부(140)의 상세한 동작에 관해서는 후술하기로 한다.

유닛 빌더부(120)의 아키텍처는 유닛 빌더 툴킷 API, 구조 해석 엔진, 코드 생성 엔진, 확장 모듈 및 툴킷 레이어, 리포지터리 레이어, 인터페이스 레이어 및 네트워크 레이어를 포함하여 구성될 수 있다. 일 실시 형태에서, 유닛 빌더부(120)에 대응하는 소프트웨어의 제작 요구 환경은 하기 표 2 와 같이 정의할 수 있고, 작동 요구 환경은 하기 표 3 과 같이 정의할 수 있다.

도 6은 본 발명에 따른 사용자 인터페이스 빌더부(130)의 동작 방식을 나타낸 도면이다. 도 6에 도시된 바와 같이, 본 발명의 예시적인 실시예에서 사용자 인터페이스 빌더부(130)는 사용자 인터페이스 화면을 패널 단위로 분리한다. 그리고 단위 유닛을 패널에 등록하여 프론트-엔드(front-end)를 완성하기 위해, 그래픽 사용자 인터페이스를 이용해 페이지 레이아웃을 생성 또는 수정 가능하게 하고, 프로젝트 이름, 단계, 위치 또는 지원되는 라이브러리를 설정 가능하게 한다. 일 실시 형태에서, 사용자 인터페이스 빌더부(130)는 프론트-엔드 개발자를 지원하기 위해 사용자 인터페이스 화면(810)을 패널(820) 단위로 분리하여 구성할 수 있다. 각 패널(820)에는 유닛 빌더부(120)에 의해 생성된 유닛(610)을 등록하여 사용자 인터페이스 화면(810)을 구성할 수 있도록 동작 가능하다.

일 실시 형태에서, 사용자 인터페이스 빌더부(130)는, 화면기획을 기반으로 화면의 레이아웃(layout)을 설정할 수 있고, 설정된 상기 레이아웃을 기반으로 레벨-깊이(level-depth)를 정한 후 확장된 레이아웃 패널 (layout panel) (830, 840, 850, 860, 870)을 구성할 수 있다. 구성된 레이아웃 패널에는 유닛을 적용시킬 수 있고, 적용시킨 유닛의 세부조정을 행할 수 있다. 사용자 인터페이스 빌더부(130)를 통해 사용자는 간단한 조작만으로 사용자 인터페이스 화면(810)을 구성할 수 있다. 이는 사용자 친화적이기 때문에, 초급 개발자의 사용자 수준이라도 사용자 인터페이스 소프트웨어로의 용이한 접근이 가능하다. 또한, 사용자 인터페이스 빌더부(130)는 경우에 따라서 일부 유닛의 조정이 가능하도록 하는 확장 기능을 가질 수 있다.

사용자 인터페이스 빌더부(130)의 아키텍처는 유닛 빌더 툴킷 API, 구조 해석 엔진, 코드 생성 엔진, 확장 모듈 및 툴킷 레이어, 리포지터리 레이어, 인터페이스 레이어 및 네트워크 레이어를 포함하여 구성될 수 있다. 일 실시형태에서, 사용자 인터페이스 빌더부(130)에 대응하는 소프트웨어의 제작 요구 환경은 하기 표 4 와 같이 정의할 수 있고, 작동 요구 환경은 하기 표 5 와 같이 정의할 수 있다.

도 7은 본 발명에 따른 백오피스 서비스부(140)의 개념을 나타낸 도면이다. 도 1, 도 5를 참조하면, 본 발명의 예시적인 실시예에서 백오피스 서비스부(140)는 유닛(610)을 컴포넌트로서 관리하기 위한 서비스를 제공할 수 있고, 단위 유닛을 유닛 빌더부(120)로부터 제공받아 사용자 인터페이스 빌더부(130)에 제공할 수 있다. 또한, 유닛 빌더부(120)에서 생성된 상기 유닛(610)을 사용자 인터페이스 빌더부(130)에서 생성, 수정 또는 삭제가 가능하도록 관리할 수 있다.

도 7을 참조하면, 상기 백오피스 서비스부(140)는 생산된 유닛과 프로트-엔드 개발자의 인증 및 관리를 위하여 사용성이 높고 확장성이 용이하도록 RWS(RESTful Web Service) 형태의 컨텐츠관리시스템(CMS: Content Management System)으로 구현되어, 디자인 관리자(1030), 컨텐츠 참가자(1040), 에디터(1050) 및 승인자(1060)가 컨텐츠관리시스템(1010)에 액세스 가능한 형태가 도시되어 있다. 컨텐츠관리시스템(1010)은 웹사이트를 구성하고 있는 다양한 컨텐츠를 효율적으로 관리할 수 있도록 도와주는 시스템이며, 디자인 관리자(1030), 컨텐츠 참가자(1040), 에디터(1050) 및 승인자(1060)는 백오피스 서비스부(140)에 접근할 수 있는 권한을 가지며, 유닛 빌더부(120)에서 생성된 유닛을 사용자 인터페이스 빌더부(130)에서 생성, 수정 또는 삭제 가능하도록 관리할 수 있다. 디자인 관리자(1030)는 백오피스 서비스부(140)에 접근할 수 있는 가장 강한 권한을 가지며, 에디터(1050) 및 승인자(1060)는 중간 등급의 권한을 가지며, 컨텐츠 참가자(1040)는 제한된 권한을 갖는다. 백오피스 서비스부(140)를 통해 관리된 컨텐츠는 웹사이트(1020)를 통해 사이트 방문자(1070)가 열람할 수 있다.

일 실시 형태에서, 백오피스 서비스부(140)는 유닛 빌더부(120)에서 생성된 유닛(610)의 생성, 수정 및 삭제를 관리할 수 있고, 유닛(610)의 관리는 그룹 관리를 기본으로 이루어지며, 사이트, 사용자 및 도메인 별로 각각 관리될 수 있다. 또한, 고유한 아이디를 지닌 유닛의 생성은 오직 유닛 빌더부(120)에서 등록된 것을 인정하고 처리할 수 있다. 백오피스 서비스부(140)는 컨텐츠 관련 현황 및 통계자료를 제공할 수 있으며, 보안 관리를 위해 컨텐츠 디지털 권한 매니지먼트 (contents digital rights management)를 이용하여 관리할 수 있다.

일 실시형태에서, 백오피스 서비스부(140)에 대응하는 소프트웨어의 작동 요구 환경은 하기 표 6 과 같이 정의할 수 있다.

도 8은 백오피스 서비스부(140)를 구성하는 소프트웨어 아키텍처에 관한 상세 구성을 나타내는 도면이다. 도 8을 참조하면, 본 발명의 백오피스 서비스부(140)는 HTTP로 요청을 받아서 결과를 XML 형태로 전송해주기 위해 HTTP 프로토콜의 PUT, GET, POST, DELETE 등과 같은 방법을 사용할 수 있고, 리소스에 대한 접근에 URI를 이용할 수 있다.

도 9는 본 발명에 따른 프로세스 빌더부(150)의 개념을 나타낸 도면이다. 본 발명의 예시적인 실시예에서 프로세스 빌더부(150)는 유닛 빌더부(120)와 사용자 인터페이스 빌더부(130)를 통해 완성된 프론트-엔드에 서버 측과의 매핑을 완성하여 사용자 이벤트에 대한 액션을 정의할 수 있다. 프론트-엔드와 서버 측과의 연결을 위해 플로우차트-다이어그램(프로세스 다이어그램 ; 1210)을 사용한다. 이로써 프론트-엔드 개발자로 하여금 코드리스(Codeless)한 개발이 가능하도록 지원할 수 있다. 기본적으로, 기획화면의 기능을 바탕으로 화면에서 이루어지는 뷰 액션을 처리하며, 더 복잡한 형태의 비즈니스 로직을 처리하는 것 또한 가능하다. 일 실시형태에서, 프로세스 빌더부(150)의 동작 방식은, 먼저 뷰 액션 및 비즈니스를 플로우차트로 구성하기 위하여 분석 작업을 할 수 있다. 이후, 관련 로직을 플로우차트로 구성하는 모델링 작업을 하고, 다이어그램의 레벨-깊이를 조정하고, 하위 레벨에서는 상세화된 로직을 구성하고, 기본이 되는 CRUD 단위까지 세분화 작업을 할 수 있다. 완성된 모델은 사용자 인터페이스 빌더부(130)에서 생성한 화면의 특정 유닛(610)에 매핑되고, 매핑된 모델의 속성을 조정할 수 있으며, 매핑된 프로젝트를 빌드하여 코드 및 아웃풋을 생성할 수 있다.

도 10은 본 발명에 따른 프로세스 빌더부(150)를 이용한 가상 동작 화면을 나타낸 도면이다. 도 10에 도시된 바와 같이, 본 발명의 예시적인 실시예에서는, 로직을 플로우차트로 구성한 모델(1310, 1320)을 사용자 인터페이스 빌더부(130)에서 생성한 화면의 특정 유닛(1330, 1340)에 각각 매핑함으로써, 특정 유닛(1330, 1340)에 대한 사용자 이벤트가 있을 때 그에 따른 액션을 정의할 수 있다. 이와 같이, 프론트-엔드를 서버 측과 매핑하여 사용자 이벤트에 대한 액션을 정의함으로써, 프론트-엔드를 위한 코딩의 양이 줄어들게 되며, 코딩 과정에서 발생하는 논리적 오류를 쉽게 파악할 수 있다. 또한, 완성된 모델을 이용하기 때문에 버그 또한 현저하게 줄어들 수 있다.

프로세스 빌더부(130)의 아키텍처는 프로세스 빌더 툴킷 API, 구조 해석 엔진, 코드 생성 엔진, 확장 모듈 및 툴킷 레이어, 리포지터리 레이어, 인터페이스 레이어 및 네트워크 레이어를 포함하여 구성될 수 있다. 일 실시형태에서, 프로세스 빌더부(150)에 대응하는 소프트웨어의 제작 요구 환경은 하기 표 7 과 같이 정의할 수 있고, 작동 요구 환경은 하기 표 8 과 같이 정의할 수 있다.

본 발명은, 모바일용 웹페이지뿐만 아니라, 기존 컴퓨터를 통해 제공되는 웹페이지를 위한 개발을 지원하기 위해 사용될 수 있으며, 모바일 애플리케이션, 웹 애플리케이션, 프로젝트 플래닝 애플리케이션 등과 같은 다양한 개발에 활용될 수 있다.

도 11은 본 발명의 객체 관계 매핑 기반 하이브리드 앱 개발 방법의 처리과정을 나타내는 순서도이다.

도 11에 도시된 바와 같이, 상기 객체 관계 매핑 기반 하이브리드 앱 개발 방법은, 유닛빌더과정(S100), 백오피스서비스과정(S200) 및 하이브리드 앱 생성과정(S300)을 포함하여 이루어진다.

상기 유닛빌더과정(S100)은 유닛 빌더부(160)를 이용하여 디자인 및 퍼블리싱을 지원하기 위해 화면 구성의 가장 작은 단위인 유닛(610)을 생성하며, 디자이너, 퍼블리셔 및 시스템 설계자가 프론트-엔드의 구성을 기준에 부합하는 가장 작은 단위인 유닛 (610)으로 작성한다.

상기 백오피스서비스과정(S200)은 유닛(610)을 컴포넌트로서 관리하기 위한 서비스를 제공하는 것으로, 단위 유닛을 유닛 빌더부(120)로부터 제공받아 사용자 인터페이스 빌더부(130)에 제공하고, 유닛 빌더부(120)에서 생성된 상기 유닛(610) 을 사용자 인터페이스 빌더부(130)에서 생성, 수정 또는 삭제가 가능하게 하는 서비를 제공한다.

상기 하이브리드 앱 생성과정(S300)은 하이브리드 앱 변환부(175)가 웹키트를 기반으로 하여 HTML5, 자바스크립트 API, CSS 등을 통해 플랫폼과 독립적으로 작성된 앱을 웹키트 엔진을 통해 개별적인 플랫폼에 적합한 하이브리드 앱으로 변환한다.

이를 위해 상기 하이브리드 앱 생성과정(S300)은

상기 UI빌더부(130)를 통해 상기 단위 유닛(610)들을 제공받아 사용자 인터페이스 화면의 각 분할된 패널에 할당하여 사용자 인터페이스를 생성하는 사용자 인터페이스 빌더과정(S310)과, 상기 프로세스빌더부(150)를 통해 상기 각각의 패널에 분할된 각각의 유닛들에 액션에 대한 기능을 프로세스로 정의하여 코드를 생성하는 프로세스 빌더과정(S320)과, 상기 코드생성부(170)를 통해 상기 프로세서 빌더 과정에 의해 생성된 사용자 인터페이스 화면의 코드를 조합하여 상기 사용자 인터페이스 화면을 나타내는 웹 코드를 생성하는 코드생성과정(S330) 및 상기 하이브리드 앱 변환부(175)가 상기 웹 코드를 특정 모바일 앱 코드로 변환하는 모바일 앱 변환과정(S340)을 포함하여 이루어져, 플랫폼에 독립적인 하이브리드 앱을 자동으로 제작 할 수 있도록 한다.

하기의 표 9 는, 본 발명에 따른 시스템을 이용한 솔루션을 사용하였을 때 가질 수 있는 경제적인 효과를 예측 및 비교하기 위한 시뮬레이션이다.

시뮬레이션을 통해, 총 17 명의 구성원으로 3 개월 동안의 프로젝트를 수행하는 것을 가정하고 2013년 과기부 고시 단가를 기준으로 M/M 를 예측하였을 때, '전단 계층 도메인에 대한 객체-관계 매핑 솔루션' 을 적용한 경우는 그렇지 않은 경우보다 약 48% 감소된 비용이 소요되었음을 확인할 수 있다. 이와 같이, 본 발명은 숙련된 개발자가 아니더라도 개발을 수행할 수 있는 솔루션을 제공함으로써 사업 진행의 안정성 및 경제적 이득을 확보하게 할 수 있다.

한편, 본 발명의 실시예는 컴퓨터에서 실행될 수 있는 프로그램으로 작성가능하다. 즉, 본 발명에 따른 시스템에 포함된 여러 구성 또는 동작들은 컴퓨터로 읽을 수 있는 기록매체에 저장될 수 있다. 상기 매체는 마그네틱 저장매체 (예 : ROM, 플로피 디스크, 하드 디스크 등), 광학적 판독매체 (예 : CD-ROM, DVD), 디지털 저장매체 (예 : USB 메모리, 메모리카드 (SD, CF, MS, SD) 등) 및 캐리어 웨이브 (예 : 인터넷을 통한 전송) 와 같은 기록매체를 포함한다.

상기에서 설명한 본 발명의 기술적 사상은 바람직한 실시예에서 구체적으로 기술되었으나, 상기한 실시예는 그 설명을 위한 것이며 그 제한을 위한 것이 아님을 주의하여야 한다. 또한, 본 발명의 기술적 분야의 통상의 지식을 가진자라면 본 발명의 기술적 사상의 범위 내에서 다양한 실시예가 가능함을 이해할 수 있을 것이다. 따라서 본 발명의 진정한 기술적 보호 범위는 첨부된 특허청구범위의 기술적 사상에 의해 정해져야 할 것이다.

120: 유닛빌더부 115: 하이브리드 앱 생성부
130: 사용자인터페이스빌더부 150: 프로세스 빌더부
170: 코드 생성부 175: 하이브리드 앱 변환부

Claims (14)

1. 화면 구성을 위한 단위 유닛을 생성하는 유닛 빌더부;
   상기 단위 유닛을 상기 유닛 빌더부로부터 제공받아 하이브리드 앱 생성부에 제공하고, 상기 단위 유닛을 사용자 인터페이스 빌더부에서 생성, 수정 또는 삭제가 가능하도록 관리하는 백오피스 (backoffice) 서비스부; 및
   사용자 인터페이스를 패널 단위로 분리하고, 상기 단위 유닛을 패널에 등록하여 프론트-엔드(front-end)를 완성한 후, 각각의 단위 유닛에 프로세스를 부여하고 코드를 생성한 후, 하이브리드 앱으로 변화하는 하이브리드 앱 생성부;를 포함하여 구성되고,
   상기 하이브리드 앱 생성부는,
   사용자 인터페이스 화면을 패널 단위로 분리하고, 상기 단위 유닛을 상기 패널에 등록하여 프론트-엔드(front-end)를 완성하는 사용자 인터페이스(UI) 빌더부;
   상기 완성된 프론트-엔드의 각 단위 유닛들에 사용자 이벤트에 대한 액션을 정의하는 프로세스 빌더부;
   상기 프로세스 빌더부의 정의에 따라 코드를 생성하는 코드 생성부; 및
   상기 생성된 코드를 포함하는 앱을 하이브리드 앱으로 변환하는 하이브리드 앱 변환부;를 포함하여 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
2. 청구항 1에 있어서,
   상기 유닛 빌더부와 상기 하이브리드 앱 생성부는 공통된 통합 환경을 제공하기 위해 클라이언트 프레임워크(client framework)을 기반으로 하는 클라이언트 시스템으로 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
3. 청구항 2에 있어서, 상기 클라이언트 프레임워크는,
   하이브리드 클라이언트-서버(HCS) 프레임워크를 포함하는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
4. 청구항 1에 있어서, 상기 단위 유닛은,
   상기 유닛 빌더부에서 정의된 디자인 가이드를 준수하여 생산되고, 상기 백오피스 서비스부로 전송되어 사용자 인터페이스 빌더부에서 사용되도록 리소스로 관리되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
5. 삭제
6. 청구항 1에 있어서, 상기 사용자 인터페이스 빌더부는,
   화면 기획을 기반으로 화면의 레이아웃(layout)을 설정하고, 설정된 레이아웃을 기반으로 레벨-깊이(level-depth)를 정한 후 확장된 레이아웃 패널(layout panel)을 구성하며, 구성된 레이아웃 패널에 유닛을 적용시키고, 적용시킨 유닛의 세부 조정을 행할 수 있도록 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
7. 청구항 1에 있어서, 상기 프로세스 빌더부는,
   사용자 이벤트에 대한 액션을 정의하기 위해, 사용자 이벤트에 대한 액션에 관련된 로직을 플로우차트 다이어그램으로 구성하고, 다이어그램의 레벨-깊이 (level-depth) 를 조정하고, 로직을 CRUD (create, read, update, delete) 단위로 세분화한 모델을 생성하고, 모델을 사용자 인터페이스 빌더부에서 생성한 사용자 인터페이스 화면의 특정 유닛에 매핑하는 코드를 생성하도록 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
8. 청구항 1에 있어서, 상기 코드 생성부는,
   상기 프로세스 빌더부에서 상기 사용자 인터페이스 화면의 특정 유닛에 매핑된 코드를 추출한 후, 프로세스 절차에 따른 코드를 조합하여, 전체 사용자 인터페이스 화면을 생성하는 코드를 생성하도록 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
9. 청구항 1에 있어서, 상기 하이브리드 앱 변환부는,
   상기 코드생성부에서 생성된 사용자 인터페이스 화면의 코드를 하이브리드 앱 코드로 변환하도록 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
   
10. 청구항 1에 있어서, 상기 백오피스 서비스부는,
    상기 단위 유닛을 사이트, 사용자 및 도메인 별로 각각 관리하도록 구성되는 서버 시스템으로 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
    
11. 청구항 10에 있어서, 상기 백오피스 서비스부는,
    상기 단위 유닛이 유닛 빌더부에서 등록된 것인지 여부를 확인한 후, 단위 유닛이 등록된 경우에만 관리를 행하도록 구성되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
    
12. 청구항 1에 있어서, 상기 객체관계 매핑은,
    프로세스를 대상으로 하는 관계 프로세스 모델링(relational process modeling)이 적용되는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 시스템.
    
13. 하이브리드 앱의 화면 인터페이스의 각각의 단위 유닛들을 생성하는 유닛빌더과정;
    상기 단위 유닛들을 유닛 빌더부로부터 제공받아 하이브리드 앱 생성부에 제공하고, 상기 단위 유닛들을 사용자 인터페이스 빌더부에서 생성, 수정 또는 삭제가 가능하도록 관리하는 백오피스 서비스과정; 및,
    상기 단위 유닛들을 사용자 인터페이스 화면의 분할된 패널들에 할당한 후, 액션에 대한 기능을 프로세스로 정의한 후 코드를 생성하고, 생성된 코드를 모바일 앱 코드로 변환하여 하이브리드 앱을 생성하는 하이브리드 앱 생성과정;을 포함하고,
    상기 하이브리드 앱 생성과정은,
    상기 단위 유닛들을 제공받아 사용자 인터페이스 화면의 각 분할된 패널에 할당하여 사용자 인터페이스를 생성하는 사용자 인터페이스 빌더과정;
    상기 각각의 패널에 분할된 각각의 단위 유닛들에 액션에 대한 기능을 프로세스로 정의하여 코드를 생성하는 프로세스 빌더과정;
    상기 프로세스 빌더 과정에 의해 생성된 사용자 인터페이스 화면의 코드를 조합하여 상기 사용자 인터페이스 화면을 나타내는 웹 코드를 생성하는 코드생성과정; 및
    상기 웹 코드를 하이브리드 앱 코드로 변환하는 하이브리드 앱 변환과정;을 포함하여 이루어지는 것을 특징으로 하는 객체 관계 매핑 기반 하이브리드 앱 개발 방법.
14. 삭제

Images