요즘IT는 2025년 12월 ‘클코나잇 3회 - The 비개발자들’ 세미나를 열어, 비개발자들이 클로드 코드를 어떻게 활용하는지 다양한 사례를 공유했습니다. 참가자들에게 “비개발자들의 유쾌한 반란”, “개발자한테도 유용했습니다”, “정말 많은 인사이트를 얻을 수 있었다” 등의 호평을 받았는데요. 아쉽게도 참석하지 못한 분들을 위해 그날의 핵심 내용을 정리해 콘텐츠로 다시 전해드립니다.
이번 글은 The 비개발자들 세미나 세 번째 주제였던 “스크린샷 주석 서비스(AnnotateShot) 개발기: Claude Code가 비개발 PM에게 준 것들”입니다. 발표 자료는 요즘IT 디스코드에서 다운로드 받을 수 있습니다. 이 콘텐츠는 일정 기간 무료로 제공한 뒤 유료로 전환되었습니다. 자세한 내용이 궁금하시면 전자책(PDF) <클로드 코드로 일하는법: 10인 실제 사례집>을 참고해주세요.
안녕하세요, 라인플러스 PM 정덕범입니다. 오늘은 “스크린샷 주석 서비스(AnnotateShot) 개발기: Claude Code가 비개발 PM에게 준 것들”이라는 주제로 발표하게 됐습니다. 먼저 제 소개를 간단히 하자면, 저는 신문방송학을 전공하고 마케터와 서비스 매니저를 거쳐, 현재는 프로덕트 매니저로 일하고 있는 전형적인 문과생 출신 직장인입니다.

10여 년 전 안드로이드 앱 개발에 도전했다가 포기한 적도 있지만, AI를 접한 후 제 삶은 다이나믹하게 바뀌었습니다. 현재는 'AnnotateShot'이라는 이미지 주석 서비스를 직접 개발해 운영 중이며, 업무 방식 역시 AI를 통해 관리하고 있습니다. 이번 글에서는 제가 약 1년 동안 서비스를 기획하고, 6,000라인이 넘는 코드를 다루며 배포와 운영까지 경험한 이야기를 공유하고자 합니다.
제가 일명 ‘바이브 코딩’의 세계에 입문하게 된 건, 바로 업무 현장에서 불편함을 마주했기 때문입니다. 계기는 라인과 야후 재팬의 합병이라는 큰 변화 속에서 찾아왔습니다. 보안 정책 강화로 평소 화면 설계와 주석 달기에 쓰던 외부 피그마 플러그인 사용이 금지됐기 때문이죠.

업무상 기획 내용을 설명하기 위해선 화면 설계 이미지 위에 숫자를 매기고, 상세 정의를 적어야 하는데요. 도구가 사라지니 스크린샷을 찍어 PPT로 옮기고, 일일이 번호를 매겨 사내 위키에 테이블을 만드는 단순 반복 작업이 시작되었습니다.
더 큰 문제는 리뷰가 끝날 때마다 수정 사항이 생겼고, 번호 위치를 바꾸고 숫자를 다시 매기는 과정을 처음부터 반복해야 한다는 점이었습니다. 이 과정에서 생산성이 심각하게 떨어진다고 느꼈죠. 그래서 이 귀찮은 일을 어떻게든 자동화하고 싶다는 간절함이 저를 AI 페어 프로그래밍의 세계로 이끌었습니다.
*2024년의 일이라, 당시에는 '바이브 코딩'이란 용어가 없었습니다. 바이브 코딩은 OpenAI의 공동 창립자이자, 테슬라의 전 AI 책임자였던 안드레 카파시(Andrej Karpathy)가 2025년 2월 3일, 자신의 X에 사용하면서 처음 등장했습니다.
이런 고민을 하던 차에 사내 AI 페어 프로그래밍 스터디를 통해 '클로드(Claude)'를 만나게 됐습니다. 처음에는 단순히 스크린샷에 번호를 입력하는 기능만 구현하려 했는데요. 클로드의 아티팩트 기능을 활용하니, 웹 프리뷰를 통해 결과물이 즉각 동작하는 모습이 정말 신기했습니다.

처음 요청했을 때 파이썬으로 작성된 코드를 웹 기반으로 다시 짜달라고 부탁했고, 그렇게 탄생한 것이 바로 주석 서비스인 '어노테이트 샷(AnnotateShot)'입니다. 저는 이 도구를 저 혼자 쓰는 데 그치지 않고, 사놓고 쓰지 않던 도메인을 연결해 사내 게시판과 동료 기획자들에게 공유했습니다. 그리고 피드백을 받아 서비스를 발전시켜 나갔죠.

제가 사내 게시판에 도구를 공유하자마자, 동료 기획자들로부터 뜨거운 반응과 함께 다양한 피드백이 쏟아졌습니다. 조직마다 다른 키 컬러를 고려한 주석 색상 선택 기능부터 모자이크 설정, 실행 취소(Undo/Redo), 주석 번호 크기 조절 등 실질적인 요구 사항들이 많았습니다.

저는 신이 나서 피드백을 반영하며 기능을 계속 추가해 나갔지만, 기능이 많아질수록 배포 간격은 점점 커지기 시작했습니다. 초기에는 2~3일 간격으로 빠르게 배포했으나, 코드가 길어지면서 사이드 이펙트를 관리하기가 점점 어려워졌죠. 나중에는 배포 주기가 한 달을 넘기기도 했습니다. 점차 비대해진 코드를 감당하기 힘들어지면서, 한동안 서비스를 제대로 관리하지 못한 채 방치하는 시기를 겪었습니다.
그렇게 정체기에 빠져있던 제게 다시 기회가 찾아온 것은 사내에서 진행한 ‘LINE AI Summer Bootcamp’를 통해서였습니다. 이 부트캠프는 직원들이 원하는 AI를 경험해 볼 수 있도록 선택해, 구독을 지원해 주는 것이었죠. 저는 동료 PM으로부터 클로드 코드(Claude Code)가 정말 좋다는 추천을 받고, 클로드 코드 사용이 가능한 프로 플랜을 선택했습니다.
실무자 10인의 클로드 코드 200% 활용법을 엮은 <클로드 코드로 일하기: 10인 실제 사례집> 전자책(PDF) 출시!

스타트업 CTO, 풀스택 개발자, PM, 영상 제작사 기술이사, 출판 에디터까지.
개발자 6인 + 비개발자 4인이 시행착오 끝에 정립한
클로드 코드 실전 방법론을 한 권에 담았습니다.
지금 읽고 있는 글의 전체 내용은
<클로드 코드로 일하기: 10인 실제 사례집>에서 확인하실 수 있습니다.
# 클로드 코드 좋다는데,
실제 어디까지 되는 건지 궁금한 분
# 개발자, PM, 에디터 등 다양한 직군의
실무 활용 사례를 한번에 보고 싶은 분
# 남들은 어떻게 쓰는지 실패담까지
솔직한 후기가 필요한 분
# 바이브 코딩, 멀티 에이전트 등
최신 키워드는 아는데 실전 감이 안 잡히는 분
# 바이브코딩으로 외주, 사이드프로젝트 등
수익화 방법을 '찍먹' 해보고 싶은 분
©️요즘IT의 모든 콘텐츠는 저작권법의 보호를 받는 바, 무단 전재와 복사, 배포 등을 금합니다.