마우스 제스쳐가 뭔가요?

보통 웹페이지를 탐색하던 중에 ‘뒤로’나 ‘앞으로’ 같은 동작을 수행할 때 보통 어떻게 하시나요? 예전에는 스크롤 바를 이용하기 보다는 스페이스바 키를 눌러서 아래쪽으로 웹페이지를 내려가면서 글을 읽고, 백 스페이스 키를 눌러서 ‘뒤로’를 실행하거나 Alt+←, Alt+→와 같은 키보드 조작으로웹 네비게이션을 주로 하던 시절이 있었습니다. 그 때만 해도 복잡도가 큰 웹은 쇼핑몰(초창기이지만)을 제외하고는 그리 많지 않았고, 사실 디자인 면에서도 복잡하다기 보다는, 진정한 ‘문서’ 태가 나는 페이지들이 대부분이었지요.

그러던 어느날 루저님이 만드신 IE toy라는 물건을 만났습니다. 대단하더군요. 그래도 웹서핑 좀 한다, 그래도 좀 파워유저지… 하시는 분들은 거의 설치해 있으리라고 생각됩니다. 지금은 워낙 유명한 물건이 되었으니, 굳이 다른 설명을 부가적으로 드릴 필요가 있을까 싶군요.자동 로그인 기능과 같은 편리한 기능외에 IE Toy를 깔지 않으면 안되는 큰 이유가 있었으니, 그것은바로 마우스 제스쳐었습니다.

마우스 제스쳐는 보통 이렇게 작동합니다. 마우스 오른쪽 버튼을 누른 상태에서 마우스 커서를 왼쪽으로 살짝 그으면, ‘뒤로’ 를 누른 것과 같은 기능을 합니다. 오른쪽으로 살짝 그으면 당연히 ‘앞으로’가 되겠지요. 이렇게 마우스로 ‘그려서’ 각종 명령을 실행할 수 있습니다. 기본적으로 ‘앞으로’, ‘뒤로’, ‘닫기’만 맵핑해 놓고 사용해 보면 그 어마어마한 편리함에 살포시 소름이 돋아오는 증상을 경험할 수 있습니다.

이게 좀 습관이 되면 윈도 탐색기에서도 마우스를 긁고 있는 자신을 발견하게 되는데요, IE toy 사용자라면 아래 그림과 같이 마우스 동작 옵션을 설정하면 윈도 탐색기는 물론, 거의 모든 윈도 응용 프로그램을 마우스 동작으로 닫을수 있습니다.

파이어폭스의 마우스 제스쳐 확장

파이어폭스도 이러한 마우스 제스쳐를 가능하게 해주는 많은 종류의 확장 기능을 갖고 있습니다. 오늘 살짝 소개해 드릴  확장의 이름은 ‘Mouse Gesture’입니다. 물론 파이어폭스 사용자들 중에서는 All-In-One Gesture (이하, AIO)를 가장 많이 사용하고 계실 것 같습니다. 물론 AIO가 강력한 기능을 가진 확장이기는 하지만, 이것 저것 설정 건드리기 좋아하는 저도 질려버릴 만큼 많은 설정은 초보 사용자를 질려버리게 만들기에 충분한 위력을 갖고 있더군요. Mouse Gesture는 이에 비해서는 그나마 간단한 설정 화면을 갖고 있습니다. 조금 더 가볍고, 편리성에서는 뒤지지 않으니 당장에 한번 설치해보는 것은 어떨까 추천 한 번 하는 바입니다.

 파이어폭스3 베타판에서 설치하기

현재 많은 파이어폭스 확장 기능들이 정식으로 파이어폭스3 버전대를 지원하지 않고 있고, 더군다나 요즘 사용중이 베타2 프릴리즈 버전은 일일 버전을 구해다가 쓰고 있으므로 베타1에서 설치가 되지 않은 확장 기능이 거의 대부분인 상황에서 제대로 설치될 녀석이 있을리 만무하지요. 하지만 방법이 없는 것은 아니니 이렇게 한 번 해보겠습니다.

우선 해당 확장 기능의 설치 페이지로 가서 설치 링크를 마우스 오른쪽 버튼으로 클릭한 다음, “링크를 다른 이름으로 저장” 하여 확장 기능 파일을 하드 디스크의 어딘가로 저장합니다. 그러면 해당 확장이 확장자가  .xpi인 파일로 저장됩니다. 이 파일을 압축 유틸리티에서 열어봅니다.

 파이어폭스의 확장 기능들은 확장자만 xpi일뿐 zip파일과 똑같은 형식으로 패키징이 되어 있습니다.자,이 중에서 install.rdf라는 파일을 압축해제 하여 텍스트 편집기에서 열어보겠습니다. install.rdf 파일은 xml 형식으로 되어 있습니다.20번 라인 근처에 max version 이라는 항목이 있습니다. 현재, 2.0.0.* 라는 값으로 되어 있는데, 이것을 3.0.0.*로 변경합니다. 이렇게 수정된 파일을 저장하고 다시 압축 파일 속으로 넣어줍니다. 압축을 풀었다가 다시 압축하는 방법도 있지만, 어지간한 압축 유틸리티들은 압축 파일을 열어놓은 상태 (위의 그림)로 해당 파일을 드래그하여 던져넣어주면 압축을 해서 내용을 바꿔줍니다.

이렇게 수정을 가한 xpi 파일을 파이어폭스 메인 창으로 드래그하거나, 혹은 부가기능 윈도우로 드래그해주면 설치가 됩니다. 이번에는 별다른 호환성 문제에 대한 언급이 없이 설치가 됩니다. 보안 업데이트를 지원하지 않는 부가기능이나 테마를 제외하고는 이렇게 설치가 가능합니다. 다만, 설치가 가능하다 뿐이지 100% 문제 없이 작동한다는 의미는 아닙니다. 다행히도, Mouse Gesture를 이렇게 파이어폭스3 베타2 프리릴리즈에 설치한 다음에 별다른 문제점을 만나지는 못했습니다.

마우스 제스쳐 설정하기

설치가 완료되면 여느 확장 기능과 마찬가지로 파이어폭스를 재시작합니다. 이제 마우스 제스쳐를 사용할 수 있습니다.기본적으로 여러가지 기능이 세팅이 되어 있어서 ‘뒤로’, ‘앞으로’와 같은 기능은 바로 쓸 수 있습니다. 하지만 너무 많은 기능을 다기억하기도 힘들고, 평소에 쓰지 않는 기능까지 맵핑이 되어 있으면 여러가지로 번거로울 수도 있지요. 그래서 간단하게  이것 저것 설정해 보는걸 해보겠습니다.

도구 메뉴의 ‘부가기능’에서 마우스 제스쳐의 설정 화면을 열어봅니다.

 위의 화면이 Mouse Gesture의 설정 화면입니다. AIO Gesture보다는 단촐한 화면이군요. 일반 탭에서는 마우스 제스쳐를 구동하는 방법을 설정하거나 기록된 제스쳐들을 편집할 수 있도록 되어 있습니다. 보통은 마우스 오른쪽 버튼을 누른 상태에서 동작을 그리지만 다른 특수키(Shirft, Ctrl, Alt 등)와 함께 사용할 때만 작동하도록 변경할 수 있습니다.

아래쪽에 ‘제스쳐 편집’을 클릭하여 제스쳐를 편집할 수 있는데, 이 부분은 좀 있다가 다시 다루도록 하겠습니다.우선 ‘고급’ 탭을 선택해서 고급 설정을 보도록 하겠습니다.

위의 스크린샷이 고급 설정 화면입니다. 맨 아래 대각선 허용 오차가 있는데요, 대각선을 올바로 그리기란 사실 쉽지 않아 제 경우에는 꽤 불편했습니다. 왼쪽이나 오른쪽이 대각선으로 인식되는 경우가 있었거든요. 그래서 ‘자신있는’ 분이 아니라면 ’0′을 입력해서 대각선 인식을 꺼 두는 것이 좋습니다.

그  위에는 ‘록커 제스쳐’가 있습니다. 록커제스쳐는 마우스 버튼을 연타하는 것으로 마우스 제스쳐를 호출하는 기능입니다. 즉 마우스 오른쪽 버튼을 누르고 떼자마자 왼쪽 버튼을 누르는 (검지와 중지를 적절히 번갈아 누르면 됩니다) 것으로 앞/뒤 이동을 하는 것입니다. 이것도 해보면 꽤 재미도 있고, 마우스를 그리는 것조차 귀찮은 경우에 유용하게 사용할 수 있습니다.

제가 그린 마우스.. 귀엽지 않나효? – _-

사실, 마우스 제스쳐 자체가 메뉴나 도구모음의 단추를 누르러 마우스를 이동하는 시간과 불편함을 없애는 기능이기에, 이를 막장(?)까지 끌고간 개념이 록커 기능이 아닐까 싶군요. 이외에도 마우스 오른쪽 버튼을 누른 상태로  마우스 휠을 돌려 탭 사이를 왔다 갔다 하는 것 까지도 가능합니다. IE toy에서도 추가되었으면 싶었는데,  아직 지원하지 않는 것 같더군요. (최근에 버전업이 이루어졌다고 하는데,새 버전을 설치해봐야겠습니다.)

다음은 실제로 마우스 제스쳐를 편집해 보겠습니다. 설정의 ‘일반’ 탭에서 제스쳐 편집 버튼을 클릭하여 제스쳐 편집 대화상자를 열어봅니다.

 이미 활성화 되어 있는 매핑을 비활성으로 제거할 수 있으며, 매핑에 다른 제스쳐를 입혀서 사용할 수 있습니다. 기본적으로는앞/뒤 이동과 탭이동, 닫기 정도를 많이 쓰게 됩니다. 쓰지 않는 것들은 조금 시간을 내어 비활성으로 만들어 놓고 관리하는 것이 좋습니다. 무심결에 뭔가를 그렸다가 엄한 동작을 하면 난감할 때도 있거든요.

새로운 마우스 제스쳐 추가하기

Mouse Gesture는 기본 확장 기능이 제공하지 않는 기능도 추가할 수 있습니다. 동작교환사이트에서 별도로 export된 동작을 가져와서 붙여 넣을 수 있구요, 자바스크립트를 사용해 기본적으로 제공하지 않는 기능도 추가할 수 있습니다.

여기서는 웹페이지의 이미지 위에서 마우스를 오른쪽 왼쪽으로 흔들 때 그림을 다른 이름으로 저장하는 동작을 추가해보도록 하겠습니다. 여기서 사용될 코드는 다음과 같습니다.

 var image=globalOnImage;

if (image.nodeType == Node.ELEMENT_NODE &&
image instanceof Components.interfaces.nsIImageLoadingContent &&
image.currentURI)
{
var docURL=image.ownerDocument.location.href;
var imageURL=image.currentURI.spec;

saveImageURL(imageURL, null, “SaveImageTitle”, false, false, makeURI(docURL));
}

위 코드를 우선 복사해둡니다. 제스쳐 편집창에서 ‘새로 만들기’ 버튼을 눌러 새 동작을 추가합니다. 다음 아래 그림과 같이 ‘사용자 지정’ 형식으로 제스쳐를 추가해줍니다. ‘다른 이름으로 그림 저장’이라고 이름을 주고, 아래 부분에 위의 자바스크립트 코드를 붙여 넣습니다.

 이제, 실제로 이미지 파일 위에서 오른쪽 버튼을 누른채로 오른쪽, 왼쪽, 오른쪽으로 마우스를 흔들기만 하면 파일을 저장할 위치를 물어보는 대화상자가 나타나며, 이미지를 하드 디스크에 별도로 저장할 수 있게 됩니다. 마우스팝업 메뉴에 기본적으로 있는 기능이기는 하지만,이미지 수집을 많이 해야하는 경우에 유용하게 쓸 수 있겠습니다.

참고로 Mous gesture의 동작 교환 사이트가 한 동안 거의 일년 이상 열리지 않아, 개발이 중단 된 것은 아닌가 걱정했었는데 다행히 다시 열리기 시작하는 것으로 보아 제대로 관리가 이루어지는 듯 합니다. 아마 파이어폭스 3 정식 버전이나오면 쉽게 업데이트 하여 사용할 수 있을 듯 하네요.