온라인 수업에서 동영상 두 개를 동시에 보는 방법

2026년 11월 11일 · 약 5분

됩니다. Crispip를 설치한 뒤 수업 탭과 참고 영상 탭에서 각각 툴바 아이콘을 한 번씩 클릭하면, 두 영상이 하나의 떠 있는 창에 나란히 재생되고 각각 따로 조작할 수 있습니다.

온라인 수업에서 동영상 두 개가 필요한 이유

모든 수업에 창이 두 개 필요한 건 아니지만, 아래 경우에는 탭을 오가는 비용이 실제로 커집니다.

녹화 강의 옆에 실습 시연

강사가 한 단계를 설명하고 화면을 프로그램으로 넘깁니다. 직접 따라 하고 싶죠. 그 단계에서 녹화를 멈추고 옆에 시연 영상을 열어 두면, 메모하고 나중에 되감는 것보다 편하고 어느 장면이 어떤 동작에 해당하는지 바로 보입니다.

수업 옆에 자막이나 번역 영상

어학 수업이나 영어 기술 강의에서는 본 영상과 자막이 따로 된 파일인 경우가 많습니다. 탭을 오가면 문장을 놓치지만, 두 화면을 함께 띄워 두면 시선이 화면을 떠나지 않습니다.

라이브 방송 옆에 미리 녹화한 자료

방송은 흘러가는데 손에는 예습 녹화나 조작 다시보기가 있습니다. 라이브는 되돌릴 수 없고 녹화는 되돌릴 수 있죠. 둘 다 열어 두고 이해가 안 되는 순간 다른 쪽을 바로 확인하면 됩니다.

Chrome 기본 화면 속 화면이 여기서 막히는 지점

기본 화면 속 화면이 해결하는 건 한 가지뿐입니다. 탭을 바꿔도 영상이 계속 재생되는 것. '두 영상을 함께' 두는 일은 해결하지 않습니다. 창 하나에는 video 요소가 정확히 하나만 들어갑니다. 같은 페이지에서 두 번째를 열면 첫 번째를 대체하고, 다른 탭에서 열면 같은 자리에 겹쳐 첫 번째를 가리는 창이 하나 더 생깁니다.

기본 화면 속 화면은 창 하나에 영상 하나만 담고, 두 번째는 첫 번째를 대체하거나 위에 겹칠 뿐 나란히 놓이지 않습니다.

시작하기 전 준비

아래 네 가지를 먼저 확인하면 단계가 매끄럽게 진행됩니다.

• Chrome 116 이상. Crispip는 Document Picture-in-Picture API를 사용하며, Chrome for Developers 문서에 따르면 이 API는 Chrome 116부터 제공됩니다.
• Crispip 설치 후 툴바에 고정. 설치는 Chrome 웹 스토어에서 합니다. 아이콘의 주황빛 빨간 숫자는 현재 탭에 있는 영상 개수이고, 숫자가 없으면 보통 페이지가 아직 영상을 불러오지 않은 상태입니다.
• 두 영상을 각각 다른 탭에서 열고 한 번씩 재생해 둡니다. 영상이 실제로 페이지에 있어야 확장이 찾을 수 있습니다.
• 무료 요금제로 충분. 동시에 최대 2개까지 놓을 수 있고 그리드 레이아웃도 포함됩니다.

단계: 두 영상을 하나의 창에 넣기

처음 한 번만 창을 여는 단계가 추가되고, 그다음부터는 아이콘을 누르고 영상을 더하면 끝입니다.

1. 수업 탭을 열고 영상이 나타날 때까지 기다리기 → 툴바의 Crispip 아이콘에 주황빛 빨간 배지가 뜹니다.
2. 툴바의 Crispip 아이콘 클릭 → Enter를 누르라는 새 PiP 탭이 열리고, 이 탭은 자동으로 탭 맨 왼쪽에 고정됩니다.
3. 그 탭에서 Enter를 누르거나 'PiP 시작' 클릭 → 별도의 떠 있는 창이 나타납니다. 이 단계는 실제 클릭에서만 시작될 수 있어 확장이 대신 눌러 줄 수 없습니다.
4. 창에 화면이 보이는지 확인 → 보이면 수업 영상이 들어간 것이고, 아니면 수업 탭으로 돌아가 아이콘을 한 번 더 누릅니다.
5. 새 탭에서 참고 영상이나 자막 영상을 열고 재생 → 이 페이지에도 영상이 생기고 아이콘에 다시 숫자가 표시됩니다.
6. 그 탭에서 Crispip 아이콘 클릭 → 두 번째 영상이 같은 창으로 들어와 그리드로 나란히 놓입니다. 페이지에 영상이 여러 개면 먼저 고르는 목록이 뜹니다.
7. 제목 표시줄을 잡아 창을 옮기고 모서리로 크기 조절 → 화면 한쪽에 두고 반대쪽은 필기용으로 비워 둡니다.

영상별 조작과 레이아웃

화면마다 조작 바가 따로 있어, 하나를 멈춰도 다른 하나는 그대로 재생됩니다.

• 하나만 일시정지: 화면에 마우스를 올리면 아래에 조작 바가 나옵니다. 맨 왼쪽 재생 버튼은 그 영상에만 적용됩니다.
• 하나만 탐색: 조작 바 아래 진행 막대는 그 영상 전용입니다.
• 영상별 음량: 스피커 아이콘과 슬라이더는 그 영상에만 적용됩니다. 듣기 싫은 쪽은 음소거하면 됩니다.
• 속도 변경: 오른쪽 ⋮을 열어 0.5x에서 2.0x까지 고릅니다. 이것도 그 영상에만 적용됩니다.
• 전체 멈춤: 창 안에서 스페이스 키를 누르면 모든 화면이 멈추고, 한 번 더 누르면 다시 재생됩니다.
• 레이아웃 변경: 창 안에서 마우스 오른쪽 버튼을 누르고 '레이아웃' → '그리드'를 고릅니다. 무료 요금제는 그리드를 쓰고, 오른쪽 L·왼쪽 L·양쪽·메뉴 맨 위의 극장 모드는 PRO 기능입니다.
• 하나를 창 가득 채우기: 조작 바의 '창 채우기'를 누르면 채워지고, 다시 누르면 돌아옵니다.
• 스크린샷과 녹화(PRO): 조작 바의 카메라와 녹화 버튼으로 현재 장면이나 일부 구간을 저장합니다.

화면이 그대로 멈춰 있으면 원래 페이지로 돌아가 재생을 눌러 주세요. 브라우저는 실제 사용자 동작을 요구하므로 확장이 대신할 수 없습니다.

자주 묻는 질문

설치 후 어디서 시작할지 모르겠다면 빠른 시작 안내를 보세요. 요금제와 가격은 가격 섹션에서 확인할 수 있습니다.

기술 설명은 MDN의 Picture-in-Picture API 문서와 Chrome for Developers의 Document Picture-in-Picture 문서를 따랐습니다. 기능과 무료 요금제 한도, 설치 링크는 Chrome 웹 스토어 페이지를 근거로 했고, 데이터 처리 방식은 개인정보 처리방침에 적혀 있습니다.