KR20170088672A

KR20170088672A - 온라인을 기반으로한 그림 동시 편집 시스템

Info

Publication number: KR20170088672A
Application number: KR1020160008864A
Authority: KR
Inventors: 송현준; 김형수
Original assignee: 송현준
Priority date: 2016-01-25
Filing date: 2016-01-25
Publication date: 2017-08-02

Abstract

본 발명에 따르면, 웹페이지는 캔버스를 포함한다. 캔버스는 클라이언트 디바이스의 사용자 및 캔버스를 포함하 는 웹페이지를 열기 위한 다른 클라이언트 디바이스를 사용하는 다른 사용자들에 의해 웹페이지 내에서 편집가능 한 그림을 포함한다. 웹페이지가 클라이언트 디바이스 상에서 열려있는 동안, 그림은 사용자 및 다른 사용자들 에 의해 그림에 가해진 편집을 실시간으로 반영하도록 동적으로 업데이트된다. 그림은 사용자가 웹페이지를 닫 았을 때에 다른 사용자들이 그림을 계속 편집할 수 있도록 서버 시스템 상에 저장된다. 사용자가 웹페이지를 다 시 열었을 때, 캔버스는 다른 사용자에 의해 편집된 그림을 포함한다

Description

온라인을 기반으로한 그림 동시 편집 시스템 {Based on the online picture editing simultaneous systems}

사람들은 소셜 네트워킹 서비스에서 주로 텍스트를 이용하여 통신한다. 그러나, 때때로 그림(drawing)을 통해서 통신하는 것이 보다 편리하거나 흥미로운 경우가 존재한다. 불행히도, 소셜 네트워킹 서비스에서 그림을 이용하여 통신하는 것이 용이하지는 않다. 예를 들어, 일부 소셜 네트워킹 서비스는 사람들이 그림을 업로드하고 다른 이들에게 그림을 전송하는 것을 허용한다. 그러나, 그러한 그림이 그림을 받은 사람에 의해 편집가능하지는 않다. 오히려, 그러한 그림은 전형적으로 JPG 또는 GIF 파일과 같은 정적 이미지이다. 다른 예시에서, 일부 소셜 네트워킹 서비스는 사용자들이 채팅 또는 인스턴트 메시징 세션 중에 그림에 대해 콜라보레이션하는 것을 가능케 하지만, 이러한 그림이 통신 세션을 넘어서까지 지속되지는 않 는다.

소셜 네트워킹 서비스(social networking service)는 사람들이 자신의 소셜 네트워크 내에서 다른 이들과 통신 하는 것을 돕는 웹사이트를 제공한다. 사람들은 소셜 네트워킹 서비스에서 주로 텍스트를 이용하여 통신한다. 그러나, 때때로 그림(drawing)을 통해서 통신하는 것이 보다 편리하거나 흥미로운 경우가 존재한다. 불행히도, 소셜 네트워킹 서비스에서 그림을 이용하여 통신하는 것이 용이하지는 않다. 예를 들어, 일부 소셜 네트워킹 서비스는 사람들이 그림을 업로드하고 다른 이들에게 그림을 전송하는 것을 허용한다. 그러나, 그러한 그림이 그림을 받은 사람에 의해 편집가능하지는 않다. 오히려, 그러한 그림은 전형적으로 JPG 또는 GIF 파일과 같은 정적 이미지이다. 다른 예시에서, 일부 소셜 네트워킹 서비스는 사용자들이 채팅 또는 인스턴트 메시징 세션 중에 그림에 대해 콜라보레이션하는 것을 가능케 하지만, 이러한 그림이 통신 세션을 넘어서까지 지속되지는 않 는다.

본 발명에 따르면, 웹페이지는 캔버스(canvas)를 포함한다. 이 캔버스는 클라이언트 디바이스의 사용자 및 그 캔버스를 포함하는 웹페이지를 열 수 있는 다른 클라이언트 디바이스를 사용하는 다른 사용자들에 의해 웹페이 지 내에서 편집될 수 있는 그림을 포함한다. 웹페이지가 클라이언트 디바이스 상에서 열려 있는 동안, 그림은 사용자 및 다른 사용자들이 도면에 편집을 하는 것과 거의 동시에 사용자 및 다른 사용자들에 의해 도면에 이루 어지는 편집을 반영하도록 동적으로 업데이트된다. 이러한 그림은 사용자가 웹페이지를 닫았을 때에도 다른 사 용자들이 도면에 대한 편집을 계속할 수 있도록 서버 시스템 상에 저장된다. 사용자가 웹페이지를 다시 열었을 때, 캔버스는 다른 사용자들에 의해 편집된 그림을 포함한다.

본 요약부는 개념들의 선택을 소개하고자 제공되었다. 이러한 개념들은 아래의 상세한 설명에서 추가로 기술될 것이다. 본 요약부는 본 발명의 청구사항의 중요한 특성 또는 기본적인 특성을 식별하기 위한 것이 아니며, 본 발명의 청구사항의 범주를 결정하는 것을 돕고자 하는 것도 아니다.

도 1은 예시적인 시스템을 도시한 블록도.
도 2는 클라이언트 디바이스의 예시적인 세부사항을 도시한 블록도. 도 3은 예시적인 브라우저 윈도우를 도시한 도면.
도 4는 서버 시스템의 예시적인 세부사항을 도시한 블록도.
도 5는 클라이언트 디바이스에 의해 수행되는 예시적인 동작의 제 1 부분을 도시한 순서도.
도 6은 클라이언트 디바이스에 의해 수행되는 예시적인 동작의 제 2 부분을 도시한 순서도.
도 7은 클라이언트 디바이스에 의해 수행되는 예시적인 동작의 제 3 부분을 도시한 순서도.
도 8은 서버 시스템에 의해 수행되는 예시적인 동작의 제 1 부분을 도시한 순서도.
도 9는 서버 시스템에 의해 수행되는 예시적인 동작의 제 2 부분을 도시한 순서도.
도 10은 예시적인 브라우저 윈도우를 도시한 예시적인 스크린을 도시한 도면.
도 11은 컨버스가 상태 업데이트 영역에 디스플레이될 때의 웹페이지를 나타내는 예시적인 스크린을 도시한 도 면.
도 12는 컨버스가 웹페이지에 추가된 후의 예시적인 웹페이지를 나타내는 예시적인 스크린을 도시한 도면. 도 13은 예시적인 컴퓨팅 디바이스를 도시한 블록도.

도 1은 예시적인 시스템(100)을 도시하는 블록도이다. 이 시스템(100)은 클라이언트 디바이스(102A 내지 102N)(집합적으로, "클라이언트 디바이스(102)")를 포함한다. 클라이언트 디바이스(102)는 개인 컴퓨터 및 휴 대용 디바이스와 같은 컴퓨팅 디바이스이다. 사용자(104A 내지 104N)(집합적으로, "사용자(104)")는 클라이언 트 디바이스(102)를 사용하는 사람이다.

시스템(100)은 또한 서버 시스템(106)을 포함한다. 서버 시스템(106)은 하나 이상의 컴퓨팅 디바이스를 포함하 는 시스템이다. 클라이언트 디바이스(102)는 네트워크(108)를 통해 서버 시스템(106)과 통신할 수 있다. 네트 워크(108)는 인터넷 또는 로컬 영역 네트워크와 같은 통신 네트워크이다. 네트워크(108)는 유선 및/또는 무선원격통신 링크를 포함할 수 있다.

서버 시스템(106)은 소셜 네트워킹 서비스를 호스팅한다. 소셜 네트워킹 서비스는 사람들 사이에서 소셜 네트 워킹을 구축하고 반영하는 것에 초점을 맞추는 소셜 네트워킹 웹사이트를 포함한다. 클라이언트 디바이스(10 2)는 사용자(104)가 소셜 네트워킹 서비스에 액세스할 수 있게 하도록 네트워크(108)를 통해 서버 시스템(106) 과 통신한다.

본 명세서에 기술된 바와 같이, 사용자(104)는 소셜 네트워킹 웹사이트에서 웹페이지를 열기 위해 클라이언트 디바이스(102)를 사용한다. 웹페이지는 캔버스(canvas)를 포함한다. 캔버스는 사용자(104)가 그림을 생성하도 록 콜라보레이션할 수 있는 웹페이지 내의 영역을 포함한다. 그림은 직선, 곡선, 삼각형, 원형, 텍스트, 화살 표, 이미지 등과 같은 다양한 요소들을 포함할 수 있다. 또한, 일부 실시예에서, 그림은 화상 요소를 포함할 수 있다. 화상 요소는 그림 내부의 비트맵 이미지이다. 캔버스는 또한 사용자(104)가 요소들을 그림에 추가할 수 있게 하는 온스크린 툴(onscreen tool)을 포함할 수 있다. 예를 들어, 캔버스는 사용자(104)가 원형, 삼각 형, 선, 텍스트 및 그외의 타입의 요소들을 그림에 추가할 수 있게 하는 온스크린 툴을 포함할 수 있다.

웹페이지가 클라이언트 디바이스(102) 상에서 열려 있는 동안, 클라이언트 디바이스(102)는 사용자(104)가 그림 에 변화를 가하는 것과 거의 동시에 사용자(104)에 의해 도면에 이루어진 변경사항을 반영하도록 그림을 동적으 로 업데이트한다. 이러한 방식으로, 만약 웹페이지가 둘 이상의 클라이언트 디바이스(102)에서 열려 있다면, 이러한 클라이언트 디바이스의 사용자들은 그들이 만든 그림에 대한 변화를 볼 수 있다. 예를 들어, 만약 웹페 이지가 클라이언트 디바이스(102A) 및 클라이언트 디바이스(102B)에서 열리고 사용자(104B)가 그림에 변화를 가 할 때, 사용자(104A)는 사용자(104B)가 그림을 변경한 것과 거의 동시에 변경사항을 확인할 수 있다.

후속하여, 사용자(104) 전부 또는 일부는 웹페이지를 닫을 수 있다. 사용자(104)가 웹페이지를 닫았을 때, 그 림의 콘텐츠가 손실되지 않는다. 오히려, 그림의 상태가 보존되어, 사용자(104)가 웹페이지를 다시 열었을 때 사용자(104)가 다시 시작하지 않고 그림의 편집을 계속할 수 있도록 한다.

사용자(104) 개개인은 다른 사용자(104)의 클라이언트 디바이스(102) 상에서 웹페이지가 열려있지 않아도 그림 을 편집할 수 있다. 예를 들어, 제 1 사용자(104)가 웹페이지가 열려있는 유일한 사용자일 수 있다. 이러한 예시에서, 제 1 사용자는 그림을 편집한 다음 웹페이지를 닫을 수 있다. 제 1 사용자가 웹페이지를 닫았을 때, 그림의 콘텐츠(즉, 그림 내의 요소들과 그러한 요소들의 속성)는 제 1 상태에 있다. 이러한 예시에서, 제 1 사 용자가 웹페이지를 닫은 후에 제 2 사용자(104)가 웹페이지를 연다. 제 2 사용자가 웹페이지를 열 때, 그림은 제 1 사용자에 의한 변경사항을 반영한다. 이러한 예시에서, 제 2 사용자는 그림에 추가적인 변경을 가할 수 있다. 그 다음 제 1 사용자가 웹페이지를 다시 열 수 있다. 제 1 사용자가 웹페이지를 다시 열 때, 그림의 콘 텐츠는 제 2 상태에 있다. 제 2 상태는 제 1 사용자의 클라이언트 디바이스 상에서 웹페이지가 닫혀있는 동안 제 2 사용자에 의해 그림이 변경된 결과이다.

도 2는 클라이언트 디바이스(10A)의 예시적인 세부사항을 도시한 블록도이다. 다른 클라이언트 디바이스(102) 들이 도 2의 예시에서의 클라이언트 디바이스(102A)에 대해 도시된 것과 유사한 세부사항을 가질 수 있음을 이 해해야 한다. 일부 실시예에서, 클라이언트 디바이스(102A) 및 사용자(104A)에 대한 아래의 설명이 다른 클라 이언트 디바이스(102) 및 사용자(104)에 대해서도 동일하게 적용가능하다.

클라이언트 디바이스(102A)는 컴퓨팅 디바이스이다. 다양한 실시예에서, 클라이언트 디바이스(102A)는 다양한 유형의 컴퓨팅 디바이스일 수 있다. 예를 들어, 클라이언트 디바이스(102A)는 개인 컴퓨터, 랩탑 컴퓨터, 휴대 용 컴퓨터, 넷북 컴퓨터, 스마트폰, 태블릿 컴퓨터, 차량용(in-car) 컴퓨터, 텔레비전 셋톱 박스, 비디오 게임 콘솔, 휴대용 비디오 게임 디바이스, 또는 다른 유형의 컴퓨팅 디바이스일 수 있다.

도 2의 예시에 도시된 바와 같이, 클라이언트 디바이스(102A)는 네트워크 인터페이스(200)를 포함한다. 네트워 크 인터페이스(200)는 클라이언트 디바이스(102A)가 네트워크(108) 상에서 다른 컴퓨팅 디바이스들과 통신할 수 있도록 한다. 클라이언트 디바이스(102A)는 또한 브라우저(202)를 제공한다. 브라우저(202)는 통신 네트워크 를 통해서 예컨대 웹페이지와 같은 문서를 열 수 있게 하는 소프트웨어 애플리케이션이다. 일부 실시예에서, 클라이언트 디바이스(102A)는 클라이언트 디바이스(102A)의 프로세싱 유닛이 하나 이상의 컴퓨터 스토리지 매체 상에 저장된 소정의 컴퓨터-실행가능한 명령들을 실행할 때 브라우저(202)를 제공한다. 브라우저의 예시적인 유형은 MICROSOFT® INTERNET EXPLORER® 웹 브라우저, Mozilla Firefox 웹 브라우저, Google Chrome 웹 브라 우저, Apple Safari 웹 브라우저, RIM BlackBerry 웹 브라우저, Opera 웹 브라우저 등을 포함한다.

브라우저(202)는 서버 시스템(106)에 의해 호스팅되는 웹사이트를 열도록 사용자(104A)로부터의 입력을 수신한다. 그에 대한 응답으로, 브라우저(202)는 네트워크 인터페이스(200)가 서버 시스템(106)에 웹페이지 요청 (204)을 전송하도록 한다. 웹페이지 요청(204)은 요청된 웹페이지를 나타내는 데이터에 대한 브라우저(202)에 의한 요청이다. 다양한 실시예에서, 웹페이지 요청(204)은 다양한 방법으로 포맷된다. 예를 들어, 일부 실시 예에서, 웹페이지 요청(204)은 Hypertext Transfer Protocol(HTTP) 요청으로서 포맷된다. 이어서, 브라우저 (202)는 네트워크 인터페이스(200)를 통해서 웹페이지 요청(206)을 수신한다. 웹페이지 요청(206)은 요청된 웹 페이지를 나타내는 데이터를 포함한다.

브라우저(202)가 웹페이지 응답(206)을 수신하면, 브라우저(202)는 디스플레이를 위한 웹페이지를 준비하도록 웹페이지를 나타내는 데이터를 프로세싱한다. 브라우저(202)가 웹페이지를 나타내는 데이터를 프로세싱하면, 브라우저(202)는 웹페이지가 캔버스를 포함하는지 여부를 판정한다. 만약 브라우저(202)가 웹페이지가 캔버스 를 포함한다고 결정하면, 브라우저(202)는 클라이언트 캔버스 모듈(208)을 시작한다. 클라이언트 캔버스 모듈 (208)은 캔버스를 관리한다.

캔버스를 관리하기 위해서, 클라이언트 캔버스 모듈(208)은 클라이언트 모듈(210)을 유지한다. 클라이언트 모 듈(210)은 캔버스 내의 그림을 나타내는 데이터를 포함한다. 다양한 실시예에서, 클라이언트 모델(210)은 다양 한 방식으로 그림을 나타낸다. 예를 들어, 클라이언트 모델(210)은 그림을 나타내는 XML 요소들의 계층을 포함 할 수 있다. 이러한 예시에서, XML 요소들의 계층은 Open Office XML(ECMA-376) 표준에서 명시된 DrawingML 포맷 또는 다른 포맷에 따를 수 있다. 이러한 예시에서, XML 요소들의 계층은 그림을 나타내는 XML 요소를 전 체로서 포함할 수 있다. 이러한 XML 요소들 내에는 그림 내의 개별적인 요소들을 나타내는 다른 XML 요소들이 존재한다. 그림 내의 개별적인 요소들은 라인, 삼각형, 텍스트, 원형 등을 포함할 수 있다. XML 요소들의 각 각은 요소들의 속성을 명시하는 속성을 포함한다.

브라우저(202)가 웹페이지를 연 후에, 클라이언트 캔버스 모듈(208)은 그림을 편집하기 위해서 사용자(104A)로 부터의 입력을 수신한다. 예를 들어, 클라이언트 캔버스 모듈(208)은 요소들을 그림에 추가하고, 그림 내에 현 존하는 요소들을 속성을 수정하고, 그림으로부터 현존하는 요소들을 삭제하는 등의 입력을 수신할 수 있다. 이 러한 입력에 응답하여, 클라이언트 캔버스 모듈(208)은 입력에 의해 표시되는 변경사항을 반영하도록 클라이언 트 모델(210)을 업데이트한다. 또한, 클라이언트 캔버스 모듈(208)은 그림이 입력에 의해 표시되는 변경사항을 반영하도록 웹페이지 내의 캔버스를 업데이트한다.

또한, 클라이언트 캔버스 모듈(208)이 그림에 대해 변경을 가하기 위해 사용자(104A)로부터의 입력을 수신하면, 클라이언트 캔버스 모듈(208)은 네트워크 인터페이스(200)가 서버 시스템(106)에 클라이언트 메시지(212)를 전 송하도록 한다. 클라이언트 메시지(212)는 그림에 대한 변경사항을 명시한다. 예를 들어, 만약 입력 그림으로 부터 요소를 삭제하기 위한 것이라면, 클라이언트 메시지는 요소가 그림으로부터 삭제되었음을 표시한다. 이러 한 방식으로, 서버 시스템(106)은 클라이언트 디바이스(102A)에서 그림의 상태를 계속 따라가게 된다.

다양한 실시예에서, 클라이언트 메시지(212)는 다양한 방식으로 포맷된다. 예를 들어, 클라이언트 모델(210)이 그림을 나타내는 XML 요소 계층을 포함하는 실시예에서, 클라이언트 메시지(212)는 클라이언트 모델(210) 내의 하나 이상의 XML 요소에 대한 변경사항을 명시함으로써 그림에 대한 변경사항을 명시한다.

클라이언트 캔버스 모듈(208)은 또한 서버 시스템(106)으로부터 서버 메시지(214)를 수신한다. 서버 메시지 (214)는 다른 사용자에 의해 이루어진 그림에 대한 변경사항을 명시한다. 클라이언트 캔버스 모듈(208)은 서버 메시지(214) 내에 명시된 변경사항을 반영하도록 클라이언트 모델(210)을 업데이트한다. 이러한 방식으로, 클 라이언트 캔버스 모듈(208)은 서버 시스템(106)에서 그림의 상태를 따라간다. 또한, 클라이언트 캔버스 모듈 (208)은 서버 메시지(214) 내에 명시된 변경사항을 반영하도록 사용자(104A)에게 디스플레이된 그림을 동적으로 업데이트한다.

다양한 실시예에서, 서버 메시지(214)는 다양한 방식으로 포맷된다. 예를 들어, 클라이언트 모델(210)이 그림 을 나타내는 XML 요소 계층을 포함하는 실시예에서, 서버 메시지(214)는 클라이언트 모델(210) 내의 하나 이상 의 XML 요소에 대한 변경사항을 명시함으로써 그림에 대한 변경사항을 명시한다.

다수의 사용자들이 그림을 동시에 편집할 수 있기 때문에, 충돌하는 변화가 발생할 수 있다. 예를 들어, 사용 자(104) 중 한 명(예컨대, 사용자(104A))이 특정한 요소를 삭제하고자 시도하는 동시에 사용자(104) 중 다른 한 명(예컨대, 사용자(104B))이 그 특정한 요소의 하나 이상의 속성을 수정하고자 시도할 수 있다. 그러므로, 사 용자(104A)에 의해 이루어지는 변화와 사용자(104B)에 의해 이루어지는 변화 간에 충돌이 존재한다. 이러한 충 돌을 방지하기 위해서, 그림 내의 요소들은 전형적으로 사용자(104)가 먼저 요소를 선택하지 않는 한 수정 또는삭제될 수 없다. 사용자(104)가 그림 내의 요소를 선택할 때마다, 클라이언트 디바이스(102)는 서버 시스템 (106)으로 잠금 요청(lock request)을 전송한다. 잠금 요청은 선택된 요소를 명시한다. 서버 시스템(106)이 그림 내의 특정한 요소를 명시하는 잠금 요청을 수신하면, 서버 시스템(106)은 특정한 요소가 선택된 동안은 다 른 사용자가 그 요소를 수정 또는 삭제할 수 없도록 그 특정한 요소를 잠근다. 이러한 방식으로, 서버 시스템 (106)은 제 2 사용자가 소정의 요소를 선택하였을 때 제 1 사용자가 그림 내의 상기 소정의 요소를 수정 또는 삭제하는 것을 방지하고, 그 역도 마찬가지이다.

도 2의 예시에 도시된 바와 같이, 클라이언트 디바이스(102A)는 또한 클립보드(216) 및 애플리케이션(218)을 제 공한다. 일부 실시예에서, 클라이언트 디바이스(102A)는 컴퓨터 실행가능한 명령들을 실행함으로써 클립보드 (216) 및 애플리케이션(218)을 제공한다. 애플리케이션(218)은 사용자(104A)가 문서를 편집하는 것을 가능케 한다. 다양한 실시예에서, 애플리케이션(218)은 서로 다른 유형의 다양한 애플리케이션들일 수 있다. 예를 들 어, 애플리케이션(218)은 (Microsoft® Word와 같은) 워드 프로세서 애플리케이션, (Microsoft® PowerPoint® 와 같은) 슬라이드쇼 애플리케이션, (Microsoft® OnNote®와 같은) 노트 테이킹 애플리케이션, (Microsoft® Outlook®과 같은) 이메일 애플리케이션, (Microsoft® Visio®와 같은) 다이어그램 편집 애플리케이션, 또는 사용자(104A)가 문서를 편집하는 것을 가능케 하는 다른 유형의 애플리케이션일 수 있다.

사용자(104A)는 웹페이지가 브라우저(202) 내에서 열려있는 동안에 브라우저(202)로 복사 입력을 제공할 수 있 다. 다양한 실시예에서, 사용자(104A)는 다양한 방식으로 브라우저(202) 내에 복사 입력을 제공할 수 있다. 예를 들어, 사용자(104A)는 그림을 선택한 다음 키보드 상에서 키의 조합(예컨대, 컨트롤-C)을 누를 수 있다. 다른 예시에서, 브라우저(202)는 사용자(104A)가 캔버스 상에서 오른쪽 마우스를 클릭하였을 때 팝-업 메뉴를 디스플레이한다. 이러한 예시에서, 사용자(104A)는 팝-업 메뉴로부터 복사 명령(copy command)을 선택함으로써 브라우저(202)로 복사 입력을 제공한다.

복사 입력을 수신하면, 브라우저(202)는 클라이언트 모델(210)을 클립보드(216)로 복사한다. 사용자(104A)는 그 다음 애플리케이션(218) 내에 열려있는 문서에 그림을 붙여넣기(paste) 할 수 있다. 사용자(104A)가 그림을 문서에 붙여넣기하면, 애플리케이션(218)은 클라이언트 모델(210)을 문서 모델로 포함시킨다. 문서 모델은 문 서를 나타내는 데이터를 포함한다. 예를 들어, 클라이언트 모델(210) 및 문서 모델은 XML 요소들의 계층을 포 함할 수 있다. 이러한 예시에서, 애플리케이션(218)은 클라이언트 모델(210) 내의 XML 요소들의 계층을 문서 모델 내의 XML 요소들의 계층으로 포함시킨다. 사용자(104A)가 그림을 문서에 붙여넣기 한 후에, 사용자(104 A)는 그림이 문서 내에 있는 동안 그림의 편집을 계속할 수 있다.

일부 실시예에서, 사용자(104A)는 애플리케이션(218)으로 복사 입력을 제공할 수 있다. 복사 입력은 애플리케 이션(218)에게 애플리케이션(218)에 열려있는 문서 내의 그림을 복사하라고 명령한다. 그에 응답하여, 애플리 케이션(218)은 그림의 모델을 클립보드(216)에 복사한다. 예를 들어, 문서 모델이 XML 요소들의 계층을 포함할 때, 애플리케이션(218)은 그림을 나타내는 XML 요소들을 클립보드(216)로 복사한다. 사용자(104A)는 그 다음 브라우저(202)에게 클립보드(216)로부터 브라우저(202) 내에 열려있는 웹페이지 내의 캔버스로 그림을 붙여넣기 하도록 명령할 수 있다. 예를 들어, XML 요소들의 계층이 그림을 나타내는 경우에, 브라우저(202)는 이러한 XML 요소들의 계층을 그림에 대한 클라이언트 모델로서 클라이언트 캔버스 모듈(208)에 제공할 수 있다.

일부 실시예에서, 사용자(104A)는 그림 내의 일부 요소들을 복사하고 붙여넣기 할 수 있다. 이를 위해서, 사용 자(104A)는 웹페이지 내에 디스플레이되어 있는 그림 내의 하나 이상의 개별적인 요소를 선택한다. 사용자 (104A)는 그 다음 브라우저(202)에 복사 입력을 제공한다. 그에 응답하여, 브라우저(202)는 클립보드(216) 내 에 새로운 모델을 생성한다. 새로운 모델은 그림의 선택된 요소를 나타내지만, 그림의 선택되지 않은 요소들은 나타내지 않는다. 사용자(104A)는 그 후에 애플리케이션(218)에 붙여넣기 입력을 제공할 수 있다. 그에 응답 하여, 애플리케이션(218)은 새로운 모델을 애플리케이션(218) 내에 열려있는 문서의 문서 모델로 포함시킨다. 이러한 방식으로, 문서는 새로운 모델(즉 선택된 요소들)에 의해 나타내어지는 그림을 포함한다. 유사한 프로 세스가 애플리케이션(218)에 열려있는 문서 내의 그림 내의 개별적인 요소를 복사하고 브라우저(202) 내에 열려 있는 웹페이지 내의 그림으로 붙여넣기 위해서 발생할 수 있다.

도 3은 예시적인 브라우저 윈도우(300)를 도시한다. 브라우저 윈도우(300)는 브라우저(202)에 의해 디스플레이 되는 윈도우이다. 브라우저 윈도우(300)는 네비게이션 컨트롤(302)을 포함한다. 네비게이션 컨트롤(302)은 사 용자(104A)가 네비게이션을 컨트롤하는 것을 가능케 한다.

브라우저 윈도우(300)는 또한 웹페이지(304)를 포함한다. 도 3의 예시에서, 웹페이지(304)는 텍스트 블록(30 6)을 포함한다. 텍스트 블록(306)에 추가로, 웹페이지는 캔버스(308)를 포함한다. 캔버스(308)는 그림(310)을포함한다. 그림(310)은 요소(312)들의 세트를 포함한다.

캔버스(308)는 또한 그림 컨트롤(314A 내지 314F)(집합적으로, "그림 컨트롤(314)")을 포함한다. 그림(310)에 요소를 추가하기 위해서, 사용자(104A)는 그림 컨트롤(314) 중 하나를 선택한다. 사용자(104A)는 그 다음 요소 에 대한 위치 및/또는 형태를 제안하는 제스처를 취하도록 입력 디바이스를 사용한다. 예를 들어, 선을 그리기 위해서, 사용자(104A)는 그림 컨트롤(314A)을 선택한다. 이러한 예시에서, 사용자(104A)는 그 다음 커서(322) 가 선이 시작해야 하는 그림(310) 내의 포인트에 있을 때 버튼을 누른 채로 있고, 커서(322)가 선이 끝나야 하 는 그림(310) 내의 포인트에 있을 때 버튼을 해제시킨다. 다른 예시에서, 그림(310) 내에 텍스트를 추가하기 위해서, 사용자(104A)는 그림 컨트롤(314D)을 선택한다. 이러한 예시에서, 사용자(104A)는 텍스트박스의 코너 가 나타나야 하는 그림(310) 내의 포인트에 커서(322)가 있을 때 버튼을 누른 채로 있고, 텍스트박스의 대각선 반대편 코너가 나타나야 하는 그림(310) 내의 포인트에 커서(322)가 있을 때 버튼을 해제한다. 이러한 예시에 서, 사용자(104A)는 텍스트를 텍스트박스에 입력하도록 키보드 또는 다른 입력 디바이스를 사용할 수 있다.

다양한 실시예에서, 사용자(104A)는 다양한 방식으로 그림(310) 내의 요소를 선택한다. 예를 들어, 사용자 (104A)는 요소 위에 커서(322)를 위치시키고 버튼을 누름으로써 그림(310) 내의 요소를 선택할 수 있다. 다른 예시에서, 사용자(104A)는 특정한 키보드 버튼(예컨대, "탭")을 반복적으로 누름으로써 그림(310) 내의 요소를 선택할 수 있다. 이러한 예시에서, 그림(310) 내의 서로 다른 요소가 사용자(104A)가 특정한 키보드 버튼을 누 를 때마다 선택된다. 다른 예시에서, 브라우저 윈도우(300)는 터치식(touch-sensitive) 디스플레이 상에 디스 플레이된다. 이러한 예시에서, 사용자(104A)는 터치식 디스플레이 상에 요소를 터치함으로써 그림(310) 내의 요소를 선택할 수 있다.

요소가 선택된 상태에 있는 동안에, 사용자(104A)는 요소를 삭제할 수 있다. 다양한 실시예에서, 사용자(104 A)는 요소를 삭제하기 위해 다양한 동작들을 수행한다. 예를 들어, 사용자(104A)는 키보드 버튼(예컨대, "delete" 또는 "backspace")을 누름으로써 요소를 삭제할 수 있다. 다른 예시에서, 사용자(104A)는 온-스크린 컨트롤(도시되지 않음)을 선택함으로써 요소를 삭제할 수 있다.

요소가 선택된 상태에 있는 동안에, 사용자(104A)는 요소의 하나 이상의 속성을 수정할 수 있다. 사용자(104 A)는 서로 다른 동작들을 수행함으로써 요소의 서로 다른 속성들을 수정할 수 있다. 예를 들어, 사용자(104A) 는 요소를 원하는 위치로 드래그(drag)하기 위해서 커서(322)를 사용함으로써 요소의 위치를 수정할 수 있다. 다른 예시에서, 사용자(104A)는 캔버스(308) 내의 색상 선택 창(pane)을 열고 원하는 색상을 선택함으로써 요소 의 선의 색상을 수정할 수 있다.

일부 실시예에서, 웹페이지(304)는 소셜 네트워킹 웹페이지의 일부이다. 예를 들어, 웹페이지(304)는 사용자 (104A)에 대한 소셜 네트워킹 프로필 페이지일 수 있다. 소셜 네트워킹 프로필 페이지는 사용자에 대한 개인 정보를 포함하는 웹페이지이다. 사용자의 소셜 네트워킹 프로필 페이지는 사용자 신상의 디지털 표현으로서의 역할을 할 수 있다. 다른 예시에서, 웹페이지(304)는 사용자들의 그룹에 대한 소셜 네트워킹 웹사이트 내의 웹 페이지일 수 있다. 또 다른 예시에서, 웹페이지(304)는 그룹 웹페이지 또는 사용자의 프로필 페이지에 링크된 소셜 네트워킹 웹사이트 내의 웹페이지일 수 있다.

캔버스(308)는 또한 공유 컨트롤(316)을 포함한다. 사용자(104A)가 공유 컨트롤(316)을 선택하면, 브라우저 (202)는 연락처 리스트를 디스플레이한다. 연락처 리스트는 사용자(104A)에 의해 사용자(104A)와 직접적인 사 회적 관계를 갖는 것으로 지정된 사람들의 리스트이다. 사용자(104A)는 연락처 리스트로부터 사람을 선택한다. 서버 시스템(106)은 선택된 사람이 그림(310)을 보고/보거나 편집하도록 초대한다. 예를 들어, 서버 시스템 (106)은 선택된 사람이 그림(310)을 보고/보거나 편집하도록 초대하기 위해 이메일 메시지 또는 텍스트 메시지 를 전송할 수 있다.

도 3의 예시에서, 캔버스(308)는 또한 승인 컨트롤(318)을 포함한다. 사용자(104A)가 승인 컨트롤(318)을 선택 하면, 브라우저(202)는 승인 인터페이스를 디스플레이한다. 승인 인터페이스는 사용자(104A)로 하여금 어떤 다 른 사람이 그림(310)을 보고/보거나 편집할 수 있을지를 선택하도록 한다. 다양한 실시예에서, 승인 인터페이 스는 다양한 정보를 포함할 수 있고 다양한 방식으로 포맷될 수 있다. 예를 들어, 서버 시스템(106)은 사용자 (104A)의 소셜 네트워킹 연락처의 리스트를 클라이언트 디바이스(102A)로 전송할 수 있다. 사용자(104A)의 소 셜 네트워킹 연락처는 사용자(104A)와 직접적인 사회적 관계를 갖는 것으로 사용자(104A)에 의해 지정된 사람들 이다. 이러한 예시에서, 사용자(104A)는 체크박스 또는 연락처의 사람들 중 누가 그림(310)을 보고/보거나 편 집하도록 권한이 주어졌는지를 명시하기 위한 다른 유형의 컨트롤을 사용할 수 있다. 다른 예시에서, 승인 인 터페이스는 사용자(104A)의 직장 동료인 사람들의 리스트를 나열할 수 있다. 사용자(104A)가 그림을 보고/보거나 편집할 한 명 이상의 사람을 선택한 후에, 브라우저(202)는 승인 메시지를 서버 시스템(106)으로 전송한다. 승인 메시지는 어떤 사용자에게 그림을 보고/보거나 편집할 권한이 주어졌는지를 나타낸다.

또한, 캔버스(308)는 복사 컨트롤(320)을 포함한다. 사용자(104A)가 복사 컨트롤(320)을 선택하면, 브라우저 (202)는 그림(310)에 대한 클라이언트 모델(210)(또는 그림(310) 내의 선택된 요소를 나타내는 모델)을 클립보 드(216)로 복사한다.

도 4는 서버 시스템(106)의 예시적인 세부사항을 나타내는 블록도이다. 전술된 바와 같이, 서버 시스템(106)은 하나 이상의 컴퓨팅 디바이스를 포함한다. 다양한 실시예에서, 서버 시스템(106)은 다양한 유형의 컴퓨팅 디바 이스를 포함할 수 있다. 예를 들어, 서버 시스템(106)은 독립형 서버 디바이스, 블레이드(blade) 서버 디바이 스, 개인 컴퓨터, 라우터, 스위치, 브릿지, 허브, 방화벽 디바이스, 로드 밸런서(load balancer), 스토리지 디 바이스 및 다른 유형의 컴퓨팅 디바이스를 포함할 수 있다.

도 4의 예시에서 도시된 바와 같이, 서버 시스템(106)은 웹 서버(400) 및 서버 캔버스 모듈(402)을 제공한다. 일부 실시예에서, 서버 시스템(106)은 서버 시스템(106) 내의 하나 이상의 컴퓨팅 디바이스가 컴퓨터-실행가능 한 명령어를 실행할 때 웹 서버(400) 및 서버 캔버스 모듈(402)을 제공한다. 서버 시스템(106)은 또한 데이터 베이스(404)를 저장한다. 다양한 실시예에서, 서버 시스템(106) 내의 하나 이상의 컴퓨팅 디바이스는 데이터베 이스(404)를 저장한다.

웹 서버(400)는 클라이언트 디바이스(102)로부터 웹페이지 요청(406)을 수신한다. 웹페이지 요청(406)은 서버 시스템(106)에 의해 호스팅되는 웹페이지를 열기 위한 요청이다. 다양한 실시예에서, 웹페이지 요청(406)은 다 양한 방식으로 포맷된다. 예를 들어, 일부 실시예에서, 웹페이지 요청(406)은 HTTP 요청으로서 포맷된다. 웹 서버(400)는 웹페이지 응답(408)을 웹페이지 요청(406)에 대한 응답으로서 전송한다. 웹페이지 응답(408)은 웹 페이지를 나타내는 데이터를 포함한다.

또한, 웹 서버(400)가 클라이언트 디바이스(102A)로부터 웹페이지 요청을 수신하고 요청된 웹페이지가 캔버스를 포함하면, 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)를 구독 리스트(subscription list)(410)에 추가 한다. 구독 리스트(410)는 캔버스를 포함하는 웹페이지를 연 클라이언트 디바이스(102)를 나열한다.

후속하여, 웹 서버(400)는 클라이언트 디바이스(102)로부터 클라이언트 메시지(412)를 수신한다. 클라이언트 메시지(412)는 클라이언트 디바이스(102)의 사용자에 의해서 캔버스 내의 그림에 대해 이루어진 변경사항을 명 시한다. 예를 들어, 클라이언트 메시지(412)는 그림에 대한 요소의 추가, 그림 내 요소의 선택 등을 명시할 수 있다. 웹 서버(400)가 클라이언트 메시지(412)를 수신할 때, 서버 캔버스 모듈(402)은 데이터베이스(40) 내의 서버 모델(414)을 업데이트한다. 서버 모델(414)은 그림을 나타내는 데이터를 포함한다. 서버 캔버스 모듈 (402)은 클라이언트 메시지(412)에 의해 표시되는 그림에 대한 변경사항을 반영하도록 서버 모델(414)을 업데이 트한다. 예를 들어, 서버 모델(414)은 그림을 나타내는 XML 요소 계층을 포함할 수 있다. 이러한 예시에서, 클라이언트 메시지(412) 중 하나는 사용자(104A) 그림으로부터 소정의 요소를 삭제하였음을 표시할 수 있다. 이러한 예시에서, 서버 캔버스 모듈(402)은 소정의 요소를 나타내는 XML 요소를 제거하도록 서버 모델(414) 내 의 XML 요소 계층을 업데이트한다.

서버 캔버스 모듈(402)이 그림에 대한 변경사항을 반영하도록 서버 모델(414)을 업데이트하면, 서버 캔버스 모 듈(402)은 구독 리스트(410) 내에 나열된 클라이언트 디바이스들 각각에게 서버 메시지(416)를 전송한다. 서버 메시지(416)는 그림에 대한 변경사항을 명시한다. 다양한 실시예에서, 서버 메시지(416)는 다양한 방식으로 그 림의 상태에 대한 변화를 명시할 수 있다. 예를 들어, 만약 서버 캔버스 모듈(402)이 그림 내의 소정의 요소를 나타내는 XML 요소를 삭제하면, 서버 메시지(416)는 서버 모델(414)로부터 XML 요소가 삭제되었음을 명시한다. 서버 메시지(416)를 프로세싱함으로써, 클라이언트 디바이스(102)는 다른 클라이언트 디바이스(102)에 의해 이 루어진 그림에 대한 변경을 따라갈 수 있다.

도 5는 클라이언트 디바이스(102A)에 의해 수행된 예시적인 동작(500)을 도시한 순서도이다. 본 명세서가 동작 (500)을 클라이언트 디바이스(102A)에 의해 수행되는 것으로서 기술하지만, 임의의 클라이언트 디바이스(102)가 동작(500)을 수행할 수 있다.

도 5의 예시에 도시된 바와 같이, 동작(500)은 브라우저(202)가 사용자(104A)로부터 입력이 수신되었는지 여부 를 판정(502)하는 것에서 시작한다. 만약 입력이 사용자로부터 수신되지 않았다면(단계(502)에서 "아니오"), 동작(500)은 도 7의 원으로 표시된 "C"로 진행한다. 만약 입력이 사용자(104A)로부터 수신되었다면(단계(502) 에서 "네"), 브라우저(202)는 입력이 네비게이션 입력인지 여부를 판정(504)한다. 네비게이션 입력은 브라우저

(202)에게 웹페이지를 열도록 명령하는 입력이다. 다양한 실시예에서, 브라우저(202)는 다양한 유형의 네비게 이션 입력을 수신할 수 있다. 예를 들어, 브라우저(202)는 사용자(104A)가 백 버튼(back button), 포워드 버튼, 리로드(reload) 버튼을 선택하거나, 네비게이션 바 내에 새로운 주소를 입력하거나, 하이퍼링크를 클릭하 거나, 또는 브라우저(202)에게 웹페이지를 열라고 명령하는 다른 유형의 입력을 제공할 때 네비게이션 입력을 수신할 수 있다. 만약 입력이 네비게이션 입력이면(단계(504)에서 "네"), 브라우저(202)는 서버 시스템(106)으 로 웹페이지 요청을 전송(506)한다. 웹페이지 요청은 웹페이지를 열라는 요청이다. 후속하여, 브라우저(202) 는 서버 시스템(106)으로부터 웹페이지 응답을 수신(508)한다. 웹페이지 응답은 웹페이지를 나타내는 데이터를 포함한다. 브라우저(202)는 그 다음 사용자(104A)에게 웹페이지를 디스플레이하도록 웹페이지를 렌더링(510)한 다. 웹페이지를 렌더링한 후에, 동작(500)은 다시 시작된다.

다른 한편으로, 만약 입력이 네비게이션 입력이 아니라면(단계(504)에서 "아니오"), 클라이언트 캔버스 모듈 (208)은 입력이 캔버스 생성 입력인지 여부를 판정(512)한다. 캔버스 생성 입력은 사용자(104A)가 웹페이지 내 에 캔버스를 포함하기를 원한다는 것을 표시한다. 다양한 실시예에서, 사용자(104A)는 다양한 방식으로 캔버스 생성 입력을 브라우저(202)에게 제공할 수 있다. 예를 들어, 일부 실시예에서, 웹페이지는 자신이 선택되었을 때 브라우저(202)에게 캔버스 생성 입력을 제공하는 컨트롤을 포함할 수 있다. 만약 입력이 캔버스 생성 입력 이라면(단계(512)에서 "네"), 클라이언트 캔버스 모듈(208)은 캔버스 생성 요청을 포함하는 클라이언트 메시지 를 서버 시스템(106)으로 전송(514)한다. 캔버스 생성 요청은 서버 시스템(106)에게 웹페이지 내에 새로운 캔 버스를 생성할 것을 명령한다. 일부 실시예에서, 클라이언트 캔버스 모듈(208)은 사용자로부터의 입력 없이도 자동으로 서버 시스템(106)에 캔버스 생성 요청을 전송할 수 있다. 예를 들어, 클라이언트 캔버스 모듈(208)은 웹페이지가 로딩될 때 서버 시스템(106)으로 캔버스 생성 요청을 전송할 수 있다. 서버 시스템(106)으로 캔버 스 생성 요청을 전송한 후에, 동작(500)은 재시작한다.

만약 입력이 캔버스 생성 입력이 아니라면(단계(512)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 입력이 승 인 입력인지 여부를 판정(516)한다. 승인 입력은 캔버스에 대한 승인을 설정하기 위한 사용자(104A)로부터의 입력이다. 캔버스에 대한 승인은 어느 다른 사용자에게 캔버스를 보고/보거나 편집할 권한이 주어지는 지를 좌 우한다. 다양한 실시예에서, 사용자(104A)는 다양한 방식으로 승인 입력을 제공한다. 예를 들어, 클라이언트 디바이스(102A)는 사용자(104A)에게 소셜 네트워킹 서비스의 사용자들의 리스트를 디스플레이할 수 있다. 사용 자(104A)는 그 다음 소셜 네트워킹 서비스의 사용자들로부터 사용자를 선택함으로써 승인 입력을 제공할 수 있 다. 이러한 예시에서, 선택되지 않은 사용자는 그림을 편집할 권한이 주어지지 않는다.

만약 입력이 승인 입력이면(단계(516)에서 "네"), 클라이언트 캔버스 모듈(208)은 승인 메시지(518)를 포함하는 클라이언트 메시지를 서버 시스템(106)에 전송한다. 승인 메시지는 서버 시스템(106)이 캔버스에 대한 승인을 설정 또는 업데이트하도록 명령한다. 클라이언트 메시지를 전송한 후에, 동작(500)이 재시작된다. 만약 입력 이 승인 입력이 아니면(단계(516)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 원으로 표시된 "B"에서 시작 하는 도 6에 도시된 동작(500)의 부분을 수행한다.

도 6은 동작(500)의 제 2 부분을 도시한 순서도이다. 원으로 표시된 "B"에서 이어서, 클라이언트 캔버스 모듈 (208)은 입력이 요소 선택 입력인지 여부를 판정(600)한다. 요소 선택 입력은 그림 내의 현존하는 요소를 선택 하라는 사용자(104A)로부터의 입력이다. 만약 클라이언트 캔버스 모듈(208)이 입력이 요소 선택 입력이라도 판 정하면(단계(600)에서 "네"), 클라이언트 캔버스 모듈(208)은 서버 시스템(106)으로 잠금 요청을 포함하는 클라 이언트 메시지를 전송(602)한다. 후속하여, 클라이언트 캔버스 모듈(208)은 잠금 응답을 포함하는 서버 메시지 를 서버 시스템(106)으로부터 수신(604)한다. 잠금 응답 메시지는 서버 시스템(106)이 클라이언트 캔버스 모듈 (208)에게 현존하는 요소에 대해 잠금을 했는지 여부를 표시한다. 그러므로, 클라이언트 캔버스 모듈(208)이 서버 시스템(106)으로부터 잠금 응답 메시지를 수신하면, 클라이언트 캔버스 모듈(208)은 서버 시스템(106)이 클라이언트 캔버스 모듈(208)에게 현존하는 요소에 대한 잠금을 했는지 여부를 판정하는 데에 잠금 응답 메시지 를 사용(606)한다. 만약 서버 시스템(106)이 클라이언트 캔버스 모듈(208)에게 현존하는 요소에 대해 잠금을 했다면(단계(606)에서 "네"), 클라이언트 캔버스 모듈(208)은 클라이언트 캔버스 모듈(208)이 현존하는 요소에 대해 잠금이 되어있음을 표시하도록 클라이언트 모델(210)을 업데이트(608)한다. 클라이언트 캔버스 모듈(20 8)이 단계(608)에서 클라이언트 모델을 업데이트한 후에, 또는 클라이언트 캔버스 모듈(208)이 서버 시스템 (106)이 현존하는 요소에 대해 클라이언트 캔버스 모듈(208)에 잠금을 하지 않았다고 판정(단계(606)에서 "아니 오")한 후에, 동작(500)은 도 7의 원으로 표시된 "C"에서 계속된다.

만약 입력이 요소 선택 입력이 아니라면(단계(600)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 입력이 요소 선택해제 입력인지 여부를 판정(610)한다. 요소 선택해제 입력은 그림 내의 소정의 요소를 선택해제하기 위한

입력이다. 다양한 실시예에서, 사용자(104A)는 다양한 방식으로 요소 선택해제 입력을 제공할 수 있다. 예를 들어, 사용자(104A)는 요소를 포함하지 않는 캔버스를 부분을 선택하거나 또는 그림 내의 다른 요소를 선택함으 로써 요소 선택해제 입력을 제공할 수 있다. 만약 입력이 요소 선택해제 입력이라면(단계(610)의 "네"), 클라 이언트 캔버스 모듈(208)은 요소 선택해제 입력에 의해 명시된 소정의 요소가 더 이상 선택되지 않았음을 표시 하도록 클라이언트 모델(210)을 업데이트(612)한다. 또한, 클라이언트 캔버스 모듈(208)은 선택해제 요청을 포 함하는 클라이언트 메시지를 서버 시스템(106)에 전송(614)한다. 선택해제 요청은 서버 시스템(106)에게 클라 이언트 캔버스 모듈(208)이 더 이상 소정의 요소에 대한 잠금을 필요로 하지 않는다는 것을 나타낸다. 클라이 언트 캔버스 모듈(208)이 단계(614)에서 클라이언트 메시지를 전송한 후에, 동작(500)은 도 7의 원으로 표시된 "C"에서 계속된다.

만약 입력이 요소 선택해제 입력이 아니라면(단계(610)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 입력이 요소 추가 입력인지 여부를 판정(616)한다. 요소 추가 입력은 그림에 새로운 요소를 추가하라는 입력이다. 만 약 입력이 요소 추가 입력이라면(단계(616)에서 "네"), 클라이언트 캔버스 모듈(208)은 요소 추가 입력에 의해 명시된 새로운 요소를 포함하도록 클라이언트 모델(210)을 업데이트(618)한다. 클라이언트 캔버스 모듈(208)은 그 다음 요소 추가 요청을 포함하는 클라이언트 메시지를 서버 시스템(106)으로 전송(620)한다. 요소 추가 요 청은 새로운 요소를 명시한다. 클라이언트 캔버스 모듈(208)이 단계(620)에서 클라이언트 메시지를 전송한 후 에, 동작(500)은 도 7의 원으로 표시된 "C"에서 계속된다.

만약 입력이 요소 추가 입력이 아니라면(단계(616)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 입력이 요소 수정 입력인지 여부를 판정(622)한다. 요소 수정 입력은 그림에 이미 존재하는 소정의 요소의 하나 이상의 속 성을 수정하기 위한 입력이다. 만약 입력이 요소 수정 입력이라면(단계(622)에서 "네"), 클라이언트 캔버스 모 듈(208)은 수정의 요소의 하나 이상의 속성을 수정하도록 클라이언트 모델(210)을 업데이트(624)한다. 클라이 언트 캔버스 모듈(208)은 그 다음 요소 수정 요청을 포함하는 클라이언트 메시지를 서버 시스템(106)으로 전송 (626)한다. 요소 수정 요청은 소정의 요소의 속성에 대한 변경사항을 표시한다. 클라이언트 캔버스 모듈(20 8)이 단계(626)에서 클라이언트 메시지를 전송한 후에, 동작(500)은 도 7의 원으로 표시된 "C"에서 계속된다.

만약 입력이 요소 수정 입력이 아니라면(단계(622)의 "아니오"), 클라이언트 캔버스 모듈(208)은 입력이 요소 삭제 입력인지 여부를 판정(628)한다. 요소 삭제 입력은 그림 내의 하나 이상의 요소를 삭제하기 위한 입력이 다. 만약 입력이 요소 삭제 입력이라면(단계(628)에서 "네"), 클라이언트 캔버스 모듈(208)은 하나 이상의 요 소를 삭제하도록 클라이언트 모델(210)을 업데이트(630)한다. 클라이언트 캔버스 모듈(208)은 그 다음 요소 삭 제 요청을 포함하는 클라이언트 메시지를 서버 시스템(106)으로 전송(632)한다. 요소 삭제 요청은 하나 이상의 요소가 그림으로부터 삭제되었음을 나타낸다. 클라이언트 캔버스 모듈(208)이 단계(632)에서 클라이언트 메시 지를 전송한 후에, 동작(500)은 도 7의 원으로 표시된 "C"에서 계속된다.

도 7은 동작(500)의 제 3 부분을 도시하는 순서도이다. 도 7에 도시된 바와 같이, 동작(500)은 원으로 표시된 "C"에서 계속된다. 처음에, 클라이언트 캔버스 모듈(208)은 클라이언트 디바이스(102A)가 서버 메시지를 수신 하였는지 여부를 판정(700)한다. 서버 메시지는 서버 시스템(106)에 의해 클라이언트 디바이스(102A)로 전송되 는 메시지이다. 만약 클라이언트 캔버스 모듈(208)이 클라이언트 디바이스(102A)가 서버 메시지를 수신하였다 고 판정하면(단계(700)에서 "네"), 클라이언트 캔버스 모듈(208)은 서버 메시지가 잠금 메시지(702)를 포함하는 지 여부를 판정(702)한다. 잠금 메시지는 서버 시스템(106)이 서버 모델(414) 내의 소정의 요소를 잠금하였는 지를 표시한다. 만약 서버 메시지가 잠금 메시지를 포함한다면(단계(702)에서 "네"), 클라이언트 캔버스 모듈 (208)은 소정의 요소가 잠금되었음을 나타내도록 클라이언트 모델(210)을 업데이트(704)한다.

만약 서버 메시지가 잠금 메시지를 포함하지 않으면(단계(702)에서 "아니오"), 클라이언트 캔버스 모듈(208)은 서버 메시지가 잠금해제 메시지를 포함하는지 여부를 판정(706)한다. 잠금해제 메시지는 서버 시스템(106)이 소정의 요소를 잠금해제하였음을 나타낸다. 만약 서버 메시지가 잠금해제 메시지를 포함하면(단계(706)에서 " 네"), 클라이언트 캔버스 모듈(208)은 소정의 요소가 잠금해제 되었음을 나타내도록 클라이언트 모델(210)을 업 데이트(708)한다.

만약 서버 메시지가 잠금해제 메시지를 포함하지 않으면(단계(706)에서 "아니오"), 클라이언트 캔버스 모듈 (208)은 서버 메시지가 요소 추가 메시지를 포함하는지 여부를 판정(710)한다. 요소 추가 메시지는 서버 시스 템(106)이 새로운 요소를 그림에 추가하였는지 여부를 나타낸다. 만약 서버 메시지가 요소 추가 메시지를 포함 하면(단계(710)에서 "네"), 클라이언트 캔버스 모듈(208)은 새로운 요소를 포함하도록 클라이언트 모델(210)을 업데이트(712)한다.

만약 서버 메시지가 요소 추가 메시지를 포함하지 않으면(단계(710)에서 "아니오"), 클라이언트 캔버스 모듈 (208)은 서버 메시지가 요소 수정 메시지를 포함하는지 여부를 판정(714)한다. 요소 수정 메시지는 그림 내의 요소의 하나 이상의 속성이 수정되었음을 나타낸다. 예를 들어, 요소 수정 메시지는 선의 색상, 위치, 크기, 폭, 채우는 색상, 폰트, 또는 그림 내에 이미 존재하는 요소의 다른 속성들이 수정되었음을 나타낼 수 있다. 만약 서버 메시지가 요소 수정 메시지를 포함하면(단계(714)에서 "네"), 클라이언트 캔버스 모듈(208)은 요소 수정 메시지에 의해 명시된 현존하는 요소의 속성을 수정하기 위해서 클라이언트 모델(210)을 업데이트(716)한 다.

만약 서버 메시지가 요소 수정 메시지를 포함하지 않으면(단계(714)에서 "아니오"), 클라이언트 캔버스 모듈 (208)은 서버 메시지가 요소 삭제 메시지를 포함하는지 여부를 판정(718)한다. 요소 삭제 메시지는 요소가 그 림에서 삭제되었음을 나타낸다. 만약 서버 메시지가 요소 삭제 메시지를 포함하면(단계(718)에서 "네"), 클라 이언트 캔버스 모듈(208)은 요소 삭제 메시지에 의해 명시된 요소를 삭제하도록 클라이언트 모델(210)을 업데이 트(720)한다.

만약 클라이언트 캔버스 모듈(208)이 서버 메시지가 수신되지 않았다고 판정하거나(단계(700)에서 "아니오"), 또는 단계(704, 708, 712, 716, 720) 중 하나를 수행한 후에, 클라이언트 캔버스 모듈(208)은 클라이언트 모델 (210)로부터 그림을 렌더링(722)한다. 이러한 방식으로, 사용자(104A)에게 디스플레이되는 그림은 클라이언트 모델(210)을 반영한다.

클라이언트 모델(210)로부터의 그림을 렌더링한 후에, 클라이언트 캔버스 모듈(208)은 웹페이지가 닫혔는지 여 부를 판정(724)한다. 웹페이지가 닫히는 사건은, 사용자(104A)가 브라우저(202) 내에서 다른 웹페이지를 탐색 하거나, 사용자(104A)가 웹페이지를 포함하는 브라우저 윈도우를 닫거나, 또는 사용자(104A)가 웹페이지가 브라 우저 윈도우 내에서 더 이상 열리지 않도록 하는 경우에 발생한다. 웹페이지 닫힘 사건이 발생되었다는 판정에 응답하여(단계(724)에서의 "네"), 클라이언트 캔버스 모듈(208)은 웹페이지 닫힘 표시자를 포함하는 클라이언트 메시지를 서버 시스템(106)으로 전송(726)한다. 웹페이지 닫힘 표시자는 서버 시스템(106)에게 웹페이지가 더 이상 클라이언트 디바이스(102A) 상에서 열려있지 않음을 표시한다. 단계(726)에서 서버 시스템(106)에게 클라 이언트 메시지를 전송한 후에, 또는 웹페이지 닫힘 사건이 발생되지 않았다고 판정된 후에(단계(724)에서 "아니 오"), 동작(500)이 재시작된다.

도 8은 서버 시스템(106)에 의해 수행되는 예시적인 동작(800)의 제 1 부분을 도시하는 순서도이다. 도 8의 예 시에서 도시된 바와 같이, 동작(800)은 웹 서버(400)가 서버 시스템(106)이 클라이언트 디바이스(102) 중 하나 로부터 메시지를 수신하였는지 여부를 판정(802)하는 것으로 시작된다. 쉬운 설명을 위해, 도 8 및 9에 대한 기술에서는 서버 시스템(106)이 클라이언트 디바이스(102A)로부터 메시지를 수신하였다고 가정한다. 만약 서버 시스템(106)이 어떠한 클라이언트 디바이스(102)로부터도 메시지를 수신하지 못했다면(단계(802)에서 "아니 오"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102) 중 하나로부터 메시지를 수신하도록 기다린다(804).

다른 한편으로, 만약 서버 시스템(106)이 클라이언트 디바이스(102A)로부터 메시지를 수신했다면(단계(802)에서 "네"), 서버 시스템(106)은 메시지가 웹페이지 요청을 포함하는지 여부를 판정(806)한다. 웹페이지 요청은 웹 페이지를 열라는 요청을 포함한다. 만약 메시지가 웹페이지 요청을 포함하면(단계(806)에서 "네"), 웹 서버 (400)는 웹페이지가 캔버스를 포함하는지 여부를 판정(808)한다. 만약 웹페이지가 캔버스를 포함하면(단계 (808)에서 "네"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)를 구독 리스트(410)에 추가(810)한다. 서버 캔버스 모듈(402)이 클라이언트 디바이스(102A)를 구독 리스트(410)에 추가한 후에, 또는 웹페이지가 캔버 스를 포함하지 않는다고 판정한 후에(단계(808)에서 "아니오"), 웹 서버(400)는 클라이언트 디바이스(102A)에 웹페이지 응답을 전송(812)한다. 웹페이지 응답은 웹페이지를 나타내는 데이터를 포함한다. 클라이언트 디바 이스(102A)에 웹페이지 응답을 전송한 후에, 동작(800)이 재시작된다.

만약 메시지가 웹페이지 요청을 포함하지 않으면(단계(806)에서 "아니오"), 서버 캔버스 모듈(402)은 메시지가 캔버스 생성 요청을 포함하는 클라이언트 메시지인지 여부를 판정(814)한다. 캔버스 생성 요청은 서버 캔버스 모듈(402)에게 웹페이지 내에 새로운 캔버스를 생성할 것을 명령한다. 만약 클라이언트 메시지가 캔버스 생성 메시지라면(단계(814)에서 "네"), 서버 캔버스 모듈(402)은 데이터베이스(404) 내에 새로운 모델을 생성(816)한 다. 새로운 모델은 새로운 캔버스 내의 그림을 나타내는 데이터를 포함한다. 서버 캔버스 모듈(402)은 그 다 음 구독 리스트(410)에 클라이언트 디바이스(102A)를 추가(818)한다. 다음으로, 서버 캔버스 모듈(402)은 새로 운 캔버스를 나타내는 데이터를 클라이언트 디바이스(102A)에 전송(819)한다. 다양한 실시예에서, 새로운 캔버 스를 나타내는 데이터가 다양한 방식으로 포맷된다. 예를 들어, 일부 실시예에서, 새로운 캔버스를 나타내는

데이터는 XML 요소들의 세트로서 포맷되고 AJAX 기술을 이용하여 클라이언트 디바이스(102A)로 전송된다. 새로 운 캔버스를 나타내는 데이터를 클라이언트 디바이스(102A)에 전송한 후에, 동작(800)이 재시작된다.

만약 클라이언트 메시지가 캔버스 생성 요청을 포함하지 않으면(단계(814)의 "아니오"), 서버 캔버스 모듈(40 2)은 클라이언트 메시지가 승인 요청을 포함하는지 여부를 판정(820)한다. 승인 요청은 서버 캔버스 모듈(40

2)이 캔버스에 대한 승인을 설정 또는 업데이트하도록 명령한다. 캔버스에 대한 승인은 어떤 사용자가 캔버스 를 보고/보거나 편집할 권한이 주어지는지를 좌우한다. 만약 클라이언트 메시지가 승인 메시지를 포함하면(단 계(820)에서 "네"), 서버 캔버스 모듈(402)은 사용자(104A)가 캔버스에 대한 승인을 설정할 권한이 있는지 여부 를 판정(822)한다. 만약 사용자(104A)가 캔버스에 대한 승인을 설정할 권한이 있다면(단계(822)에서 "네"), 서 버 캔버스 모듈(402)은 승인 메시지에 의해 표시된 바에 의해 캔버스에 대한 승인을 업데이트(824)한다. 캔버 스에 대한 승인을 업데이트한 후에, 또는 사용자가 캔버스에 대한 승인을 설정할 권한이 없다고 판정된 후에(단 계(822)에서 "아니오"), 동작(800)이 재시작된다.

만약 클라이언트 메시지가 승인 메시지를 포함하지 않으면(단계(820)에서 "아니오"), 서버 캔버스 모듈(402)은 클라이언트 메시지가 초청 메시지를 포함하는지 여부를 판정(826)한다. 초청 메시지는 서버 캔버스 모듈(402) 이 명시된 사용자에게 초청을 전송하도록 명령한다. 초청은 명시된 사용자가 그림을 보고/보거나 편집하도록 초대한다. 만약 클라이언트 메시지가 초청 메시지를 포함하면(단계(826)에서 "네"), 서버 캔버스 모듈(402)은 명시된 사용자에게 초청을 전송(828)한다. 초청을 전송한 후에, 동작(800)이 재시작된다.

만약 클라이언트 메시지가 초청 메시지를 포함하지 않으면(단계(826)에서 "아니오"), 서버 캔버스 모듈(402)은 클라이언트 메시지가 웹페이지 닫힘 표시자를 포함하는지 여부를 판정(830)한다. 만약 클라이언트 메시지가 웹 페이지 닫힘 표시자를 포함하면(단계(830)에서 "네"), 서버 캔버스 모듈(402)은 구독 리스트(410)로부터 클라이 언트 디바이스(102A)를 삭제(832)한다. 이러한 방식으로, 클라이언트 디바이스(102A)는 웹페이지가 열려있는 캔버스를 포함하지 않는 동안에 캔버스와 관련된 서버 메시지를 수신하지 않는다. 구독 리스트(410)로부터 클 라이언트 디바이스(102A)가 제거된 후에, 동작(800)이 재시작된다. 다른 한편으로, 만약 클라이언트 메시지가 웹페이지 닫힘 표시자를 포함하지 않으면(단계(830)에서 "아니오"), 서버 캔버스 모듈(402)은 도 9의 동작(80 0)의 일부분을 수행한다.

도 9는 동작(800)의 제 2 부분을 도시하는 순서도이다. 만약 클라이언트 메시지가 웹페이지 닫힘 표시자를 포 함하지 않으면(단계(830)에서 "아니오"), 서버 캔버스 모듈(402)은 클라이언트 메시지가 잠금 요청을 포함하는 지 여부를 판정(900)한다. 잠금 요청은 서버 캔버스 모듈(402)이 서버 모델(414) 내의 요소를 잠그라고 명령한 다. 만약 클라이언트 메시지가 잠금 요청을 포함하면(단계(900)에서 "네"), 서버 캔버스 모듈(402)은 서버 모 델(414)이 감금 요청에 의해 명시된 요소가 이미 잠금되어 있음을 나타내는지 여부를 판정(902)한다. 만약에 명시된 요소에 대해 이미 잠금되어 있다면, 다른 사용자가 이미 해당 요소를 선택하였고 그 요소가 선택해제되 지 않은 것이다. 그러므로, 만약 명시된 요소에 대해 이미 잠금되어 있다면(단계(902)에서 "네"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)로 잠금 거부 응답을 전송(904)한다. 잠금 거부 응답은 서버 시스템 (106)이 클라이언트 디바이스(102A)에 잠금을 하지 않았음을 나타낸다. 다른 한편으로, 만약 명시된 요소가 이 미 잠금이 되어있지 않다면, 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)가 명시된 요소에 대해 잠금을 하였음을 나타내도록 서버 모델(414)을 업데이트(906)한다. 그 다음 서버 캔버스 모듈(402)은 구독 리스트 (410)에 열거된 다른 클라이언트 디바이스들에게 서버 메시지를 전송(908)한다. 서버 메시지는 잠금 메시지를 포함한다. 잠금 메시지는 서버 시스템(106)이 명시된 요소를 잠금하였음을 나타낸다. 서버 캔버스 모듈(402) 은 그 다음 클라이언트 디바이스(102A)에게 잠금 확인 응답(lock granted response)을 전송(909)한다. 잠금 확인 응답은 서버 시스템(106)이 명시된 요소에 대한 잠금을 클라이언트 디바이스(102A)에게 부여하였음을 나타 낸다.

만약 클라이언트 메시지가 잠금 요청을 포함하지 않으면(단계(900)에서 "아니오"), 서버 캔버스 모듈(402)은 클 라이언트 메시지가 잠금해제 요청을 포함하는지 여부를 판정(910)한다. 잠금해제 요청은 클라이언트 디바이스 (102A)가 더 이상 명시된 요소에 대한 잠금을 필요로 하지 않음을 나타낸다. 만약 클라이언트 메시지가 잠금해 제 요청을 포함하면(단계(910)에서 "네"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)가 명시된 요소 에 대한 잠금을 갖는지 여부를 판정(912)한다. 만약 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖는다면(단계(912)에서 "네"), 서버 캔버스 모듈(402)은 명시된 요소에 대한 잠금을 제거하도록 서버 모델 (414)을 업데이트(914)한다. 서버 캔버스 모듈(402)은 그 다음 구독 리스트(410) 내에 있는 다른 클라이언트 디바이스들에게 서버 메시지를 전송(915)한다. 각각의 서버 메시지들은 잠금해제 메시지를 포함한다. 잠금해 제 메시지는 서버 시스템(106)이 명시된 요소를 잠금해제 하였음을 나타낸다. 서버 모델(414)이 업데이트된 후에, 또는 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖지 않는다고 판정된 후에(단계(912)에서 "아니오"), 동작(800)이 다시 시작된다.

만약 클라이언트 메시지가 잠금해제 메시지를 포함하지 않으면(단계(910)에서 "아니오"), 서버 캔버스 모듈 (402)은 클라이언트 메시지가 요소 추가 요청을 포함하는지 여부를 판정(916)한다. 요소 추가 요청은 요소를 서버 캔버스 모듈(402)에 추가할 요소를 명시한다. 만약 클라이언트 메시지가 요소 추가 요청을 포함하면(단계 (916)에서 "네"), 서버 캔버스 모듈(402)은 명시된 요소를 서버 모델(414)에 추가하도록 서버 모델(414)을 업데 이트(918)한다. 서버 캔버스 모듈(402)은 그 다음 구독 리스트(410)의 다른 클라이언트 디바이스들에게 서버 메시지를 전송(920)한다. 각각의 서버 메시지는 요소 추가 메시지를 포함한다. 요소 추가 메시지는 명시된 요 소가 그림에 추가되었음을 나타낸다. 그 다음 동작(800)이 다시 시작된다.

만약 클라이언트 메시지가 요소 추가 요청을 포함하지 않으면(단계(916)에서 "아니오"), 서버 캔버스 모듈(40 2)은 클라이언트 메시지가 요소 수정 요청을 포함하는지 여부를 판정(922)한다. 요소 수정 요청은 그림 내의 요소의 하나 이상의 속성에 대한 변경사항을 나타낸다. 만약 클라이언트 메시지가 요소 수정 요청을 포함하면 (단계(922)에서 "네"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 가지 는지 여부를 판정(924)한다. 만약 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖는다면(단계 (924)에서 "네"), 서버 캔버스 모듈(402)은 요소 수정 요청에 의해 표시된 바와 같이 명시된 요소의 속성을 수 정하도록 서버 모델(414)을 업데이트(926)한다. 서버 캔버스 모듈(402)은 그 다음 구독 리스트(410)의 다른 클 라이언트 디바이스에게 서버 메시지를 전송(928)한다. 각각의 서버 메시지는 요소 수정 메시지를 포함한다. 요소 수정 메시지는 요소의 하나 이상의 속성이 수정되었음을 나타낸다. 단계(928)에서 서버 메시지를 전송한 후에, 또는 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖지 않는다고 판정된 후에(단계(924)에서 "아니오"), 동작(800)이 재시작된다.

만약 클라이언트 메시지가 요소 수정 요청을 포함하지 않으면(단계(922)에서 "아니오"), 서버 캔버스 모듈(40 2)은 클라이언트 메시지가 요소 삭제 요청을 포함하는지 여부를 판정(930)한다. 요소 삭제 요청은 하나 이상의 요소가 그림으로부터 삭제되었음을 나타낸다. 만약 클라이언트 메시지가 요소 삭제 요청을 포함하면(단계(93 0)에서 "네"), 서버 캔버스 모듈(402)은 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖는지 여부 를 판정(932)한다. 만약 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖는다면(단계(932)에서 "네"), 서버 캔버스 모듈(402)은 명시된 요소를 삭제하도록 서버 모델(414)을 업데이트(934)한다. 서버 캔버스 모듈(402)은 그 다음 구독 리스트(410)의 다른 클라이언트 디바이스들에게 서버 메시지를 전송(936)한다. 각각 의 서버 메시지는 요소 삭제 메시지를 포함한다. 요소 삭제 메시지는 명시된 요소가 삭제되었음을 나타낸다. 서버 메시지를 전송한 후에, 또는 클라이언트 디바이스(102A)가 명시된 요소에 대한 잠금을 갖지 않는다고 판정 된 후에(단계(932)에서 "아니오"), 동작(800)이 재시작된다.

도 10은 예시적인 브라우저 윈도우(1000)를 도시한 예시적인 스크린 도면이다. 브라우저 윈도우(1000)는 브라 우저(202)에 의해 디스플레이되는 윈도우이다. 브라우저 윈도우(1000)는 네비게이션 컨트롤(1002)을 포함한다. 네비게이션 컨트롤(1002)은 사용자(104A)가 네비게이션을 컨트롤하는 것을 가능케 한다. 브라우저 윈도우 (1000)는 또한 웹페이지(1004)를 포함한다. 도 10의 예시에서, 웹페이지(1004)는 "John Smith"라는 이름의 사 용자에 대한 소셜 네트워킹 프로필 페이지이다. 웹페이지(1004)는 사용자의 사진, 사용자가 좋아하는 음악 및 사용자의 고향과 같은 사용자에 대한 개인 정보를 포함한다. 웹페이지(1004)는 또한 다른 사용자들로부터의 그 사용자에 대한 코멘트를 포함한다.

또한, 웹페이지(1004)는 상태 업데이트 영역(1006)을 포함한다. 상태 업데이트 영역(1006)은 텍스트 영역 (1008)을 포함한다. 사용자는 텍스트 영역(1008)에 텍스트를 입력할 수 있다. 텍스트 영역(1008)에 입력된 텍 스트는 웹페이지(1004) 상에 포스팅된다. 또한, 텍스트 영역(1008)에 입력된 텍스트는 사용자와 사회적으로 연 관된 사람들의 페이지로 복사될 수 있다.

또한, 상태 업데이트 영역(1006)은 사진 컨트롤(1010)을 포함한다. 사용자가 사진 컨트롤(1010)을 선택하면, 사용자는 텍스트 영역(1008)에 입력된 텍스트에 첨부하기 위한 이미지 파일을 선택할 수 있다. 또한, 상태 업 데이트 영역(1006)은 비디오 컨트롤(1012)을 포함한다. 사용자가 비디오 컨트롤(1012)을 선택하면, 사용자는 텍스트 영역(1008) 내에 입력될 텍스트에 첨부할 비디오 파일을 선택한다.

상태 업데이트 영역(1006)은 또한 그림 컨트롤(1014)을 포함한다. 사용자가 그림 컨트롤(1014)을 선택하면, 캔 버스가 상태 업데이트 영역(1006) 내에 나타난다. 도 11은 캔버스(1016)가 상태 업데이트 영역(1006)에 디스플 레이되었을 때의 웹페이지(1004)를 보여주는 예시적인 스크린 도면이다. 사용자는 캔버스(1016)가 상태 업데이트 영역(1006) 내에 있는 동안에 캔버스(1016) 내의 그림을 편집할 수 있다. 그 다음 사용자는 캔버스(1016)를 웹페이지(1004)에 추가하도록 제출(submit) 컨트롤(1018)을 선택한다.

도 12는 캔버스(1016)가 웹페이지(914)에 추가된 후의 웹페이지(1004)를 보여주는 예시적인 스크린 도면이다. 사용자 "John Smith"는 캔버스(1016) 내의 그림을 편집할 수 있다. 또한, 웹페이지(1004)를 연 다른 사용자들 도 캔버스(1016) 내의 그림을 편집할 수 있다.

도 13은 예시적인 컴퓨팅 디바이스(1300)를 도시한 블록도이다. 일부 실시예에서, 클라이언트 디바이스(102) 및/또는 서버 시스템(106)이 컴퓨팅 디바이스(1300)와 같은 하나 이상의 컴퓨팅 디바이스를 이용하여 구현된다. 다른 실시예에서는 클라이언트 디바이스(102) 및/또는 서버 시스템(106)이 도 13의 예시에 도시된 것과는 다른 하드웨어 구성요소를 갖는 컴퓨팅 디바이스를 이용하여 구현된다는 것을 이해해야 한다.

다른 실시예에서, 컴퓨팅 디바이스는 서로 다른 방식으로 구현된다. 예를 들어, 도 13의 예시에서, 컴퓨팅 디 바이스(1300)는 메모리(1302), 프로세싱 시스템(1304), 2차 스토리지 디바이스(1306), 네트워크 인터페이스 카 드(1308), 비디오 인터페이스(1310), 디스플레이 유닛(1312), 외부 구성요소 인터페이스(1314) 및 통신 매체 (1316)를 포함한다. 다른 실시예에서, 컴퓨팅 디바이스는 더 많거나 더 적은 하드웨어 구성요소를 이용하여 구 현된다. 예를 들어, 다른 예시적인 실시예에서, 컴퓨팅 디바이스는 비디오 인터페이스, 디스플레이 유닛, 외부 스토리지 디바이스, 또는 입력 디바이스를 포함하지 않는다.

본 명세서에서 사용되는 컴퓨터 판독가능한 매체라는 용어는 컴퓨터 스토리지 매체를 포함할 수 있다. 컴퓨터 스토리지 매체는, 컴퓨터 판독가능한 명령어, 데이터 구조, 프로그램 모듈, 또는 그외의 데이터와 같은 정보의 저장을 위한 임의의 방법 또는 기술로 구현되는 휘발성 및 비휘발성, 제거가능 및 제거 불가능한 매체를 포함할 수 있다. 메모리(1302)는 데이터 및/또는 명령어를 저장할 수 있는 하나 이상의 컴퓨터 스토리지 매체를 포함 한다. 본 명세서에서 사용되는 바와 같이, 컴퓨터 스토리지 매체는 컴퓨팅 디바이스에 의해 판독가능한 데이터 및/또는 소프트웨어 명령어를 저장하는 디바이스 또는 제품이다. 다른 실시예에서, 메모리(1302)가 다른 방식 으로 구현된다. 예를 들어, 다양한 실시예에서, 메모리(1302)는 다양한 유형의 컴퓨터 스토리지 매체를 이용하 여 구현된다. 컴퓨터 스토리지 매체의 예시적인 유형은 동적 랜덤 액세스 메모리(DRAM), DDR SDRAM, 대기시간 감소된 DRAM(reduced latency DRAM), DDR2 SDRAM, DDR3 SDRAM, Rambus RAM, 고체 상태 메모리, 플래시 메모리, 판독 전용 메모리(ROM), 전자적으로 삭제가능하고 프로그램가능한 ROM 및 데이터를 저장하는 그외의 유형의 디 바이스 및/또는 제품을 포함하지만, 이것으로 한정되는 것은 아니다.

본 명세서에서 사용되는 컴퓨터 판독가능한 매체라는 용어는 또한 통신 매체를 포함할 수 있다. 통신 매체는 컴퓨터 판독가능한 명령어, 데이터 구조, 프로그램 모듈, 또는 반송파 또는 다른 전송 메커니즘과 같은 변조된 데이터 신호 내의 다른 데이터에 의해 구현될 수 있으며, 임의의 정보 전달 매체를 포함한다. "변조된 데이터 신호"라는 용어는 하나 이상의 특징 세트를 갖거나 신호 내의 정보를 인코딩하기 위한 방식으로 변경된 신호를 기술할 수 있다. 예시로서, 통신 매체는 유선 네트워크 또는 다이렉트-유선 접속과 같은 유선 매체 및 음향, RF, 적외선 및 그 외의 무선 매체와 같은 무선 매체를 포함할 수 있지만, 이것으로 한정되는 것은 아니다.

프로세싱 시스템(1304)은 소프트웨어 명령어를 선택적으로 실행하는 하나 이상의 물리적 집적회로를 포함한다. 다양한 실시예에서, 프로세싱 시스템(1304)은 다양한 방식으로 구현된다. 예를 들어, 프로세싱 시스템(1304)은 하나 이상의 프로세싱 코어로서 구현될 수 있다. 이러한 예시에서, 프로세싱 시스템(1304)은 하나 이상의 Intel Core 2 마이크로프로세서를 포함할 수 있다. 다른 예시에서, 프로세싱 시스템(1304)은 하나 이상의 개별 적인 마이크로프로세서를 포함할 수 있다. 또 다른 예시적인 실시예에서, 프로세싱 시스템(1304)은 특정한 기 능을 제공하는 ASIC을 포함할 수 있다. 또 다른 예시에서, 프로세싱 시스템(1304)은 ASIC을 사용하고 소프트웨 어 명령어를 실행함으로써 특정한 기능을 제공한다. 다른 예시에서, 프로세싱 시스템(1304)은 ARM7 프로세서이 다. 다른 실시예에서, 프로세싱 시스템(1304)은 다른 명령어 세트 내의 소프트웨어 명령어를 실행한다. 예를 들어, 프로세싱 시스템(1304)은 x86 명령어 세트, POWER 명령어 세트, RISC 명령어 세트, SPARC 명령어 세트, IA-64 명령어 세트, MIPS 명령어 세트, 및/또는 그 외의 명령어 세트와 같은 명령어 세트 내의 소프트웨어 명령 어를 실행한다.

2차 스토리지 디바이스(1306)는 하나 이상의 컴퓨터 스토리지 매체를 포함한다. 2차 스토리지 디바이스(1306) 는 프로세싱 시스템(1304)에 의해 직접 접속가능하지 않은 데이터 및 소프트웨어 명령어를 저장한다. 다시 말 하면, 프로세싱 시스템(1304)은 2차 스토리지 디바이스(1306)로부터 데이터 및/또는 소프트웨어 명령어를 검색 하도록 I/O 동작을 수행한다. 다양한 실시예에서, 2차 스토리지 디바이스(1306)는 다양한 유형의 컴퓨터 판독 가능한 데이터 스토리지 매체에 의해서 구현된다. 예를 들어, 2차 스토리지 디바이스(1306)는 하나 이상의 자기 디스크, 자기 테이프 드라이브, CD-ROM 디스크, DVD-ROM 디스크, 블루레이 디스크, 고체 상태 메모리 디바이 스, Bernoulli 카트리지, 및/또는 그 외의 유형의 컴퓨터 판독가능한 데이터 스토리지 매체에 의해 구현될 수 있다.

네트워크 인터페이스 카드(1308)는 컴퓨팅 디바이스(1300)가 통신 네트워크로 데이터를 전송하고 통신 네트워크 로부터 데이터를 수신할 수 있게 한다. 다른 실시예에서, 네트워크 인터페이스 카드(1308)는 서로 다른 방식으 로 구현된다. 예를 들어, 다양한 실시예에서, 네트워크 인터페이스 카드(1308)는 이더넷 인터페이스, 토큰-링 (token-ring) 네트워크 인터페이스, 광섬유 네트워크 인터페이스, 무선 네트워크 인터페이스(예컨대, WiFi, WiMax 등), 또는 다른 유형의 네트워크 인터페이스로서 구현된다.

비디오 인터페이스(1310)는 컴퓨팅 디바이스(1300)가 비디오 정보를 디스플레이 유닛(1312)으로 출력하는 것을 가능케 한다. 다른 실시예에서, 비디오 인터페이스(1310)는 서로 다른 방식으로 구현된다. 예를 들어, 일 예 시적인 실시예에서, 비디오 인터페이스(1310)는 컴퓨팅 디바이스(1300)의 마더보드에 결합된다. 다른 예시적인 실시예에서, 비디오 인터페이스(1310)는 비디오 확장 카드이다. 다양한 실시예에서, 디스플레이 유닛(1312)은 음극선관 디스플레이, LCD 디스플레이 패널, 플라스마 스크린 디스플레이 패널, 터치식 디스플레이 패널, LED 스크린, 프로젝터, 또는 다른 유형의 디스플레이 유닛이다. 다양한 실시예에서, 비디오 인터페이스(1310)는 다 양한 방식으로 디스플레이 유닛(1312)과 통신한다. 예를 들어, 비디오 인터페이스(1310)는 USB 커넥터, VGA 커 넥터, DVI 커넥터, S-Video 커넥터, HDMI 인터페이스, DisplayPort 커넥터, 또는 다른 유형의 접속을 통해 디스 플레이 유닛(1312)과 통신할 수 있다.

외부 구성요소 인터페이스(1314)는 컴퓨팅 디바이스(1300)가 외부 디바이스와 통신하는 것을 가능케 한다. 다 양한 실시예에서, 외부 구성요소 인터페이스(1314)는 서로 다른 방식으로 구현된다. 예를 들어, 외부 구성요소 인터페이스(1314)는 USB 인터페이스, 방화벽 인터페이스, 직렬 포트 인터페이스, 병렬 포트 인터페이스, PS/2 인터페이스, 및/또는 컴퓨팅 디바이스(1300)가 외부 디바이스와 통신하는 것을 가능케 하는 다른 유형의 인터페 이스일 수 있다. 다른 실시예에서, 외부 구성요소 인터페이스(1314)는 컴퓨팅 디바이스(1300)가 서로 다른 외 부 구성요소들과 통신하는 것을 가능케 한다. 예를 들어, 외부 구성요소 인터페이스(1314)는 컴퓨팅 디바이스 (1300)가 외부 스토리지 디바이스, 입력 디바이스, 스피커, 전화기 충전 잭, 모뎀, 미디어 재생 도크(media player dock), 다른 컴퓨팅 디바이스, 스캐너, 디지털 카메라, 지문 인식기 및 컴퓨팅 디바이스(1300)에 접속될 수 있는 다른 디바이스와 통신하는 것을 가능케 한다. 외부 스토리지 디바이스의 예시적인 유형은, 자기 테이 프 드라이브, 플래시 메모리 모듈, 자기 디스크 드라이브, 광학 디스크 드라이브, 플래시 메모리 유닛, 집 디스 크 드라이브, 광학 주크박스 및 하나 이상의 컴퓨터 스토리지 매체를 포함하는 다른 유형의 디바이스를 포함하 지만, 이것으로 한정되는 것은 아니다. 입력 디바이스의 예시적인 유형은, 키보드, 마우스, 트랙볼, 스타일러 스 입력 디바이스, 키 패드, 마이크로폰, 조이스틱, 터치식 디스플레이 스크린 및 컴퓨팅 디바이스(1300)로 사 용자 입력을 제공하는 다른 유형의 디바이스를 포함하지만, 이것으로 한정되는 것은 아니다.

통신 매체(1316)는 컴퓨팅 디바이스(1300)의 하드웨어 구성요소들 간의 통신을 용이하게 한다. 다른 실시예에 서, 통신 매체(1316)는 컴퓨팅 디바이스(1300)의 서로 다른 구성요소들 사이에서의 통신을 용이하게 한다. 예 를 들어, 도 13의 예시에서, 통신 매체(1316)는 메모리(1302), 프로세싱 시스템(1304), 2차 스토리지 디바이스 (1306), 네트워크 인터페이스 카드(1308), 비디오 인터페이스(1310) 및 외부 구성요소 인터페이스(1314) 간의 통신을 용이하게 한다. 컴퓨팅 디바이스(1300)의 다른 구현에서, 통신 매체(1316)는 다른 방식으로 구현된다. 예를 들어, 컴퓨팅 디바이스(1300)의 다른 구현물에서, 통신 매체(1316)는 PCI 버스, PCI Express 버스, AGP 버스, Infiniband 상호접속, ATA 상호접속, 병렬 ATA 상호접속, Fiber Channel 상호접속, USB 버스, SCSI 인터 페이스, 또는 다른 유형의 통신 매체로서 구현될 수 있다.

메모리(1302)는 다양한 유형의 데이터 및/또는 소프트웨어 명령어를 저장한다. 예를 들어, 도 13의 예시에서, 메모리(1302)는 BIOS(124) 및 운영 시스템(1326)을 저장한다. BIOS(1324)는 소프트웨어 명령어의 세트를 포함 하며, 이러한 소프트웨어 명령어는 프로세싱 시스템(1304)에 의해 실행되었을 때, 컴퓨팅 디바이스(1300)가 부 팅되도록 한다. 운영 시스템(1326)은 프로세싱 시스템(1304)에 의해 실행되었을 때 컴퓨팅 디바이스(1300)가 컴퓨팅 디바이스(1300)의 액티비티 및 리소스의 공유를 조정하는 운영 시스템을 제공하게 하는 소프트웨어 명령 어의 세트를 포함한다.

전술된 다양한 실시예들은 단지 설명의 방식으로 제공된 것으로, 한정적인 의미로 해석되어서는 안된다. 당업 자는 본 명세서에서 기술 및 설명된 예시적인 실시예 및 응용을 따르지 않은 다양한 수정 및 변경이 이루어질 수 있음을 쉽게 인지할 것이다. 예를 들어, 도면에 도시된 동작들은 단지 예시적인 것이다. 다양한 실시예에서, 유사한 동작들이 도면에 도시된 것보다 많거나 적은 단계들을 포함할 수 있다. 또한, 다른 실시예에서, 유 사한 동작들이 도면에 도시된 동작의 단계들과는 다른 순서를 갖는 단계들을 포함할 수 있다.

없음

Claims

도면을 이용하여 통신하는 방법으로서,
클라이언트 디바이스에 의해, 캔버스를 포함하는 웹페이지를 처음으로 여는 단계 -상기 캔버스는 상기 클라이언 트 디바이스의 사용자 및 상기 캔버스를 포함하는 웹페이지를 열기 위한 다른 클라이언트 디바이스를 사용하는 다른 사용자들에 의해 상기 웹페이지 내의 편집가능한 그림을 포함함- 와,
상기 웹페이지가 상기 클라이언트 디바이스 상에서 열려있는 동안 상기 웹페이지를 리로딩(reloading)하지 않고 상기 사용자 및 상기 다른 사용자들이 상기 그림을 편집하는 것과 거의 동시에 상기 사용자 및 상기 다른 사용 자들에 의해 상기 그림에 이루어진 편집을 반영하도록, 상기 클라이언트 디바이스에 의해, 상기 그림을 동적으 로 업데이트하는 단계와,
상기 웹페이지를 닫는 단계 -상기 클라이언트 디바이스가 상기 웹페이지를 닫을 때 상기 그림의 콘텐츠는 제 1 상태에 있음- 와,
상기 클라이언트 디바이스에 의해, 상기 웹페이지를 두 번째로 여는 단계를 포함하되,
상기 클라이언트 디바이스가 두 번째로 상기 웹페이지를 열 때, 상기 그림은 상기 사용자에 의해 편집가능한 채 로 남아있으며 상기 그림의 콘텐츠는 제 2 상태에 있고, 상기 제 2 상태는 상기 웹페이지가 상기 클라이언트 디 바이스 상에서 닫혀있는 동안 상기 제 1 상태에 대해 상기 다른 사용자들에 의해 편집된 결과인
도면을 이용하여 통신하는 방법.
상기 사용자가 상기 그림에 제 1 변화를 가한 것에 응답하여 상기 클라이언트 디바이스에 의해 서버 시스템에 클라이언트 메시지를 전송하는 단계 -상기 클라이언트 메시지는 상기 그림에 대한 상기 제 1 변화를 명시함- 와,
상기 클라이언트 디바이스에 의해, 상기 서버 시스템으로부터 서버 메시지를 수신하는 단계 -상기 서버 메시지 는 상기 다른 사용자들 중 한 명에 의해 가해진 제 2 변화를 명시함- 를 더 포함하는
도면을 이용하여 통신하는 방법.
상기 클라이언트 디바이스에 의해 클라이언트 모델을 저장하는 단계 -상기 클라이언트 모델은 상기 그림을 나타 내는 XML 요소들을 포함함- 와,
상기 사용자가 상기 그림에 상기 제 1 변화를 가한 것에 응답하여 상기 클라이언트 모델을 업데이트하는 단계와,
상기 서버 메시지를 수신한 것에 응답하여 상기 클라이언트 모델을 업데이트하는 단계를 더 포함하되,
상기 클라이언트 메시지는 상기 클라이언트 모델 내의 상기 XML 요소들 중 하나 이상에 대한 변화를 명시함으로 써 상기 그림에 대한 상기 제 1 변화를 명시하고,
상기 서버 메시지는 상기 클라이언트 모델 내의 상기 XML 요소들 중 하나 이상에 대한 변화를 명시함으로써 상 기 제 2 변화를 명시하는
도면을 이용하여 통신하는 방법.
상기 웹페이지는 소셜 네트워킹 웹사이트의 일부이고,
상기 방법은 상기 클라이언트 디바이스에 의해 상기 소셜 네트워킹 웹사이트의 사용자들 중에서 상기 다른 사용 자들을 선택하는 입력을 수신하는 단계를 더 포함하되,
상기 소셜 네트워킹 웹사이트의 사용자들 중 선택되지 않은 사용자들은 상기 그림을 편집할 권한이 주어지지 않 는
도면을 이용하여 통신하는 방법.
상기 웹페이지로부터 상기 그림을 클립보드에 복사하는 단계와,
상기 클립보드로부터 상기 그림을 문서에 붙여넣기(paste) 하는 단계를 더 포함하되, 상기 그림은 상기 그림이 상기 문서에 붙여넣기 된 후에도 편집가능한 상태로 남아있으며,
상기 문서는 워드 프로세서 문서, 슬라이드쇼 문서, 노트 테이킹(note taking) 문서, 이메일 메시지 및 다이어 그램 편집 문서 중 하나인
도면을 이용하여 통신하는 방법.
상기 클라이언트 디바이스에 의해, 상기 그림 내의 요소를 선택하는 입력을 수신하는 단계와,
상기 클라이언트 디바이스에 의해, 상기 다른 사용자들 중 어느 누구도 상기 요소를 선택하지 않았을 때에만 상 기 사용자가 상기 요소를 수정 또는 삭제할 수 있게 하는 단계를 더 포함하는
도면을 이용하여 통신하는 방법.
상기 요소를 선택하는 입력을 수신한 것에 응답하여, 서버 시스템으로 잠금 요청(lock request)을 전송하는 단 계와,
상기 클라이언트 디바이스에 의해 상기 서버 시스템으로부터 잠금 응답을 수신하는 단계와, 상기 클라이언트 디바이스에 의해 상기 요소를 선택해제하는 입력을 수신하는 단계와,
상기 요소를 잠금해제 하는 입력을 수신한 것에 응답하여, 상기 클라이언트 디바이스에 의해 상기 서버 시스템 에 잠금해제 요청(unlock request)을 전송하는 단계를 더 포함하되,
상기 잠금 응답이 상기 서버 시스템이 상기 클라이언트 디바이스에 상기 요소에 대한 잠금을 주었다고 나타낼 때 상기 클라이언트 디바이스가 상기 사용자로 하여금 상기 요소를 수정 또는 삭제할 수 있게 하되, 상기 서버
시스템은 어떠한 다른 사용자도 상기 요소를 선택하지 않았을 때 상기 클라이언트 디바이스에 상기 요소에 대한 잠금을 부여하고,
상기 잠금 응답이 상기 서버 시스템이 상기 클라이언트 디바이스에 상기 요소에 대한 잠금을 부여하지 않았다고 나타낼 때 상기 클라이언트 디바이스는 상기 사용자가 상기 요소를 수정할 수 없도록 하고, 상기 잠금 응답이 상기 서버 시스템이 상기 클라이언트 디바이스에 상기 요소에 대한 잠금을 부여하지 않았다고 나타낼 때 상기 클라이언트 디바이스는 상기 사용자가 상기 요소를 삭제할 수 없도록 하되, 상기 서버 시스템은 다른 사용자가 상기 요소를 선택하였을 때 상기 요소에 대한 잠금을 상기 클라이언트 디바이스에게 부여하지 않는
도면을 이용하여 통신하는 방법.
그림을 나타내는 데이터를 포함하는 서버 모델을 저장하는 단계와,
서버 시스템에 의해, 제 1 클라이언트 디바이스로부터 제 1 웹페이지 요청을 수신하는 단계와,
상기 서버 시스템에 의해, 상기 제 1 웹페이지 요청에 응답하여 상기 제 1 클라이언트 디바이스로 제 1 웹페이 지 응답을 전송하는 단계 -상기 제 1 웹페이지 응답은 상기 그림을 포함하는 캔버스를 포함하는 웹페이지를 나 타내는 데이터를 포함하고, 상기 그림은 상기 제 1 클라이언트 디바이스를 이용하는 제 1 사용자에 의해 상기 웹페이지 내에서 편집가능함- 와,
상기 서버 시스템에 의해, 제 2 클라이언트 디바이스로부터 제 2 웹페이지 요청을 수신하는 단계와,
상기 서버 시스템에 의해, 상기 제 2 클라이언트 디바이스로 제 2 웹페이지 응답을 전송하는 단계 -상기 제 2 웹페이지 응답은 상기 웹페이지를 나타내는 데이터를 포함하고, 상기 그림은 상기 제 2 클라이언트 디바이스를 이용하는 제 2 사용자에 의해 상기 웹페이지 내에서 편집가능함 -와,
상기 제 1 클라이언트 디바이스 및 상기 제 2 클라이언트 디바이스로부터 클라이언트 메시지를 수신하는 단계 - 상기 클라이언트 메시지는 상기 제 1 사용자 및 상기 제 2 사용자에 의해 이루어진 상기 그림에 대한 변화를 명 시함- 와,
상기 클라이언트 메시지에 응답하여,
상기 그림에 대한 상기 변화를 반영하도록 상기 서버 모델을 업데이트하고,
상기 서버 시스템에 의해 상기 그림에 대한 변화를 명시하는 서버 메시지를 상기 제 1 클라이언트 디바 이스에 전송하며,
상기 서버 시스템에 의해 상기 그림에 대한 상기 변화를 명시하는 상기 제 2 클라이언트 디바이스에 추 가의 서버 메시지를 전송
하는 단계와,
상기 제 1 클라이언트 디바이스 또는 상기 제 2 클라이언트 디바이스 중 하나 또는 둘 모두가 상기 웹페이지를 닫을 때 상기 서버 모델을 계속해서 저장하는 단계와,
상기 서버 시스템에 의해 상기 제 1 클라이언트 디바이스로부터 제 3 웹페이지 요청을 수신하는 단계와,
상기 제 3 웹페이지 요청에 응답하여 상기 서버 시스템에 의해 상기 제 1 클라이언트 디바이스에 제 3 웹페이지 응답을 전송하는 단계 - 상기 제 3 웹페이지 응답은 상기 웹페이지를 나타내는 데이터를 포함하고, 상기 그림은 상기 서버 모델을 반영 - 를 포함하는방법.
상기 웹페이지는 소셜 네트워킹 웹사이트의 일부이고,
상기 웹페이지는 상기 제 1 사용자의 소셜 네트워킹 프로필 페이지인 방법.
컴퓨팅 디바이스로서, 프로세싱 유닛과,
컴퓨터 실행가능한 명령어들을 저장하는 컴퓨터 스토리지 매체의 세트를 포함하되,
상기 컴퓨터 실행가능한 명령어들은 상기 프로세싱 유닛에 의해 실행될 경우, 상기 컴퓨팅 디바이스로 하여금,
상기 컴퓨팅 디바이스의 사용자에 대한 소셜 네트워킹 프로필 페이지인 웹페이지를 처음으로 열도록 하되, 상기 웹페이지는 캔버스를 포함하고, 상기 캔버스는 상기 사용자 및 상기 캔버스를 포함하는 웹페이지를 열기 위한 다른 클라이언트 디바이스를 사용하는 다른 사용자들에 의해 상기 웹페이지 내의 편집가능한 그림을 포함하고,
상기 그림을 나타내는 XML 요소들을 포함하는 클라이언트 모델을 저장하게 하고,
상기 웹페이지가 상기 클라이언트 디바이스 상에서 열려있는 동안 상기 웹페이지를 리로딩하지 않은 채로 상기 그림 내의 요소를 선택하는 입력을 수신하고,
상기 다른 사용자들 중 누구도 상기 요소를 선택하지 않았을 때에만 상기 사용자가 상기 요소를 수정 또는 삭제하는 것을 가능케 하고,
상기 사용자가 상기 그림에 제 1 변화를 가한 것에 응답하여 상기 클라이언트 모델을 업데이트하고, 상기 사용자가 상기 그림에 상기 제 1 변화를 가한 것에 응답하여 서버 시스템으로 클라이언트 메시지
를 전송 -상기 클라이언트 메시지는 상기 클라이언트 모델 내의 상기 XML 요소들 중 하나 이상에 대한 변화를 명시함으로써 상기 그림에 대한 상기 제 1 변화를 명시함- 하고,
상기 서버 시스템으로부터 서버 메시지를 수신 -상기 서버 메시지는 상기 클라이언트 모델 내의 상기 XML 요소들 중 하나 이상에 대한 변화를 명시함으로써 상기 다른 사용자들 중 하나에 의한 제 2 변화를 명시함- 하고,
상기 서버 메시지를 수신한 것에 응답하여 상기 클라이언트 모델을 업데이트하게 하며,
상기 웹페이지를 닫도록 하되, 상기 컴퓨팅 디바이스가 상기 웹페이지를 닫을 때 상기 그림의 콘텐츠는 제 1 상태에 있으며,
상기 웹페이지를 두 번째로 열도록 하되, 상기 컴퓨팅 디바이스가 상기 웹페이지를 두 번째 열 때, 상기 그림은 상기 사용자에 의해 편집가능한 채로 남아있으며 상기 그림의 콘텐츠는 제 2 상태에 있고, 상기 제 2 상태는 상 기 웹페이지가 상기 컴퓨팅 디바이스 상에서 닫혀있는 동안 상기 제 1 상태에 대해 상기 다른 사용자들에 의해 편집된 결과인 컴퓨팅 디바이스.