본문으로 건너뛰기

스크린샷 문서를 최신 상태로 유지하는 방법

담당자 지정, 버전 기록, 변경 점검, 영향받은 페이지 교체, 검토 트리거로 UI 변경 후에도 스크린샷 문서를 유지합니다.

11분 분량워크플로우작성자: Temposhot Team

스크린샷 문서는 릴리스마다 조금씩 낡습니다. 버튼 이름이 바뀌거나 메뉴 위치가 옮겨지거나 테마가 새로 적용되면, 단계가 여전히 동작하더라도 가이드가 잘못된 것처럼 보입니다. 독자는 결국 가이드를 신뢰하지 않게 됩니다.

이 글은 유지보수 절차를 설명합니다. 가이드마다 담당자를 정하는 방법, 검토를 시작하는 조건, Mac에서 Temposhot으로 변경된 페이지만 교체하는 방법을 다룹니다.

이 절차는 하나의 예시로 끝까지 설명합니다. 웹 제품의 관리자 가이드는 40페이지이며, 제품은 6주마다 릴리스됩니다. 버전 4.3에서 버튼 이름 하나가 바뀌고, 대화상자 하나에 필드가 추가되고, 사이드바 항목 하나가 이동하므로 릴리스 당일 전에 가이드를 맞춰야 합니다.

네 가지 수치: 관리자 가이드 40페이지, 6주마다 릴리스, 릴리스 4.3에 영향받는 7페이지, 해당 페이지 교체와 재확인에 약 35분.

담당자와 검증 버전 지정

가이드마다 담당자를 한 명 지정합니다. 보통 가이드가 보여주는 기능을 소유한 사람이나 팀이 담당합니다. 담당자를 여럿으로 나누면 아무도 가이드를 갱신하지 않는 경우가 많습니다.

표지 또는 첫 페이지에 다음 항목을 기록합니다.

  • 담당자: 사람 또는 팀 이름임.
  • 검증 버전: 스크린샷이 일치하는 제품 버전 또는 릴리스 날짜임.
  • 마지막 검증일: 누군가 가이드를 처음부터 끝까지 따라 한 날짜임.

"검증됨"은 누군가 가이드로 작업을 실제로 수행했다는 뜻입니다. 단순히 화면을 훑어본 것은 검증으로 보지 않습니다.

독자가 보는 위치에 기록 두기

검증 버전은 추적 시트에만 두지 않고 가이드 본문에 넣습니다. 4.1 버전을 쓰는 독자가 4.3으로 표시된 가이드를 열면 화면이 다른 이유를 바로 알 수 있습니다. 지원팀은 불일치를 디버깅하기 전에 버전을 물어볼 수 있습니다.

Temposhot에서는 Document의 첫 페이지에 Page title과 Description으로 기록을 넣을 수 있습니다. Cover page를 켜면 PDF 내보내기가 문서 제목과 단계 수로 시작합니다. 예를 들어 "Admin guide, verified on 4.3" 같은 제목을 쓰면 표지에 버전이 표시됩니다.

표지 설정 변경은 PDF 사용자 지정에 속하며 Temposhot Pro가 필요합니다. 기본값에는 표지 페이지가 이미 포함되어 있습니다.

담당자별로 긴 가이드 나누기

예시의 40페이지 관리자 가이드는 구성원, 역할, 결제, 감사 로그를 다룹니다. 영역이 네 개이므로 담당자도 보통 네 명입니다.

40페이지를 한 명이 맡기보다 섹션마다 담당자를 두는 편이 낫습니다. 결제 변경은 결제 팀이 가장 먼저 알아채기 때문입니다.

섹션 네 개의 페이지 범위와 담당자를 보여주는 표: 구성원 및 초대는 1페이지부터 14페이지, 역할 및 권한은 15페이지부터 22페이지, 결제 및 청구서는 23페이지부터 32페이지, 감사 로그는 33페이지부터 40페이지.

섹션 담당자는 자신이 맡은 페이지에만 승인합니다. 가이드 담당자는 승인을 모아 네 섹션 모두 승인되면 검증 버전을 변경합니다.

제품 변경을 검토 트리거로 사용

달력에 따른 정기 검토만으로는 문제를 늦게 발견합니다. 화면을 바꾸는 이벤트에 검토를 연결합니다.

트리거발견 주체조치
릴리스 노트에 가이드의 화면이 언급됨문서 담당자릴리스 전에 영향받는 가이드 점검
라벨 또는 메뉴 항목이 이름 변경됨제품 또는 디자인이전 라벨을 가이드에서 검색
테마 또는 레이아웃 재디자인디자인전체 재촬영 계획
지원팀이 불일치를 보고함지원팀다음 근무 주에 수정
한 분기 동안 트리거가 없음문서 담당자가장 많이 쓰이는 가이드를 샘플 점검

제품 팀이 시각적 UI를 바꾸는 릴리스 항목에 태그를 붙이도록 요청합니다. 이 습관 하나로 대부분의 트리거를 자동으로 발견할 수 있습니다.

6주 릴리스 주기에 검토 맞추기

릴리스가 6주마다 나오면 문서 작업에 고정된 시간이 생깁니다. 릴리스 며칠 전 스테이징 빌드에서 UI가 동결되며, 그 이전에 촬영한 스크린샷은 여전히 바뀔 수 있습니다. 동결된 빌드에서 촬영하고 릴리스 당일 전에 내보내면 가이드와 제품이 일치합니다.

1주차부터 릴리스 당일까지의 타임라인: 1주차부터 4주차에 UI 변경 항목 태그, 5주차 1일에 영향받는 페이지 매핑, 5주차 3일에 스테이징 빌드 UI 동결, 5주차 4일에 Action Capture로 재촬영, 6주차 1일에 가이드 테스트, 릴리스 당일에 PDF 내보내기와 게시된 사본 교체.

이 주기에서 가장 흔한 실수는 너무 일찍 촬영하는 것입니다. 동결 이후에 라벨이 다시 바뀌면 같은 페이지를 두 번 재촬영해야 합니다.

데이터가 안정적인 스테이징 계정 사용

릴리스 사이에 데이터가 바뀌지 않는 계정에서 재촬영합니다. 같은 테스트 구성원 세 명, 같은 청구서 번호, 같은 요금제 이름을 쓰면 바뀌지 않은 페이지와 새 스크린샷이 일관됩니다. 샘플 데이터가 다른 페이지는 UI가 같더라도 기존 페이지 사이에서 어색하게 보입니다.

지원팀이 보고한 불일치 처리

지원팀은 릴리스 노트에서 빠진 변경을 자주 발견합니다. "가이드에 있는 버튼이 보이지 않습니다"라는 티켓은 재촬영 전에 세 가지 정보가 필요합니다. 가이드 이름, 페이지 번호, 고객이 사용하는 제품 버전입니다.

버전이 없으면 4.1을 쓰는 고객의 문의가 이미 4.3에 맞는 가이드를 수정하게 만들 수 있습니다. 지원팀에 세 필드가 있는 짧은 양식을 제공합니다. 현재 버전에서 확인된 불일치는 다음 근무 주에 처리하고, 이전 버전의 불일치는 아래의 보관 항목으로 넘깁니다.

변경을 영향받는 단계에 연결

재촬영 전에 변경된 화면을 보여주는 페이지를 정확히 찾습니다. 인벤토리를 만들면 이 작업이 빨라집니다.

가이드표시되는 화면검증 버전담당자
팀원 초대Members, Invite dialog4.2팀 관리자
청구서 내보내기Billing, Invoices list4.1재무

릴리스가 Invite 대화상자를 바꾸면 인벤토리에서 해당 가이드와 확인할 페이지를 바로 찾을 수 있습니다. 인벤토리가 없으면 모든 가이드를 열어 확인해야 합니다.

예시: 릴리스 4.3

릴리스 4.3에는 눈에 띄는 변경이 세 개 있습니다. Members 페이지의 Add member 버튼이 Invite로 이름이 바뀝니다. Invite 대화상자에 새 Role 필드가 추가됩니다. Invoices 항목이 계정 메뉴에서 Billing 사이드바로 옮겨집니다.

인벤토리가 이 변경을 40페이지 중 7페이지에 매핑합니다.

4.3의 변경변경을 보여주는 페이지재촬영 방법
Add member 버튼이 Invite로 이름 변경6(Members 목록), 14(요약 화면)Members 페이지 Action Capture
Invite 대화상자에 Role 필드 추가7, 8, 9(Invite 대화상자, 역할 선택, 확인)초대 흐름 Action Capture
Invoices가 Billing 사이드바로 이동27, 28(탐색 및 청구서 목록)결제 경로 Action Capture

나머지 33페이지는 그대로 둡니다. 이 페이지들의 스크린샷은 여전히 4.3과 일치하므로, 재촬영해도 독자에게 보이는 내용은 바뀌지 않고 작업만 늘어납니다.

Compare Images로 시각적 차이 찾기

릴리스 노트는 모든 픽셀 변경을 나열하지 않습니다. 간격 변경, 새 아이콘, 색이 바뀐 버튼은 빠질 수 있습니다. 릴리스 노트에 언급되지 않은 페이지는 같은 화면을 새로 한 장 촬영해 내보낸 페이지 이미지와 비교합니다.

Compare Images는 두 버전을 슬라이더, 페이드, 나란히 보기 또는 픽셀 차이 보기로 보여줍니다. 차이 보기는 변경된 영역을 강조하므로 이동한 컨트롤을 쉽게 찾습니다. 브라우저에서 실행되며, 인벤토리가 변경 없음으로 표시한 33페이지를 빠르게 확인하는 데 씁니다.

흐름도: UI 변경으로 태그된 릴리스 항목에서 화면 이름으로 인벤토리를 조회하고, 인접 페이지를 Compare Images로 확인한 뒤, 재촬영할 7페이지 목록을 만들고, 바뀐 경로마다 Action Capture를 한 번씩 실행함.

영향받은 단계만 교체

변경된 대화상자 하나 때문에 가이드 전체를 재촬영하면 시간이 낭비되고 새로운 실수가 생길 수 있습니다. 변경된 페이지만 교체합니다.

  1. Document 열기

    Command+4를 눌러 가이드의 Document를 엽니다.

  2. 새 화면 촬영

    Pages 패널의 추가 메뉴를 열고 Capture new images…, Action Capture 순으로 선택합니다. 변경된 단계만 수행하고 Finish capture를 선택합니다. 새 페이지는 편집기로 돌아오며 현재 페이지 뒤에 삽입할 수 있습니다.

  3. 이동 및 삭제

    Pages 패널에서 새 페이지를 원하는 위치로 드래그하거나 Move up, Move down을 사용합니다. 오래된 페이지는 Delete page로 삭제합니다.

  4. 제목과 표시 옮기기

    오래된 페이지를 삭제하기 전에 제목과 설명을 복사합니다. Command+C와 Command+V로 주석을 복사한 뒤 위치를 조정합니다.

  5. 다시 내보내기

    Export PDF를 선택하거나 More export formats를 사용합니다. 내보내기 결과에는 현재 페이지 순서, 프레이밍, 주석이 그대로 반영됩니다.

페이지 및 가져오기 가이드에서 촬영, 이미지, Capture History로 페이지를 추가하는 방법을 다룹니다.

Action Capture 다시 실행 또는 Capture History에서 추가

Document에 새 페이지를 넣는 방법은 두 가지입니다. **Capture new images…**는 Document 안에서 촬영을 실행하고 실행이 끝나면 프레임을 추가합니다. **Add from Capture History…**는 이미 있는 세션에서 프레임을 가져옵니다. 예를 들어 스테이징 Mac에서 동료가 실행한 촬영이 여기에 해당합니다.

두 가지 교체 페이지 추가 방법 비교: Capture new images는 Document 안에서 Action Capture를 실행하고, Add from Capture History는 프레임별 선택이 가능한 이전 세션의 프레임을 가져옴.

예시에서 초대 흐름은 직접 재촬영합니다. 결제 경로는 전날 스테이징에서 이미 촬영했으므로 프레임 2개를 **Add from Capture History…**로 가져옵니다. 선택기에서 해당 세션을 펼치고 필요한 프레임 2개만 체크합니다.

초대 흐름 재촬영 절차

초대 흐름은 클릭 5번입니다. Invite, 이메일 필드, Role 메뉴, Admin 옵션, Send invite를 누릅니다. 5단계는 무료 요금제의 Action Capture 한도인 실행당 5단계 안에 들어갑니다. 더 긴 경로는 Temposhot Pro를 쓰거나 실행을 두 번으로 나눠야 합니다.

재촬영 실행의 설정 패널: 대상 Specific Window(스테이징 브라우저), 모든 마우스 클릭 촬영, Capture outside clicks Off, Parse clicked elements On, 클릭 영역 표시 Circle Medium, 커서 표시 Mac Pointer Medium.

원래 실행과 같은 대상 유형과 같은 마커 스타일을 사용합니다. 6~9페이지는 원형 마커를 쓰고 나머지는 사각형 마커를 쓰는 가이드는 모든 단계가 맞더라도 임시로 덧댄 것처럼 보입니다.

창 크기 유지

Specific Window 대상은 현재 크기의 창을 촬영합니다. 원래 페이지를 촬영할 때 브라우저 창이 1440픽셀 너비였다면, 재촬영 전에 같은 너비로 되돌립니다. 너비가 다르면 페이지 레이아웃과 글자 크기가 바뀌어 변경되지 않은 33페이지와 어긋납니다.

Screenshot Resolution Checker는 내보낸 페이지 이미지의 픽셀 크기를 보여줍니다. 이전 페이지 한 장과 새 페이지 한 장을 확인하고 너비가 같은지 봅니다.

텍스트, 주석, 개인정보 재확인

새 스크린샷은 주변 요소를 깨뜨리는 경우가 많습니다.

  • 이전 라벨을 쓴 제목: 버튼이 이제 Invite로 표시되는데 "Add member를 선택"이라고 적힘.
  • 화살표와 마커가 빈 공간을 가리킴.
  • 옮겨진 컨트롤이 프레이밍에서 잘림.
  • 이전 화면에 없던 데이터가 새 화면에 표시됨. 예: 이름이 보이는 새 사이드바.

Action Capture 페이지에는 Focus on action을 다시 적용하고, 다른 페이지에는 Custom 프레이밍을 적용합니다. 새 개인 데이터는 Blur(B, Pro)로 흐리게 처리합니다.

모든 페이지에서 이전 라벨 검색

이름이 바뀐 컨트롤은 그 화면을 보여주는 페이지 말고도 여러 곳에 나타나는 경우가 많습니다. 예시에서 "Add member"는 6페이지와 14페이지의 제목에 있고, 3페이지의 설명에도 있습니다. 3페이지는 Members 페이지를 찾는 방법을 설명합니다.

Page Inspector에서 모든 페이지의 Page title과 Description을 읽고, 이전 라벨이 나오는 곳을 모두 적습니다. 같은 편집에서 전부 수정합니다.

교체한 페이지 점검 목록: 제목은 새 라벨 Invite를 사용하고, 설명은 새 Role 필드와 일치하며, 클릭 마커는 클릭한 컨트롤 위에 있고, 프레이밍 수준은 인접 페이지와 같으며, 새 개인 정보가 보이지 않음.

인접 페이지의 프레이밍 맞추기

Action Capture 페이지는 프레이밍 수준 다섯 가지를 지원합니다. Wide, Relaxed, Balanced, Close, Tight입니다. 5페이지와 10페이지가 Balanced를 쓰면 6~9페이지도 Balanced로 설정합니다. 수준이 섞이면 페이지 사이에서 확대 비율이 튀어 오류처럼 보입니다.

페이지에서 F를 누르면 프레이밍 편집기가 열립니다. 수동 자르기가 잘못되었으면 Reset to action으로 클릭 지점을 기준으로 자동 프레임을 다시 만듭니다.

페이지 교체에 쓰는 단축키 목록: Command+4는 Documents 열기, F는 프레이밍 편집기 열기, B는 흐림 추가, M은 Click Marker 추가, Command+C와 Command+V는 주석 복사와 붙여넣기, Command+Z는 실행 취소.

가이드 전체 테스트

테스트 계정을 사용해 현재 버전에서 첫 페이지부터 결과까지 가이드 전체를 따라 합니다. 교체한 페이지가 흐름을 깨뜨릴 수 있습니다. 예를 들어 변경으로 다음 단계의 위치가 함께 옮겨진 경우입니다.

Verified version과 Last verified 날짜는 이 테스트를 통과한 뒤에만 갱신합니다.

예시에서 테스트가 찾아낸 내용

4.3 예시에서 엔드 투 엔드 테스트는 페이지 검토가 놓친 문제 하나를 찾았습니다. 10페이지는 초대를 보낸 뒤 독자에게 "close the dialog"라고 안내했지만, 4.3에서는 대화상자가 자동으로 닫힙니다.

10페이지의 스크린샷은 여전히 맞았으므로 인벤토리와 Compare Images 모두 이 문제를 표시하지 못했습니다. 단계를 실제로 따라 해야만 찾을 수 있었습니다.

설명을 수정한 뒤 5페이지부터 테스트를 다시 합니다. 변경 이전 페이지부터 부분 재테스트를 해도 나머지 가이드가 바뀌지 않았다면 충분합니다.

테스트 담당자 선택

페이지를 재촬영한 사람은 모든 컨트롤의 위치를 이미 알고 있으므로 테스터로 가장 적합하지 않습니다. 재촬영에 참여하지 않은 섹션 담당자나 지원팀 구성원이 고객처럼 가이드를 읽습니다. 예시에서 보안팀 담당자가 구성원 섹션을 테스트하며 약 10분 만에 10페이지의 문제를 찾았습니다.

편집기의 Document가 아니라 내보낸 PDF를 테스터에게 줍니다. 그래야 테스트가 페이지 순서, 표지 페이지, 이미지 품질 등 독자가 받는 파일을 그대로 확인합니다.

핫픽스 후 재테스트

두 릴리스 사이의 핫픽스는 릴리스 노트 없이 라벨을 바꿀 수 있습니다. 6주 주기 안에 지원팀이 불일치를 보고하면 같은 절차를 반복합니다. 인벤토리에서 페이지를 찾고, 교체하고, 변경 전 페이지부터 부분 테스트를 합니다.

Verified version 필드에 핫픽스 버전을 추가합니다. 예: 4.3.1.

독자에게 이력이 필요할 때만 보관

대부분의 독자는 현재 가이드만 필요로 합니다. 장기 릴리스를 쓰는 고객처럼 이전 제품 버전을 아직 쓰는 사람이 있거나, 규정상 기록이 필요한 경우에만 이전 버전을 보관합니다.

보관할 때는 파일 이름과 표지에 이전 버전임을 분명히 표시합니다. 예: invite-teammate_v4.1_archived.pdf. Documents와 Capture History는 Mac에 로컬로 저장되므로, 보관용 내보내기 파일은 Mac에 의존하지 않도록 공유 저장소에 둡니다. Action Capture 작업을 삭제하면 그 작업의 Document가 함께 삭제될 수 있습니다. 따라서 가이드를 폐기할 때까지 원본 Document를 보관합니다.

내보내기 폴더 구조

폴더 구조를 고정하면 현재 파일을 쉽게 찾을 수 있습니다. Settings > General의 Export path를 가이드 작업 폴더로 지정한 뒤, 완성된 파일을 해당 위치로 옮깁니다.

admin-guide 폴더 아래에 4.3 PDF와 PNG 페이지가 있는 current 폴더와, 4.1 및 4.2 PDF를 archived로 표시해 둔 archive 폴더, 유지보수 기록 CSV가 있는 파일 트리.

current 폴더만 도움말 센터나 사내 포털에서 링크합니다. 보관된 파일은 이전 버전을 쓰는 고객이 계속 접근할 수 있지만, 실수로 열리지는 않습니다.

Capture History 보관 기간 확인

Capture History는 기본적으로 세션 30개를 보관합니다. Settings > History에서 상한을 1에서 500 사이로 설정할 수 있습니다. 6주마다 여러 가이드를 재촬영하는 팀은 몇 번의 주기 안에 세션 30개에 도달할 수 있습니다.

Document는 모든 이미지의 복사본을 따로 보관하므로 오래된 세션을 삭제해도 가이드는 손상되지 않습니다. 다만 나중에 재사용할 원본 프레임은 사라집니다.

이 기록으로 유지보수 추적

스프레드시트나 문서 도구에 가이드마다 한 줄씩 기록합니다.

  • 가이드 이름과 파일 위치 기록함.
  • 담당자 기록함.
  • 표시되는 화면 기록함.
  • 검증 버전과 마지막 검증일 기록함.
  • 지원팀 또는 독자가 보고한 열린 이슈 기록함.
  • 다음 예정 샘플 점검 날짜 기록함.

주간에 이 목록을 짧게 점검하면 변경이 작을 때 발견합니다. 연 1회 정리는 독자가 이미 문제를 겪은 뒤에야 발견합니다.

릴리스 4.3 이후 기록 예시

항목값
가이드관리자 가이드, current/admin-guide_v4.3.pdf
담당자문서 담당자 1명, 섹션 담당자 4명
표시되는 화면Members, Invite dialog, Roles, Billing, Invoices, Audit log
검증 버전4.3, 릴리스 당일에 마지막 검증
열린 이슈없음
다음 샘플 점검릴리스 4.4, 6주 후

스크린샷 수명을 늘리는 습관

어떤 스크린샷은 릴리스마다 깨지고, 어떤 스크린샷은 수년 동안 유효합니다. 차이는 주로 프레임을 얼마나 좁게 잡았는지와 어떤 데이터를 보여주는지에 있습니다.

할 것과 하지 말 것 목록: 각 페이지를 단계에 쓰는 패널에 맞춰 프레이밍하고 안정적인 테스트 데이터를 사용함. 날짜나 알림 개수를 프레임에 남기지 않고, 창 하나면 충분할 때 전체 화면을 촬영하지 않으며, 색이나 위치만으로 컨트롤을 설명하지 않음.

자주 묻는 질문

스크린샷 문서는 얼마나 자주 검토해야 하나요?

화면이 바뀌는 릴리스마다 검토합니다. 다른 트리거가 없는 가이드는 분기마다 한 번씩 샘플 점검을 합니다.

스크린샷이 깨지는 빈도를 줄이려면 어떻게 해야 하나요?

Framing으로 관련 패널에 맞춰 촬영 범위를 좁히고, 스크린샷에 날짜와 이름을 넣지 않습니다. 컨트롤 이름을 설명 텍스트로 적어 두면 사소한 스타일 변경이 있어도 독자가 따라갈 수 있습니다.

재설계 후 가이드 전체를 재촬영해야 하나요?

레이아웃이나 테마가 전체적으로 바뀌었다면 그렇습니다. 버튼 이름이 바뀌거나 컨트롤이 옮겨진 경우에는 영향받는 페이지만 교체합니다.

Document를 다시 내보내면 이전 PDF를 덮어쓰나요?

아니요. Export path에 같은 이름의 파일이 있으면 Temposhot이 새 파일 이름에 번호를 붙입니다. 이전 파일을 먼저 이동하거나 이름을 바꾸거나, 게시된 사본을 직접 교체합니다.

수동 스크린샷으로 만든 가이드의 페이지도 업데이트할 수 있나요?

네. **Upload images…**로 새 이미지 파일을 추가하거나 **Capture new images…**로 촬영합니다. Document는 출처와 관계없이 모든 페이지를 같은 방식으로 처리하며, Focus on action에 쓰는 클릭 지점은 Action Capture 페이지에만 있습니다.

부분 업데이트는 전체 재촬영과 비교해 얼마나 걸리나요?

40페이지 예시에서 7페이지를 교체하고 재확인하는 데 약 35분이 걸렸습니다. 전체 재촬영은 40개 제목과 설명을 다시 입력하거나 확인하고 모든 페이지에 주석을 다시 적용해야 하므로 수 배의 시간이 듭니다.

클릭 기록을 명확한 단계별 가이드로 바꾸기

Action Capture는 변경된 단계만 다시 촬영해 기존 Document에 추가합니다. Temposhot 다운로드를 받고, 검증 버전이 가장 오래된 가이드부터 갱신합니다.

maintenancedocumentationscreenshotsreview

여기서 사용한 용어: visual documentation

반복되는 스크린샷을 완성된 결과물로 만듭니다

Temposhot은 타이머 또는 클릭할 때마다 캡처하고, 결과를 PDF, 이미지, ZIP 또는 MP4로 내보냅니다.

관련 글