KR102208033B1 - 반응형 위젯 개발 장치, 방법 및 기록 매체 - Google Patents

Abstract

본 발명은 반응형 위젯 개발 장치, 방법 및 기록 매체에 관한 것으로, 하나의 위젯을 개발함에 있어 해당 위젯이 구동될 다양한 종류의 단말기 디스플레이 사양에 따라 각각 다른 위젯 뷰(View)를 제공하는, 이른바 반응형 위젯을 개발할 수 있는 장치, 방법 등에 관한 것이다. 본 발명에 의하면 전술한 반응형 위젯을 개발할 수 있음을 물론, 각 단말기에 대응하는 뷰(View)마다 자유롭게 편집을 할 수 있어 위젯 사용자의 사용환경에 따라 위젯의 컨텐츠를 효과적으로 보여줄 수 있고, 나아가 사용자 친화적인 인터페이스를 구비함으로써 개발자에게 반응형 위젯을 보다 쉽게 개발할 수 있는 환경을 제공할 수 있다.

Description

반응형 위젯 개발 장치, 방법 및 기록 매체 {An apparatus, method and recording medium for developing responsive widget}

본 발명은 위젯의 개발 수단을 제공하는 장치, 방법 및 기록매체에 관한 것으로서, 더욱 상세하게는 하나의 위젯 프로그램이라 하더라도 단말기 각각의 디스플레이 사양에 따라 화면 크기, 해상도에 맞는 위젯이 구동될 수 있도록 하는 이른바 반응형 위젯을 개발할 수 있는 장치, 방법 및 기록매체에 관한 것이다.

최근 통신 기술의 발달 및 이동통신 단말기를 포함한 각종 단말기의 하드웨어 기술이 발달하면서 사용자들에게 다양한 정보, 예를 들어 영상, 음성 컨텐츠나 각종 뉴스, 날씨 등의 생활정보를 전달해 주는 컨텐츠 제공 서비스가 널리 보급되고 있다.

위젯(widget)은 위와 같은 다양한 컨텐츠를 웹브라우저를 통하지 않고 단말기의 화면 상에서 바로 제공받을 수 있도록 만든 응용프로그램을 말한다. 즉, 위젯은 날씨, 계산기, 시계와 같은 유용한 기능과 각종 정보(컨텐츠)를 담고 있는 작은 크기의 애플리케이션으로, PC, 모바일 등으로 다운로드 받아 웹브라우저를 통하지 않고도 이를 클릭만 하면 해당 서비스를 바로 이용할 수 있도록 만든 것이다.

그러나 종래의 위젯들은 일반적으로 하나의 화면 크기 또는 하나의 해상도만을 기준으로 개발된 것이어서, 요즘과 같이 단말기의 종류가 다양하고 그에 따라 디스플레이 장치의 사양 역시 다양한 상황에서는 위젯이 적절하게 동작하지 않는 문제점이 존재하여 왔다.

한편 일반적으로 반응형 특성을 웹 페이지 전체에 적용하는 기술이 이미 공지되어 있으나, 이같은 기술은 페이지 구성에 변경이 필요한 경우 기존 서비스 되던 사이트 또는 웹 페이지를 전체적으로 재개편해야 하는 불편함이 있어 왔다. 즉, 웹 페이지 전체를 개편해야 하기 때문에 반응형 특성을 적용하더라도 그 효과를 크게 누릴 수 없었다.

한편, 위젯을 개발하는 방법에 대하여는 이미 많은 관련 내용이 공지(출원공개)되어 있다.

등록특허공보 제10-0864579호(이하 선행기술) 역시 위젯 편집 서비스에 관한 것이며, 상세하게는 모바일 위젯 편집 툴을 웹 사이트를 통해 사용자에게 제공하고, 모바일 위젯 편집 툴을 통해 사용자로부터 입력 받는 모바일 위젯 편집 정보를 상기 사용자의 모바일 디바이스로 제공하는 모바일 위젯 편집 서버 및 편집 서비스 제공 방법에 관한 것이다. 즉, 상기 선행기술은 웹사이트를 통해 위젯 편집 환경을 제공하고, 상기 웹사이트에서 편집된 위젯 정보를 모바일 디바이스로 제공하는 편집 툴에 관하여 기재하고 있다.

그러나 상기 선행기술은 서로 다른 화면 크기 또는 해상도를 가지는 단말기에서 위젯이 적절하게 동작하도록 할 수 있는 기술적 해결책은 제시하고 있지 않다.

이렇듯 일반적으로 하나의 화면 크기, 해상도만을 고려한 위젯을 개발하는 방법은 이미 다양한 형태의 것들이 개시되어 있으나, 앞서 언급한 것과 같이 디스플레이 장치의 다양한 사양에 따라 구동시킬 수 있는 위젯을 개발하는 장치, 방법 또는 기록매체에 관하여는 관련 기술이 알려진 바 없어 문제가 존재한다.

한국등록특허문헌 제10-0864579호 {모바일 위젯 편집 서버 및 모바일 위젯 편집 서비스 제공방법}

본 발명은 전술한 종래기술의 문제점을 해결하기 위하여 도출된 것으로서, 하나의 위젯 프로그램이 다양한 디바이스의 디스플레이 사양에 따라 구동될 수 있도록 한, 이른바 반응형 위젯을 개발할 수 있는 장치, 방법 및 기록매체의 제공을 목적으로 한다.

상술한 과제를 해결하기 위한 본 발명의 일 측면에 따르면, 반응형 위젯 개발 장치는 사용자의 입력을 받는 입력부, 상기 입력부로부터 입력 수신하여 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 위젯 설정부, 위젯에 적용되는 하나 이상의 API(Application Programming Interface)를 저장하는 위젯용 API 데이터베이스, 위젯의 디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 상기 위젯용 API 데이터베이스로부터 호출하고, 호출된 API에 상기 위젯 설정부가 생성한 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 위젯 구현부, 상기 구현된 위젯을 표시하는 표시부, 상기 입력부, 위젯 설정부, 위젯용 API 데이터베이스, 위젯 구현부 및 표시부를 제어하는 제어부를 포함한다.

상기 반응형 위젯 개발 장치에 있어, 상기 위젯 설정부가 생성하는 디스플레이 설정정보는 위젯을 구동하고자 하는 단말기의 종류, 각 단말기의 디스플레이 사양에 따른 뷰(View)개수, 해상도 중 적어도 어느 하나를 포함할 수 있다.

상기 반응형 위젯 개발 장치에 있어, 상기 위젯 설정부가 생성하는 구성요소 설정정보는 구성요소의 종류, 구성요소의 가로/세로 크기, 위치좌표 중 적어도 어느 하나를 포함할 수 있다.

한편, 상기 구성요소 설정정보 중 구성요소의 종류에는 위젯을 구성할 수 있는 이미지, 텍스트, 링크, 표 중 적어도 어느 하나를 포함할 수 있다.

상기 반응형 위젯 개발 장치는, 사용자 입력시 사용자가 위젯 구현에 필요한 구성요소를 선택할 수 있도록 구성요소 목록을 제공하는 구성요소 목록 제공부를 더 포함할 수 있다.

상기 반응형 위젯 개발 장치는, 상기 디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API를 저장하는 위젯설정 저장부, 상기 위젯설정 저장부에 저장된 API를 호출하는 위젯설정 호출부를 더 포함할 수 있다.

상기 반응형 위젯 개발 장치에 있어, 상기 표시부는 위젯의 구성요소, 구성요소의 설정정보, 디스플레이 설정정보에 따른 하나 이상의 뷰(View) 중 적어도 어느 하나를 표시할 수 있다.

상기 반응형 위젯 개발 장치에 있어, 상기 위젯 구현부는 CSS의 미디어쿼리(media query)를 이용하여 위젯을 구현할 수 있다.

본 발명의 다른 측면에 따르면, 반응형 위젯 개발 방법은 위젯 설정부가 입력부로부터 입력을 수신하여 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 단계, 위젯 구현부가 디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 위젯용 API 데이터베이스로부터 호출하고, 호출된 API에 상기 생성된 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 단계, 표시부가 상기 구현된 위젯을 표시하는 단계를 포함한다.

또한, 상기 반응형 위젯 개발 방법은 사용자 입력시 사용자가 위젯 구현에 필요한 구성요소를 선택할 수 있도록 구성요소 목록 제공부가 사용자에게 구성요소 목록을 제공하는 단계를 더 포함할 수 있다.

본 발명의 또 다른 측면에 따르면, 반응형 위젯 개발 장치에 의해 실행될 때, 위젯 설정부가 입력부로부터 입력 수신하여 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 단계, 위젯 구현부가 디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 위젯용 API 데이터베이스로부터 호출하고, 호출된 API에 상기 생성된 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 단계, 표시부가 상기 구현된 위젯을 표시하는 단계를 포함하는 반응형 위젯 개발 방법이 프로그램으로 기록되고 전자 장치에서 판독 가능한 기록매체가 제공된다.

전술한 본 발명의 과제 해결 수단에 의하면, 본 발명은 서로 다른 사양을 가지는 다양한 디바이스에서 각각의 화면크기, 해상도 등에 대응하여 구동될 수 있는 반응형 위젯을 개발할 수 있는 장치, 방법 및 기록매체를 사용자에게 제공한다.

또한 본 발명에 의하면, 각 위젯별로 화면 크기, 해상도 등에 따라 변경할 수 있는 영역을 자유롭게 정할 수 있기 때문에, 사용자는 각 디바이스별 사용환경을 고려하여 표시하고 싶은 내용을 효과적으로 나타낼 수 있다.

나아가 본 발명은, 사용자에게 반응형 위젯을 개발하기 위한 API, 위젯 구성요소 목록 제공 또는 구현된 위젯의 설정정보를 저장/호출할 수 있는 구성제공 등 사용자 친화적인 인터페이스를 제공함으로써, 전문적인 지식을 갖추지 않은 사용자도 쉽고 빠르게 반응형 위젯을 개발할 수 있는 환경을 제공한다.

도 1은 본 발명의 실시예에 따른 반응형 위젯 개발 장치의 블록도.
도 2는 도1의 반응형 위젯 개발 장치에 있어 구성요소 목록 제공부, 위젯설정 저장부, 위젯설정 호출부가 더 포함된 블록도.
도 3은 단말기의 화면 크기에 따라 각각 별개의 위젯 화면이 표시되는 반응형 위젯 프로그램의 일 표시예.
도 4는 반응형 위젯 개발 장치의 표시부에서 뷰(View), 각종 설정정보 등이 표시되는 것을 나타낸 일 실시예.
도 5는 구성요소 설정정보의 입력예시.
도 6은 본 발명의 일 실시예에 따른 반응형 위젯 개발 방법을 나타낸 흐름도.
도 7은 본 발명의 다른 실시예에 따른 반응형 위젯 개발 방법을 나타낸 흐름도.
도 8은 본 발명의 또 다른 실시예에 따른 반응형 위젯 개발 방법을 나타낸 흐름도.

이하 첨부된 도면들을 참조하여 본 발명의 실시예를 기술한다.

본 발명을 설명함에 있어, 관련된 공지 기능 또는 구성에 대한 구체적인 설명이 본 발명의 요지를 불필요하게 흐릴 수 있다고 판단되는 경우에는 그 상세한 설명은 생략될 것이다. 또한 후술되는 용어들은 본 발명에서의 기능을 고려하여 설정된 용어들로서 이 용어들은 제품을 생산하는 생산자의 의도 또는 관례에 따라 달라질 수 있으며, 용어들의 정의는 본 명세서 전반에 걸친 내용을 토대로 내려져야 할 것이다.

도 1은 본 발명의 실시예에 따른 반응형 위젯 개발 장치의 블록도이다.

도 1을 참조하면, 반응형 위젯 개발 장치는 입력부(100), 위젯 설정부(200), 위젯용 API 데이터베이스(300), 위젯 구현부(400), 표시부(500)를 포함하며, 상기 세부구성들은 모두 제어부(600)에 의해 제어된다.

입력부(100)는 반응형 위젯 개발 장치의 외부로부터 사용자 입력을 받는다. 상기 입력부(100)는 적외선 리모콘, 스위치, 키패드, 키보드, 터치 스크린 등 문자 및 숫자의 입력이 가능한 형태의 입력 장치라면 어느 것이든 해당되며 사용자의 입력 방식에 별도의 제한을 두지 않는다.

위젯 설정부(200)는 상기 입력부(100)로부터 사용자의 입력을 수신받아 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 기능을 한다. 위젯 설정부(200)는 두 가지 설정정보를 모두 생성하며, 설사 각 설정정보에 대응하는 사용자 입력이 수신되지 않았다 하더라도 후술하는 바와 같이 기설정된 디폴트 값을 이용하여 각각의 설정정보를 생성하게 된다.

전술한 디스플레이 설정정보는 위젯을 구동하고자 하는 단말기의 종류, 각 단말기의 디스플레이 사양에 따른 뷰(View)개수, 화면크기 또는 해상도 중 적어도 어느 하나를 포함할 수 있으며, 필요에 따라서는 앞서 언급한 것들 이외의 디스플레이 관련 설정정보를 더 포함할 수 있다.

이 때 ‘각 단말기의 디스플레이 사양에 따른 뷰(View)’란, 각 단말기의 화면크기, 해상도 등 다양한 환경에 맞추어 위젯이 사용자에게 보여지는 디스플레이 화면을 일컫는다. 본 발명이 해결하고자 하는 과제가 하나의 위젯 프로그램이 여러 종류의 단말기에서 각각 적절하게 구동될 수 있는 반응형 위젯을 개발하기 위한 것인 이상, 상기 뷰(View)의 개수는 최소한 2개 이상인 것이 바람직하다.

또한 전술한 구성요소 설정정보는 반응형 위젯을 구성하는 구성요소의 종류, 구성요소의 가로/세로 크기 또는 위치좌표 중 적어도 어느 하나를 포함한다.

구성요소의 종류는 이미지, 텍스트, 링크 또는 표 중 적어도 어느 하나를 포함하는 것을 특징으로 한다. 다만 구성요소의 종류가 상기 언급한 것들에 한정되는 것은 아니며, 위젯을 구성하는데 이용할 수 있는 다양한 종류의 구성요소(예를 들어 동영상 또는 음성데이터 등)가 포함될 수 있는 것으로 이해되어야 할 것이다.

한편, 전술한 바와 같이 디스플레이 설정정보 및 구성요소 설정정보 생성에 있어 대응되는 사용자 입력이 없는 경우에는, 사용자가 임의로 설정해 놓은 디폴트 값을 기초로 각 설정정보를 생성할 수 있다. 따라서 어느 하나의 설정정보에 대응하는 사용자 입력이 없다 하더라도, 위젯 설정부(200)는 항상 디스플레이 설정정보 및 구성요소 설정정보를 생성하게 될 것이다.

한편, 도 1에는 도시되어 있지 않으나, 반응형 위젯 개발 장치는 상기 세부구성 이외에 별도의 저장부를 구비할 수 있으며, 저장부에는 위젯 설정부(200)가 생성한 디스플레이 설정정보 및 구성요소 설정정보를 저장할 수 있다.

위젯용 API 데이터베이스(300)는 위젯에 적용되는 하나 이상의 API(Application Programming Interface)를 저장한다.

일반적으로 API란 운영체제와 응용프로그램 사이의 통신에 사용되는 언어나 메시지 형식을 말하며, API는 프로그램 실행을 위해 특정 서브루틴에 연결을 제공하는 함수를 호출하는 것으로 구현된다. 그러므로 하나의 API는 함수의 호출에 의해 요청되는 작업을 수행하기 위해 이미 존재하거나 또는 연결되어 있는 몇 개의 프로그램 모듈, 루틴을 가진다.

본 발명의 구성요소 중 하나인 위젯용 API 데이터베이스(300)에는 상기와 같은 API가 하나 이상 저장되어 있어 언제든지 조회 및 호출이 가능하며, 나아가 모든 API에 대한 빌딩 블록(building block)을 제공함으로써 사용자가 반응형 위젯 개발을 보다 쉽게 할 수 있게 해 준다. 또한 ‘위젯에 적용되는 하나 이상의 API’란 위젯을 구현하기 위해 사용되는 고급 언어(High- level language), 예를 들어 JavaScript, CSS 등 모든 종류의 프로그래밍 언어에 대한 API를 일컫는 것으로 이해함이 바람직하다.

위젯 구현부(400)는 위젯의 디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 상기 위젯용 API 데이터베이스(300)로부터 호출하고, 호출된 API에 상기 위젯 설정부(200)가 생성한 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 기능을 한다.

‘디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 호출하는 것’이란 위젯을 구현하는데 필요한 고급 언어의 다양한 API 중 디스플레이 설정과 관련된 함수, 값을 호출하는 것 또는 구성요소 설정과 관련된 함수, 값을 호출하는 것을 일컫는다.

바람직하게는 CSS 언어를 이용하고, 그 중에서도 미디어쿼리(media query)를 이용하여 각각의 위젯을 구현하는 것을 전제로 한다.

아래는 CSS의 미디어쿼리를 이용하여 가로길이(width)를 기준으로 각각의 위젯을 구현한 예이다.

이와 같이 선언되면 980px와 320px를 기준으로 뷰1 <-> 뷰2 <-> 뷰3 을 가지는 위젯을 구성할 수 있으며, 위의 규칙을 추가하면서 뷰(View)의 개수를 추가할 수 있다.

한편, 상기와 같이 디스플레이 설정 또는 구성요소 설정과 대응하는 함수 등이 호출된 이후에는, 앞서 위젯 설정부(200)가 생성한 디스플레이 설정정보 및 구성요소 설정정보를 함수의 매개값 또는 변수에 적용시켜 각각의 디스플레이 설정, 구성요소 설정 등을 구현하게 된다. 즉, 위젯 구현부(400)는 상기 위젯용 API 데이터베이스(300)로부터 디스플레이 또는 구성요소의 기본 틀이 되는 함수 등을 호출한 후, 위 함수 등에 사용자가 입력한 설정정보를 대입시키고, 이들을 구조적으로 배치하는 기능을 한다.

표시부(500)는 상기 위젯 구현부(400)에서 구현된 위젯을 디스플레이 장치 등을 통해 사용자에게 표시하는 기능을 한다. 한편, 표시부(500)는 반드시 위젯 구현부(400)에서 구현된 위젯만을 표시하는 것이 아니라 위젯 개발단계에서 요구되는 화면(예를 들어 사용자 입력 받는 단계, 구성요소 목록 제공 단계)들도 표시할 수 있음에 유의한다. 또한, 표시부(500)는 사용자에게 위젯의 구현 단계 또는 구현 완성된 상태를 표시할 수 있는 것이라면 어느 디스플레이 장치이든 제한을 두지 않는다.

도 2는 앞서 설명한 도 1의 반응형 위젯 개발 장치에 구성요소 목록 제공부(700), 위젯설정 저장부(800), 위젯설정 호출부(900)가 더 포함된 반응형 위젯 개발 장치의 블록도이다.

구성요소 목록 제공부(700)는 사용자에게 구성요소의 종류를 나열한 목록을 제공한다. 즉, 반응형 위젯을 개발하고자 하는 사용자에게 사용자 입력하기 전 또는 사용자 입력이 있은 후에라도 위젯의 구성요소 목록을 제공함으로써, 사용자가 다양한 구성요소를 효과적으로 이용할 수 있도록 도움을 준다. 이 때 제공되는 목록은 구성요소의 종류가 텍스트 형태로 나열된 것이거나 그림의 형태로 나열된 것 또는 텍스트 및 그림의 형태로 이루어진 것일 수 있다. 아래는 텍스트 및 그림의 형태로 이루어진 구성요소 목록의 예시이다.

위젯설정 저장부(800)는 상기 디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API를 저장한다. 위젯설정 저장부(800)는 사용자가 반응형 위젯 개발을 종료한 이후, 경우에 따라 위젯 구성의 편집이 필요한 때 위의 저장된 API를 호출하여 수정을 쉽게 할 수 있도록 해 준다. 나아가 위젯 개발 작업이 완료되지 못한 상태에서도 사용자가 위젯설정 저장부(800)에 그 때까지 편집된 위젯API를 저장할 수 있게 함으로써 이후 개발을 계속 이어나갈 수 있도록 하는 편의성도 제공한다.

한편 본 구성은 저장 대상이 위젯용 API라는 점에서 앞서 언급한 저장부(미도시. 위젯 설정부가 생성한 설정정보를 저장)와 구별된다.

위젯설정 호출부(900)는 상기 위젯설정 저장부(800)에 저장된 위젯용 API를 호출하는 기능을 한다.

도 3은 단말기의 화면 크기에 따라 각각 별개의 위젯 화면이 표시되는 반응형 위젯 프로그램의 일 표시예이다.

도 3에서 보는 바와 같이, 하나의 위젯 프로그램을 실행시킴에 있어 구동되는 단말기가 각기 다른 디스플레이 사양을 가지고 있더라도, 각 단말기에 대응하여 사용자가 원하는 화면 구성, 구성요소의 배치 등으로 표시될 수 있게 하는 것이다.

도시된 것과 같이 1(A) 화면은 비교적 큰 화면 크기를 가지는 단말기에서의 위젯 프로그램 구동상태를 나타낸 것이다. 데스크탑 모니터, TV화면 등의 단말기는 디스플레이 가능한 화면크기가 클 뿐만 아니라 해상도 면에서도 비교적 좋은 성능을 보일 수 있으므로, 이에 대응되는 뷰(View)는 각 구성요소가 충분한 간격을 가질 수 있으며 이미지 역시 가로/세로 크기면에서 타 뷰들에 비해 큰 이미지를 삽입할 수 있다.

1(B) 화면은 1(A) 화면에 비하여 화면크기가 다소 줄어든 단말기에서 보여지는 뷰를 나타낸 것으로서, 1(A)와 비교할 때 각 구성요소들의 배치상태는 유사하지만 구성요소 간의 간격이 좁아지고 이미지의 가로/세로 크기가 작아지는 등 해당 화면크기에 맞게 구성요소가 편집된 상태임을 알 수 있다.

마지막으로 1(C) 화면은 가장 작은 화면크기를 가지는 휴대용 단말기에서의 위젯 구동 모습을 나타낸 것이다. 디스플레이 가능한 화면 면적이 넓지 않기 때문에 이미지의 크기 역시 작은 크기로 수정되어야 하며, 텍스트를 포함하고 있는 구성요소들의 배치 및 간격 면에서 상기 1(A), 1(B)의 뷰와 차이가 난다.

도 5는 위젯을 구성하는 구성요소 중 이미지에 대한 설정정보를 각 뷰(View)별로 나타낸 일실시예이다. 보는 바와 같이 와이드뷰(Wide View. 도 3의 1(A)에 대응) 및 내로우뷰(Narrow View. 도 3의 1(B)에 대응)에서는 위젯의 구성요소로서 이미지가 삽입되며 따라서 이에 따라 해당 이미지의 위치좌표, 가로/세로 크기 값이 설정된다. 반면 모바일뷰(Mobile View. 도 3의 1(C)에 대응)에 있어서는 디스플레이 가능 영역이 부족하기 때문에 이미지를 생략할 수 있으며, 이 경우 위치좌표, 가로/세로 크기 값이 모두 null로 설정된다.

이렇듯 본 발명은 사용자가 상기 복수개의 뷰(View)를 동시에 편집할 수 있는 환경을 제공함으로써, 각 단말기마다의 특성을 고려해 위젯 구성요소들을 편집할 수 있으며, 이로써 다양한 단말기 사용상태에 대응하여 가장 효과적인 컨텐츠 서비스를 제공할 수 있게 된다.

도 4는 반응형 위젯 개발 장치의 표시부(500)의 일표시예를 나타낸 것이다. 표시부(500)는 위젯의 구성요소, 구성요소의 설정정보 또는 디스플레이 설정정보에 따른 하나 이상의 뷰(View) 중 적어도 어느 하나를 표시할 수 있으며, 바람직하게는 상기 세 가지 정보 및 디스플레이 설정정보를 더 포함한 것을 표시할 수 있다.

도 4는 뷰(View)의 개수가 3개인 경우를 상정한 것이며, 그 밖에 위젯 구성요소, 디스플레이 설정정보, 구성요소 설정정보를 나타내는 영역이 개별적으로 존재한다. 한편, 도 4에 개시하고 있는 뷰 및 각 정보 영역의 배치는 표시부(500)에서의 일실시예에 불과한 것이며, 각 영역의 배치는 사용자의 의사에 따라 자유롭게 변경할 수 있어 보다 편한 개발 환경 또는 인터페이스를 제공할 수 있다.

이하에서는 첨부된 도 6 내지 도 8을 기준으로 반응형 위젯 개발 방법에 대해 설명한다.

도 6은 본 발명의 일 실시예에 따른 반응형 위젯 개발 방법을 나타낸 흐름도이다.

도 6을 참조하면, 위젯 설정부(200)가 입력부(100)로부터 디스플레이 설정정보 및 구성요소 설정정보를 수신하면(S100), 위젯 구현부(400)는 디스플레이 설정 및 구성요소 설정과 대응하는 API를 위젯용 API 데이터베이스(300)로부터 호출하고, 호출된 API에 상기 생성된 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현한다(S110). 이때, 위젯 설정부(200)가 생성하는 디스플레이 설정정보는 위젯을 구동하고자 하는 단말기의 종류, 각 단말기의 디스플레이 사양에 따른 뷰(View)개수, 화면크기, 해상도 등을 포함할 수 있다. 또한, 위젯 설정부(200)가 수신하는 구성요소 설정정보는 구성요소의 종류, 구성요소의 가로/세로 크기, 위치좌표 등을 포함할 수 있고, 구성요소의 종류에는 위젯을 구성할 수 있는 이미지, 텍스트, 링크, 표 등을 포함할 수 있다.

단계 S110이 수행되면, 표시부(500)는 상기 구현된 위젯을 표시한다(S120).

도7은 도 6의 반응형 위젯 개발 방법에 구성요소 목록 제공단계가 더 포함된 실시예를 나타낸 흐름도이다.

도 7을 참조하면, 구성요소 목록 제공부(700)는 사용자가 위젯 개발에 있어 이용할 수 있는 구성요소들을 텍스트 형식 또는 이미지 형식으로 나열한 목록을 제공한다(S200). 사용자는 위젯용 구성요소 목록을 제공받아 이로부터 삽입하고자 하는 구성요소를 선택하고, 이어서 해당 구성요소의 위치좌표, 크기 값 등을 입력하여 입력부(100)로부터 위젯 설정부(200)로 각 설정정보를 전송할 수 있다.

그러면, 위젯 설정부(200)는 입력부(100)로부터 디스플레이 설정정보 및 구성요소 설정정보를 수신하고(S210), 위젯 구현부(400)는 디스플레이 설정 및 구성요소 설정과 대응하는 API를 위젯용 API 데이터베이스(300)로부터 호출하고, 호출된 API에 상기 생성된 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현한다(S220).

단계 S220이 수행되면, 표시부(500)는 상기 구현된 위젯을 표시한다(S230).

구성요소 목록 제공 단계는 해당 단계의 특성상 도 6에서 각 단계의 시작 전과 종료 후에 이루어질 수 있으며, 반드시 도 7에 도시된 것과 같이 위젯 설정부(200)가 디스플레이 설정정보 및 구성요소 설정정보를 생성하기 전 단계에서만 구성요소 목록이 제공되는 것은 아니다. 즉, 표시부(500)에서 구현된 위젯을 표시하는 단계 이후에도 구성요소 목록을 제공받음으로써 새로운 구성요소를 선택 할 수도 있다.

도8은 도6의 반응형 위젯 개발 방법에 있어, 위젯설정 저장부(800)에 저장되어 있던 디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API정보를 호출하는 단계(S300)가 S310단계(위젯 설정부가 입력부로부터 입력 수신하여 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 단계) 이전에, 그리고 디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API정보를 위젯설정 저장부(800)에 저장하는 단계(S330)가 S320단계(위젯 구현부가 상기 수신한 설정정보를 적용시켜 위젯을 구현하는 단계) 이후에 더 포함된 반응형 위젯 개발 방법의 일실시예를 나타낸 것이다.

디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API정보를 저장/호출하는 단계(S300, S330)는 앞서 위젯설정 저장부(800)/호출부에 대한 설명에서 언급한 것과 같이 사용자 또는 개발자의 작업 편의를 위한 것으로서, 위젯 개발을 완료하지 못한 경우 또는 개발 완료 후 변경 사항이 생겨 이전 위젯에 대한 편집이 필요한 경우 저장된 API정보를 호출함으로써 개발 작업을 계속 이어나갈 수 있게 해 준다.

한편, 상기 S330단계는 입력부(100)로부터 저장단계 실행을 명하는 별도 입력이 수신되었을 때 실행될 수도 있으나, 바람직하게는 S320단계에서 위젯 구현부(400)가 각 설정정보를 호출된 API에 적용시켜 위젯을 구현한 직후 자동으로 S330단계를 실행시킴으로써 API정보를 위젯설정 저장부(800)에 저장할 수도 있다.

한편, 본 발명의 다른 측면에 따르면, 반응형 위젯 개발 장치에 의해 실행될 때, 위젯 설정부가 입력부로부터 입력 수신하여 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 단계, 위젯 구현부가 디스플레이 설정 및 구성요소 설정과 대응하는 API를 위젯용 API 데이터베이스로부터 호출하고, 호출된 API에 상기 생성된 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 단계, 표시부가 상기 구현된 위젯을 표시하는 단계를 포함하는 반응형 위젯 개발 방법이 프로그램으로 기록되고 전자 장치에서 판독 가능한 기록매체가 제공된다.

이러한 반응형 위젯 개발 방법은 프로그램으로 작성 가능하며, 프로그램을 구성하는 코드들 및 코드 세그먼트들은 당해 분야의 프로그래머에 의하여 용이하게 추론될 수 있다. 또한, 반응형 위젯 개발 방법에 관한 프로그램은 전자장치가 읽을 수 있는 정보저장매체(Readable Media)에 저장되고, 전자장치에 의하여 읽혀지고 실행될 수 있다.

본 발명의 바람직한 실시예 및 응용예에 대하여 도시하고 설명하였지만, 본 발명은 상술한 특정의 실시예 및 응용예에 한정되지 아니하며, 청구범위에서 청구하는 본 발명의 요지를 벗어남이 없이 당해 발명이 속하는 기술분야에서 통상의 지식을 가진 자에 의해 다양한 변형실시가 가능한 것은 물론이고, 이러한 변형실시들은 본 발명의 기술적 사상이나 전망으로부터 구별되어 이해되어서는 안 될 것이다.

본 발명은 위젯 개발 분야에 적용될 수 있으며, 서로 다른 디스플레이 사양을 가지는 다양한 단말기에서도 각각 대응되어 구동될 수 있는 형태의 위젯인, 이른바 반응형 위젯을 개발할 수 있는 환경을 제공할 뿐만 아니라, 사용자 친화적인 위젯 개발 인터페이스를 제공함으로써 해당 분야의 위젯 개발 산업에 긍정적 영향을 미칠 것으로 기대되는 바, 이에 비추어 볼 때 본 발명은 산업상 이용가능성이 있는 유용한 발명이다.

100: 입력부 200: 위젯 설정부
300: 위젯용 API 데이터베이스 400: 위젯 구현부
500: 표시부 600: 제어부
700: 구성요소 목록 제공부 800: 위젯설정 저장부
900: 위젯설정 호출부

Claims (11)

1. 사용자의 입력을 받는 입력부;
   상기 입력을 수신하여 위젯의 디스플레이 설정정보 및 구성요소 설정정보를 생성하는 위젯 설정부;
   위젯에 적용되는 하나 이상의 API(Application Programming Interface)를 저장하는 위젯용 API 데이터베이스;
   위젯의 디스플레이 설정과 대응하는 API 및 구성요소 설정과 대응하는 API를 상기 위젯용 API 데이터베이스로부터 호출하고, 호출된 API에 상기 위젯 설정부가 생성한 디스플레이 설정정보 및 구성요소 설정정보를 적용시켜 위젯을 구현하는 위젯 구현부;
   상기 구현된 위젯을 표시하는 표시부; 및
   상기 입력부, 위젯 설정부, 위젯용 API 데이터베이스, 위젯 구현부 및 표시부를 제어하는 제어부;를 포함하되,
   사용자의 입력을 받기 전후 또는 사용자 입력시 사용자가 위젯 구현에 필요한 구성요소를 선택할 수 있도록 구성요소 목록을 텍스트 및 그림의 형태 중 적어도 하나로 제공하는 구성요소 목록 제공부;
   상기 디스플레이 설정정보 및 구성요소 설정정보가 적용된 위젯용 API를 저장하는 위젯설정 저장부; 및
   상기 위젯설정 저장부에 저장된 API를 호출하는 위젯설정 호출부를 더 포함하고,
   상기 위젯 구현부는
   상기 디스플레이 설정정보를 기반으로 상기 위젯을 구성하는 구성요소를 단말기의 화면 크기에 상응하는 구조로 배치하되,
   상기 위젯 설정부가 생성하는 디스플레이 설정정보는 위젯을 구동하고자 하는 단말기의 종류, 각 단말기의 디스플레이 사양에 따른 뷰(View)개수, 해상도 중 적어도 어느 하나를 포함하고,
   상기 위젯 설정부가 생성하는 구성요소 설정정보는 구성요소의 종류, 구성요소의 가로/세로 크기, 위치좌표 중 적어도 어느 하나를 포함하고,
   상기 구성요소 설정정보 중 구성요소의 종류에는 위젯을 구성할 수 있는 이미지, 텍스트, 링크, 표 중 적어도 어느 하나를 포함하고,
   상기 표시부는 위젯의 구성요소, 구성요소의 설정정보, 디스플레이 설정정보 및 디스플레이 설정정보에 따른 둘 이상의 뷰(View) 중 적어도 어느 하나를 표시하고,
   상기 위젯 구현부는 CSS의 미디어쿼리(media query)를 이용하여 위젯을 구현하는 것을 특징으로 하는 반응형 위젯 개발 장치.
2. 삭제
3. 삭제
4. 삭제
5. 삭제
6. 삭제
7. 삭제
8. 삭제
9. 삭제
10. 삭제
11. 삭제

Images