본문으로 건너뛰기

쇼츠 영상이 편마다 다르게 나오게 했습니다

바이브 로그 · 26-09-10 · 커밋 101 · day 03 ·
바이브 코딩 프로젝트들의 제작기를 매일 밤 저절로 올리는 블로그입니다.이 프로젝트 소개 →

뭘 했다

매일 나오는 쇼츠 영상이 편마다 다른 모습으로 나오게 했습니다. 지금까지 그 영상은 매번 같은 순서, 같은 화면이었습니다.

오늘은 이야기 틀을 3가지로 나눴습니다. 무언가를 내놓은 날, 고장 난 걸 고친 날, 어제와 오늘을 견주는 날입니다. 영상마다 지난 편과 다른 틀을 고릅니다. 첫 2초는 그날 목록이 타자로 찍히는 화면으로 엽니다. 숫자를 말하는 순간에는 화면 가운데에 그 숫자가 올라갑니다. 프로젝트마다 색과 분위기가 다른 테마 5가지 중 하나를 고를 수도 있습니다. 이 밖에 자막과 썸네일도 손봤습니다.

왜

매일 올라오는 영상이 첫 장면부터 똑같으면 볼 이유가 줄어듭니다. 장면이 차례대로 지나가기만 해서 처음 몇 초에 눈길을 잡지 못했습니다. 숫자도 말로만 스쳐 지나갔습니다.

삽질 포인트

영상 첫 장면에는 그날 이야기를 한 줄로 크게 띄웁니다. 내레이션이 그 줄을 읽을 때 중요한 낱말에 색을 칠해 강조합니다. 그런데 어제 영어 영상에서는 그 강조 색이 한 군데도 칠해지지 않았습니다. 알고 보니 강조할 말이 문장 끝에 오면 마침표가 붙었습니다. 그래서 영상을 만드는 프로그램이 "started."를 강조할 낱말 "started"와 다른 말로 여기고 넘어갔습니다. 낱말 앞뒤의 문장부호는 무시하게 고쳤습니다. 한국어 영상에도 같은 문제가 있었는데, 강조할 말이 문장 중간에 오는 일이 많아 덜 드러났을 뿐입니다.

고치기 전문장 속강조할 말started.≠started색 안 칠해짐고친 뒤: 문장부호 무시started=started색 칠해짐
마침표 하나 때문에 같은 낱말을 다른 말로 봤습니다

다음 할 것

오늘 밤 바뀐 영상이 처음부터 끝까지 저절로 만들어지는지 지켜봅니다. 오늘 이 블로그에 두 번째로 등록한 프로젝트 apart의 첫 글과 영상도 기다립니다.

그 밖의 소식

블로그 첫 화면에는 프로젝트마다 카드가 한 장씩 있는데, 새 프로젝트도 이제 30분 안에 카드로 뜹니다. 두 번째 프로젝트 apart는 등록하고도 밤까지 카드가 안 보였고 도 손으로 넣어야 해서, 주소를 저절로 찾게 하고 아직 정식 공개 전인 사이트는 카드에 '미리보기'로 따로 표시하게 했습니다. 커밋 11개

화면 위 KO/EN 스위치 하나로 사이트 전체가 영어로 바뀝니다. 언어 버튼이 글과 소개, 영상 창에 흩어져 있었고, 영어로 봐도 프로젝트 설명과 커밋 목록은 한국어로 남아 있었습니다. 커밋 6개

블로그 화면을 색과 글자 크기, 간격을 정해 둔 디자인 문서대로 다시 만들었습니다. 어제까지는 임시 디자인이었는데, 이제 첫 화면과 글 화면을 비롯한 다섯 화면이 모두 그 문서를 따릅니다. 커밋 12개

원료 · git log

5d76128feat: preview 상태 — 배포됐지만 릴리즈 전인 프로젝트를 구분 + 본문 링크 새 창
ed745e7chore: 배포 주소 자동 감지에 진단 로그
da0d68efix: 다음 프로젝트 온보딩 검증에서 나온 구멍 4개
d62e1b2feat: 배포 주소 감지에 Vercel API 경로 추가 — CLI 배포도 잡는다
51cac36feat: 배포 주소 자동 감지 — About Website 안 채워도 live가 된다
e1cf41ffeat: 천 단위 콤마(fmtNum) + 지난 실행 줄에 프로젝트 이름 강조
3d59152fix: 이번 주·오늘 커밋 수가 100에서 포화 — Link 헤더로 정확히 센다
27d2cc8docs: CLAUDE.md에 새 프로젝트 등록 체크리스트
9e39e4fdocs: 프로젝트 레포용 커밋 메시지 규약 문구 추가 (복붙 블록)
56f8188fix: 인식 배치가 프로젝트 메타 변경도 감지 — slug만 비교하던 구멍

최근 데브로그

전체 →
바이브 로그의 다른 날 →