ch03. 앱별 단축키 -- Chrome PIP, 주소창 영문 변환
Chrome에서 영상 보면서 작업하기, 주소창에서 한영 전환 실수 없애기, ChatGPT 답변을 마크다운으로 깔끔하게 복사하기. 세 가지 매크로로 브라우저 활용도를 높인다.
이런 불편함, 겪어보셨나요?
YouTube 영상을 보면서 다른 작업을 하고 싶을 때가 있다. 탭을 왔다 갔다 하거나, 창 크기를 줄여서 구석에 놓거나. 어느 쪽이든 불편하다.
Chrome에는 PIP(Picture-in-Picture) 기능이 있다. 영상을 작은 창으로 띄워서 다른 작업 위에 올려놓는 기능이다. 문제는 이걸 쓰려면 영상 위에서 마우스 오른쪽 버튼을 두 번 눌러야 한다는 것이다. 매번 하기엔 번거롭다.
주소창도 마찬가지다. Command+L을 눌러서 주소창으로 이동했는데, 한글 입력 상태인 걸 모르고 URL을 입력한다. 입력한 내용이 검색어가 되어 엉뚱한 결과가 나온다. 다시 영문으로 바꾸고 다시 입력한다. 하루에도 몇 번씩 반복되는 이 과정은 생각보다 짜증이 난다.
ChatGPT도 비슷한 문제가 있다. 답변을 복사할 때 일반 복사를 하면 서식이 깨진다. 마크다운 형식으로 복사하려면 답변 하단의 작은 버튼을 찾아 클릭해야 한다. 버튼이 작아서 한 번에 안 눌릴 때도 있다.
이런 작은 불편을 해결하는 매크로 세 개를 만들어본다.
매크로 분석: Chrome - PIP 모드
무엇을 하는 매크로인가
Control+P를 누르면 현재 탭의 영상이 PIP 모드로 전환된다. Chrome과 Safari 모두에서 동작한다. 매크로 그룹이 "Chrome&Safari"로 설정되어 있어서, 이 두 브라우저가 활성화되었을 때만 실행된다.
트리거
| 트리거 타입 | 값 | 설명 |
|---|---|---|
| HotKey | Control+P | Chrome 또는 Safari가 활성화된 상태에서만 동작 |
액션 흐름
그림 3-1. Chrome PIP 모드 전환 흐름도
이 매크로의 액션은 단 하나의 IfThenElse 블록이다. 하지만 그 안에 중첩된 IfThenElse가 하나 더 있다.
- 조건 확인: 현재 앱이 Chrome인가? -- 첫 번째 분기점이다.
- Chrome일 때 --
document.querySelector("video").webkitSetPresentationMode("picture-in-picture")를 실행한다. Chrome의 WebKit 전용 PIP API다. - Chrome이 아닐 때 (Safari 등) -- 두 번째 IfThenElse로 넘어간다.
- Safari일 때 -- 표준 API인
document.querySelector("video").requestPictureInPicture()를 실행한다.
왜 두 가지 방식이 필요할까?
Chrome과 Safari가 PIP를 구현하는 방식이 다르기 때문이다.
Chrome은 webkitSetPresentationMode라는 WebKit 전용 메서드를 사용한다.
Safari는 W3C 표준인 requestPictureInPicture 메서드를 지원한다.
하나의 매크로에서 조건 분기를 통해 두 브라우저를 모두 지원한다.
핵심 기술 해설
ExecuteJavaScript in Browser
KM은 Chrome과 Safari에서 JavaScript를 직접 실행할 수 있다.
Execute JavaScript in Browser 액션을 추가하고, 실행할 JavaScript 코드를 입력하면 된다.
웹페이지의 DOM에 직접 접근할 수 있어서, 버튼 클릭이나 요소 조작이 가능하다.
이 매크로에서 사용하는 JavaScript 코드를 살펴보자.
Chrome용:
document.querySelector("video").webkitSetPresentationMode("picture-in-picture");
Safari용:
document.querySelector("video").requestPictureInPicture();
두 코드 모두 document.querySelector("video")로 페이지에서 첫 번째 비디오 요소를 찾는다.
그 다음 각 브라우저에 맞는 PIP 메서드를 호출한다.
IfThenElse 조건 분기
이 챕터에서 처음 등장하는 핵심 개념이다. "현재 앱이 무엇인가?"를 확인하고, 결과에 따라 다른 액션을 실행한다.
IfThenElse 액션은 세 부분으로 구성된다:
- If (조건) -- 참/거짓을 판별하는 조건식
- Then (참일 때) -- 조건이 참이면 실행할 액션 목록
- Else (거짓일 때) -- 조건이 거짓이면 실행할 액션 목록
Else 안에 다시 IfThenElse를 넣으면 중첩 조건이 된다.
프로그래밍의 if-else if-else와 같은 구조다.
활용 팁
- YouTube뿐 아니라 Netflix, 쿠팡플레이 등 비디오가 있는 모든 사이트에서 동작한다.
- PIP 창은 항상 최상위에 떠 있으므로, 전체 화면으로 다른 작업을 해도 보인다.
- PIP를 끄려면 PIP 창의 닫기 버튼을 누르거나, 같은 단축키를 다시 누르면 된다.
- 비디오가 여러 개인 페이지에서는 첫 번째 비디오가 PIP로 전환된다. 특정 비디오를 지정하려면
querySelector의 선택자를 수정하면 된다.
매크로 분석: Chrome - 주소입력창 이동 후 영문 변환하기
무엇을 하는 매크로인가
Command+L을 누르면 Chrome 주소창으로 이동하면서 자동으로 영문 입력 모드로 전환된다. 한글 상태에서 URL을 입력하는 실수를 원천적으로 방지한다.
트리거
| 트리거 타입 | 값 | 설명 |
|---|---|---|
| HotKey | Command+L | Chrome 기본 단축키를 가로채서 기능을 추가한다 |
액션 흐름
그림 3-2. 주소창 영문 변환 흐름도
이 매크로는 세 개의 액션이 순차적으로 실행된다.
- SetActionDelay -- 액션 간 딜레이를 최소로 설정한다. 세 단계가 거의 동시에 실행되도록 하기 위함이다.
- SetKeyboardLayout -- 입력 소스를 영문(ABC)으로 강제 전환한다.
- SimulateKeystroke Command+L -- 원래의 Command+L 동작, 즉 주소창으로 포커스 이동을 실행한다.
세 단계가 순식간에 실행되므로, 사용자 입장에서는 Command+L을 눌렀을 때 주소창으로 이동하면서 동시에 영문 모드가 된 것처럼 느껴진다.
핵심 기술 해설
기존 단축키 가로채기
이 매크로에서 가장 중요한 패턴이다. Command+L은 Chrome의 기본 단축키다. KM에서 같은 단축키를 트리거로 설정하면, Chrome의 기본 동작 대신 KM의 매크로가 실행된다.
그런데 매크로 안에서 SimulateKeystroke로 Command+L을 다시 보내면, 원래 기능도 동작한다.
이것이 가능한 이유는 KM이 매크로 실행 중에는 트리거를 무시하기 때문이다.
매크로 안에서 보내는 Command+L은 KM의 트리거에 걸리지 않고 Chrome에 그대로 전달된다.
이 패턴을 정리하면:
- KM이 기존 단축키를 가로챈다
- 원하는 추가 동작을 먼저 수행한다 (영문 전환)
- SimulateKeystroke로 원래 단축키를 다시 보낸다
- 앱이 원래 동작을 수행한다 (주소창 이동)
"기존 동작 앞에 추가 동작을 끼워넣는" 패턴이다. 이 패턴은 다른 앱의 단축키를 확장할 때 자주 사용된다.
SetKeyboardLayout
macOS의 입력 소스를 강제로 변경하는 액션이다. 영문, 한글, 일본어 등 원하는 입력 소스로 전환할 수 있다. 현재 입력 소스가 이미 영문이어도 에러 없이 동작한다.
SetActionDelay
매크로 내 액션 간 기본 딜레이를 설정한다. 기본값은 보통 0.1~0.3초인데, 이 매크로에서는 0초(또는 최소)로 설정한다. 주소창 이동과 영문 전환이 거의 동시에 일어나야 자연스럽기 때문이다.
활용 팁
- Safari에서도 같은 패턴을 적용할 수 있다. Safari에서 Command+L은 동일하게 주소창으로 이동한다.
- 입력 소스 전환이 필요한 다른 단축키에도 같은 방식을 쓸 수 있다. 예를 들어 Spotlight(Command+Space)를 영문 모드로 여는 매크로도 가능하다.
- 검색 창(Command+F)에도 적용할 수 있다. 영문 코드를 검색할 때 유용하다.
매크로 분석: ChatGPT - 마크다운 형식으로 복사하기
무엇을 하는 매크로인가
Control+C를 누르면 ChatGPT 답변을 마크다운 형식으로 복사한다. ChatGPT 웹 인터페이스의 "Copy" 버튼을 자동으로 클릭하는 방식이다. 일반 텍스트 복사와 달리, 코드 블록과 서식이 보존된다.
트리거
| 트리거 타입 | 값 | 설명 |
|---|---|---|
| HotKey | Control+C | ChatGPT 앱/사이트가 활성화된 상태에서만 동작 |
매크로 그룹이 "ChatGPT"로 설정되어 있다. 이 그룹은 ChatGPT 앱 또는 ChatGPT 웹사이트가 활성화되었을 때만 매크로를 실행한다. 다른 앱에서 Control+C를 누르면 이 매크로가 아닌 시스템 기본 복사 기능이 동작한다.
액션 흐름
그림 3-3. ChatGPT 마크다운 복사 흐름도
- SetActionDelay -- 딜레이를 설정한다.
- IfThenElse: ChatGPT 페이지인가? -- 현재 페이지가 ChatGPT인지 조건을 확인한다.
- 참일 때 -- 마크다운 복사 버튼의 좌표를 클릭한다.
- 0.2초 대기 -- UI가 반응할 시간을 준다.
- 한 번 더 클릭 -- 복사 완료를 확인하는 두 번째 클릭이다.
- 거짓일 때 -- 아무 동작도 하지 않는다. 기본 Control+C 복사가 작동한다.
핵심 기술 해설
MouseMoveAndClick
화면의 특정 좌표를 클릭하는 액션이다. ChatGPT 답변 옆에 있는 마크다운 복사 버튼의 위치를 좌표(X, Y)로 지정한다.
좌표 기반 클릭의 장단점:
- 장점: 설정이 간단하다. DOM 구조를 몰라도 된다.
- 단점: 창 크기나 UI 레이아웃이 바뀌면 좌표도 바뀐다. 해상도에 따라 달라질 수 있다.
Pause (딜레이)
액션 사이에 대기 시간을 넣는 액션이다. 이 매크로에서는 첫 번째 클릭과 두 번째 클릭 사이에 0.2초를 둔다. 웹 UI가 클릭에 반응하는 데 시간이 필요하기 때문이다.
딜레이가 너무 짧으면 두 번째 클릭이 무시될 수 있다. 딜레이가 너무 길면 매크로 실행이 느리게 느껴진다. 0.2초는 적절한 균형점이다.
활용 팁
- ChatGPT UI가 업데이트되면 버튼 좌표를 다시 설정해야 할 수 있다.
- "Found Image" 액션을 사용하면 좌표 대신 이미지로 버튼을 찾을 수 있다. UI가 변경되어도 버튼 모양이 같으면 동작한다.
- Claude나 Gemini 같은 다른 AI 도구에도 같은 방식으로 마크다운 복사 매크로를 만들 수 있다.
세 매크로의 공통점
이번 챕터의 세 매크로에는 공통 패턴이 있다.
앱 제한(Targeting)
세 매크로 모두 특정 앱에서만 동작한다. Chrome - PIP 모드는 Chrome&Safari 그룹에 속해 있고, ChatGPT 복사는 ChatGPT 그룹에 속해 있다. 이렇게 매크로 그룹 단위로 "이 앱이 활성화되었을 때만 실행"을 설정할 수 있다.
같은 단축키를 여러 앱에서 다른 용도로 사용할 수 있다는 뜻이다. 예를 들어 Control+C는 ChatGPT에서는 마크다운 복사, 다른 앱에서는 일반 복사가 된다.
단축키 확장
주소창 매크로는 기존 단축키(Command+L)를 가로채서 기능을 확장한다. PIP 매크로는 새로운 단축키(Control+P)를 만든다. ChatGPT 매크로는 기존 단축키(Control+C)에 새로운 의미를 부여한다.
세 가지 모두 "단축키 하나로 복잡한 동작을 간단하게"라는 KM의 핵심 철학을 보여준다.
직접 만들어보기
가장 실용적인 "주소창 영문 변환" 매크로를 직접 만들어보자. 액션이 세 개뿐이라 처음 만들기에 적합하다.
- KM 에디터를 열고 좌측 그룹 목록에서 새 그룹을 만든다. 이름은 "Chrome&Safari"로 설정한다.
- 새로 만든 그룹을 선택하고, 하단의 "Available in these applications"에서 "Google Chrome"을 추가한다. Safari도 사용한다면 함께 추가한다.
- 그룹 안에 새 매크로를 만든다. 이름을 "Chrome - 주소입력창 이동 후 영문 변환하기"로 설정한다.
- 트리거를 추가한다. "Hot Key Trigger"를 선택하고 Command+L을 입력한다.
- 첫 번째 액션: Set Action Delay 를 추가한다. 딜레이를 0초로 설정한다.
- 두 번째 액션: Set Keyboard Layout 을 추가한다. "ABC" (영문)을 선택한다.
- 세 번째 액션: Simulate Keystroke 를 추가한다. Command+L을 입력한다.
- Chrome을 열고 테스트한다. 한글 입력 상태에서 Command+L을 누른다.
- 주소창으로 이동하면서 영문 모드가 되면 성공이다.
이 챕터에서 배운 것
- 브라우저에서 JavaScript를 실행하여 웹페이지를 조작하는 방법 (ExecuteJavaScript)
- IfThenElse 조건 분기로 앱별로 다른 동작을 수행하는 방법
- 기존 단축키를 가로채서 기능을 추가하는 "끼워넣기" 패턴
- SetKeyboardLayout으로 입력 소스를 강제 전환하는 방법
- 매크로 그룹을 이용한 앱 제한(Targeting) 설정
- MouseMoveAndClick으로 특정 좌표를 클릭하는 방법
다음 챕터 예고
ch04에서는 Chrome 프로필 전환 매크로를 다룬다. 공부, 개인, 회사, 교양, AI 다섯 개 프로필을 단축키 하나로 전환하는 방법을 배운다. 비슷한 구조의 매크로를 패턴화하는 기법과, ch03에서 배운 IfThenElse를 더 복잡하게 활용하는 사례를 살펴본다.