KR101668881B1

KR101668881B1 - 시각적 랜드마크를 사용해 다이어그램 조직하기

Info

Publication number: KR101668881B1
Application number: KR1020107029202A
Authority: KR
Inventors: 스티븐 엠. 댄톤; 스콧 로버츠; 로렌트 몰리콘; 조단 센; 태드 디. 프라이스; 데이비드 케이. 펙; 유리 리치킨
Original assignee: 마이크로소프트 테크놀로지 라이센싱, 엘엘씨
Priority date: 2008-06-27
Filing date: 2009-06-12
Publication date: 2016-10-24
Also published as: WO2009158219A2; JP2011526039A; BRPI0914999B1; US20140351727A1; CN102077166B; US9766787B2; EP2304540A4; WO2009158219A3; US20090327954A1; US8826174B2; BRPI0914999A2; CA2724684A1; EP2304540B1; KR20110029138A; JP5757035B2; EP2304540A2; CN102077166A

Abstract

본 발명은 시각적 랜드마크를 사용해 다이어그램을 조직하는 방법, 시스템, 및 컴퓨터 프로그램 제품에 관한 것이다. 본 발명의 실시예는 시각적 랜드마크를 사용해 다이어그램 내의 요소를 조직하는 것을 용이하게 한다. 다이어그램의 요소는 시각적 랜드마크의 구성 가능하게 정의된 특성에 따라 정렬되어 다이어그램 내에 일정 수준의 레이아웃 구조를 제공할 수 있다. 따라서, 본 발명의 실시예는 어떤 구조를 제공하지만 자유 형식 편집의 유연성을 유지하는 사용자 경험을 제공한다. 사용자는 시각적 랜드마크를 사용자 정의하여 시각적 랜드마크가 소정 거동을 나타내게 할 수 있다.

Description

시각적 랜드마크를 사용해 다이어그램 조직하기{USING VISUAL LANDMARKS TO ORGANIZE DIAGRAMS}

컴퓨터 시스템 및 관련 기술은 사회의 여러 측면에 영향을 미친다. 실제로, 정보를 처리하는 컴퓨터 시스템 능력은 우리가 생활하고 작업하는 방법을 변형시켜 왔다. 컴퓨터 시스템이 이제는 일상적으로 컴퓨터 시스템의 출현 이전에 수동으로 수행되었던 태스크(예를 들어, 워드 프로세싱, 스케줄링, 회계 등)의 대부분을 수행한다. 좀더 최근에는, 컴퓨터 시스템이 서로 그리고 다른 전자 장치에 결합되어, 그를 통해 컴퓨터 시스템 및 다른 전자 장치가 전자 데이터를 전송할 수 있는 유선 및 무선 컴퓨터 네트워크를 형성하여 왔다. 따라서, 많은 비지니스 관련 프로세스의 성능이 다수의 상이한 컴퓨터 시스템 및/또는 다수의 상이한 컴퓨팅 컴포넌트에 걸쳐 분산된다.

예를 들어, 다이어그래밍 애플리케이션(diagramming applications)이 흐름도, 조직도, 워크플로우 다이어그램 등을 발생시키는데 사용될 수 있다. 대개의 다이어그래밍 애플리케이션은 최소한 툴바 및 캔버스 영역을 포함한다. 사용자는 툴바로부터 형상(예를 들어, 원, 직사각형, 정사각형, 마름모꼴 등)을 끌어 와 캔버스에 추가할 수 있다. 형상은 서로 연결되어 형상 사이의 관계를 지시할 수 있다. 또한, 사용자는 캔버스 내의 기존 형상 및 연결을 재배열하고 제거할 수 있다.

적어도 일부 다이어그래밍 애플리케이션은 사용자가 캔버스의 형상에 대한 조직과 간격을 완전하게 제어할 수 있게 하는 자유 형식 캔버스(free form canvas)를 이용한다. 사용자는 아무 제한없이 그들이 알아서 형상 및 연결을 자유롭게 (재)배열한다. 따라서, 자유 형식 캔버스는 사용자에게 다이어그램을 그들의 정확한 사양에 따라 생성하는 상당한 유연성(significant flexibility)을 부여한다.

그러나, 자유 형식 캔버스를 사용해 다이어그램을 생성하는 것은 또한 지루하고 노동 집약적일 수 있다. 다이어그램의 의미는 다이어그램 내의 형상이 조직되고 적절하게 간격 조정될 때 좀더 적절하게 전달된다(예를 들어, 시각적으로 인지된다). 따라서, 다이어그램이 변할 때마다(예를 들어, 다이어그램에 새로운 형상이 도입되거나 기존 형상이 다이어그램으로부터 제거되거나 다이어그램 내에서 이동될 때마다), 형상의 조직과 간격 그리고 연결은 다이어그램의 새로운 의미를 적절하게 전달하기 위해 조정되어야 할 수 있다.

불행하게도, 자유 형식 캔버스를 사용하면, 사용자는, 예를 들어, 형상의 연결 해제와 재연결, 픽셀 정렬 등과 같은, 이 모든 조정을 스스로 개별적으로 수행할 것이 요구된다. 많은 다이어그램 및 특히 좀더 크고 그리고/또는 좀더 복잡한 다이어그램의 경우, 이들 조정은 그 수가 엄청날 수 있고 구현하는데 상당한 시간이 소요될 수 있다. 더 나아가, 다이어그램에 대한 단일 변화가, 대다수 형상이 조직 해제되게 하고 그리고/또는 부적절하게 간격 조정되게 하는 연쇄 작용(ripple effect)을 가질 수 있다.

따라서, 일부 다이어그래밍 애플리케이션은, 자동-레이아웃 알고리즘(auto-layout algorithm)과 같은, 자동화된 메커니즘을 포함하여, 사용자가 다이어그램에 대한 변화에 응답하여 형상 및 연결을 적절하게 조정하는 것을 지원한다. 자동-레이아웃 알고리즘은 본질적으로 다이어그램 내의 형상 및 연결의 배치를 지시하는 다양한 레이아웃(예를 들어, 조직 및 간격) 제약을 가질 수 있다. 또한, 자동-레이아웃 알고리즘은 하나 이상의 다양하고 상이한 기능을 포함할 수 있다.

예를 들어, (새롭거나 이동된) 형상이 다이어그램 내의 특정 위치에 삽입될 때, 자동-레이아웃 알고리즘은 형상을 특정 위치에서 (캔버스의) 좀더 적절한(예를 들어, 가까운) 위치로 자동 이동시켜 레이아웃 제약을 준수할 수 있다. 유사하게, 형상이 다이어그램 내의 위치로부터 제거될 때(삭제되거나 이동될 때), 자동-레이아웃 알고리즘은 (캔버스의) 제거된 형상에 앞서 연결된 형상을 자동 조정하여 레이아웃 제약을 준수할 수 있다. 형상이 다이어그램 내에서 이동되는 경우에는, 이들 기능 모두 구현될 수 있다. 또한, 자동-레이아웃 알고리즘은 형상을 추가, 삭제, 또는 이동시키는 것에 응답하여 다이어그램 내의 어떤 다른 형상 및 연결을 조정하여 레이아웃 제약을 준수하는(예를 들어, 연쇄 작용을 보상하는) 기능을 포함할 수 있다.

따라서, 자동-레이아웃 알고리즘은 다이어그램 내의 형상 및 연결을 자동 배열하여 다이어그램의 새로운 의미를 좀더 양호하게 전달하는데 이용될 수 있다. 일부 자동-레이아웃 알고리즘은 심지어 레이아웃 제약의 조율(tuning)을 허용하고, 그에 따라, 사용자가 다이어그램의 레이아웃에 대한 일부 제어를 가진다. 그러나, 자동-레이아웃 알고리즘은 통상적으로 규정적이고 (조율된 레이아웃 제약에 기초한다 하더라도) 다이어그램에 대한 비준수 변화(non-compliant changes)를 허용하지는 않는다. 더 나아가, 전형적인 사용자가, 형상을 삽입, 이동, 또는 삭제하기 전에는, 자동-레이아웃 알고리즘이 형상 및/또는 연결된 주변 형상의 위치를 어떻게 조정할 것인지 알 수 있는 방법이 없다.

흔히, 형상은 다이어그램의 기존 형상에 관련한 임의 갯수의 위치에 배치되어 레이아웃 제약을 준수할 수 있다. 그러나, 사용자가 변경시키기 전에는 기존 형상에 관련한 준수 위치가 어떤 것인지를 알 수 있는 방법이 없다. 따라서, 사용자는 자동-레이아웃 알고리즘에 의존해 준수 위치를 선택해야 하지만, 이는, 다이어그램을 위한 사용자의 의도에 기초해, 가장 적절한 준수 위치가 아닐 수도 있다.

그렇지 않다면 자유 형식일 다이어그램에 제한된 조직을 제공하는 일부 추가 도구가 존재한다. 이들 추가 도구는, 정렬, 센터, 및 배포와 같은 능력을 제공할 수 있다. 그러나, 이들 추가 도구는 다수 결함을 가진다. 예를 들어, 이들 추가 도구는 통상적으로 캔버스에 제시되지 않는다. 더 나아가, 이들 추가 도구는, 예를 들어, 새로운 형상을 추가하는 것과 같은, 업데이트를 자동적으로 재적용하지 않는다. 그에 따라, 이들 추가 도구는 자신의 기능을 호출하기 위해 (일정 수준의 빈도로 그리고 일부 환경에서는 사실상 끊임없이) 재적용되어야 한다. 추가적으로, 이들 추가 도구는 통상적으로 사용자 정의가 불가능하다. 사용자 정의 가능성(customizability)의 부재는 전문 레이아웃을 구성하고 보유하는 것을 어렵게 한다.

<간단한 요약>

본 발명은 시각적 랜드마크를 사용해 다이어그램을 조직하는 방법, 시스템, 및 컴퓨터 프로그램 제품에 관한 것이다. 일부 실시예에서는, 시각적 랜드마크가 다이어그램을 조직하는데 사용된다. 컴퓨터 시스템은 다이어그램을 표현하는 하나 이상의 시각적 요소(visual elements)를 제시한다. 컴퓨터 시스템은 다이어그램 내에 하나 이상의 시각적 요소와 함께 시각적 랜드마크를 제시한다. 시각적 랜드마크는 연관된 시각적 요소에 적용되어 연관된 시각적 요소를 시각적 랜드마크에 관련하여 배치하는 하나 이상의 특성을 갖도록 구성된다.

컴퓨터 시스템은 다이어그램에서의 배치를 위해 하나 이상의 시각적 요소 중 하나를 선택하는 입력을 수신한다. 컴퓨터 시스템은 선택된 시각적 요소가 시각적 랜드마크와 연관되어야 한다는 것을 지시하는 추가 입력을 수신한다. 컴퓨터 시스템은 선택된 시각적 요소를 시각적 랜드마크의 하나 이상의 해당 특성에 따라 시각적 랜드마크에 관련하여 자동 배치하여 선택된 시각적 요소를 다이어그램 내에서 조직한다. 선택된 시각적 요소는 추가 입력을 수신하는 것에 응답하여 배치된다.

다른 실시예에서, 시각적 랜드마크는 다이어그램을 조직하는데 사용하기 위해 사용자 정의된다. 컴퓨터 시스템은 다이어그램의 시각적 요소를 조직하는데 사용될 수 있는 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시한다. 컴퓨터 시스템은 시각적 랜드마크의 시각적 제시를 사용자가 입력한 입력(user-entered input)에 따라 변경한다.

컴퓨터 시스템은 사용자가 입력한 입력에 따라 시각적 랜드마크의 하나 이상의 특성을 구성한다. 구성된 하나 이상의 특성은 연관된 시각적 요소를 시각적 랜드마크에 관련하여 자동 배치하여 연관된 시각적 요소를 다이어그램 내에서 조직하는 방법을 지시한다. 컴퓨터 시스템은 변경된 시각적 제시를 구성된 하나 이상의 특성과 함께 새로운 시각적 랜드마크로서 저장한다. 새로운 시각적 랜드마크는 사용자가 입력한 입력에 따라 다이어그램을 조직하는데 사용하기 위한 것이다.

이 요약은 상세한 설명에서 부연되는 개념 중 일부를 간략화된 형태로 소개하기 위해 제공된다. 이 요약은, 청구된 주제의 핵심 사양 또는 본질적인 사양을 식별하는데 사용하기 위한 것도 청구된 주제의 범위를 판정하는 것을 지원하는데 사용하기 위한 것도 아니다.

본 발명의 추가 사양 및 이점이 다음 설명에서 기술될 것이고, 일부는 설명으로부터 명백해 질 것이며, 또는 본 발명의 실시로부터 학습될 수 있다. 본 발명의 사양 및 이점은 첨부된 청구항에서 특별히 지적되는 도구와 조합에 의해 실현되고 획득될 수 있다. 본 발명의 이들 및 다른 사양은 다음 설명 및 첨부된 청구항으로부터 좀더 명백해 질 것이고, 또는 다음에서 기술되는 본 발명의 실시에 의해 학습될 수 있다.

본 발명의 앞서 언급된 다른 이점 및 사양이 획득될 수 있는 방식을 설명하기 위해, 앞서 간략하게 설명된 본 발명의 좀더 구체적인 설명이, 첨부된 도면에서 예시되는 그것의 특정 실시예를 참조하여 제공될 것이다. 이들 도면은 본 발명의 통상적인 실시예를 묘사할 뿐이므로 본 발명의 범위를 제한하는 것으로 간주되어서는 안된다는 것을 이해한 상태에서, 본 발명이 첨부 도면을 사용해 좀더 상세하게 추가적으로 기술되고 설명될 것인데:
도 1은 시각적 랜드마크를 사용해 다이어그램을 조직하는 것을 용이하게 하는 예시적 컴퓨터 아키텍처를 예시한다.
도 2는 시각적 랜드마크를 사용해 다이어그램을 조직하기 위한 예시적 방법의 흐름도를 예시한다.
도 3a 내지 도 3d는 시각적 랜드마크를 사용해 다이어그램을 조직하는 실례를 예시한다.
도 4a 내지 도 4e는 시각적 랜드마크를 사용해 다이어그램을 조직하는 다른 실례를 예시한다.
도 5a 내지 도 5c는 시각적 랜드마크를 사용해 다이어그램을 조직하는 또 다른 실례를 예시한다.
도 6a 및 도 6b는 시각적 랜드마크를 사용해 다이어그램을 조직하는 또 다른 실례를 예시한다.
도 7a 내지 도 7c는 시각적 랜드마크를 사용해 다이어그램을 조직하는 또 다른 실례를 예시한다.
도 8a 내지 도 8c는 시각적 랜드마크를 사용해 다이어그램을 조직하는 또 다른 실례를 예시한다.
도 9a 및 도 9b는 시각적 랜드마크를 사용해 다이어그램을 조직하는 또 다른 실례를 예시한다.
도 10a 내지 도 10d는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 바(snap bars)의 실례를 예시한다.
도 11a 및 도 11b는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 베지어(snap beziers)의 실례를 예시한다.
도 12a 내지 도 12c는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 아크(snap arcs)의 실례를 예시한다.
도 13a 내지 도 13c는 다이어그램의 요소를 조직하는데 사용될 수 있는 중력 함정(gravity wells)의 실례를 예시한다.
도 14a 및 도 14b는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 스택(snap stack)의 실례를 예시한다.
도 15는 다이어그램의 요소를 조직하는데 사용될 수 있는 스티키 박스(sticky box)의 실례를 예시한다.
도 16은 다이어그램의 요소를 조직하는데 사용될 수 있는 스티키 라쏘(sticky lasso)의 실례를 예시한다.
도 17은 시각적 랜드마크를 사용자 정의하는 예시적 방법의 흐름도를 예시한다.
도 18은 사용자 정의된 시각적 랜드마크의 실례를 예시한다.

본 발명은 시각적 랜드마크를 사용해 다이어그램을 조직하는 방법, 시스템, 및 컴퓨터 프로그램 제품에 관한 것이다. 일부 실시예에서는, 시각적 랜드마크가 다이어그램을 조직하는데 사용된다. 컴퓨터 시스템은 다이어그램을 제시하는 하나 이상의 시각적 요소를 제시한다. 컴퓨터 시스템은 다이어그램 내에 하나 이상의 시각적 요소와 함께 시각적 랜드마크를 제시한다. 시각적 랜드마크는 연관된 시각적 요소에 적용되어 연관된 시각적 요소를 시각적 랜드마크에 관련하여 배치하는 하나 이상의 특성을 갖도록 구성된다.

컴퓨터 시스템은 하나 이상의 시각적 요소 중 다이어그램에 배치하기 위한 하나를 선택하는 입력을 수신한다. 컴퓨터 시스템은 선택된 시각적 요소가 시각적 랜드마크와 연관되어야 한다는 것을 지시하는 추가 입력을 수신한다. 컴퓨터 시스템은 선택된 시각적 요소를 시각적 랜드마크의 하나 이상의 해당 특성에 따라 시각적 랜드마크에 관련하여 자동 배치하여 선택된 시각적 요소를 다이어그램 내에서 조직한다. 선택된 시각적 요소는 추가 입력을 수신하는 것에 응답하여 배치된다.

다른 실시예에서, 시각적 랜드마크는 다이어그램을 조직하는데 사용하기 위해 사용자 정의된다. 컴퓨터 시스템은 다이어그램의 시각적 요소를 조직하는데 사용될 수 있는 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시한다. 컴퓨터 시스템은 시각적 랜드마크의 시각적 제시를 사용자가 입력한 입력에 따라 변경한다.

컴퓨터 시스템은 시각적 랜드마크의 하나 이상의 특성을 사용자가 입력한 입력에 따라 구성한다. 구성된 하나 이상의 특성은 연관된 시각적 요소를 시각적 랜드마크에 관련하여 자동 배치하여 연관된 시각적 요소를 다이어그램 내에서 조직하는 방법을 지시한다. 컴퓨터 시스템은 변경된 시각적 제시를 구성된 하나 이상의 특성과 함께 새로운 시각적 랜드마크로서 저장한다. 새로운 시각적 랜드마크는 사용자가 입력한 입력에 따라 다이어그램을 조직하는데 사용하기 위한 것이다.

본 발명의 실시예는, 다음에서 부연되는 바와 같이, 컴퓨터 하드웨어를 포함하는 특수 목적 또는 범용 컴퓨터를 구비하거나 이용할 수 있다. 또한, 본 발명의 범위 내의 실시예는 컴퓨터-실행 가능 명령어 및/또는 데이터 구조를 전달하거나 저장하기 위한 물리적 및 다른 컴퓨터-판독 가능 매체를 포함한다. 그러한 컴퓨터-판독 가능 매체는 범용 또는 특수 목적 컴퓨터 시스템에 의해 액세스될 수 있는 이용 가능한 어떤 매체일 수 있다. 컴퓨터-실행 가능 명령어를 저장하는 컴퓨터-판독 가능 매체는 물리적 스토리지 매체이다. 컴퓨터-실행 가능 명령어를 전달하는 컴퓨터-판독 가능 매체는 전송 매체이다. 따라서, 한정이 아닌 실례로써, 본 발명의 실시예는 적어도 2개의 완전히 상이한 종류의 컴퓨터-판독 가능 매체: 물리적 스토리지 매체 및 전송 매체를 구비할 수 있다.

물리적 스토리지 매체로는 RAM, ROM, EEPROM, CD-ROM 또는 다른 광 디스크 스토리지, 자기 디스크 스토리지 또는 다른 자기 스토리지 장치, 또는 소정 프로그램 코드 수단을 컴퓨터-실행 가능 명령어 또는 데이터 구조의 형태로 저장하는데 사용될 수 있으며 범용 또는 특수 목적 컴퓨터에 의해 액세스될 수 있는 기타 매체를 들 수 있다.

"네트워크"는 컴퓨터 시스템 및/또는 모듈 및/또는 다른 전자 장치 사이에서 전자 데이터 전송을 가능하게 하는 하나 이상의 데이터 링크로서 정의된다. 정보가 네트워크 또는 다른 통신 접속(고정 배선(hardwired), 무선, 또는 고정 배선이나 무선의 조합)을 통해 컴퓨터쪽으로 전송되거나 제공될 때, 컴퓨터는 그 접속을 정확하게 전송 매체로서 간주한다. 전송 매체는 소정 프로그램 코드 수단을 컴퓨터-실행 가능 명령어 또는 데이터 구조의 형태로 전달하는데 사용될 수 있으며 범용 또는 특수 목적 컴퓨터에 의해 액세스될 수 있는 네트워크 및/또는 데이터 링크를 포함할 수 있다. 상기한 것의 조합도 컴퓨터-판독 가능 매체의 범위 내에 포함되어야 한다.

더 나아가, 다양한 컴퓨터 시스템 컴포넌트의 실행시에, 컴퓨터-실행 가능 명령어 또는 데이터 구조 형태의 프로그램 코드 수단이 전송 매체에서 물리적 스토리지 매체쪽으로(또는 그 반대로) 자동 전송될 수 있다는 것을 이해할 수 있어야 한다. 예를 들어, 네트워크 또는 데이터 링크를 통해 수신되는 컴퓨터-실행 가능 명령어 또는 데이터 구조는 네트워크 인터페이스 모듈(예를 들어, "NIC") 내의 RAM에 버퍼링된 다음 궁극적으로 컴퓨터 시스템 RAM 및/또는 컴퓨터 시스템의 휘발성이 덜한(less volatile) 물리적 스토리지 매체쪽으로 전송될 수 있다. 따라서, 물리적 스토리지 매체가, 이 또한(또는 심지어 주로) 전송 매체를 이용하는 컴퓨터 시스템 컴포넌트에 포함될 수 있다는 것을 이해할 수 있어야 한다.

컴퓨터-실행 가능 명령어는, 예를 들어, 범용 컴퓨터, 특수 목적 컴퓨터, 또는 특수 목적 처리 장치가 특정 기능 또는 기능 그룹을 수행하게 하는 명령어 및 데이터를 구비한다. 컴퓨터 실행 가능 명령어는, 예를 들어, 이진수, 어셈블리 언어와 같은 중간 포맷 명령어, 또는 심지어 소스 코드일 수 있다. 주제가 구조적 사양 및/또는 방법론적 행위에 특정적인 언어로 설명되었지만, 첨부된 청구항에서 정의되는 주제가 반드시 앞서 설명된 사양 또는 행위로 제한될 필요는 없다는 것을 이해할 수 있어야 한다. 오히려, 설명된 사양 및 행위는 청구항을 구현하는 예시적 형태로서 개시된다.

당업자라면, 본 발명이, 퍼스널 컴퓨터, 데스크탑 컴퓨터, 랩탑 컴퓨터, 메시지 프로세서, 핸드-헬드 장치, 멀티-프로세서 시스템, 마이크로프로세서-기반 또는 프로그래머블 가전, 네트워크 PC, 미니컴퓨터, 메인프레임 컴퓨터, 휴대 전화, PDA, 페이저, 라우터, 스위치 등을 포함하는, 다수 유형의 컴퓨터 시스템 구성을 갖춘 네트워크 컴퓨팅 환경에서 실시될 수 있다는 것을 알 수 있을 것이다. 또한, 본 발명은 네트워크를 통해 (고정 배선 데이터 링크, 무선 데이터 링크, 또는 고정 배선과 무선 데이터 링크의 조합에 의해) 링크되는 로컬 및 원격 컴퓨터 시스템 모두가 태스크를 수행하는 분산 시스템 환경에서 실시될 수 있다. 분산 시스템 환경에서, 프로그램 모듈은 로컬 및 원격 메모리 스토리지 장치 모두에 배치될 수 있다.

도 1은 자동-레이아웃 준수 다이어그램의 유연성 있는 생성을 용이하게 하는 예시적 컴퓨터 아키텍처(100)를 예시한다. 도 1을 참조하면, 컴퓨터 아키텍처(100)는 사용자-인터페이스(101), 다이어그램 편집기(102), 및 렌더링 모듈(107)을 포함한다. 묘사된 컴포넌트 각각은, 예를 들어, LAN(Local Area Network), WAN(Wide Area Network), 및 심지어 인터넷과 같은, 네트워크를 통해 서로 접속될 수 있다(또는 네트워크의 일부일 수 있다). 따라서, 묘사된 컴포넌트 뿐만 아니라 기타 접속 컴포넌트 각각이 메시지 관련 데이터를 생성할 수 있고 네트워크를 통해 메시지 관련 데이터(예를 들어, IP(Internet Protocol) 데이터그램 및, TCP(Transmission Control Protocol), HTTP(Hypertext Transfer Protocol), SMTP(Simple Mail Transfer Protocol) 등과 같은, IP 데이터그램을 이용하는 다른 상위 계층 프로토콜)를 교환할 수 있다.

입력 장치(114)는, 예를 들어, 키보드 및/또는 마우스와 같은, 다양한 입력 장치를 포함할 수 있다. 사용자(113)는 입력 장치(114)를 이용해 컴퓨터 아키텍처(100)에 데이터를 입력할 수 있다. 디스플레이 장치(108)는 컴퓨터 아키텍처(100)로부터 출력되는 데이터를 디스플레이(109)에 시각적으로 제시할 수 있다. 사용자(113)는 디스플레이(109)에서 디스플레이되는 데이터를 시각적으로 인지할 수 있다.

일반적으로, 사용자-인터페이스(101)는 컴퓨터 아키텍처(100)의 사용자(113)와 나머지 컴포넌트 사이의 중간 소프트웨어 계층으로서 기능하도록 구성된다. 사용자-인터페이스(101)는, 예를 들어, 드라이버와 같은, 적절한 소프트웨어로써 입력 장치(114)로부터 입력을 수신하고 디스플레이 장치(108)쪽으로 출력을 송신하도록 구성될 수 있다. 따라서, 사용자-인터페이스(101)는 사용자 입력을, 예를 들어, 다이어그램 편집기(102)와 같은, 다른 컴포넌트쪽으로 포워딩할 수 있다. 또한, 사용자-인터페이스(101)는, 예를 들어, 렌더링 모듈(107)과 같은, 다른 컴포넌트로부터의 렌더링 가능한 이미지 데이터를 디스플레이 장치(108)쪽으로 포워딩할 수 있다.

다이어그램 편집기(102)는 렌더링 가능한 다이어그램을 위해 다이어그램 데이터를 편집하도록 구성된다. 다이어그램 데이터는 다이어그램의 시각적 요소를 위한 형상 유형, 형상 위치, 및 형상 사이의 연결을 지시할 수 있다. 사용자-입력에 응답하여, 다이어그램 편집기(102)는 다이어그램의 시각적 요소를 위한 형상 위치, 형상 유형, 및 연결을 표현하는 다이어그램 데이터를 추가, 삭제, 및 변경할 수 있다. 일부 실시예에서는, 사용자 행동으로 인해, 다이어그램 편집기(102)가 다이어그램 데이터에 대한 일련의 편집을 수행한다. 예를 들어, 다이어그램에서의 시각적 요소 배치에 응답하여, 다이어그램 편집기(102)는 a) 다이어그램 데이터를 시각적 요소를 위한 형상의 위치 및 유형을 포함하도록 편집할 수 있고 b) 다이어그램 데이터를 형상과 다른 적절한 형상 사이의 연결을 포함하도록 편집할 수 있다.

또한, 다이어그램 편집기(102)는 시각적 랜드마크 저장소(135)로부터의 시각적 랜드마크에 액세스할 수 있고 시각적 랜드마크를 표현하는 데이터를 다이어그램 데이터에 포함시킬 수 있다. 따라서, 다이어그램 내의 형상과 유사하게, 다이어그램 편집기(102)는 다이어그램 내의 시각적 랜드마크를 위한 시각적 랜드마크 위치, 유형, 및 연결을 표현하는 다이어그램 데이터 또한 추가, 삭제, 및 변경할 수 있다. 시각적 랜드마크 동작 또한 사용자-입력에 대한 응답일 수 있다.

렌더링 모듈(107)은 다이어그램을 디스플레이 장치(108)에 렌더링하기 위해 다이어그램 데이터로부터 상호 연결된 시각적 요소를 발생시키도록 구성된다. 다이어그램은, 흐름도, 워크플로우 다이어그램, 조직도, 프로세스 다이어그램, 개념도 등을 포함하는, 다양하고 상이한 다이어그램 유형 중 어떤 것일 수 있다. 다이어그램은, 예를 들어, 원, 마름모꼴, 정사각형, 직사각형, 삼각형 등과 같은, 기하학적 형상을 포함하는 다양하고 상이한 시각적 요소 중 어떤 것을 포함할 수 있다. 시각적 요소 사이의 연결은 선으로 표현될 수 있다.

묘사된 바와 같이, 렌더링 모듈(107)은 시각적 지원 모듈(117)을 포함한다. 시각적 지원 모듈(117)은 사용자가 다이어그램을 생성하고 편집하는 것을 지원하기 위해 사용자에게 시각적 피드백을 제공하도록 구성된다. 예를 들어, 다이어그램의 시각적 요소에 대한 사용자 선택시에, 시각적 지원 모듈(117)은 시각적 요소의 선택을 지시하는 시각적 피드백을 제공할 수 있다. 시각적 피드백은 선택을 지시하기 위해 요소의 시각적 특징 및 연결을 변경하는 것(예를 들어, 시각적 요소의 아웃라인을 회색으로 표시하는 것)을 포함할 수 있다. 또한, 시각적 피드백은 다이어그램에서의 요소 및 연결의 레이아웃시에 사용자를 지원하기 위해 다이어그램에 추가적인 시각적 정보를 보충하는 것을 포함할 수 있다.

도 3a 내지 도 3d는 시각적 랜드마크를 사용해 다이어그램(300)을 조직하는 것을 예시한다.

도 2는 시각적 랜드마크를 사용해 다이어그램을 조직하는 방법(200)의 흐름도를 예시한다. 방법(200)은 컴퓨터 아키텍처(100)에서 묘사된 컴포넌트 및 데이터를 참조하여 그리고 다이어그램(300)을 참조하여 설명될 것이다.

방법(200)은 다이어그램을 표현하는 하나 이상의 시각적 요소에 대한 배열을 제시하는 행위(행위 201)를 포함한다. 방법(200)은 하나 이상의 시각적 요소와 함께 시각적 랜드마크를 다이어그램 내에 제시하는 행위(행위 202)를 포함하는데, 시각적 랜드마크는 연관된 시각적 요소에 적용되어 연관된 시각적 요소를 시각적 랜드마크에 관련하여 배치하는 하나 이상의 특성을 갖도록 구성된다. 예를 들어, 사용자-인터페이스(101)는 디스플레이 장치(108)에서 시각적 요소(141)를 제시할 수 있다. 시각적 요소(141)는 요소 및 하나 이상의 랜드마크를 포함할 수 있다. 예를 들어, 도 3a를 참조하면, 요소(301) 및 스냅 바(302)가 디스플레이(109)에 제시될 수 있다. 스냅 바(302)는 요소(301)에 적용되어 요소(301)를 스냅 바(302)에 관련하여 배치하는 하나 이상의 특성을 갖도록 구성될 수 있다. 예를 들어, 스냅 바(302)는 요소(301)를 스냅 바(302)에 수직 정렬하는 특성을 포함할 수 있다.

방법(200)은 다이어그램에서의 배치를 위해 시각적 요소를 선택하는 입력을 수신하는 행위(행위 203)를 포함한다. 예를 들어, 사용자-인터페이스(101)는 사용자-요소 선택 입력(133)(예를 들어, 요소(301)에서의 마우스 클릭)을 수신할 수 있다. 사용자-인터페이스(101)는, 사용자-요소 선택 입력(133)이 새로운 또는 기존 시각적 요소의 선택이라는 것을 판정할 수 있다. 그에 따라, 사용자-인터페이스(101)는 선택 입력(161)을 렌더링 모듈(107)쪽으로 포워딩할 수 있다.

(예를 들어, 툴바로부터) 새로운 요소가 다이어그램에서의 포함을 위해 선택될 수 있다. (예를 들어, 다이어그램에 이미 존재하는) 기존 요소가 다이어그램 내에서의 이동을 위해 선택될 수 있다. 예를 들어, 도 3a를 참조하면, 요소(301; 새로운 요소 또는 다이어그램(300)이 아닌 곳으로부터의 요소)가 다이어그램(300)으로의 포함 또는 다이어그램(300) 내에서의 이동을 위해 선택될 수 있다. 기존 요소가 이동을 위해 선택되는 경우, 기존 요소의 현재 표현은 자신의 현재 위치를 유지할 수 있다. 현재 표현과 함께, 기존 요소의 선택된 임시 표현이 생성될 수 있다. 요소의 선택된 임시 표현이 다이어그램 내에서 이동되어 다이어그램의 상이한 위치로의 요소의 가능한 이동을 표현할 수 있다. 기존 요소의 실제 이동이 궁극적으로 발생하면, 요소의 현재 위치는 새로운 위치로 이동된다.

방법(200)은 선택된 시각적 요소가 선택되는 것을 지시하는 시각적 피드백을 제공하는 행위(행위 204)를 포함한다. 예를 들어, 시각적 지원 모듈(117)은 디스플레이 장치(108)에서의 디스플레이를 위해 요소 선택 시각적 피드백(142)을 제공할 수 있다. 요소 선택 시각적 피드백은 선택된 시각적 요소가 선택되는 것을 지시하기 위해 선택된 시각적 요소의 시각적 특징을 어떻게든 변경하는 것으로부터 유래할 수 있다. 예를 들어, 이제 도 3b를 참조하면, 사용자(113)는 커서(391)로 요소(301)를 선택하였다. 묘사된 바와 같이, 요소(301)는 요소(301)가 선택되는 것을 지시하기 위해 (실선이 아닌) 점선으로 표현된다. 그러나, 예를 들어, 색상, 밝기, 크기, 형상 등에 대한 변화와 같은, 다른 시각적 특징 변화 또한 가능하다. 점선의 시각적 지각(또는 다른 시각적 특징)은 요소(301)가 선택되는 것을 사용자(113)가 좀더 쉽게 판정할 수 있게 한다. 요소(301)가 기존 요소라면, 요소(301)의 현재 표현은 다이어그램(300)의 (표시되지 않은) 다른 곳에 남아 있을 수 있다.

방법(200)은 선택된 시각적 요소가 시각적 랜드마크와 연관되어야 한다는 것을 지시하는 추가 입력을 수신하는 행위(행위 205)를 포함한다. 예를 들어, 도 1과 도 3c 양자를 참조하면, 사용자-인터페이스(101)는 요소(301)가 이동됨으로써 그것이 (예를 들어, 디스플레이(109)에) 적어도 부분적으로 스냅 바(302)와 공동-배치된다는 것을 지시하는 이동 입력(132)을 검출할 수 있다. 사용자-인터페이스(101)는 이동 입력(132)이 렌더링 모듈(107)에 관련된다는 것을 판정할 수 있고 이동 데이터(162)를 렌더링 모듈(107)쪽으로 포워딩할 수 있다. 렌더링 모듈(107)은 이동 데이터(162)로부터 요소(301)가 적어도 부분적으로 스냅 바(302)와 공동-배치된다는 것을 판정할 수 있다.

방법(200)은 선택된 시각적 요소를 다이어그램 내에서 조직하기 위해 추가 입력을 수신하는 것에 응답하여 시각적 랜드마크에 대한 하나 이상의 해당 특성에 따라 선택된 시각적 요소를 시각적 랜드마크에 관련하여 배치하는 것에 의해 하나 이상의 시각적 요소에 대한 배열을 자동 업데이트하는 행위(행위 206)를 포함한다. 예를 들어, 이동 데이터(162)(예를 들어, 요소(301)와 스냅 바(302)의 공동-위치)에 응답하여, 다이어그램 편집기(102)는 스냅 바(302)에 대한 하나 이상의 특성에 따라 요소(301)를 스냅 바(302)에 관련하여 배치하는 것에 의해 (예를 들어, 다이어그램(300)을 표현하는) 다이어그램 데이터(112)를 업데이트할 수 있다. 요소(301)를 스냅 바(302)에 관련하여 배치하는 것은 요소(301)를 다이어그램(300) 내에서 조직하도록 수행될 수 있다.

방법(200)은 하나 이상의 시각적 요소에 대한 업데이트된 배열을 제시하여 선택된 시각적 요소의 다이어그램 내에서의 조직을 반영하는 행위(행위 207)를 포함한다. 예를 들어, 도 1 및 도 3d를 참조하면, 렌더링 모듈(107)은 업데이트된 시각적 요소(143;예를 들어, 도 3d에서와 같이 배열되는 요소(301) 및 스냅 바(302))를 디스플레이 장치(108)쪽으로 송신할 수 있다. 디스플레이 장치(108)는 업데이트된 시각적 요소(143)를 제시할 수 있다. 예를 들어, 도 3d에서 묘사되는 바와 같이, 요소(301)는 스냅 바(302)에 수직으로 정렬된다.

따라서, 도 3a 내지 도 3d는 스냅 바를 사용해 요소를 다이어그램 내에서 유연성 있게 조직하는 실례를 예시한다. 그러나, 다양한 다른 실시예도 예상된다. 앞서 설명된 그리고 다음에서 설명되는 다이어그램 중 어떤 것도 디스플레이 장치(예를 들어, 디스플레이 장치(108))의 디스플레이(예를 들어, 디스플레이(109))를 통해 디스플레이되고 상호 작용될 수 있다.

본 발명의 실시예는 시각적 랜드마크에 관련한 배치를 위해 요소를 태깅하는 것을 용이하게 한다. 예를 들어, 도 4a 내지 도 4e는 다이어그램(400)의 복수개 요소에 스냅 바의 특성을 적용하기 위해 복수개 요소를 태깅하는 실례를 예시한다.

도 4a에서 묘사되는 바와 같이, 다이어그램(400)은 요소(401, 402, 및 403)를 포함한다. 요소(401, 402, 및 403)는 다이어그램(400) 내의 임의 위치에 존재한다. 도 4b에서 묘사되는 바와 같이, 커서(491)가 요소(401)에 태깅 지시자(411)를 적용하는데 사용된다. 도 4c에서 묘사되는 바와 같이, 커서(491)가 요소(402)에 태깅 지시자(412)를 적용하는데 사용된다. 요소(401)는 태깅 지시자(411)로 태깅되는 상태를 유지한다. 도 4d에서 묘사되는 바와 같이, 커서(491)가 요소(403)에 태깅 지시자(413)를 적용하는데 사용된다. 요소(401 및 402)는, 각각, 태깅 지시자(411 및 412)로 태깅되는 상태를 유지한다. 요소의 태깅은 선택 입력(161)에서 표현될 수 있다. 태깅에 응답하여 요소를 점선으로 변경하는 것은 요소 선택 시각적 피드백(142)으로 표현될 수 있다.

요소(403)를 태깅하는 것에 후속하여, 사용자(113)는, 예를 들어, (사용자-인터페이스(101)에 의해 제시되는) 메뉴 또는 버튼 바로부터 항목을 선택하는 것과 같은, 추가 입력을 제출하여 요소(401, 402, 및 403)가 스냅 바(또는 어떤 다른 시각적 랜드마크)와 연관되어야 한다는 것을 지시할 수 있다. 이 추가 입력은 사용자-인터페이스(101)에서 수신되어 렌더링 모듈(107) 및/또는 다이어그램 편집기(102)쪽으로 포워딩될 수 있다. 렌더링 모듈(107) 및 다이어그램 편집기(102)는 상호 작용하여 다이어그램(400)의 배열을 자동 업데이트할 수 있다. 예를 들어, 렌더링 모듈(107)은 요소(401, 402, 및 403)를 위한 변경된 위치를 표현하였고, 다이어그램 편집기(102)는 스냅 바(404)를 포함하도록 다이어그램 데이터(112)를 변경할 수 있다. 요소(401, 402, 및 403)는 스냅 바(404)의 특성(예를 들어, 요소 사이의 고른 간격 및 수직 정렬)에 따라 스냅 바(404)에 관련하여 배치될 수 있다.

렌더링 모듈(107)은 (업데이트된 시각적 요소(144)에서 표현되는) 다이어그램(400)의 업데이트된 배열을 디스플레이 장치(109)에 제시할 수 있다. 도 4e에서 묘사되는 바와 같이, 요소(401, 402, 및 403)는 스냅 바(404)상에 고르게 간격 조정되고 스냅 바(404)상에 수직 정렬된다.

본 발명의 실시예는 이미 하나 이상의 요소를 포함하고 있는 시각적 랜드마크에 요소를 추가하는 것을 용이하게 한다. 도 5a 내지 도 5c는 다이어그램(500)의 스냅 바에 요소를 추가하는 실례를 예시한다.

도 5a에서 묘사되는 바와 같이, (새로운 요소이거나 다이어그램(500)이 아닌 곳으로부터의 기존 요소인) 선택된 요소(501)는 커서(591)로 선택되어 스냅 바(503)와 부분적으로 공동-배치되도록 이동된다. 예를 들어, 사용자 입력을 통해, 사용자(113)는 선택된 요소(501)를 스냅 바(503)상으로 드래그할 수 있다. 기존 요소(502)는 스냅 바(503)의 특성에 따라 스냅 바(503)상에 이미 배치되어 있다.

추가 사용자 입력을 통해, 사용자(113)는 선택된 요소(501)가 스냅 바(503)상에 배치되어야 한다는 것을 지시할 수 있다. 예를 들어, 사용자(113)는 선택된 요소(501)를 스냅 바(503)상에 드롭할 수 있다. 선택된 요소(501)가 스냅 바(503)상에 드롭되는 것을 검출하는 것에 응답하여, 다이어그램(500)은 자동 업데이트되어 디스플레이(109)에 제시될 수 있다. 예를 들어, 도 5b에서 묘사되는 바와 같이, 스냅 바(503)는 선택된 요소(501)를 수용하기 위해 크기 조정된 스냅 바(503R)로 크기 조정된다. 도 5c에서 묘사되는 바와 같이, 선택된 요소(501) 및 기존 요소(502)는 크기 조정된 스냅 바(503R)의 특성에 따라 크기 조정된 스냅 바(503R)상에 조정되고 정렬된다.

본 발명의 실시예는 시각적 랜드마크에서 기존 요소를 확장하는 것을 용이하게 한다. 도 6a 및 도 6b는 다이어그램(600)의 스냅 바에서 요소를 확장하는 실례를 예시한다.

도 6a에서 묘사되는 바와 같이, 요소(601 및 602)는 스냅 바(603)의 특성에 따라 스냅 바(603)에 관련하여 배치된다. 요소(602)는 (예를 들어, 사용자 입력을 통해) 커서(691)로 선택된다. 추가 사용자 입력을 통해, 사용자(113)는 요소(602)가 스냅 바(603)에서 확장되어야 한다는 것을 지시할 수 있다. 예를 들어, 사용자(113)는 (사용자-인터페이스(101)에 의해 제시되는) 메뉴 또는 버튼 바로부터 확장 항목을 선택할 수 있다.

추가 사용자 입력이 확장 항목을 선택하는 것에 응답하여, 다이어그램(600)은 자동 업데이트되어 디스플레이(109)에 제시될 수 있다. 예를 들어, 도 6b에서 묘사되는 바와 같이, 스냅 바(603)는 확장된 요소(602E)를 수용하기 위해 크기 조정된 스냅 바(603R)로 크기 조정된다. 또한, 확장된 요소(602E)는 3개의 하위-요소, 요소(612, 622, 및 632)를 드러낸다. 요소(601), 확장된 요소(602E), 및 요소(612, 622, 및 632)는 크기 조정된 스냅 바(603R)의 특성에 따라 크기 조장된 스냅 바(603R)상에서 조정되고 정렬된다.

본 발명의 실시예는 시각적 랜드마크의 요소를 시각적 랜드마크의 상이한 위치로 이동시키는 것을 용이하게 한다. 도 7a 내지 도 7c는 다이어그램(700)의 스냅 바에서 요소를 이동시키는 실례를 예시한다.

도 7a에서 묘사되는 바와 같이, 요소(701 및 702)는 스냅 바(703)의 특성에 따라 스냅 바(703)에 배치된다. 이후에, 수신된 사용자 입력은 요소(702)가 요소(701)의 오른쪽에서 요소(701)의 왼쪽으로 이동되어야 한다는 것을 지시한다. 예를 들어, 요소(702)가 커서(791)로 선택되어 요소(701)의 오른쪽에서 요소(701)의 왼쪽으로 드래그될 수 있다. 도 7b에서 묘사되는 바와 같이, (선택된) 요소(702)는 요소(701)의 왼쪽에 배치된다.

추가 사용자 입력을 통해, 사용자(113)는 요소(702)가 스냅 바(703)에서 요소(702)의 왼쪽에 배치되어야 한다는 것을 지시할 수 있다. 예를 들어, 사용자(113)는 (선택된) 요소(702)를 도 7b에서 지시되는 위치에 드롭할 수 있다. (선택된) 요소(702)가 스냅 바(703)상에 드롭되는 것을 검출하는 것에 응답하여, 다이어그램(700)은 자동 업데이트되어 디스플레이(109)에 제시될 수 있다. 예를 들어, 도 7c에서 묘사되는 바와 같이, 요소(701 및 702)는 스냅 바(703)의 특성에 따라 스냅 바(703)상에서 조정되고 정렬된다. 요소(702)는 요소(701)의 왼쪽에 배치된다.

본 발명의 실시예는 시각적 랜드마크를 이동시켜 시각적 랜드마크상에 배치된 모든 요소를 이동시키는 것을 용이하게 한다. 도 8a 내지 도 8c는 스냅 바를 이동시켜 다이어그램(800)의 스냅 바상의 모든 요소를 이동시키는 실례를 예시한다.

도 8a에서 묘사되는 바와 같이, 요소(801) 및 요소(802)는 스냅 바(803)의 특성에 따라 스냅 바(803)에 관련하여 배치된다. 이후에, 수신된 사용자 입력은 스냅 바(803)가 선택되어야 한다는 것을 지시한다. 예를 들어, 스냅 바(803)가 커서(891)로 선택될 수 있다. 선택시에, 스냅 바(803)는 다이어그램(800) 내에서 이동될 수 있다. 예를 들어, 도 8b에서 묘사되는 바와 같이, 스냅 바(803)는 (선택된 스냅 바(803)의) 새로운 위치를 향해 오른쪽 아래로 이동될 수 있다. 요소(801 및 802)는 스냅 바(803)와 함께 이동한다. 추가 사용자 입력은 스냅 바(803)가 다이어그램(800) 내의 새로운 위치에 머물러야 한다는 것을 지시할 수 있다. 드래그 및 드롭 동작이, 요소(801 및 802)와 함께, 스냅 바(803)를 새로운 위치로 이동시키는데 사용될 수 있다.

본 발명의 실시예는 시각적 랜드마크의 가시성(visibility)을 토글링하는 것을 용이하게 한다. 도 9a 및 도 9b는 다이어그램(900)에서 스냅 바를 토글링하는 실례를 예시한다.

도 9a에서 묘사되는 바와 같이, 요소(901)는 스냅 바(911)에 관련하여 배치되고, 요소(902, 903, 및 904)는 스냅 바(912)에 관련하여 배치되며, 요소(905, 906, 및 907)는 스냅 바(913)에 관련하여 배치된다. 스냅 바(914)는 수신된 시각적 요소에 이용 가능한 것으로 지시된다. 스냅 스택(921)은 다이어그램(900) 내에 요소를 배열하기 위한 그리드 구조를 제공한다. 예를 들어, 스냅 스택(921)은 인접한 스냅 바 사이에서 정의된 간격을 유지하는(본질적으로 행 수를 유지하는) 특성을 가질 수 있다. 각각의 스냅 바(행)는 요소를 적절하게 수용하기 위해 수평으로 크기 조정될 수 있다. 요소가 다이어그램(900)에 추가됨에 따라, 요소는 새로운 스냅 바 또는 기존 스냅 바상의 위치를 차지할 수 있다.

도 9b에서 묘사되는 바와 같이, 스냅 스택(921)은 (그것이 공백이므로 스냅 바(914)를 포함하여) 토글 오프(toggle off)된다. 그러나, 도 9a의 시각적 랜드마크의 특성에 따른 요소의 배열은 그대로 유지된다. 이와 같이, 요소는 시각적 랜드마크를 사용해 조직될 수 있고 이후에 시각적 랜드마크는 요소의 조직된 배열만이 남도록 은닉될 수 있다.

따라서, 일반적으로, 시각적 랜드마크가 다이어그램에 추가되어 다이어그램 내에서 요소를 조직하는 것을 지원할 수 있다. 다양하고 상이한 유형의 시각적 랜드마크가 사용될 수 있다. 시각적 랜드마크의 유형 각각은 그 유형의 시각적 랜드마크와 연관되는 요소를 위한 배열 및 조정을 정의하는 구성 가능한 특성을 포함할 수 있다. 구성 가능한 특성은 연관된 요소가 시각적 랜드마크에 관련하여 어떻게 배치되어야 하는지를 정의할 수 있다. 또한, 구성 가능한 특성은 연관된 요소가 서로에 관련하여 어떻게 배치되어야 하는지를 정의할 수 있다. 이후에, 다이어그램 내의 요소는 시각적 랜드마크와 연관될 수 있고 시각적 랜드마크의 특성에 따라 배열 및/또는 조정될 수 있다.

예를 들어, 도 10a 내지 도 10d는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 바의 다수 실례를 예시한다. 도 10a는 수평 스냅 바(1003)에 관련하여 배치되는 요소(1001 및 1002)를 묘사한다. 수평 스냅 바(1003)의 특성 중 하나는 요소가 수평 스냅 바(1003)상에 수평으로 고르게 간격 조정되어야 한다는 것을 지시할 수 있다. 도 10b는 수평 스냅 바(1014)에 관련하여 배치되는 요소(1011, 1012, 및 1013)를 묘사한다. 수평 스냅 바(1014)의 특성 중 하나는 수평 스냅 바(1014)상의 요소(1012)와 요소(1013) 사이의 증가된 간격을 지시할 수 있다. 도 10c는 수직 스냅 바(1024)에 관련하여 배치되는 요소(1021, 1022, 및 1023)를 묘사한다. 수직 스냅 바(1024)의 특성 중 하나는 요소가 수직 스냅 바(1024)상에 수직으로 고르게 간격 조정되어야 한다는 것을 지시할 수 있다. 도 10d는 대각선 스냅 바(1033)상의 요소(1031 및 1032)를 묘사한다.

도 11a 및 도 11b는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 베지어의 실례를 예시한다. 스냅 베지어는 스냅 바의 변형이다. 도 11a는 스냅 베지어(1105)상의 요소(1101, 1102, 1103, 및 1104)를 묘사한다. 스냅 베지어(1105)의 특성 중 하나는 그것이 덜 두드러진 곡률(less pronounced curvature)을 가진다는 것일 수 있다. 도 11b는 스냅 베지어(1115)상의 요소(1111, 1112, 1113, 및 1114)를 묘사한다. 스냅 베지어(1105)의 특성 중 하나는 그것이 좀더 두드러진 곡률을 가진다는 것일 수 있다.

도 12a 내지 도 12c는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 아크의 실례를 예시한다. 스냅 아크는 타원 형태라는 것을 제외하면 스냅 바와 유사하다. 도 12a는 스냅 아크(1206)상의 요소(1201, 1202, 1203, 1204, 및 1205)를 묘사한다. 스냅 아크(1206)의 특성은 좀더 작은 반경 및 좀더 큰 각도(즉, 완전한 원에 좀더 가깝다는 것)를 포함할 수 있다. 도 12b는 스냅 아크(1214)상의 요소(1211, 1212, 및 1213)를 묘사한다. 스냅 아크(1214)의 특성은 좀더 작은 반경 및 좀더 작은 각도(즉, 완전한 원과는 좀더 멀다는 것)를 포함할 수 있다. 도 12c는 스냅 아크(1224)상의 요소(1221, 1222, 및 1223)를 묘사한다. 스냅 아크(1224)의 특성은 좀더 큰 반경 및 좀더 작은 각도를 포함할 수 있다.

더 나아가, 스냅 바, 스냅 베지어, 및 스냅 아크는 공통적으로 다양한 다른 구성 가능 특성을 가질 수 있다. 예를 들어, 스냅 바, 스냅 베지어, 및 스냅 아크는 분포가 (적용 가능한 경우) 하단 정렬, 상단 정렬, 왼쪽 정렬, 및 오른쪽 정렬 중 하나 이상, 회전 각도(예를 들어, 45도, 90도 등), 및 (예를 들어, 픽셀) 간격의 고른 또는 자유 형식인지를 정의하는 구성 가능한 특성을 포함할 수 있다.

중력 함정은 타원 형태이고 원하는 크기로 만들어 질 수 있다. 중력 함정의 "작용 범위(field of influence)" 내에 추가된 형상은, 힘-기반 알고리즘에 의해 정의되는 바와 같이, 중력 함정쪽으로 강하게 끌릴 수 있다. 도 13a 내지 도 13c는 다이어그램의 요소를 조직하는데 사용될 수 있는 중력 함정의 실례를 예시한다. 도 13a는 중력 함정(1304)의 작용 범위 내의 요소(1301, 1302, 1303)를 묘사한다. 중력 함정(1304)은 원형이다. 도 13b는 중력 함정(1314)의 작용 범위 내의 요소(1311, 1312, 및 1313)를 묘사한다. 중력 함정(1314)은 수직 배향된 타원형이다. 도 13c는 중력 함정(1323)의 작용 범위 내의 요소(1321 및 1322)를 묘사한다. 중력 함정(1323)은 대각선으로 배향된 타원형이다. 중력 함정은 (예를 들어, 직경) 범위 및 분포(예를 들어, 균형, 상단, 하단, 왼쪽, 오른쪽 등)를 정의하는 구성 가능한 특성을 포함할 수 있다.

스냅 스택은 요소를 스태킹 그리드 구조에 따라 배열하는데 사용될 수 있다. 형상이 경로에 추가됨에 따라, 형상은 새로운 행 또는 기존 행 내의 셀을 차지할 수 있다. 요소가 스냅 스택에 추가됨에 따라 새로운 행 및 셀이 발생될 수 있다. 도 14a 및 도 14b는 다이어그램의 요소를 조직하는데 사용될 수 있는 스냅 스택의 실례를 예시한다. 도 14a는 스냅 바(1411, 1412, 1413, 및 1414)를 포함하는 스냅 스택(1421)을 묘사한다. 도 14b는 스냅 바(1411, 1412, 및 1413)상에 배치되는 상호 연결된 요소(1401-1407)를 묘사한다. 스냅 스택은 (예를 들어, 자유 형식 또는 고른) 셀 분포, 스택 왼쪽, 스택 중앙, 스택 오른쪽, 회전(예를 들어, 45도, 90도 등), 및 행 간격을 정의하는 구성 가능한 특성을 포함할 수 있다.

스티키 박스는 직사각형이고 요소의 집합을 조직하고, 이동시키고, 관리하는데 사용될 수 있는 시각적 그룹으로 작용한다. 도 15는 다이어그램의 요소를 조직하는데 사용될 수 있는 스티키 박스의 실례를 예시한다. 도 15는 스티키 박스(1505) 내의 요소(1501-1504)를 묘사한다. 스티키 라쏘는 임의 형태이고 요소의 집합을 조직하고, 이동시키고, 관리하는데 사용될 수 있는 시각적 그룹으로 작용한다. 도 16은 다이어그램의 요소를 조직하는데 사용될 수 있는 스티키 라쏘의 실례를 예시한다. 도 16은 스티키 라쏘(1611) 내의 요소(1601-1605)를 묘사한다. 요소(1606, 1607, 및 1608)는 스티키 라쏘(1611)의 바깥에 위치한다. 스티키 라쏘는 좀더 표준적인 기하학적 형상에 적합하지 않은 관심있는 그룹화 영역의 사용을 용이하게 한다. 스티키 박스 및 스티키 라쏘는 확장/수축 및 크기 조정/경로 조정을 정의하는 구성 가능한 특성을 포함할 수 있다.

일반적으로, 본 발명의 실시예는 시각적 랜드마크가 소정 거동을 나타내도록 사용자가 시각적 랜드마크를 사용자 정의하는 것을 허용한다. 또한, 본 발명의 실시예는 개개 시각적 랜드마크를 사용자 정의하여 새로운 시각적 랜드마크를 생성하는 것을 포함한다. 예를 들어, 기존 스냅 아크의 반경이 변경(증가 또는 감소)되어 새로운 스냅 아크를 생성할 수 있고, 기존 스티키 라쏘가 새로운 경계 영역을 생성하도록 변경될 수 있으며, 스냅 베지어는 곡률을 변경하거나, 새로운 곡선을 추가하거나, 기존 곡선을 제거하여 새로운 스냅 베지어를 생성할 수 있는 식이다.

일부 실시예에서는, 기존의 복수개 시각적 랜드마크가 조합되어 사용자 정의된 시각적 랜드마크를 생성한다. 도 18은 사용자 정의된 시각적 랜드마크(1800)의 실례를 예시한다. 도 17은 시각적 랜드마크를 사용자 정의하는 예시적 방법(1700)의 흐름도를 예시한다. 방법(1700)은 도 1의 컴퓨터 아키텍처(100)의 컴포넌트 및 사용자 정의된 시각적 랜드마크(1800)를 참조하여 설명될 것이다.

방법(1700)은 다이어그램의 시각적 요소를 조직하는데 사용될 수 있는 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 행위(행위 1701)를 포함한다. 예를 들어, 이제 도 1을 참조하면, 사용자(113)는 시각적 랜드마크 선택 입력(134)을 입력할 수 있다. 사용자 인터페이스(101)는 시각적 랜드마크 선택 입력(134)이 시각적 랜드마크를 선택하는 사용자 입력인지를 판정한다. 응답으로, 사용자 인터페이스(101)는 시각적 랜드마크 선택 입력(134)을 다이어그램 편집기(102)쪽으로 포워딩한다. 다이어그램 편집기(102)는 시각적 랜드마크 선택 입력(134)을 처리하고 시각적 랜드마크 저장소(135)로부터의 시각적 랜드마크에 액세스할 수 있다. 다이어그램 편집기(102)는 다이어그램 데이터(112)에 시각적 랜드마크를 포함시키고 다이어그램 데이터(112)를 디스플레이 장치(108)에서의 제시를 위해 렌더링 모듈(107)쪽으로 송신할 수 있다. 렌더링 모듈(107)은 선택된 시각적 랜드마크를 디스플레이(109)에 시각적으로 렌더링할 수 있다. 기존의 복수개 시각적 랜드마크가 조합되어야 하는 경우, 행위 1701은 복수개 시각적 랜드마크의 시각적 랜드마크 각각에 액세스하여 시각적으로 제시하기에 적절하도록 반복될 수 있다. 예를 들어, 도 18을 참조하면, 행위 1701은 스냅 바(1821, 1822, 1823, 1824, 및 1825)에 액세스하도록 반복될 수 있다.

방법(1700)은 사용자가 입력한 입력에 따라 시각적 랜드마크의 시각적 제시를 변경하는 행위(행위 1702)를 포함한다. 예를 들어, 사용자(131)는 행위 1701에서 시각적으로 제시되는 어떤 시각적 랜드마크를 변경하기 위한 사용자 입력을 입력할 수 있다. 시각적 랜드마크가 선택되는 경우, 시각적 랜드마크 피드백이 (예를 들어, 다이어그램 내의 요소에 적용 가능한 어떤 지시를 사용해) 사용자(113)에게 선택을 시각적으로 지시할 수 있다. 예를 들어, 스냅 바(1821)의 선택시에, 렌더링 모듈은 (예를 들어, 스냅 바(1821)를 점선으로 제시하는) 시각적 랜드마크 피드백(143)을 디스플레이 장치(108)쪽으로 송신할 수 있다.

방법(1700)은 사용자가 입력한 입력에 따라 시각적 랜드마크에 대한 하나 이상의 특성을 구성하는 행위(행위 1703)를 포함하는데, 구성된 하나 이상의 특성은 연관된 시각적 요소를 시각적 랜드마크에 관련하여 자동 배치하여 다이어그램 내에서 연관된 시각적 요소를 조직하는 방법을 지시한다. 예를 들어, 도 18에서는, 다양한 스냅 바의 종점이 스냅 바를 하나가 되게 조합하도록 연결될 수 있다. 종점(1821B, 1822A, 및 1823A)이 서로 연결되고 종점(1823B, 1824A, 및 1825A)이 연결되어 사용자 정의된 시각적 랜드마크(1800)를 형성할 수 있다.

방법(1700)은 변경된 시각적 제시를 구성된 하나 이상의 특성과 함께 새로운 시각적 랜드마크로서 저장하는 행위(행위 1704)를 포함하는데, 새로운 시각적 랜드마크는 다이어그램을 사용자가 입력한 입력에 따라 조직하는데 사용하기 위한 것이다. 예를 들어, 사용자(113)는 사용자 정의된 시각적 랜드마크(1800)가 시각적 랜드마크 저장소(135)에 저장되게 하는 사용자 입력을 입력할 수 있다.

시각적 랜드마크는 자유 형식 방식으로 배열되는 시각적 요소를 가진 다이어그램에 적용되어 다이어그램 내의 요소를 조직하는 것을 지원할 수 있다. 또한, 시각적 랜드마크는 자동 배열 메커니즘에 따라(예를 들어, 자동-레이아웃 알고리즘에 따라) 배열되는 시각적 요소를 가진 다이어그램에 적용되어 다이어그램 내의 요소를 조직하는 것을 지원할 수 있다. 시각적 랜드마크는 시각적 요소의 자동 배열에 제약을 적용하는 것에 의해 자동 배열 메커니즘과 연동할 수 있다.

따라서, 본 발명의 실시예는 (일부 실시예에서 사용자 정의된) 시각적 랜드마크를 사용해 다이어그램 내의 요소를 조직하는 것을 용이하게 한다. 다이어그램의 요소는 시각적 랜드마크의 구성 가능하게 정의된 특성에 따라 배열되어 다이어그램 내에 일정 수준의 레이아웃 구조를 제공할 수 있다. 따라서, 본 발명의 실시예는 자유 형식 편집의 유연성을 유지하는 사용자 경험을 제공한다.

본 발명은 본 발명의 정신 또는 본질적인 특징을 벗어나지 않으면서 다른 특정 형태로 구현될 수 있다. 설명된 실시예는 모든 관점에서 한정이 아니라 단지 예시인 것으로 생각되어야 한다. 따라서, 본 발명의 범위는 상기 설명에 의해서가 아니라 첨부된 청구항에 의해 지시된다. 청구항에 대한 등가물의 의미 및 범위 내에 해당하는 모든 변화는 그것의 범위 내에 포함되어야 한다.

Claims

컴퓨터 아키텍처에서, 시각적 랜드마크들을 사용해 다이어그램을 조직하는(organize) 방법으로서,
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는(presenting) 단계;
상기 다이어그램 내에 상기 하나 이상의 시각적 요소와 함께 시각적 랜드마크를 제시하는 단계- 상기 시각적 랜드마크는 연관된 시각적 요소들을 상기 시각적 랜드마크에 관련하여 배치하기 위해 상기 연관된 시각적 요소들에 적용되어야 하는 하나 이상의 특성을 갖도록 구성됨 -;
상기 시각적 랜드마크와 함께 디스플레이되는 상기 하나 이상의 시각적 요소 중 하나의 시각적 요소를 선택하는 입력을 수신하는 단계;
제1 위치에서 디스플레이되는 상기 선택된 시각적 요소가 상기 시각적 랜드마크와 연관되어야 함을 나타내는 추가 입력을 수신하는 단계- 상기 추가 입력은 상기 선택된 시각적 요소를 상기 시각적 랜드마크와 교차하도록 이동시키는 입력을 포함함 -;
선택된 시각적 요소가 선택되었음을 나타내는 시각적 피드백을 제공하는 단계;
상기 추가 입력을 수신하는 단계에 응답하여 상기 선택된 시각적 요소를 상기 다이어그램 내에 조직하기 위해 상기 시각적 랜드마크의 대응하는 상기 하나 이상의 특성에 따라 상기 선택된 시각적 요소를 상기 시각적 랜드마크에 관련하여 자동 배치하는 단계- 상기 배치하는 단계는 상기 선택된 시각적 요소가 상기 시각적 랜드마크의 제한된 부분과 부분적으로 중첩되도록 하여 상기 선택된 시각적 요소의 일부분만이 상기 시각적 랜드마크와 중첩되도록 함 -; 및
상기 다이어그램 내에 상기 선택된 시각적 요소의 조직을 반영하는 상기 하나 이상의 시각적 요소의 업데이트된 배열(arrangement)을 제시하는 단계
를 포함하는 방법.
제1항에 있어서,
스냅 바(snap bar)의 디스플레이를 토글 오프하는(toggling off) 사용자 입력을 수신하는 단계를 더 포함하되, 상기 선택된 시각적 요소는 상기 스냅 바의 디스플레이가 토글 오프된 경우에도 계속 디스플레이되는 방법.
제1항에 있어서,
상기 시각적 랜드마크는 스냅 바를 포함하고, 상기 하나 이상의 시각적 요소는 상기 스냅 바 상에 디스플레이되는 방법.
제1항에 있어서,
상기 시각적 랜드마크는 스냅 아크(snap arc)를 포함하는 방법.
제1항에 있어서,
상기 시각적 랜드마크는 스냅 베지어(snap beziers)를 포함하는 방법.
제1항에 있어서,
상기 시각적 랜드마크는 스냅 스택(snap stack)을 포함하는 방법.
제1항에 있어서,
상기 선택된 시각적 요소의 현재 표현이 상기 제1 위치에 남아있는 동안 제2 위치로 이동되는 상기 시각적 요소의 임시 표현을 생성하는 단계를 더 포함하는 방법.
컴퓨터 아키텍처에서, 다이어그램을 조직하는데 사용될 시각적 랜드마크를 커스터마이즈(customize)하는 방법으로서,
다이어그램 내에 시각적 요소들을 조직하는 데 사용될 수 있는 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 단계- 상기 시각적 랜드마크는 두 개의 종단 노드 사이에서 연장되는 라인의 형태를 갖는 그래픽 개체를 포함하는 스냅 바를 포함함 -;
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 상기 시각적 제시를 변경하는 단계;
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 하나 이상의 특성을 구성하는 단계- 상기 구성된 하나 이상의 특성은, 연관된 시각적 요소를 태깅하는(tags) 검출된 입력 및 상기 태깅된 시각적 요소가 상기 시각적 랜드마크와 연관되어야 함을 나타내는 입력에 응답하여, 상기 연관된 시각적 요소를 다이어그램 내에 조직하기 위해 상기 연관된 시각적 요소를 상기 시각적 랜드마크에 관련하여 자동 배치하는 방식을 나타내고, 상기 연관된 시각적 요소의 자동 배치는 상기 연관된 시각적 요소가 상기 시각적 랜드마크의 제한된 부분과 부분적으로 중첩되도록 하여 상기 연관된 시각적 요소의 일부분만이 상기 시각적 랜드마크와 중첩되도록 함 -; 및
상기 변경된 시각적 제시를 상기 구성된 하나 이상의 특성과 함께 새로운 시각적 랜드마크로서 저장하는 단계 - 상기 새로운 시각적 랜드마크는 상기 사용자가 입력한 입력에 따라 다이어그램들을 조직하는 데 사용됨 -
를 포함하는 방법.
제8항에 있어서,
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 상기 시각적 제시를 변경하는 상기 단계는,
다이어그램 내에 시각적 요소들을 조직하는 데 사용될 수 있는 제2의 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 단계; 및
상기 시각적 랜드마크의 제시를 상기 제2의 시각적 랜드마크의 제시에 연결하여 상기 시각적 랜드마크와 상기 제2의 시각적 랜드마크를 합성 시각적 랜드마크로 조합하는 단계를 포함하는 방법.
제8항에 있어서,
다이어그램 내에 시각적 요소들을 조직하는 데 사용될 수 있는 제2의 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 단계를 더 구비하고,
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 상기 시각적 제시를 변경하는 상기 단계는 상기 시각적 랜드마크를 상기 제2의 시각적 랜드마크와 연결하는 단계를 포함하는 방법.
제8항에 있어서,
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 하나 이상의 특성을 구성하는 상기 단계는 스냅 바, 스냅 아크, 스냅 베지어, 중력 함정(gravity well), 스냅 스택, 스티키 박스, 및 스티키 라쏘 (sticky lasso) 중에서 선택되는 시각적 랜드마크의 하나 이상의 특성을 구성하는 단계를 포함하는 방법.
제8항에 있어서,
상기 시각적 랜드마크의 하나 이상의 특성을 구성하는 상기 단계는 상기 시각적 랜드마크와 연관되는 시각적 요소들에 대한 분포, 상기 시각적 랜드마크와 연관되는 시각적 요소들의 정렬, 상기 시각적 랜드마크의 회전, 및 상기 시각적 랜드마크에 대한 직경 중 하나 이상을 구성하는 단계를 포함하는 방법.
컴퓨팅 시스템으로서,
하나 이상의 프로세서; 및
시각적 랜드마크들을 사용해 다이어그램을 조직하기 위한 컴퓨터 실행 가능 명령어들이 저장된 하나 이상의 물리적 저장 매체를 포함하되,
상기 컴퓨터 실행 가능 명령어들은 상기 하나 이상의 프로세서에서 실행되는 경우 상기 컴퓨팅 시스템으로 하여금 방법을 구현하도록 하며,
상기 방법은
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는 단계;
상기 시각적 요소 중 적어도 두 개를 태깅하는 사용자 입력을 수신하는 단계;
상기 사용자 입력에 의해 태깅된 상기 적어도 두 개의 시각적 요소 각각에 대해 개별적인 태깅 지시자를 디스플레이하는 단계;
상기 적어도 두 개의 태깅된 시각적 요소가 시각적 랜드마크와 연관되어야 함을 나타내는 추가의 사용자 입력을 수신하는 단계- 상기 시각적 랜드마크는 상기 적어도 두 개의 태깅된 시각적 요소를 상기 시각적 랜드마크에 관련하여 배치하기 위해 상기 적어도 두 개의 태깅된 시각적 요소에 적용되어야 하는 하나 이상의 특성을 갖도록 구성됨 -;
상기 시각적 랜드마크를 디스플레이하는 단계;
상기 다이어그램 내에서 상기 시각적 랜드마크와 함께 상기 적어도 두 개의 태깅된 시각적 요소를 조직하기 위해 상기 시각적 랜드마크의 상기 하나 이상의 특성에 따라 상기 적어도 두 개의 태깅된 시각적 요소를 상기 시각적 랜드마크에 관련하여 배치하는 단계
를 포함하는, 컴퓨팅 시스템.
제13항에 있어서,
상기 개별적인 태깅 지시자는 태깅되는 각각의 대응 시각적 요소와 함께 디스플레이되는 새로운 그래픽 개체를 포함하는, 컴퓨팅 시스템.
제13항에 있어서,
상기 개별적인 태깅 지시자는 태깅되는 각각의 대응 시각적 요소의 그래픽 제시에 대한 시각적 변경을 포함하는, 컴퓨팅 시스템.
제13항에 있어서,
상기 방법은 상기 적어도 두 개의 태깅된 시각적 요소 각각에 대한 상기 개별적인 태깅 지시자를 제거하고 상기 적어도 두 개의 태깅된 시각적 요소에 대한 임의의 개별적인 태깅 지시자 없이 상기 시각적 랜드마크의 상기 하나 이상의 특성에 따라 상기 적어도 두 개의 태깅된 시각적 요소를 상기 시각적 랜드마크에 관련하여 디스플레이하는 단계를 포함하는, 컴퓨팅 시스템.
제13항에 있어서,
상기 시각적 랜드마크는 중력 함정의 그래픽 이미지를 포함하는
컴퓨팅 시스템.
제13항에 있어서,
상기 시각적 랜드마크는 하나 이상의 다른 시각적 랜드마크로부터 구성된 커스텀(custom) 시각적 랜드마크인
컴퓨팅 시스템.
컴퓨터 아키텍처에서, 하나 이상의 스냅 바를 사용해 다이어그램을 조직하는 방법으로서,
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는 단계;
상기 다이어그램 내에 상기 하나 이상의 시각적 요소와 함께 스냅 바를 제시하는 단계- 상기 스냅 바는 상기 스냅 바와 선택적으로 연관된 임의의 시각적 요소가 상기 스냅 바에 관련하여 배치되어야 하는 방식을 정의하는 하나의 이상의 대응 특성을 갖도록 구성되고, 상기 스냅 바는 두 개의 종단 노드 간에 연장되는 라인의 형상을 갖는 그래픽 개체를 포함함 -;
상기 스냅 바와 함께 디스플레이되는 상기 하나 이상의 시각적 요소 중 하나의 시각적 요소를 선택하는 입력을 수신하는 단계;
상기 시각적 요소를 상기 스냅 바와 선택적으로 연관시키는 추가 입력을 수신하는 단계- 상기 추가 입력은 제1 위치에서 디스플레이되는 상기 선택된 시각적 요소가 상기 스냅 바와 교차하는 제2 위치로 이동되어야 함을 나타냄 -;
선택된 시각적 요소가 선택되었음을 나타내는 시각적 피드백을 제공하는 단계;
상기 추가 입력을 수신하는 단계에 응답하여 상기 선택된 시각적 요소를 상기 다이어그램 내에 조직하기 위해 상기 스냅 바의 상기 하나 이상의 대응 특성에 따라 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 자동 배치하는 단계- 상기 배치하는 단계는 상기 선택된 시각적 요소가 상기 스냅 바의 상기 라인을 따라 상기 두 개의 종단 노드 사이에 적어도 부분적으로 배치되도록 함 -; 및
상기 다이어그램 내에 상기 선택된 시각적 요소의 조직을 반영하는 상기 하나 이상의 시각적 요소의 업데이트된 배열을 제시하는 단계
를 포함하는 방법.
제19항에 있어서,
상기 자동 배치하는 단계는 상기 시각적 요소가 상기 스냅 바의 제한된 부분과만 부분적으로 중첩되도록 하여 상기 선택된 시각적 요소의 일부분만이 상기 스냅 바와 중첩되도록 하는
방법.
제19항에 있어서,
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는 상기 단계는 하나 이상의 기하학적 형상을 제시하는 단계를 포함하는 방법.
제19항에 있어서,
상기 대응 특성은 상기 스냅 바 상에서 요소들을 간격 조정(space)하는 방식을 정의하는 방법.
제19항에 있어서,
상기 추가 입력을 수신하는 단계는 상기 선택된 시각적 요소가 상기 스냅 바와 교차하는 동안 상기 선택된 시각적 요소를 해제하는(releasing) 추가의 사용자 입력을 수신하는 단계를 포함하는 방법.
제19항에 있어서,
상기 스냅 바의 상기 하나 이상의 대응 특성에 따라 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 자동 배치하는 단계는 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 정렬하는 단계를 포함하는
방법.
제19항에 있어서,
상기 스냅 바의 상기 하나 이상의 대응 특성에 따라 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 자동 배치하는 단계는 상기 선택된 시각적 요소를 상기 스냅 바와 연관된 적어도 하나의 다른 시각적 요소에 대해 간격 조정(space)하는 단계를 포함하는
방법.
제19항에 있어서,
상기 스냅 바의 상기 하나 이상의 대응 특성에 따라 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 자동 배치하는 단계는 상기 선택된 시각적 요소를 상기 스냅 바 상에서 하나의 위치에서 다른 위치로 이동시키는 단계를 포함하는
방법.
제19항에 있어서,
상기 하나 이상의 시각적 요소의 업데이트된 배열을 제시하는 단계는 상기 스냅 바와 교차하는 상기 시각적 요소를 제시하는 단계를 포함하는
방법.
제19항에 있어서,
상기 하나 이상의 시각적 요소의 업데이트된 배열을 제시하는 단계는 상기 스냅 바의 상기 두 개의 종단 노드 사이에 실질적으로 중앙에 배치된 상기 시각적 요소를 제시하는 단계를 포함하는
방법.
하나 이상의 컴퓨터 프로세서에 의해 실행되는 경우, 시각적 랜드마크들을 사용해 다이어그램을 조직하는 방법을 구현하는 컴퓨터 실행가능 명령어들이 저장된 하나 이상의 컴퓨터 저장 장치로서,
상기 방법은
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는 단계;
상기 다이어그램 내에 상기 하나 이상의 시각적 요소와 함께 시각적 랜드마크를 제시하는 단계- 상기 시각적 랜드마크는 연관된 시각적 요소들을 상기 시각적 랜드마크에 관련하여 배치하기 위해 상기 연관된 시각적 요소들에 적용되어야 하는 하나 이상의 특성을 갖도록 구성됨 -;
상기 시각적 랜드마크와 함께 디스플레이되는 상기 하나 이상의 시각적 요소 중 하나의 시각적 요소를 선택하는 입력을 수신하는 단계;
제1 위치에서 디스플레이되는 상기 선택된 시각적 요소가 상기 시각적 랜드마크와 연관되어야 함을 나타내는 추가 입력을 수신하는 단계- 상기 추가 입력은 상기 선택된 시각적 요소를 상기 시각적 랜드마크와 교차하도록 이동시키는 입력을 포함함 -;
선택된 시각적 요소가 선택되었음을 나타내는 시각적 피드백을 제공하는 단계;
상기 추가 입력을 수신하는 단계에 응답하여 상기 선택된 시각적 요소를 상기 다이어그램 내에 조직하기 위해 상기 시각적 랜드마크의 대응하는 상기 하나 이상의 특성에 따라 상기 선택된 시각적 요소를 상기 시각적 랜드마크에 관련하여 자동 배치하는 단계- 상기 배치하는 단계는 상기 선택된 시각적 요소가 상기 시각적 랜드마크의 제한된 부분과 부분적으로 중첩되도록 하여 상기 선택된 시각적 요소의 일부분만이 상기 시각적 랜드마크와 중첩되도록 함 -; 및
상기 다이어그램 내에 상기 선택된 시각적 요소의 조직을 반영하는 상기 하나 이상의 시각적 요소의 업데이트된 배열(arrangement)을 제시하는 단계
를 포함하는
컴퓨터 저장 장치.
하나 이상의 컴퓨터 프로세서에 의해 실행되는 경우, 다이어그램을 조직하는데 사용될 시각적 랜드마크를 커스터마이즈(customize)하는 방법을 구현하는 컴퓨터 실행가능 명령어들이 저장된 하나 이상의 컴퓨터 저장 장치로서,
상기 방법은
다이어그램 내에 시각적 요소들을 조직하는 데 사용될 수 있는 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 단계- 상기 시각적 랜드마크는 두 개의 종단 노드 사이에서 연장되는 라인의 형태를 갖는 그래픽 개체를 포함하는 스냅 바를 포함함 -;
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 상기 시각적 제시를 변경하는 단계;
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 하나 이상의 특성을 구성하는 단계- 상기 구성된 하나 이상의 특성은, 연관된 시각적 요소를 태깅하는 검출된 입력 및 상기 태깅된 시각적 요소가 상기 시각적 랜드마크와 연관되어야 함을 나타내는 입력에 응답하여, 상기 연관된 시각적 요소를 다이어그램 내에 조직하기 위해 상기 연관된 시각적 요소를 상기 시각적 랜드마크에 관련하여 자동 배치하는 방식을 나타내고, 상기 연관된 시각적 요소의 자동 배치는 상기 연관된 시각적 요소가 상기 시각적 랜드마크의 제한된 부분과 부분적으로 중첩되도록 하여 상기 연관된 시각적 요소의 일부분만이 상기 시각적 랜드마크와 중첩되도록 함 -; 및
상기 변경된 시각적 제시를 상기 구성된 하나 이상의 특성과 함께 새로운 시각적 랜드마크로서 저장하는 단계 - 상기 새로운 시각적 랜드마크는 상기 사용자가 입력한 입력에 따라 다이어그램들을 조직하는 데 사용됨 -
를 포함하는 컴퓨터 저장 장치.
제30항에 있어서,
사용자가 입력한 입력에 따라 상기 시각적 랜드마크의 상기 시각적 제시를 변경하는 상기 단계는,
다이어그램 내에 시각적 요소들을 조직하는 데 사용될 수 있는 제2의 저장된 시각적 랜드마크에 액세스하여 시각적으로 제시하는 단계; 및
상기 시각적 랜드마크의 제시를 상기 제2의 시각적 랜드마크의 제시에 연결하여 상기 시각적 랜드마크와 상기 제2의 시각적 랜드마크를 합성 시각적 랜드마크로 조합하는 단계를 포함하는
컴퓨터 저장 장치.
하나 이상의 컴퓨터 프로세서에 의해 실행되는 경우, 하나 이상의 스냅 바를 사용해 다이어그램을 조직하는 방법을 구현하는 컴퓨터 실행가능 명령어들이 저장된 하나 이상의 컴퓨터 저장 장치로서,
상기 방법은
다이어그램을 표현하는 하나 이상의 시각적 요소를 제시하는 단계;
상기 다이어그램 내에 상기 하나 이상의 시각적 요소와 함께 스냅 바를 제시하는 단계- 상기 스냅 바는 상기 스냅 바와 선택적으로 연관된 임의의 시각적 요소가 상기 스냅 바에 관련하여 배치되어야 하는 방식을 정의하는 하나의 이상의 대응 특성을 갖도록 구성되고, 상기 스냅 바는 두 개의 종단 노드 간에 연장되는 라인의 형상을 갖는 그래픽 개체를 포함함 -;
상기 스냅 바와 함께 디스플레이되는 상기 하나 이상의 시각적 요소 중 하나의 시각적 요소를 선택하는 입력을 수신하는 단계;
상기 시각적 요소를 상기 스냅 바와 선택적으로 연관시키는 추가 입력을 수신하는 단계- 상기 추가 입력은 제1 위치에서 디스플레이되는 상기 선택된 시각적 요소가 상기 스냅 바와 교차하는 제2 위치로 이동되어야 함을 나타냄 -;
선택된 시각적 요소가 선택되었음을 나타내는 시각적 피드백을 제공하는 단계;
상기 추가 입력을 수신하는 단계에 응답하여 상기 선택된 시각적 요소를 상기 다이어그램 내에 조직하기 위해 상기 스냅 바의 상기 하나 이상의 대응 특성에 따라 상기 선택된 시각적 요소를 상기 스냅 바에 관련하여 자동 배치하는 단계- 상기 배치하는 단계는 상기 선택된 시각적 요소가 상기 스냅 바의 상기 라인을 따라 상기 두 개의 종단 노드 사이에 적어도 부분적으로 배치되도록 함 -; 및
상기 다이어그램 내에 상기 선택된 시각적 요소의 조직을 반영하는 상기 하나 이상의 시각적 요소의 업데이트된 배열을 제시하는 단계
를 포함하는, 컴퓨터 저장 장치.
제32항에 있어서,
상기 자동 배치하는 단계는 상기 시각적 요소가 상기 스냅 바의 제한된 부분과만 부분적으로 중첩되도록 하여 상기 선택된 시각적 요소의 일부분만이 상기 스냅 바와 중첩되도록 하는
컴퓨터 저장 장치.