이 시안 (v16 · 나만 보기 · 완료 화면 픽셀 스타디움)
지원자가 춤·보컬 연습을 남기고, 월 달력에서 기록한 날을 본다. 올린 기록은 본인만 볼 수 있다. 공개·동의 기능은 이번 시안에 없다. 이전 버전(공개 범위·동의 화면 포함)은 git 태그 v6-with-guardian-and-agency에 있다. 모든 데이터는 가짜다.
왼쪽 목록이나 화면 안 버튼으로 넘어간다.
흐름
- 마이 → 이용 내역 "연습 기록" → 홈(달력·고른 날 기록 목록).
- 홈에서 날짜를 고르면 그 날이 7일 안일 때 버튼이 "10월 25일 기록 올리기"로 바뀐다.
- 올리기 → 종류(영상·유튜브 링크·사진·오디오·글) → 파일 고르기 또는 링크 붙여넣기 → 태그(춤·보컬)·연습한 날·메모 → 저장 → 완료. 정보 입력 맨 아래에 "나만 볼 수 있어요" 표시.
- 고른 날에 이미 3개가 있으면 "하루 3개" 안내가 뜬다.
- 기록 상세 → ⋯ 메뉴에서 수정·삭제.
- 오류: 500MB 초과, 업로드 실패(다시 올리기), 빈 상태.
올리기 완료: 무대와 객석 (v10)
기본 규칙: 한 달이 공연 1회다. 좌석 1개는 그 달의 하루(10월 31석)이고, 기록이 1개 이상인 날이면 픽셀 관객(머리+어깨)이 앉는다. 객석은 한 줄 8석, 앞줄(무대 쪽)부터 1일이다. 빈 자리는 어두운 스타디움 의자다. 하루에 몇 개를 올려도 좌석은 1개다. "연속 n일"은 오늘(없으면 어제)부터 거꾸로 센다. 무대 카드를 누르면 달력으로 간다. 그림은 모두 네모 칸(1칸 = 3px)으로만 그렸다.
| 단계 | 이름 | 기록한 날 | 무대 |
|---|---|---|---|
| Lv.1 | 연습실 | 0-4일 | 조명 1개 |
| Lv.2 | 소극장 | 5-11일 | 조명 2개 |
| Lv.3 | 공연장 | 12-19일 | 조명 3개 |
| Lv.4 | 콘서트홀 | 20일 이상 (주 5일 정도) | 조명 3개 + 금빛 무대 테두리 |
"다음 단계(이름)까지 n석"은 다음 기준(5, 12, 20)에서 현재 기록한 날 수를 뺀 값이다. 콘서트홀부터는 "만석까지 n석"을 보여 준다. 만석(그 달 모든 날 기록)은 단계가 아니라 별도 보너스이고, 콘서트홀에 필요하지 않다. 만석이 되면 "최고 단계 · 만석 달성"이 뜬다.
한 줄 안내 규칙: 좌석 수·연속 일수 바로 아래에 한 줄만 보인다. 위에서부터 먼저 맞는 것 하나만 쓴다. 단계가 오르거나 만석이 되는 순간에는 단계 이름·좌석 수와 같은 순간(1.1초)에 나타난다. 왼쪽 목록의 "문구 ①~⑩"로 각각 볼 수 있다.
| 순서 | 조건 | 문구 |
|---|---|---|
| 1 | 만석 | 만석 달성! 이번 달 최고의 무대였어요 |
| 2 | 오늘 단계가 오름 | {새 단계} 오픈! 다음 무대는 {다음 단계}({기준}석) · 콘서트홀: 콘서트홀 오픈! 이제 만석에 도전해요 |
| 3 | 다음 단계(콘서트홀이면 만석)까지 1-2석 | {다음}까지 단 {n}석! 내일 한 번만 더 올려요 |
| 4 | 이전 기록과 3일 이상 간격(새 좌석) | 다시 왔군요! 관객이 기다리고 있었어요 |
| 5 | 이번 달 첫 기록 | 첫 관객 입장! 내일도 무대에 서 볼까요? |
| 6 | 연속 3일 이상 | 연속 {n}일째 무대! 관객이 점점 늘고 있어요 |
| 7 | 이미 기록이 있던 날에 또 저장(3개 미만, 좌석은 그대로) | 오늘 두 번째 무대! 하루 3개까지 남길 수 있어요 (두/세 번째) |
| 8 | 그 날이 3/3개가 됨 (7보다 먼저 검사) | 오늘은 여기까지! 내일 또 객석을 채워요 |
| 9 | 지난 날짜에 저장 | 지난 날 빈자리를 채웠어요 |
| 10 | 그 밖 | 이번 달 만석까지 {남은}석 남았어요 |
관객 섞기: 완료 화면을 보여 줄 때마다 관객 모양이 새로 섞인다(한 번 보는 동안은 그대로, 좌석 수와 켜진 좌석은 같다. 주소 끝에 ?seed=7을 붙이면 고정). 켜진 관객의 30-40%는 응원봉을 들고 두 칸씩 끊어 흔든다. 10-15%는 하트·별 피켓을 든다(5석 이상이면 1개 이상, 만석이면 3개 이상). 나머지는 모자·헤드폰·선글라스·손 든 사람·맨머리다.
사람 모양(8비트): 피부 6가지, 머리색 6가지, 셔츠색 6가지, 머리 6가지(짧은·삐죽·긴·말총·똥머리·양갈래), 웃는 입 2가지가 날짜마다 섞인다. 무대는 좌우 붉은 커튼과 위쪽 주름(밸런스), 나무 바닥 판자, 앞쪽 무대 턱의 조명 줄로 꾸몄고, 단계는 커튼 위 작은 간판("LV.n", 만석이면 "FULL")에 적힌다. 위에서 내려오는 스포트라이트(반투명 원뿔)가 단계가 오르면 1→2→3개로 늘고 콘서트홀부터 무대 턱 조명이 금색이다. 배경은 검정이고 빈 의자는 짙은 회색이며, 객석은 뒷줄로 갈수록 어두워진다. 무대 위 공연자는 방금 저장한 기록의 태그를 따른다: 춤은 댄서, 보컬은 마이크 든 가수(음표가 떠오름), 둘 다면 듀엣이다.
움직임(모두 steps()로 뚝뚝 끊는 8비트 방식). 새 좌석은 위에서 떨어져 세 번 튀고, 네모 조각 4개가 터지고 "+1"이 떠오른다. 가까운 관객이 박수(두 번 뜀)를 친다. 단계가 오르면 배지가 튀고 이름과 다음 목표 문구가 같은 순간(1.1초)에 바뀐다. 만석이 되는 순간에는 LED 화면이 "FULL"로 깜빡이고 네모 색종이가 떨어진다. 이미 찬 날에 올리면 객석은 그대로이고 움직임도 없다. 움직임 줄이기 설정이면 모든 움직임을 멈추고 한 자세로 두며, 새 좌석만 0.15초 페이드로 보인다.
미리 보기: 왼쪽 목록의 "완료 · 레벨 업(4→5일) / 공연장 진입(11→12일) / 콘서트홀 진입(19→20일) / 보컬 기록(가수) / 춤+보컬 기록(듀엣) / 만석 보너스 커튼콜(30→31일)"를 누르면 그 상태가 처음부터 재생된다. 다시 보려면 같은 항목을 다시 누른다. 만석 미리보기는 10월 31일에 저장했고 31일 전부 기록한 상태(연속 31일)로 가정한다. 다른 미리보기도 저장한 날까지만 좌석이 찬다.
진입점: 마이 화면 (로피 코드에서 확인)
마이 탭은 프로필 카드 → 내 오디션 영상(있을 때만) → 메뉴 순서다(lopi-app/screens/my-screen.tsx:20-57). 메뉴는 "이용 내역"과 "설정" 두 섹션이고 아이콘 없이 글과 오른쪽 화살표만 둔다(lopi-app/src/my/components/my-menu.tsx:73-130). "연습 기록"은 이용 내역 첫 줄에 넣었다.
업로드 제한
| 항목 | 값 | 출처·결정 |
|---|---|---|
| 영상 용량 | 500MB 초과 금지 (10진 MB) | lopi-app/src/profile/components/use-profile-video-upload-button.ts:38, 검사 :189·:259 |
| 영상 길이 | 제한 없음 (기존대로) | 민경문 결정 5 |
| 영상 처리 | 올리기 전 H.264, 긴 변 1920px | lopi-app/utils/video-upload-compression.ts:6-8 |
| 유튜브 링크 | 길이·용량 제한 없음. youtube.com/watch, youtu.be, shorts 주소만 받음 | 민경문 결정 2 |
| 하루 개수 | 최대 3개 (모든 종류 합산, 연습한 날 기준) | 민경문 결정 5 |
| 지난 날짜 | 오늘 포함 7일 전까지 | 민경문 결정 4 |
| 사진·오디오 용량 | 검사 없음 (확인 필요) | profile-upload-button.tsx:107-109, audition-apply-audio.tsx:123-124 |
레퍼런스
Mobbin(iOS) v7 검색어: private video diary app entries list. 이전 버전 검색어는 그대로 유효(달력·유튜브 링크·업로드 폼).
| 앱 · 화면 | 가져온 것 |
|---|---|
| Journal · All Entries | 내 기록 목록: 카드마다 제목·날짜·⋯ 메뉴. |
| Notion · 영상 보기 (Private) | 상세 헤더 제목 아래 "Private" 작은 표시. |
| Hypelist · Diary | 월 달력에서 기록한 날 표시. |
| Life Reset · Journey | 사진·영상 기록을 날짜별로 쌓는 모양. |
이전 버전 레퍼런스: Weverse·pliability·Tonal·BeReal(달력), Weverse·Digg·Blinkist(링크 입력).
스타일 출처 (lopi-app)
- brand
#BEF264(tailwind.config.js), 카드#161616rounded-xl, 주 버튼 50px 둥근 brand 바탕 검정 글씨(ui/animated-button.tsx:50). - 마이 화면: 제목 "Profile" Outfit 28/500, 섹션 제목 22px semibold·줄 15px·화살표 white/50(
my-menu.tsx:40-66).
데이터 모양 제안
PracticeLog
id,userId,practicedOn(DATE · 달력·하루 3개 기준),createdAtkind(VIDEO|YOUTUBE|PHOTO|AUDIO|TEXT)fields(DANCE|VOCAL),memostatus(UPLOADING|READY|FAILED),deletedAt- 조회는
userId가 본인일 때만. 제약:(userId, practicedOn)마다READY·UPLOADING3개까지 — 서버가 막는다.practicedOn≥ 오늘−7일(KST).
PracticeLogMedia
- 파일:
fileUrl(R2),mimeType,sizeBytes,durationMs,thumbnailUrl - 유튜브:
youtubeVideoId(11자), 원래 URL,title·thumbnailUrl(oEmbed로 받은 값, 표시용 캐시). 파일은 저장하지 않는다.
정해 주실 것 (남은 것만)
- 하루 3개의 기준일: 시안은 "연습한 날" 기준이다. "올린 날" 기준으로 할지.
- 탈퇴 시 기록: 회원 탈퇴하면 연습 기록 파일을 바로 지울지, 일정 기간 보관할지.
- 유튜브 비공개 영상: 재생 실패 안내를 앱 안에서 어떻게 보여 줄지(시안은 상세 화면 배너).