KR20140097820A

KR20140097820A - 전자장치에서 웹페이지 내의 특정 객체의 속성을 조절하기 위한 방법 및 장치

Info

Publication number: KR20140097820A
Application number: KR1020130010413A
Authority: KR
Inventors: 김경태; 김종석; 최윤정
Original assignee: 삼성전자주식회사
Priority date: 2013-01-30
Filing date: 2013-01-30
Publication date: 2014-08-07
Also published as: AU2014200500A1; EP2763021A3; AU2014200500B2; CN103970412B; EP2763021B1; US20140215310A1; EP2763021A2; CN103970412A

Abstract

전자장치의 동작방법은, 웹페이지를 디스플레이하는 하는 과정과, 상기 웹페이지 내의 특정 객체를 선택하기 위한, 제1 사용자 제스처를 감지하는 과정과, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한, 제2 사용자 제스처를 감지하는 과정과, 상기 제2 사용자 제스처 따라, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 과정을 포함하여, 상하좌우로 확대된 웹페이지를 이동시켜 특정 객체를 검색하는 사용자의 불편함을 줄일 수 있다.

Description

전자장치에서 웹페이지 내의 특정 객체의 속성을 조절하기 위한 방법 및 장치{METHOD AND APPARATUS FOR ADJUSTING ATTRIBUTE OF SPECIFIC OBJECT IN WEB PAGE IN ELECTRONIC DEVICE}

본 발명은 일반적으로 전자장치에 관한 것으로, 특히 전자장치에서 웹페이지 내의 특정 객체의 속성을 조정하는 방법 및 장치에 관한 것이다.

최근 휴대용 단말기는 사용자의 편의를 위해 다양한 기능들을 제공하고 있으며, 동시에 소형 및 경량화되는 추세에 있다. 상기 모바일 단말기의 소형화 추세에 따라 다양한 입력 키들의 구비가 어려워졌으며 이에 상기 소형화 상태에서도 정보를 쉽게 입력할 수 있도록 하는 방법들이 연구 및 제공되고 있다. 그 예로서 현재 터치스크린 패널을 입력수단으로 하는 모바일 단말기가 제공되고 있다.

상기 터치스크린 패널을 입력수단으로 구비한 모바일 단말기는 상기 터치스크린 패널을 이용하여 화면표시를 제어할 수 있는 기능, 즉, 화면을 확대 혹은 축소할 수 있는 기능을 제공하고 있다. 예를 들어, 종래의 모바일 단말기에서는 멀티 터치를 이용한 화면 확대 및 축소 방식을 제공하고 있다.

일반적으로, 터치스크린을 이용하는 모바일 단말기에서 화면확대/축소를 위해, 멀티 터치 핀치 줌(multi-touch pinch zoom) 방식이 사용된다. 멀티 터치 핀치 줌 방식은, 두 터치 지점을 검출한 뒤, 두 터치 지점 사이의 거리가 멀어지면 확대되고, 두 터치 지점 사이 거리가 가까워지면 축소되는 동작을 의미한다.

도 1은 종래 기술에 따른 모바일 단말기에서 웹페이지 화면 확대 예를 도시하고 있다. 상기 도 1에 도시된 바와 같이, 두 터치 지점 사이의 거리가 멀어져서 웹페이지 화면이 확대될 때, 웹페이지 전체가 확대되고 화면에 표시된다.이때, 화면 크기는 고정되어 있기 때문에, 웹페이지의 확대배율이 늘어나면서 웹페이지를 구성하는 일부 객체들이 화면에서 벗어나게 될 수 있다. 즉, 사용자의 시야에서 어느 객체의 일부분 혹은 전체부분이 벗어나게 된다. 여기서, 도 1 (a)는 확대 전의 화면을 나타내며, 도 1(b)은 확대 후의 화면을 나타내고 있다.

특히, 웹페이지를 통해, 사용자가 기사 등을 볼 때에, 확대배율을 줄이면 글자 크기가 너무 작고 확대배율을 늘리면 전체 객체(예: 기사 내용)가 모바일 단말기의 보임창(viewport) 또는 화면을 벗어나게 되어, 좌우로 확대된 웹페이지를 이동시켜(이하 패닝(panning) 동작이라 칭함) 기사내용을 확인해야 한다. 다시 말해, 전체 기사 내용 중 확대배율이 늘어남으로써 일부 기사내용이 벗어나면, 사용자는 벗어난 기사 내용을 확인하기 위해 패닝 동작을 수행하여 벗어난 기사내용이 화면에 보이도록 해야 한다.

상술한 바와 같이, 모바일 단말기의 제한된 화면크기로 인해, 사용자가 웹페이지를 확대하여 웹페이지 내용을 확인할 때, 상하좌우로 확대된 웹페이지를 이동시켜 원하는 객체를 화면에 보이게 해야 하는 불편한 점이 있다.

본 발명의 목적은 전자장치에서 웹페이지 내의 특정 객체의 속성을 조절하기 위한 방법 및 장치를 제공함에 있다.

본 발명의 다른 목적은 전자장치에서 상하좌우로 확대된 웹페이지를 이동시켜 특정 객체를 검색하는 사용자의 불편함을 줄이기 위한 방법 및 장치를 제공함에 있다.

본 발명의 또 다른 목적은 웹브라우저에서 웹페이지 내의 특정 객체의 글자 크기를 조절하는 사용자 인터페이스를 제공함에 있다.

본 발명의 또 다른 목적은 웹브라우저에서 웹페이지 내의 특정 객체의 크기를 조절하는 사용자 인터페이스를 제공함에 있다.

본 발명의 또 다른 목적은 웹브라우저에서 웹페이지 내의 특정 객체를 이동시키는 사용자 인터페이스를 제공함에 있다.

본 발명의 또 다른 목적은 웹브라우저에서 웹페이지 내의 특정 객체를 삭제하는 사용자 인터페이스를 제공함에 있다.

상기한 목적들을 달성하기 위한 본 발명의 제1 견지에 따르면, 전자장치의 동작방법은, 웹페이지를 디스플레이하는 과정과, 상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정과, 상기 멀티 터치 중 어느 하나의 터치가 제1 방향으로 드래그되는 것을 감지하는 과정과, 상기 멀티 터치 중 어느 하나의 터치가 제1 방향으로 드래그될 때, 상기 특정 객체의 글자크기를 크게 조절하여 상기 웹페이지를 디스플레이하는 과정을 포함하되, 상기 특정 객체의 글자크기는 상기 어느 하나의 터치가 제1 방향으로 드래그된 거리에 비례하여 커지고, 상기 특정 객체를 제외한 상기 웹페이지를 구성하고 있는 다른 객체들의 속성들은 변경되지 않는다.

바람직하게, 상기 방법은 상기 특정 객체의 글자크기를 크게 조절하여 상기 웹페이지를 디스플레이하는 과정 후, 상기 멀티 터치 중 어느 하나의 터치가 제2 방향으로 드래그되는 것을 감지하는 과정과, 상기 멀티 터치 중 어느 하나의 터치가 제2 방향으로 드래그될 때, 상기 특정 객체의 글자크기를 원래 크기로 조절하여 상기 웹페이지를 디스플레이하는 과정을 더 포함한다.

바람직하게, 상기 방법은 상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정 후, 상기 멀티 터치를 특정 방향으로 모두 밀어내는 스윕(sweep) 동작을 감지하는 과정과, 상기 스윕 동작이 감지될 시, 상기 특정 객체를 삭제한 후 상기 웹페이지를 재구성하여 디스플레이하는 과정을 더 포함한다.

바람직하게, 상기 방법은 상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정 후, 상기 멀티 터치 중 어느 하나의 터치가 해제되고(release) 다른 터치가 드래그되는 것을 감지하는 과정과, 상기 다른 터치의 드래그가 멈춘 위치에 상기 특정 객체를 이동시키는 과정과, 상기 특정 객체가 이동된 상기 웹페이지를 디스플레이하는 과정을 더 포함한다,

바람직하게, 상기 방법은 상기 특정 객체의 글자크기 변경/삭제/이동에 대한 정보를 상기 웹페이지의 URL(Uniform Resource Locator) 정보와 연관하여 저장하는 과정과, 상기 웹페이지를 다시 로딩할 시, 상기 저장된 정보를 바탕으로 상기 웹페이지 내의 특정 객체의 글자크기를 변경시키거나, 상기 웹페이지 내의 특정 객체를 삭제하거나, 상기 웹페이지 내의 특정 객체를 이동시켜 상기 웹페이지를 디스플레이하는 과정을 더 포함한다.

상기한 목적들을 달성하기 위한 본 발명의 제2 견지에 따르면, 전자장치의 동작방법은, 웹페이지를 디스플레이하는 과정과, 상기 웹페이지 내의 특정 객체를 선택하기 위한, 제1 사용자 제스처를 감지하는 과정과, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한, 제2 사용자 제스처를 감지하는 과정과, 상기 제2 사용자 제스처 따라, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 과정을 포함한다.

바람직하게, 상기 제1 사용자 제스처는, 상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작이고,

상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작은, 상기 웹페이지 내의 특정 객체 중심으로 좌측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 우측 아래쪽에 제2 터치를 수행하거나, 상기 웹페이지 내의 특정 객체 중심으로 우측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 좌측 아래쪽에 제2 터치를 수행한다.

바람직하게, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치를 고정하고 제2 터치를 아래쪽으로 또는 위쪽으로 드래그하는 동작이거나, 제1 터치를 고정하고 제2 터치를 오른쪽으로 또는 왼쪽으로 드래그하는 동작이거나, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치 및 제2 터치를 동시에 해당 방향으로 밀어내는 동작이거나, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치를 해지하고, 제2 터치를 이동하려는 위치로 드래그앤드롭하는 동작이다.

바람직하게, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 과정은, 상기 제2 사용자 제스처 따라, 상기 현재 웹페이지를 구성하고 있는 소스코드의 돔 트리구조 내에, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들을 추가하는 과정과, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 기반으로, 렌더링 트리를 생성하는 과정과, 상기 생성된 렌더링 트리를 검색하여, 각 객체의 위치나 크기를 갖도록 레이아웃을 구성하는 과정과, 상기 구성된 레이아웃을 출력하는 과정을 포함한다.

바람직하게, 상기 구성된 레이아웃을 출력하는 과정은, 상기 현재 웹페이지 내 특정 객체의 크기, 글자크기를 확대하거나 축소하여 웹페이지를 출력하는 과정이거나, 상기 현재 웹페이지 내 특정 객체를 삭제하거나 이동하여 웹페이지를 출력하는 과정인 것을 특징으로 한다.

바람직하게, 상기 방법은 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 소스코드로 변환하는 과정과, 상기 변환된 소스코드를 저장하는 과정을 더 포함한다.

바람직하게, 상기 방법은 상기 돔 트리구조 내에 추가된 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들에 대한 정보를 저장하는 과정과, 상기 정보 저장 후에, 상기 웹페이지가 재로딩될 시, 상기 정보를 이용하여, 웹페이지를 표시하는 과정을 포함한다.

바람직하게, 상기 방법은 상기 웹페이지 내의 특정 객체가 선택되었음을 표시하는 과정을 더 포함한다.

상기한 목적들을 달성하기 위한 본 발명의 제 3 견지에 따르면, 하나 이상의 프로세서; 메모리; 및 상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자 장치로서, 상기 프로그램은, 웹페이지를 디스플레이하고, 상기 웹페이지 내의 특정 객체를 선택하기 위한, 제1 사용자 제스처를 감지하고, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한, 제2 사용자 제스처를 감지하고, 상기 제2 사용자 제스처 따라, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 명령어를 포함한다.

바람직하게, 상기 제1 사용자 제스처는, 상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작이고, 상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작은, 상기 웹페이지 내의 특정 객체 중심으로 좌측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 우측 아래쪽에 제2 터치를 수행하거나, 상기 웹페이지 내의 특정 객체 중심으로 우측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 좌측 아래쪽에 제2 터치를 수행한다.

바람직하게, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치를 고정하고 제2 터치를 아래쪽으로 또는 위쪽으로 드래그하는 동작이거나, 제1 터치를 고정하고 제2 터치를 오른쪽으로 또는 왼쪽으로 드래그하는 동작이거나, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치 및 제2 터치를 동시에 해당 방향으로 밀어내는 동작이거나, 상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에, 제1 터치를 해지하고, 제2 터치를 이동하려는 위치로 드래그앤드롭하는 동작인 것을 특징으로 한다.

바람직하게, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 명령어는, 상기 제2 사용자 제스처 따라, 상기 현재 웹페이지를 구성하고 있는 소스코드의 돔 트리구조 내에, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들을 추가하고, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 기반으로, 렌더링 트리를 생성하고, 상기 생성된 렌더링 트리를 검색하여, 각 객체의 위치나 크기를 갖도록 레이아웃을 구성하고, 상기 구성된 레이아웃을 출력하는 명령어를 포함한다.

바람직하게, 상기 구성된 레이아웃을 출력하는 명령어는, 상기 현재 웹페이지 내 특정 객체의 크기, 글자크기를 확대하거나 축소하여 웹페이지를 출력하거나, 상기 현재 웹페이지 내 특정 객체를 삭제하거나 이동하여 웹페이지를 출력하는 명령어를 포함한다.

바람직하게, 프로그램은, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 소스코드로 변환하고, 상기 변환된 소스코드를 저장하는 명령어를 더 포함한다.

바람직하게, 프로그램은, 상기 돔 트리구조 내에 추가된 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들에 대한 정보를 저장하고, 상기 정보 저장 후에, 상기 웹페이지가 재로딩될 시, 상기 정보를 이용하여, 웹페이지를 표시하는 명령어를 더 포함한다.

바람직하게, 프로그램은, 상기 웹페이지 내의 특정 객체가 선택되었음을 표시하는 명령어를 더 포함한다.

상술한 바와 같이, 웹페이지 내의 특정 객체의 속성을 조절함으로써,상하좌우로 확대된 웹페이지를 이동시켜 특정 객체를 검색하는 사용자의 불편함을 줄일 수 있다.

또한, 모바일 단말기의 화면크기 제한으로 인한 사용자 불편함을 줄이기 위한 웹페이지 내의 특정 객체의 글자 크기를 조절하는 사용자 인터페이스, 웹페이지 내의 특정 객체의 크기를 조절하는 사용자 인터페이스, 웹브라우저에서 웹페이지 내의 특정 객체를 이동시키는 사용자 인터페이스, 및 웹브라우저에서 웹페이지 내의 특정 객체를 삭제하는 사용자 인터페이스를 제공할 수 있다.

도 1은 종래 기술에 따른 모바일 단말기에서 웹페이지 화면 확대 예를 도시하고 있다.
도 2는 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 글자크기를 확대하는 예를 도시하고 있다.
도 3은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 글자크기를 축소하는 예를 도시하고 있다.
도 4는 본 발명의 제1 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 확대하는 예를 도시하고 있다.
도 5는 본 발명의 제2 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 확대하는 예를 도시하고 있다.
도 6은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 축소하는 예를 도시하고 있다.
도 7은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 삭제하는 예를 도시하고 있다.
도 8은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 이동시키는 예를 도시하고 있다.
도 9는 본 발명에 따른 웹페이지에 해당하는 소스코드를 해석하여 출력하는 예를 도시하고 있다.
도 10은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 조절하기 위한 흐름도를 도시하고 있다.
도 11은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내 처리된 특정 객체를 표시하기 위한 흐름도를 도시하고 있다.
도 12는 본 발명의 실시 예에 따른 전자장치의 구성도를 도시하고 있다.

이하 본 발명의 바람직한 실시 예를 첨부된 도면의 참조와 함께 상세히 설명한다. 그리고, 본 발명을 설명함에 있어서, 관련된 공지기능 혹은 구성에 대한 구체적인 설명이 본 발명의 요지를 불필요하게 흐릴 수 있다고 판단된 경우 그 상세한 설명은 생략할 것이다. 그리고 후술되는 용어들은 본 발명에서의 기능을 고려하여 정의된 용어들로서 이는 사용자, 운용자의 의도 또는 관례 등에 따라 달라질 수 있다. 그러므로 그 정의는 본 명세서 전반에 걸친 내용을 토대로 내려져야 할 것이다.

이하, 본 발명은 전자장치에서 웹페이지 내의 특정 객체의 속성을 조절하기 위한 방법 및 장치에 관해 설명하기로 한다.

도 2는 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 글자크기를 확대하는 예를 도시하고 있다.

상기 도 2를 참조하면, 사용자는 터치스크린 위에 두 지점(201, 202)을 터치한 후 소정 시간 멀티 터치를 유지하여 웹페이지 내에서 원하는 객체(object)(200)를 선택한다. 웹 브라우저에 내장되어 있는 여러 가지 객체들은 Window 객체, Document 객체, Location 객체, History 객체, Frame 객체, Navigator 객체, Image 객체, Form 객체 등을 포함한다.

예를 들어, 사용자는 웹페이지의 Window 객체 내의 텍스트를 선택하기 위해, 텍스트의 좌측 위의 한점(202)과 텍스트의 우측 아래의 한점(201)을 터치한 후 멀티 터치를 소정시간 동안 유지한다. 구현에 따라, 텍스트의 우측 위의 한점과 텍스트의 좌측 아래의 한점을 터치한 후 멀티 터치를 소정시간 동안 유지할 수도 있다. 본 발명에서 웹페이지의 특정 객체를 선택하기 위한 터치 지점은 좌측/우측에 제한되지 않으며, 다양한 사용자 제스처에 의해 선택될 수 있다. 일례로, 터치스크린 위에 터치를 유지한 채 특정 객체를 포함하는 특정 모양(원, 혹은 사각형)으로 드래그함으로써 특정 객체를 선택할 수도 있다.

이때, 멀티 터치로 선택된 영역 내에 객체(200)가 선택되며, 포커스링(focus ring)을 사용하여 특정 객체가 선택되었음을 사용자에게 알려준다. 다시 말해, 선택된 객체의 외곽선에 하이라이트를 표시하여, 사용자에게 객체가 선택되었을 알려준다.

도 1 (a)와 같이, 멀티 터치를 통해 객체를 선택한 상태에서, 멀티 터치 중 어느 하나의 터치(예: 우측 아래의 터치(201))를 아래로 드래그하면 또는 좌측 위의 터치를 위로 드래그하면, 도 1 (b)와 같이, 선택된 특정 객체의 폭(width)은 유지된 채 글자크기가 커진다. 이때, 선택된 특정 객체의 폭(width)은 유지된 채 글자크기가 커지므로, 특정 객체의 높이(height)만 늘어나게 된다(210).

한편, 도 1 (b)와 같이, 선택된 특정 객체의 폭(width)은 유지된 채 글자크기가 커진 상태에서, 다시 한번, 멀티 터치를 한 후 하나의 터치를 아래로 드래그하면, 선택된 특정 객체의 폭(width)은 유지된 채 글자크기가 더 커질 수 있다.

도 3은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 글자크기를 축소하는 예를 도시하고 있다.

도 3을 참조하면, 상기 도 2와 같이, 멀티 터치를 통해 객체를 선택한 상태에서, 멀티 터치 중 어느 하나의 터치(예: 우측 아래의 터치)를 아래로 드래그하여, 선택된 특정 객체의 폭(width)은 유지된 채 글자크기를 확대한 후에, 반대로, 도 3 (a)와 우측 아래의 터치를 위로 드래그하면 또는 좌측 위의 터치를 아래로 드래그하면, 도 3(b)과 같이 이전 객체의 글자 크기로 원상복귀된다. 다만, 객체의 폭(width)은 유지된 채 객체의 글자크기가 줄어들어(이전 글자크기) 객체의 높이(height)가 줄어든다(이전 객체의 높이).

구현에 따라, 한 터치가 드래그되는 거리에 따라, 객체의 폭 및 높이는 원래 크기로 유지된 채, 이전 객체의 글자 크기보다 더 작아질 수 있다. 다시 말해, 드래그되는 거리가 길어질수록 글자크기가 비례하여 축소될 수 있다.

도 4는 본 발명의 제1 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 확대하는 예를 도시하고 있다.

상기 도 4를 참조하면, 웹페이지 내의 특정 객체(예: 이미지)만 강조하여 사용자가 표시하고 싶은 경우, 사용자는 터치스크린 위에 두 지점(401, 402)을 터치한 후 소정 시간 멀티 터치를 유지하여 웹페이지 내에서 원하는 객체(400)를 선택한 후. 우측 아래 터치(402)를 우측으로 드래그할 시 또는 좌측 위 터치(401)를 좌측으로 드래그할 시, 현재 웹페이지의 크기는 유지되면서 선택된 객체의 크기만 확대된다. 다시 말해, 선택된 객체의 크기는 확대되지만, 반대로 선택된 객체의 확대배율 크기에 반비례하여 현재 웹페이지를 구성하고 있는 다른 객체들의 크기는 축소되어 전체적으로 웹페이지의 크기는 유지된다.

즉, 선택된 객체 크기 조정에 맞춰 다른 객체들을 줄여줌으로써 사용자의 보임창(viewport) 내에 동일한 객체들이 계속 포함된다.

한편, 선택된 객체의 크기가 확대될 때, 객체의 가로 또는 세로로만 확대되거나 또는 객체의 가로 및 세로 모두가 확대될 수 있다.

또한, 도 4 (b)와 같이, 선택된 특정 객체가 커진 상태에서, 다시 한번, 멀티 터치를 한 후 하나의 터치를 우측으로 드래그하면, 선택된 특정 객체의 크기가 더 커질 수 있다.

도 5는 본 발명의 제2 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 확대하는 예를 도시하고 있다.

상기 도 5를 참조하면, 웹페이지 내의 특정 객체(예: 이미지)만 강조하여 사용자가 표시하고 싶은 경우, 사용자는 터치스크린 위에 두 지점(501, 502)을 터치한 후 소정 시간 멀티 터치를 유지하여 웹페이지 내에서 원하는 객체(500)를 선택한 후. 우측 아래 터치(502)를 우측으로 드래그할 시 또는 좌측 위 터치(501)를 좌측으로 드래그할 시, 선택된 객체의 크기가 확대되고, 현재 웹페이지를 구성하고 있는 다른 객체들의 크기는 현재 크기를 유지한다.

이때, 선택된 객체의 크기확대로 인해 주변 객체들의 크기는 기존 크기를 유지하지만 사용자의 보임창(viewport) 내에 주변 객체들의 일부 혹은 전체가 벗어날 수 있다.

도 6은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체의 크기를 축소하는 예를 도시하고 있다.

상기 도 6을 참조하면, 상기 도 4 (b)와 같이, 멀티 터치를 통해 객체를 선택한 상태에서, 멀티 터치 중 어느 하나의 터치(예: 우측 아래의 터치를 우측으로 드래그하여, 선택된 특정 객체의 크기를 확대한 후에(600), 반대로, 도 6(a)과 멀티 터치 중(601, 602) 우측 아래의 터치(602)를 좌측으로 드래그하면, 도 6(b)과 같이 이전 객체의 크기로 원상복귀된다(610).

구현에 따라, 한 터치가 드래그되는 거리에 따라, 객체의 크기는 이전 객체의 크기보다 더 작아질 수 있다. 다시 말해, 드래그되는 거리가 길어질수록 객체크기 또한 비례하여 축소될 수 있다.

도 7은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 삭제하는 예를 도시하고 있다.

상기 도 7을 참조하면, 사용자가 웹페이지 내의 특정 객체를 보이지 않도록 하고 싶은 경우, 멀티 터치(701, 702)를 통해 객체를 선택한 상태에서(a), 양쪽 터치 모두를 보임창(viewport) 또는 화면 바깥으로 밀어내는 동작인 스윕(sweep) 동작이 감지되면(b), 선택된 특정 객체가 삭제된 웹페이지를 재구성하여(relayout) 표시한다(c).

다른 구현에 있어서, 멀티 터치를 통해 객체를 선택한 상태에서(a), 양쪽 터치 모두를 보임창(viewport) 바깥으로 밀어내는 스윕(sweep) 동작을 하게 되면(b), 웹페이지를 구성하는 객체들의 위치는 변경되지 않으며 다만 선택된 객체는 비활성화(disable)되어 표시되지 않을 수도 있다.

도 8은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 이동시키는 예를 도시하고 있다.

상기 도 8을 참조하면, 사용자가 웹페이지 내의 특정 객체의 위치를 조정하고 싶은 경우, 멀티 터치(801, 802)를 통해 객체(800)를 선택한 상태에서(a), 한쪽 터치(802)를 해지하고 나머지 한쪽 터치(801)를 원하는 위치로 드래그/드롭할 시(b), 특정 객체(800)를 드롭된 위치로 이동시킨다(c). 예를 들어, 특정 객체(800)가 다른 객체(803) 위에 드래그앤드롭될 때, 특정 객체(800)와 다른 객체(803)의 위치가 서로 바뀐다.

도 9는 본 발명에 따른 웹페이지에 해당하는 소스코드를 해석하여 출력하는 예를 도시하고 있다.

상기 도 9를 참조하면, 웹페이지는 HTML(HyperText Markup Language) 또는 XML(eXtensible Markup Language), CSS(Cascading Style Sheets), 자바스크립트(Javascript)의 구성요소를 포함하는 소스코드로 이루어진다.

상기 웹페이지에 해당하는 소스코드가 클라이언트(즉, 모바일 단말기)에서 처리되어 표시되는 과정을 보면, 먼저 모바일 단말기는 서버로부터 해당 웹페이지의 소스코드 또는 HTML 또는 XML 문서(a)를 다운로드한 후, 웹페이지를 화면에 보여주는 렌더링 엔진(Web Rendering Engine)을 이용하여 DOM(Document Object Model) 트리 구조를 생성하기 위해 소스코드를 해석한다(이하 파싱(parsing)이라고 칭함). 즉, 소스코드의 구성요소(태그, 속성, 내용)들을 하나하나 분해되어 DOM(Document Object Model) 트리 구조로 구성된다(b). 상기 렌더링 엔진은 응용프로그램인 웹브라우저 내에 포함되거나 별도의 프로그램으로 존재할 수 있다.

파싱으로 생성된 DOM 트리는 HTML/XML 문서의 내용을 트리 형태로 자료구조화 한 것으로, 이 내용을 화면에 표시하기 위해 다른 형태의 데이터 구조가 필요하다. 다시 말해, DOM 트리는 메모리 내에 내용 자체를 저장하고 있고, 화면에 표시하기 위한 위치 및 크기 정보 그리고 순서 등을 저장하고 있는 렌더링 트리 구조가 필요하다(c). 렌더러 트리는 화면상에 요소를 표시하는 스타일적인 요소와 배치순서 등을 담당하며, 올바른 순서로 화면상에 콘텐츠를 표시한다.

렌더링 트기가 생성될 때, 각 렌더(render) 객체는 위치나 크기가 있지 않다. 각 렌더 객체가 위치와 크기를 갖게 되는 과정(이후 레이아웃(layout)이라 칭함)이 수행된다(d).

마지막으로, 도시하지 않았지만, 레이아웃 과정 다음에 렌더링 트리를 탐색하면서 스타일 정보를 찾아서 각 노드들을 화면상에 표현하는 과정이 수행된다(이하 페인팅(painting)이라 칭함).

도 10은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내의 특정 객체를 조절하기 위한 흐름도를 도시하고 있다.

상기 도 10을 참조하면, 모바일 단말기는 1000단계에서 해당 웹페이지의 특정 객체를 선택하기 위한 사용자의 멀티 터치를 일정시간 동안 감지한다. 예를 들어, 특정 객체의 우측 위쪽과 좌측 아래쪽의 터치를 감지한다. 다른 구현에 따라, 특정 객체의 우측 아래쪽과 좌측 위쪽의 터치를 감지한다. 하지만, 본 발명의 해당 웹페이지의 특정 객체를 선택하기 위한 사용자의 멀티 터치는 다양하게 구성될 수 있으며, 객체의 우측과 좌측의 터치에 제한되지 않는다. 예를 들어, 해당 객체를 중심으로 특정 모양을 드래그할 경우 해당 객체가 선택될 수도 있다.

이후, 모바일 단말기는 1002단계에서 감지된 사용자의 멀티 터치에 기반하여, 멀티 터치 영역 내에 포함된 객체를 선택한다. 여기서, 멀티 터치 영역 내에 포함된 객체는 하나 혹은 하나 이상일 수 있다.

이후, 모바일 단말기는 1004단계에서 해당 웹페이지 내에서 선택된 특정 객체의 확대/축소/이동/삭제를 위한 사용자 제스처를 감지한다.

예를 들어, 선택된 특정 객체의 글자크기를 확대하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 아래쪽 혹은 위쪽으로 드래그하는 사용자 제스처를 감지하고(상기 도 2 참조), 선택된 특정 객체를 확대하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 우측 혹은 좌측으로 드래그하는 사용자 제스처를 감지하고(상기 도 4 및 도 5 참조), 선택된 특정 객체의 글자크기를 축소하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 위쪽 혹은 아래쪽으로 드래그하는 사용자 제스처를 감지하고(상기 도 3 참조), 선택된 특정 객체를 축소하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 좌측 혹은 우측으로 드래그하는 사용자 제스처를 감지하고(상기 도 6 참조), 선택된 특정 객체를 삭제하기 위해, 멀티 터치의 제1 터치 및 제2 터치를 동일한 방향으로 보임창 바깥으로 스윕하는 제스처를 감지하고(상기 도 7 참조), 선택된 특정 객체를 이동하기 위해, 멀티 터치 중 제1 터치를 해지하고 제2 터치를 이동하려는 위치로 드래그앤드롭하는 제스처를 감지한다(상기 도 8 참조).

한편, 해당 웹페이지 내에서 선택된 특정 객체의 확대/축소/이동/삭제를 위한 사용자 제스처를 감지될 때, 현재 표시되는 웹페이지의 소스코드는 변경되지 않지만, 객체의 확대/축소/이동/삭제를 위한 속성값이 도 9 (b)의 돔(DOM) 트리 구조 내에 노드로 추가된다. 다시 말해, 객체가 확대/축소/이동/삭제되기 전의 돔 트리 구조 내에 하나의 노드로 존재하며, 더불어 객체가 확대/축소/이동/삭제된 후의 돔 트리 구조 내에 변경된 노드가 추가된다.

이후, 모바일 단말기는 1006단계에서 돔 트리 구조 내에 추가된 객체에 대한 속성값을 기반으로, 감지된 사용자 제스처에 따라 선택된 특정 객체를 확대/축소/이동/삭제하여 표시한다.

한편, 변경된 돔 트리 구조에 대한 정보, 즉, 해당 웹페이지 내의 특정 객체의 확대/축소/이동/삭제 정보를 저장한 후, 해당 웹페이지가 사용자에 의해 다시 로딩될 때 이전 해당 웹페이지 내의 특정 객체의 확대/축소/이동/삭제 정보를 기반으로, 해당 웹페이지의 특정 객체를 조정하여 표시할 수도 있다.

다시 말해, 조정된 특정 객체의 ID, class를 기반으로 조정된 스타일 값을 해당 웹페이지와 연관지어 저장하여, 추후 다시 웹페이지가 다시 로딩될 때, 변경될 객체의 스타일 값을 적용하여 웹페이지를 표시할 수도 있다.

이후, 본 발명의 절차를 종료한다.

도 11은 본 발명의 실시 예에 따른 모바일 단말기에서 웹페이지 내 처리된 특정 객체를 표시하기 위한 흐름도를 도시하고 있다.

상기 도 11을 참조하면, 모바일 단말기는 1100단계에서 사용자 제스처에 따라, 예를 들어, 멀티 터치 후에 제1 터치를 고정하고 제2 터치를 상하좌우로 드래그하는 제스처, 멀티 터치 후에 제1 터치 및 제2 터치를 보임창 바깥으로 스윕하는 제스처, 또는 멀티 터치 후에 제1 터치를 해지하고 제2 터치를 이동하려는 지점으로 드래그앤드롭하는 제스처에 따라, 특정 객체에 해당하는 속성을 돔 트리 구조에 추가한다. 다시 말해, 사용자 제스처에 따라, 도 9의 (b)와 같은 해당 웹페이지를 표시하기 위해 돔 트리 구조 내에서 객체의 확대/축소/이동/삭제를 위한 노드가 추가되거나 이동하거나 해당 노드 값의 속성값이 변경될 수 있다.

이후, 모바일 단말기는 1102단계에서 사용자 제스처에 따라 변경된 돔 트리 구조를 기반으로 렌더러 트리를 재구성한다.

이후, 모바일 단말기는 1104단계에서 레이아웃을 구성하고, 1106단계에서 레이아웃을 출력한다.

이후, 본 발명의 절차를 종료한다.

도 12는 본 발명의 실시 예에 따른 전자장치의 구성도를 도시하고 있다.

전자장치는, 휴대용 전자 장치(portable electronic device)일 수 있으며, 휴대용 단말기(portable terminal), 이동 단말기(mobile terminal), 이동 패드(mobile pad), 미디어 플레이어(media player), 태블릿 컴퓨터(tablet computer), 핸드헬드 컴퓨터(handheld computer) 또는 PDA(Personal Digital Assistant)와 같은 장치일 수 있다. 또한, 이러한 장치들 중 두 가지 이상의 기능을 결합한 장치를 포함하는 임의의 휴대용 전자 장치일 수도 있다.

상기 도 12를 참조하면, 전자장치는 제어기(1200), 스피커/마이크로폰(1210), 카메라(1220), GPS 수신기(1230), RF 처리기(1240), 센서모듈(1250), 터치스크린(1260), 터치스크린 제어기(1265), 확장 메모리(1270)를 포함하여 구성된다.

제어기(1200)는, 인터페이스(1201), 하나 이상의 프로세서(1202, 1203) 그리고 내부 메모리(1204)를 포함할 수 있다. 경우에 따라서는, 제어기(1200) 전체를 프로세서로 칭하기도 한다. 인터페이스(1201), 애플리케이션 프로세서(1202), 통신 프로세서(1203), 내부 메모리(1204)는 별개의 구성요소일 수 있거나 하나 이상의 집적화된 회로에 집적화될 수 있다.

애플리케이션 프로세서(1202)는 여러 가지의 소프트웨어 프로그램을 실행하여 전자장치를 위한 여러 기능을 수행하고 통신 프로세서(1203)는 음성 통신 및 데이터 통신을 위한 처리 및 제어를 수행한다. 또한, 이러한 통상적인 기능에 더하여, 프로세서(1202, 1203)는 확장 메모리(1270) 혹은 내부 메모리(1204)에 저장되어 있는 특정한 소프트웨어 모듈(명령어 세트)을 실행하여 그 모듈에 대응하는 특정한 여러 가지의 기능을 수행하는 역할도 한다. 즉, 프로세서(1202, 1203)는 확장 메모리(1270) 혹은 내부 메모리(1204)에 저장된 소프트웨어 모듈들과 연동하여 본 발명의 웹페이지 내의 특정 객체를 조절하기 위한 방법을 수행한다.

예를 들어, 애플리케이션 프로세서(1202)가, 해당 웹페이지의 특정 객체를 선택하기 위한 사용자의 멀티 터치를 일정시간 동안 감지한다. 예를 들어, 특정 객체의 우측 위쪽과 좌측 아래쪽의 터치를 감지한다. 다른 구현에 따라, 특정 객체의 우측 아래쪽과 좌측 위쪽의 터치를 감지한다. 하지만, 본 발명의 해당 웹페이지의 특정 객체를 선택하기 위한 사용자의 멀티 터치는 다양하게 구성될 수 있으며, 객체의 우측과 좌측의 터치에 제한되지 않는다. 예를 들어, 해당 객체를 중심으로 특정 모양을 드래그할 경우 해당 객체가 선택될 수도 있다.

그리고, 애플리케이션 프로세서(1202)가, 감지된 사용자의 멀티 터치에 기반하여, 멀티 터치 영역 내에 포함된 객체를 선택한다. 여기서, 멀티 터치 영역 내에 포함된 객체는 하나 혹은 하나 이상일 수 있다.

그리고, 애플리케이션 프로세서(1202)가, 해당 웹페이지 내에서 선택된 특정 객체의 확대/축소/이동/삭제를 위한 사용자 제스처를 감지한다.

그리고, 애플리케이션 프로세서(1202)가, 렌더링 엔진을 이용하여, 돔 트리 구조 내에 추가된 객체에 대한 속성값을 기반으로, 감지된 사용자 제스처에 따라 선택된 특정 객체를 확대/축소/이동/삭제하여 표시한다.

바람직하게, 애플리케이션 프로세서(1202)가, 웹페이지 내 처리된 특정 객체를 표시하기 위해, 사용자 제스처에 따라, 예를 들어, 멀티 터치 후에 제1 터치를 고정하고 제2 터치를 상하좌우로 드래그하는 제스처, 멀티 터치 후에 제1 터치 및 제2 터치를 보임창 바깥으로 스윕하는 제스처, 또는 멀티 터치 후에 제1 터치를 해지하고 제2 터치를 이동하려는 지점으로 드래그앤드롭하는 제스처에 따라, 특정 객체에 해당하는 속성을 돔 트리 구조에 추가한다. 다시 말해, 사용자 제스처에 따라, 도 9의 (b)와 같은 해당 웹페이지를 표시하기 위해 돔 트리 구조 내에서 객체의 확대/축소/이동/삭제를 위한 노드가 추가되거나 이동하거나 해당 노드 값의 속성값이 변경될 수 있다.

또한, 애플리케이션 프로세서(1202)가, 사용자 제스처에 따라 변경된 돔 트리 구조를 기반으로 렌더러 트리를 재구성하고, 레이아웃을 구성하고, 레이아웃을 출력 한다.

한편, 다른 프로세서(도시하지 않음)는 하나 이상의 데이터 프로세서, 이미지 프로세서, 또는 코덱을 포함할 수 있다. 데이터 프로세서, 이미지 프로세서 또는 코덱은 별도로 구성할 수도 있다. 또한, 서로 다른 기능을 수행하는 여러 개의 프로세서로 구성될 수도 있다. 인터페이스(1201)는 전자장치의 터치 스크린 제어기(1265) 및 확장 메모리(1270)에 연결시킨다.

센서모듈(1250)은 인터페이스(1201)에 결합되어 여러 가지 기능을 가능하게 할 수 있다. 예를 들어, 움직임 센서 및 광센서가 인터페이스(1201)에 결합되어 각각 전자 장치의 움직임 감지 및 외부로부터의 빛 감지를 가능하게 할 수 있다. 이외에도, 위치측정 시스템, 온도센서 또는 생체 센서 등과 같은 기타 센서들이 인터페이스(1250)에 연결되어 관련 기능들을 수행할 수 있다.

카메라(1220)는 인터페이스(1201)를 통해 센서모듈(1250)과 결합하여, 사진 및 비디오 클립 레코딩과 같은 카메라 기능을 수행할 수 있다.

RF 처리기(1240)는 통신 기능이 수행된다. 예를 들어, 통신 프로세서(1203)의 제어하에 RF 신호를 기저대역 신호로 변환하여 통신 프로세서(1203)로 제공하거나 통신 프로세서(1203)로부터의 기저대역 신호를 RF 신호로 변환하여 송신한다. 여기서, 통신 프로세서(1203)는 다양한 통신방식에 기저대역신호를 처리한다. 예를 들어, 통신방식은, 이들에 한정하지는 않지만, GSM(Global System for Mobile Communication) 통신방식, EDGE(Enhanced Data GSM Environment) 통신방식, CDMA(Code Division Multiple Access) 통신방식, W-CDMA(W-Code Division Multiple Access) 통신방식, LTE(Long Term Evolution) 통신방식, OFDMA(Orthogonal Frequency Division Multiple Access) 통신방식, Wi-Fi(Wireless Fidelity) 통신방식, WiMax 통신방식 또는/및 Bluetooth 통신방식을 포함할 수 있다.

스피커/마이크로폰(1210)은 음성 인식, 음성 복제, 디지털 레코딩(recording) 및 전화 기능과 같은 오디오 스트림의 입력과 출력을 담당할 수 있다. 즉, 스피커/마이크로폰(1210)은 음성신호를 전기신호로 변환하거나 전기신호를 음성신호로 변환한다. 도시하지 않았지만, 탈부착 가능한(attachable and detachable) 이어폰(ear phone), 헤드폰(head phone) 또는 헤드셋(head set)이 외부포트를 통해 전자장치에 연결될 수 있다.

터치스크린 제어기(1265)는 터치스크린(1260)에 결합될 수 있다. 제스처 스크린(1260) 및 터치 스크린 제어기(1265)는, 이하에 한정되지는 않지만, 제스처 스크린(1260)과의 하나 이상의 접촉점을 결정하기 위한 용량성, 저항성, 적외선 및 표면 음향파 기술들뿐만 아니라 기타 근접 센서 배열 또는 기타 요소들을 포함하는 임의의 멀티 터치 감지 기술을 이용하여 접촉 및 움직임 또는 이들의 중단을 검출할 수 있다.

터치스크린(1260)은 전자장치와 사용자 사이에 입력/출력 인터페이스를 제공한다. 즉, 터치스크린(1260)은 사용자의 터치입력을 전자 장치에 전달한다. 또한 전자 장치로부터의 출력을 사용자에게 보여주는 매개체이다. 즉, 터치스크린은 사용자에게 시각적인 출력을 보여준다. 이러한 시각적 출력(visual output)은 텍스트(text), 그래픽(graphic), 비디오(video)와 이들의 조합의 형태로 나타난다.

터치스크린(1260)은 여러 가지 디스플레이가 사용될 수 있다. 예를 들면, 이에 한정하지는 않지만, LCD(liquid crystal display), LED(Light Emitting Diode), LPD(light emitting polymer display), OLED(Organic Light Emitting Diode), AMOLED(Active Matrix Organic Light Emitting Diode) 또는 FLED(Flexible LED)를 사용할 수 있다.

GPS 수신기(1230)는 인공위성으로부터 받은 신호를 위치, 속도, 시간 등의 정보로 변환한다. 예를 들어, 위성과 GPS 수신기간 거리는 빛의 속도와 신호도달 시간을 곱하면 계산되며, 3개 위성의 정확한 위치와 거리를 구하여 공지된 삼각측량의 원리로 전자장치의 위치가 측정된다.

확장 메모리(1270) 혹은 내부 메모리(1204)는 하나 이상의 자기 디스크 저장 장치와 같은 고속 랜덤 액세스 메모리 및/또는 비휘발성 메모리, 하나 이상의 광 저장 장치 및/또는 플래시 메모리(예컨대, NAND, NOR)를 포함할 수 있다.

확장 메모리(1270) 혹은 내부 메모리(1204)는 소프트웨어를 저장한다. 소프트웨어 구성요소는 운영 체제(operating system) 소프트웨어 모듈, 통신 소프트웨어 모듈, 그래픽 소프트웨어 모듈, 사용자 인터페이스 소프트웨어 모듈 및 MPEG 모듈, 카메라 소프트웨어 모듈, 하나 이상의 애플리케이션 소프트웨어 모듈 등을 포함한다. 또한, 소프트웨어 구성요소인 모듈은 명령어들의 집합으로 표현할 수 있으므로, 모듈을 명령어 세트(instruction set)라고 표현하기도 한다. 모듈은 또한 프로그램으로 표현하기도 한다.

운영 체제 소프트웨어는 일반적인 시스템 동작(system operation)을 제어하는 여러 가지의 소프트웨어 구성요소를 포함한다. 이러한 일반적인 시스템 작동의 제어는, 예를 들면, 메모리 관리 및 제어, 저장 하드웨어(장치) 제어 및 관리, 전력 제어 및 관리 등을 의미한다. 이러한 운영 체제 소프트웨어는 여러 가지의 하드웨어(장치)와 소프트웨어 구성요소(모듈) 사이의 통신을 원활하게 하는 기능도 수행한다.

통신 소프트웨어 모듈은, RF 처리기(1240)를 통해 컴퓨터, 서버 및/또는 휴대용 단말기 등 다른 전자 장치와 통신을 가능하게 할 수 있다. 그리고, 통신 소프트웨어 모듈은, 해당 통신방식에 해당하는 프로토콜 구조로 구성된다.

그래픽 소프트웨어 모듈은 터치스크린(1260) 상에 그래픽을 제공하고 표시하기 위한 여러 가지 소프트웨어 구성요소를 포함한다. 그래픽(graphics)이란 용어는 텍스트(text), 웹 페이지(web page), 아이콘(icon), 디지털 이미지(digital image), 비디오(video), 애니메이션(animation) 등을 포함하는 의미로 사용된다.

사용자 인터페이스 소프트웨어 모듈은 사용자 인터페이스에 관련한 여러 가지 소프트웨어 구성요소를 포함한다. 사용자 인터페이스의 상태가 어떻게 변경되는지 또는 사용자 인터페이스 상태의 변경이 어떤 조건에서 이루어지는지 등에 대한 내용을 포함한다.

카메라 소프트웨어 모듈은 카메라 관련 프로세스 및 기능들을 가능하게 하는 카메라 관련 소프트웨어 구성요소를 포함한다. 애플리케이션 모듈은 렌더링 엔진을 포함하는 웹브라우저(browser), 이메일(email), 즉석 메시지(instant message), 워드 프로세싱(word processing), 키보드 에뮬레이션(keyboard emulation), 어드레스 북(address book), 접촉 리스트(touch list), 위젯(widget), 디지털 저작권 관리(DRM, Digital Right Management), 음성 인식(voice recognition), 음성 복제, 위치 결정 기능(position determining function), 위치기반 서비스(location based service) 등을 포함한다. 메모리(1270, 1204)는 위에서 기술한 모듈 이외에 추가적인 모듈(명령어들)을 포함할 수 있다. 또는, 필요에 따라, 일부의 모듈(명령어들)을 사용하지 않을 수 있다.

본 발명에 관련하여, 애플리케이션 모듈은 웹페이지 내의 특정 객체를 조절하기 위한 명령어들(하기 도 10 내지 도 11 참조)을 포함한다.

예를 들어, 애플리케이션 모듈은, 해당 웹페이지의 특정 객체를 선택하기 위한 사용자의 멀티 터치를 일정시간 동안 감지하고, 감지된 사용자의 멀티 터치에 기반하여, 멀티 터치 영역 내에 포함된 객체를 선택하고, 해당 웹페이지 내에서 선택된 특정 객체의 확대/축소/이동/삭제를 위한 사용자 제스처를 감지한다. 예를 들어, 선택된 특정 객체의 글자크기를 확대하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 아래쪽 혹은 위쪽으로 드래그하는 사용자 제스처를 감지하고(상기 도 2 참조), 선택된 특정 객체를 확대하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 우측 혹은 좌측으로 드래그하는 사용자 제스처를 감지하고(상기 도 4 및 도 5 참조), 선택된 특정 객체의 글자크기를 축소하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 위쪽 혹은 아래쪽으로 드래그하는 사용자 제스처를 감지하고(상기 도 3 참조), 선택된 특정 객체를 축소하기 위해, 멀티 터치 중 제1 터치를 고정한 후 다른 제2 터치를 좌측 혹은 우측으로 드래그하는 사용자 제스처를 감지하고(상기 도 6 참조), 선택된 특정 객체를 삭제하기 위해, 멀티 터치의 제1 터치 및 제2 터치를 동일한 방향으로 보임창 바깥으로 스윕하는 제스처를 감지하고(상기 도 7 참조), 선택된 특정 객체를 이동하기 위해, 멀티 터치 중 제1 터치를 해지하고 제2 터치를 이동하려는 위치로 드래그앤드롭하는 제스처를 감지한다(상기 도 8 참조).

바람직하게, 애플리케이션 모듈은, 웹페이지 내 처리된 특정 객체를 표시하기 위해, 사용자 제스처에 따라, 예를 들어, 멀티 터치 후에 제1 터치를 고정하고 제2 터치를 상하좌우로 드래그하는 제스처, 멀티 터치 후에 제1 터치 및 제2 터치를 보임창 바깥으로 스윕하는 제스처, 또는 멀티 터치 후에 제1 터치를 해지하고 제2 터치를 이동하려는 지점으로 드래그앤드롭하는 제스처에 따라, 특정 객체에 해당하는 속성을 돔 트리 구조에 추가하고, 사용자 제스처에 따라 변경된 돔 트리 구조를 기반으로 렌더러 트리를 재구성하고, 레이아웃을 구성하고, 레이아웃을 출력한다.

또한, 위에서 언급한, 그리고 이하에서 언급할, 본 발명에 따른 전자장치의 다양한 기능들은 하나 이상의 프로세싱(processing) 및/또는 애플리케이션 특정 집적 회로(ASIC, Application Specific Integrated circuit)를 포함하는 하드웨어 및/또는 소프트웨어 및/또는 이들의 결합으로 실행될 수 있다.

한편 본 발명의 상세한 설명에서는 구체적인 실시 예에 관해 설명하였으나, 본 발명의 범위에서 벗어나지 않는 한도 내에서 여러 가지 변형이 가능함은 물론이다. 그러므로 본 발명의 범위는 설명된 실시 예에 국한되어 정해져서는 아니 되며 후술하는 특허청구의 범위뿐만 아니라 이 특허청구의 범위와 균등한 것들에 의해 정해져야 한다.

제어기: 1200
인터페이스: 1201
애플리케이션 프로세서: 1202
통신 프로세서: 1203
RF 처리기: 1240
확장 메모리: 1270

Claims

웹페이지를 디스플레이하는 과정과,
상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정과,
상기 멀티 터치 중 어느 하나의 터치가 제1 방향으로 드래그되는 것을 감지하는 과정과,
상기 멀티 터치 중 어느 하나의 터치가 제1 방향으로 드래그될 때, 상기 특정 객체의 글자크기를 크게 조절하여 상기 웹페이지를 디스플레이하는 과정을 포함하되,
상기 특정 객체의 글자크기는 상기 어느 하나의 터치가 제1 방향으로 드래그된 거리에 비례하여 커지고,
상기 특정 객체를 제외한 상기 웹페이지를 구성하고 있는 다른 객체들의 속성들은 변경되지 않는 전자장치의 동작방법.
제1항에 있어서,
상기 특정 객체의 글자크기를 크게 조절하여 상기 웹페이지를 디스플레이하는 과정 후, 상기 멀티 터치 중 어느 하나의 터치가 제2 방향으로 드래그되는 것을 감지하는 과정과,
상기 멀티 터치 중 어느 하나의 터치가 제2 방향으로 드래그될 때, 상기 특정 객체의 글자크기를 원래 크기로 조절하여 상기 웹페이지를 디스플레이하는 과정을 포함하는 방법.
제1항에 있어서,
상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정 후, 상기 멀티 터치를 특정 방향으로 모두 밀어내는 스윕(sweep) 동작을 감지하는 과정과,
상기 스윕 동작이 감지될 시, 상기 특정 객체를 삭제한 후 상기 웹페이지를 재구성하여 디스플레이하는 과정을 더 포함하는 방법.
제1항에 있어서,
상기 웹페이지 내의 특정 객체를 선택하기 위한, 멀티 터치를 감지하는 과정 후, 상기 멀티 터치 중 어느 하나의 터치가 해제되고(release) 다른 터치가 드래그되는 것을 감지하는 과정과,
상기 다른 터치의 드래그가 멈춘 위치에 상기 특정 객체를 이동시키는 과정과,
상기 특정 객체가 이동된 상기 웹페이지를 디스플레이하는 과정을 더 포함하는 방법.
제1항, 제3항 또는 제4항에 있어서,
상기 특정 객체의 글자크기 변경/삭제/이동에 대한 정보를 상기 웹페이지의 URL(Uniform Resource Locator) 정보와 연관하여 저장하는 과정과,
상기 웹페이지를 다시 로딩할 시, 상기 저장된 정보를 바탕으로 상기 웹페이지 내의 특정 객체의 글자크기를 변경시키거나, 상기 웹페이지 내의 특정 객체를 삭제하거나, 상기 웹페이지 내의 특정 객체를 이동시켜 상기 웹페이지를 디스플레이하는 과정을 더 포함하는 방법.
웹페이지를 디스플레이하는 과정과,
상기 웹페이지 내의 특정 객체를 선택하기 위한, 제1 사용자 제스처를 감지하는 과정과,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한, 제2 사용자 제스처를 감지하는 과정과,
상기 제2 사용자 제스처 따라, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 과정을 포함하는,
전자장치의 동작방법.
제6항에 있어서,
상기 제1 사용자 제스처는, 상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작인 것을 특징으로 하는 방법.
제7항에 있어서,
상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작은,
상기 웹페이지 내의 특정 객체 중심으로 좌측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 우측 아래쪽에 제2 터치를 수행하거나,
상기 웹페이지 내의 특정 객체 중심으로 우측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 좌측 아래쪽에 제2 터치를 수행하는 것을 특징으로 하는 방법.
제6항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치를 고정하고 제2 터치를 아래쪽으로 또는 위쪽으로 드래그하는 동작이거나,
제1 터치를 고정하고 제2 터치를 오른쪽으로 또는 왼쪽으로 드래그하는 동작인 것을 특징으로 하는 방법.
제6항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치 및 제2 터치를 동시에 해당 방향으로 밀어내는 동작인 것을 특징으로 하는 방법.
제6항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치를 해지하고, 제2 터치를 이동하려는 위치로 드래그앤드롭하는 동작인 것을 특징으로 하는 방법.
제6항에 있어서,
상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 과정은,
상기 제2 사용자 제스처 따라, 상기 현재 웹페이지를 구성하고 있는 소스코드의 돔 트리구조 내에, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들을 추가하는 과정과,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 기반으로, 렌더링 트리를 생성하는 과정과,
상기 생성된 렌더링 트리를 검색하여, 각 객체의 위치나 크기를 갖도록 레이아웃을 구성하는 과정과,
상기 구성된 레이아웃을 출력하는 과정을 포함하는 방법.
제12항에 있어서,
상기 구성된 레이아웃을 출력하는 과정은,
상기 현재 웹페이지 내 특정 객체의 크기, 글자크기를 확대하거나 축소하여 웹페이지를 출력하는 과정이거나,
상기 현재 웹페이지 내 특정 객체를 삭제하거나 이동하여 웹페이지를 출력하는 과정인 것을 특징으로 하는 방법.
제12항에 있어서,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 소스코드로 변환하는 과정과,
상기 변환된 소스코드를 저장하는 과정을 더 포함하는 방법.
제12항에 있어서,
상기 돔 트리구조 내에 추가된 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들에 대한 정보를 저장하는 과정과,
상기 정보 저장 후에, 상기 웹페이지가 재로딩될 시, 상기 정보를 이용하여, 웹페이지를 표시하는 과정을 포함하는 방법.
제6항에 있어서,
상기 웹페이지 내의 특정 객체가 선택되었음을 표시하는 과정을 더 포함하는 방법.
하나 이상의 프로세서;
메모리; 및
상기 메모리에 저장되어 있으며 상기 하나 이상의 프로세서에 의하여 실행되도록 구성되는 하나 이상의 프로그램을 포함하는 전자 장치로서,
상기 프로그램은,
웹페이지를 디스플레이하고,
상기 웹페이지 내의 특정 객체를 선택하기 위한, 제1 사용자 제스처를 감지하고,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한, 제2 사용자 제스처를 감지하고,
상기 제2 사용자 제스처 따라, 상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 명령어를 포함하는 전자 장치.
제17항에 있어서,
상기 제1 사용자 제스처는, 상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작인 것을 특징으로 하는 전자장치.
제18항에 있어서,
상기 웹페이지 내의 특정 객체 중심으로 두 개의 터치 지점을 결정하는 동작은,
상기 웹페이지 내의 특정 객체 중심으로 좌측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 우측 아래쪽에 제2 터치를 수행하거나,
상기 웹페이지 내의 특정 객체 중심으로 우측 위쪽에 제1 터치를 수행하고, 상기 웹페이지 내의 특정 객체 중심으로 좌측 아래쪽에 제2 터치를 수행하는 것을 특징으로 하는 전자장치.
제17항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치를 고정하고 제2 터치를 아래쪽으로 또는 위쪽으로 드래그하는 동작이거나,
제1 터치를 고정하고 제2 터치를 오른쪽으로 또는 왼쪽으로 드래그하는 동작인 것을 특징으로 하는 전자장치.
제17항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치 및 제2 터치를 동시에 해당 방향으로 밀어내는 동작인 것을 특징으로 하는 전자장치.
제17항에 있어서,
상기 제2 사용자 제스처는, 상기 제1 사용자 제스처의 멀티 터치 이후에,
제1 터치를 해지하고, 제2 터치를 이동하려는 위치로 드래그앤드롭하는 동작인 것을 특징으로 하는 전자장치.
제17항에 있어서,
상기 특정 객체의 속성이 변경된 웹페이지를 디스플레이하는 명령어는,
상기 제2 사용자 제스처 따라, 상기 현재 웹페이지를 구성하고 있는 소스코드의 돔 트리구조 내에, 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들을 추가하고,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 기반으로, 렌더링 트리를 생성하고,
상기 생성된 렌더링 트리를 검색하여, 각 객체의 위치나 크기를 갖도록 레이아웃을 구성하고,
상기 구성된 레이아웃을 출력하는 명령어를 포함하는 전자장치.
제23항에 있어서,
상기 구성된 레이아웃을 출력하는 명령어는,
상기 현재 웹페이지 내 특정 객체의 크기, 글자크기를 확대하거나 축소하여 웹페이지를 출력하거나,
상기 현재 웹페이지 내 특정 객체를 삭제하거나 이동하여 웹페이지를 출력하는 명령어인 것을 특징으로 하는 전자장치.
제23항에 있어서,
상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들이 추가된 돔 트리구조를 소스코드로 변환하고,
상기 변환된 소스코드를 저장하는 명령어를 더 포함하는 전자장치.
제23항에 있어서,
상기 돔 트리구조 내에 추가된 상기 웹페이지 내의 특정 객체의 속성을 조절하기 위한 노드들에 대한 정보를 저장하고,
상기 정보 저장 후에, 상기 웹페이지가 재로딩될 시, 상기 정보를 이용하여, 웹페이지를 표시하는 명령어를 더 포함하는 전자장치.
제17항에 있어서,
상기 웹페이지 내의 특정 객체가 선택되었음을 표시하는 명령어를 더 포함하는 전자장치.