docs: cli 용 문서 업로드 (runbook: 개발, runbook_planner: 기획)
This commit is contained in:
59
.cli/tasks/0001-lobby-routes-cta-twinkle.md
Normal file
59
.cli/tasks/0001-lobby-routes-cta-twinkle.md
Normal file
@@ -0,0 +1,59 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 카드 구성 단순화 + twinkle 강화
|
||||
- TASK_SLUG: lobby-routes-cta-twinkle
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 메인 로비 화면을 아래 요구사항대로 수정한다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 별 반짝임(twinkle) 강화
|
||||
|
||||
- 메인화면에서 각 별자리(카드/배경에 표현된 별자리)의 별(점)들이 주기적으로 빛나는 느낌이 나도록 수정
|
||||
- 별마다 반짝임 타이밍이 약간씩 다르게(랜덤 딜레이/듀레이션) 적용
|
||||
- prefers-reduced-motion: reduce 환경에서는 반짝임을 끄거나 매우 약하게
|
||||
|
||||
2. 메인 구성 변경 (3개만)
|
||||
|
||||
- 메인 화면 카드/버튼 구성은 아래 3개만 존재:
|
||||
- 우주정거장(무제한/무기한 대기 방): 1개 (CTA)
|
||||
- 오리온: 60분 1개
|
||||
- 쌍둥이자리: 30분 1개
|
||||
- 기존에 있던 다른 별자리 항로/카드는 제거
|
||||
|
||||
3. 레이아웃 변경: 2-row 구성
|
||||
|
||||
- 버튼들의 부모 레이아웃을 2행(row 2개)으로 구성:
|
||||
- 상단 row: 우주정거장(CTA) 버튼이 full-width로 단독 차지
|
||||
- 하단 row: 오리온(60분), 쌍둥이자리(30분) 버튼이 2열로 나란히 배치
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 하단 문구(“정거장 3명 대기 중”) 제거는 사용자가 직접 처리한다. 이 작업에서 변경하지 말 것.
|
||||
- /flight 등 다른 페이지 로직/구조 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
- 과도한 번쩍임/강한 플래시/깜빡임 효과 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 메인 화면에 카드/버튼이 3개만 보인다: 우주정거장(CTA), 오리온 60분, 쌍둥이자리 30분
|
||||
- [ ] 레이아웃이 2행 구조로 동작한다(상단 CTA full / 하단 2열)
|
||||
- [ ] 별들이 은은하게 반짝이며 별마다 타이밍이 달라 자연스럽다
|
||||
- [ ] prefers-reduced-motion에서 반짝임이 정지 또는 매우 약해진다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
|
||||
## 작업 종료 후 정리(필수)
|
||||
|
||||
- 위 작업이 끝나면 `@.cli/run_housekeeping.md` 절차를 그대로 수행하라.
|
||||
66
.cli/tasks/0002-lobby-constellation-twinkle-fix.md
Normal file
66
.cli/tasks/0002-lobby-constellation-twinkle-fix.md
Normal file
@@ -0,0 +1,66 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 별자리 3개 고정 + 별 반짝임 구현 + 불필요 별/문구 제거
|
||||
- TASK_SLUG: lobby-constellation-twinkle-fix
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 로비 화면에서 아래 문제를 해결한다:
|
||||
|
||||
- “정거장 3명이 대기 중” 문구가 다시 나타나는 현상 제거(재발 방지)
|
||||
- 배경 별자리는 **3개만 유지**(오리온/마차부/북두칠성)
|
||||
- 각 별자리의 “별(점)”이 주기적으로 은은하게 반짝이도록(twinkle) **실제 구현**
|
||||
- 별자리 외 **추가 별(랜덤 스타필드 등) 생성 금지** 및 기존에 생긴 불필요 별 제거
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 문구 재발 방지(필수)
|
||||
|
||||
- 로비 화면에서 아래 문구가 렌더링되지 않도록 제거하고, 재도입되지 않게 한다:
|
||||
- "정거장 3명 대기 중"
|
||||
- "정거장 3명이 대기중"
|
||||
- "대기 중" 관련 유사 문구(정거장 대기 인원 표현 포함)
|
||||
- 주의: 하드코딩/데이터/컴포넌트 어디에 있든 **최종 UI에 나오면 실패**.
|
||||
|
||||
2. 배경 별자리 3개 고정(필수)
|
||||
|
||||
- 배경에는 아래 3개 별자리만 존재해야 한다(이름/레이블은 내부 코드에서만 사용해도 됨):
|
||||
- 오리온
|
||||
- 마차부(Auriga)
|
||||
- 북두칠성(큰곰자리 일부 / Big Dipper)
|
||||
- 기존에 있던 다른 별자리(거문고 등) 또는 별자리 외 요소는 제거한다.
|
||||
|
||||
3. 별 반짝임(twinkle) 실제 구현(필수)
|
||||
|
||||
- 반짝임은 **오리온/마차부/북두칠성의 별(점) 요소에만** 적용한다.
|
||||
- “별자리 외 별(랜덤 점/스타필드)”에는 반짝임 적용 금지(애초에 생성 금지).
|
||||
- 방식 권장:
|
||||
- opacity 0.6~1.0 사이 미세 변화 + scale 0.98~1.03 미세 변화
|
||||
- duration 2~6초 범위로 분산
|
||||
- delay를 별마다 다르게(랜덤/고정 배열 모두 가능)
|
||||
- `prefers-reduced-motion: reduce` 환경에서는 반짝임을 **정지 또는 매우 약화**.
|
||||
|
||||
4. 불필요 별(추가 생성 요소) 제거(필수)
|
||||
|
||||
- 별자리 3개 외의 별/점이 대량으로 추가되는 코드(랜덤 생성, 루프 생성, Canvas 스타필드 등)가 있다면 제거한다.
|
||||
- 결과적으로 화면에 보이는 “별(점)”은 **3개 별자리를 구성하는 별(점)만**이어야 한다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- /flight 등 다른 페이지 로직/구조 변경 금지
|
||||
- 신규 기능 추가 금지(로그인/채팅/윈도우 출항 등)
|
||||
- 과도한 번쩍임/강한 플래시/깜빡임(고주파 점멸) 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소 변경): 공통 스타일/컴포넌트(별자리 SVG/스타 컴포넌트 분리하는 경우만)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 로비 화면에서 “정거장 3명 대기 중/대기중” 및 정거장 대기 인원 문구가 **절대 표시되지 않는다**
|
||||
- [ ] 배경 별자리는 **오리온/마차부/북두칠성 3개만** 존재한다
|
||||
- [ ] 반짝임(twinkle)이 **각 별자리의 별(점)에 실제로 적용**되어 보인다(별마다 타이밍이 다름)
|
||||
- [ ] 별자리 외 “추가 별(스타필드/랜덤 점)”이 **생성되지 않는다**
|
||||
73
.cli/tasks/0003-lobby-twinkle-only-no-move.md
Normal file
73
.cli/tasks/0003-lobby-twinkle-only-no-move.md
Normal file
@@ -0,0 +1,73 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby twinkle를 “반짝임만”으로 고정(이동 제거) + 별자리 3개 유지
|
||||
- TASK_SLUG: lobby-twinkle-only-no-move
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 로비 배경에서 “반짝임(twinkle)”이 **이동 없이** 빛만 변하도록 수정한다.
|
||||
또한 배경 별자리는 **오리온/마차부/북두칠성 3개만** 유지하고, 별자리 외 추가 별(스타필드)을 제거/금지한다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 별자리 3개 고정(필수)
|
||||
|
||||
- 배경에는 아래 3개 별자리만 존재해야 한다:
|
||||
- 오리온
|
||||
- 마차부(Auriga)
|
||||
- 북두칠성(Big Dipper)
|
||||
- 다른 별자리(또는 별자리 외 장식 요소)가 있으면 제거한다.
|
||||
|
||||
2. “반짝임만” 구현(필수)
|
||||
|
||||
- 반짝임은 **별자리의 별(점) 요소에만** 적용한다.
|
||||
- 반짝임 방식:
|
||||
- `opacity` 변화만 허용(권장 범위: 0.6 ~ 1.0)
|
||||
- (선택) `scale`은 0.99 ~ 1.01 이내에서만 허용(없어도 됨)
|
||||
- 별마다 타이밍이 다르게:
|
||||
- duration 2~6초 분산
|
||||
- delay도 별마다 분산(랜덤 또는 고정 배열)
|
||||
|
||||
3. 이동/드리프트/패럴럭스 금지(최우선)
|
||||
|
||||
- 아래는 **전부 금지**이며, 존재하면 제거한다:
|
||||
- translate / rotate / position 이동(left/top/x/y 변화)
|
||||
- Canvas 스타필드/별 이동 애니메이션
|
||||
- 배경 스크롤링/드리프트/패럴럭스(별이 흐르는 연출)
|
||||
- 별(점)의 좌표는 시간에 따라 **절대 변하지 않아야 한다.**
|
||||
|
||||
4. 추가 별(스타필드) 금지(필수)
|
||||
|
||||
- 별자리 외의 랜덤 점/별을 생성하는 코드가 있으면 제거한다.
|
||||
- 결과적으로 화면에 보이는 별(점)은 **3개 별자리를 구성하는 점들만**이어야 한다.
|
||||
|
||||
5. 모션 접근성(필수)
|
||||
|
||||
- `prefers-reduced-motion: reduce` 환경에서는 반짝임을 **정지**하거나 매우 약하게 만든다(정지 우선).
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 로비의 버튼 구성/CTA/항로 구성 변경 금지(이번 작업은 배경 twinkle 품질/제약 정리 중심)
|
||||
- /flight 등 다른 페이지 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소 변경): 공통 스타일/컴포넌트 파일(별자리 SVG/스타 컴포넌트를 분리하는 경우만)
|
||||
- (권장) 별자리 점 요소에는 식별 가능한 class/data-attribute를 부여해 twinkle 대상이 명확하도록 한다.
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 배경 별자리는 오리온/마차부/북두칠성 **3개만** 존재한다
|
||||
- [ ] 별(점)은 **위치 이동이 전혀 없고**, 빛(opacity)만 변한다(반짝임만)
|
||||
- [ ] translate/rotate/드리프트/패럴럭스/스타필드(Canvas 포함) 코드가 존재하지 않는다
|
||||
- [ ] 별자리 외 “추가 별(랜덤 점/스타필드)”이 생성되지 않는다
|
||||
- [ ] prefers-reduced-motion에서 반짝임이 정지(또는 매우 약화)된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
90
.cli/tasks/0004-lobby-glint-twinkle-opacity-only.md
Normal file
90
.cli/tasks/0004-lobby-glint-twinkle-opacity-only.md
Normal file
@@ -0,0 +1,90 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 별 반짝임을 “빛 번짐(십자/팔각 글린트)”으로 구현(이동 없음)
|
||||
- TASK_SLUG: lobby-glint-twinkle-opacity-only
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 로비 배경의 별자리(오리온/마차부/북두칠성)에서,
|
||||
별(점)이 단순 점멸이 아니라 **십자(4-point) 또는 팔각(8-point) 형태의 빛 번짐(glint)**으로 반짝이도록 개선한다.
|
||||
단, **어떠한 이동/드리프트/패럴럭스도 발생하면 안 된다.**
|
||||
|
||||
## 전제(현재 상태)
|
||||
|
||||
- 배경 별자리는 3개(오리온/마차부/북두칠성)만 유지한다.
|
||||
- 기존에 랜덤 별(스타필드) 생성 코드가 있다면 이번 작업에서 제거 대상이다(별자리 외 별 0).
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 글린트(빛 번짐) 형태 구현(필수)
|
||||
|
||||
- 각 별은 아래 구성 요소로 표현한다(권장: SVG):
|
||||
- 핵심 별: `circle`
|
||||
- 글린트: `line` 2개(십자) 또는 4개(팔각 = 십자+대각선)
|
||||
- 글린트는 “항상 보이는 선”이 아니라, 반짝일 때만 **opacity가 올라왔다 내려가야** 한다.
|
||||
- 핵심 별(circle)도 약한 opacity 변화는 가능하나, 주역은 글린트가 되어야 한다.
|
||||
|
||||
2. 애니메이션은 opacity만(최우선)
|
||||
|
||||
- 아래는 전부 금지(존재하면 제거):
|
||||
- `transform` 전부(translate/scale/rotate 포함)
|
||||
- `transition-transform`
|
||||
- position 이동(left/top/x/y 변화)
|
||||
- Canvas 스타필드 / requestAnimationFrame 기반 이동
|
||||
- 배경 드리프트/패럴럭스/스크롤링
|
||||
- 반짝임 애니메이션은 **opacity만** 변화하도록 구현한다.
|
||||
- (선택) circle의 opacity는 0.65~1.0 범위, 글린트는 0~0.85 범위 권장.
|
||||
|
||||
3. 별별 랜덤 타이밍 분산(필수)
|
||||
|
||||
- 별마다 애니메이션 타이밍이 약간씩 다르게 보이도록:
|
||||
- duration: 2~6초 범위 분산
|
||||
- delay: 별마다 분산
|
||||
- 랜덤은 “렌더 시 고정”이어야 한다(매 프레임 바뀌는 랜덤 금지).
|
||||
|
||||
4. 모션 접근성(필수)
|
||||
|
||||
- `prefers-reduced-motion: reduce` 환경에서는:
|
||||
- 애니메이션을 끄거나(정지 우선) 아주 약하게
|
||||
- 글린트는 opacity를 매우 낮게 고정(예: 0.1~0.2)
|
||||
|
||||
5. 별자리 3개 고정 & 추가 별 금지(필수)
|
||||
|
||||
- 배경 별자리는 오리온/마차부/북두칠성 3개만 존재해야 한다.
|
||||
- 별자리 외 추가 별(랜덤 점/스타필드)은 생성되지 않아야 한다.
|
||||
|
||||
## 구현 가이드(권장 방향)
|
||||
|
||||
- `page.tsx` 내 별자리 SVG 렌더링에서 “Star” 컴포넌트를 만들고,
|
||||
별 좌표(cx,cy)마다 `circle + glint lines`를 렌더링한다.
|
||||
- CSS는 Tailwind `@layer utilities` 또는 모듈 CSS로 작성하되,
|
||||
keyframes에는 **opacity만** 포함한다.
|
||||
- 글린트 선은 `strokeLinecap="round"`를 사용하고 너무 굵지 않게(0.6~1.0) 유지한다.
|
||||
- 필요하다면 `feGaussianBlur` 기반의 아주 약한 glow 필터를 추가할 수 있으나,
|
||||
성능/가독성에 영향이 없도록 최소화한다(선택).
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 로비의 CTA/항로 카드 구성 변경 금지(이번 작업은 배경 별 반짝임 연출 품질 개선)
|
||||
- /flight 등 다른 페이지 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소 변경): 글로벌 CSS(유틸리티 keyframes 추가가 필요한 경우만)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 글린트(십자/팔각) 형태의 빛 번짐이 별(점)에서 실제로 보인다
|
||||
- [ ] 별자리 관련 어떤 요소에도 transform/translate/scale/rotate가 적용되지 않는다(opactiy only)
|
||||
- [ ] 별자리 외 랜덤 별(스타필드)이 생성되지 않는다(추가 별 0)
|
||||
- [ ] 별마다 반짝임 타이밍이 다르게 느껴진다(duration/delay 분산)
|
||||
- [ ] prefers-reduced-motion에서 애니메이션이 정지 또는 매우 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
82
.cli/tasks/0005-lobby-glint-cross-bloom-like-ref.md
Normal file
82
.cli/tasks/0005-lobby-glint-cross-bloom-like-ref.md
Normal file
@@ -0,0 +1,82 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 별 반짝임을 “십자 글린트 + 블룸(이미지 참고)”로 개선(이동/transform 0)
|
||||
- TASK_SLUG: lobby-glint-cross-bloom-like-ref
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 로비 배경의 별자리(오리온/마차부/북두칠성) 별(점)을
|
||||
첨부 이미지처럼 “십자(4-point) 글린트 + 부드러운 빛 번짐(bloom)” 느낌으로 반짝이게 만든다.
|
||||
|
||||
## 핵심 제약(최우선)
|
||||
|
||||
- 애니메이션은 **opacity만** 허용한다.
|
||||
- `transform`(scale/translate/rotate 포함) 사용 **절대 금지**.
|
||||
- 대각선(×) 글린트 금지. **십자(+)만** 사용.
|
||||
- 별자리 외 랜덤 별/스타필드/Canvas 이동 연출 금지.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 별자리 3개 고정(필수)
|
||||
|
||||
- 배경에는 오리온/마차부/북두칠성 3개만 존재.
|
||||
- 별자리 외 추가 별(랜덤 점/스타필드)은 0.
|
||||
|
||||
2. “이미지 같은” 글린트 형태(필수, SVG 권장)
|
||||
각 별은 아래 구조로 표현한다:
|
||||
|
||||
- Core: 작은 `circle` (중앙 빛)
|
||||
- Spikes: 수평 line 1개 + 수직 line 1개 (십자)
|
||||
- Spikes는 “끝이 뚝 끊기지 않고” **양 끝으로 갈수록 서서히 투명해져야 함**:
|
||||
- `stroke`를 단색이 아니라 `linearGradient`로 처리(중앙 흰색, 양끝 투명)
|
||||
- Bloom: core/스파이크에 **아주 약한 blur glow**를 1겹만 추가
|
||||
- 방법: (권장) 스파이크를 2번 그리기
|
||||
- 1. blur+낮은 opacity(블룸용)
|
||||
- 2. 선명한 라인(본선)
|
||||
- 또는 SVG filter(feGaussianBlur) 1개를 최소로 사용
|
||||
|
||||
3. 반짝임 리듬(필수)
|
||||
|
||||
- 글린트는 항상 켜져 있지 않고, 대부분은 거의 안 보이다가 잠깐 피크:
|
||||
- 기본 opacity: 0 (또는 0.02~0.05)
|
||||
- 피크 순간만 0.7~0.9로 올라왔다가 빠르게 내려옴
|
||||
- 별마다 duration(2~6s), delay 분산(고정 랜덤 OK, 프레임 랜덤 금지)
|
||||
|
||||
4. 디자인 수치(권장 고정값)
|
||||
|
||||
- StrokeWidth: 0.6 전후(0.5~0.8)
|
||||
- Arm 길이(한쪽): 5px(작은 별) ~ 10px(밝은 별) 정도
|
||||
- Core 반지름: 1.2 ~ 2.0
|
||||
- Bloom(블러 라인) opacity는 본선보다 훨씬 낮게(예: 본선 1.0이면 블룸 0.25 이하)
|
||||
|
||||
5. 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce 에서는 애니메이션 OFF(정지 우선)
|
||||
- 글린트는 opacity를 낮게 고정(예: 0.1) 또는 0
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 로비 CTA/항로 카드 구성 변경 금지
|
||||
- /flight 등 다른 페이지 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소): 글로벌 CSS에 twinkle keyframes/클래스 추가
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 글린트는 십자(+)만 존재하고 대각선(×)이 없다
|
||||
- [ ] 스파이크가 그라데이션으로 자연스럽게 사라져(끝이 부드러움) 이미지와 유사한 느낌이다
|
||||
- [ ] bloom이 과하지 않고 “은은한 번짐” 정도로만 보인다
|
||||
- [ ] 애니메이션은 opacity만 사용하며 transform이 0이다(지터/이동 없음)
|
||||
- [ ] 별자리 3개만 유지되고 추가 별/스타필드가 없다
|
||||
- [ ] prefers-reduced-motion에서 애니메이션이 정지(또는 매우 약화)된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
106
.cli/tasks/0006-lobby-star-glint-gradient-bloom-fix.md
Normal file
106
.cli/tasks/0006-lobby-star-glint-gradient-bloom-fix.md
Normal file
@@ -0,0 +1,106 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 별(노드) UI를 “빛나는 별”로 개선(그라데이션 스파이크 + 블룸 + 강약) — 이동 없음
|
||||
- TASK_SLUG: lobby-star-glint-gradient-bloom-fix
|
||||
|
||||
## 작업 목표
|
||||
|
||||
현재 로비 배경 별자리 결과물이 “UI 노드/플러스 아이콘”처럼 보이는 문제를 해결하고,
|
||||
레퍼런스처럼 **중앙이 밝고, 십자 스파이크가 끝으로 갈수록 사라지는** “빛나는 별” 느낌으로 개선한다.
|
||||
추가로 별마다 강약을 줘서 도식 느낌을 줄인다.
|
||||
|
||||
## 핵심 제약(최우선)
|
||||
|
||||
- 애니메이션은 **opacity만** 허용한다.
|
||||
- `transform`(scale/translate/rotate 포함) 사용 절대 금지.
|
||||
- 십자(+)만 사용(대각선 × 금지).
|
||||
- 별자리 외 랜덤 별/스타필드/Canvas 이동 연출 금지.
|
||||
- 별(점) 위치는 절대 변하지 않아야 한다.
|
||||
|
||||
## 개선 포인트(반드시 반영)
|
||||
|
||||
1. 스파이크가 “딱 끊기는 선”처럼 보임 → **그라데이션 스트로크**로 끝이 서서히 사라지게
|
||||
2. 빛 번짐이 없음 → **블룸(1겹)** 추가(과하지 않게)
|
||||
3. 중심 원이 버튼/노드처럼 큼 → **코어는 더 작게**, 대신 은은한 글로우/하이라이트
|
||||
4. 전체가 균일해 도식 느낌 → 별마다 **강약(크기/스파이크 길이/피크 빈도)** 분산
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
### 1) 스파이크 그라데이션(필수)
|
||||
|
||||
- 각 별의 십자 스파이크(수평/수직)는 단색 stroke가 아니라 다음 형태로 구현:
|
||||
- 중앙(코어 근처)은 밝게
|
||||
- 양 끝으로 갈수록 투명(0)으로 페이드아웃
|
||||
- 구현 방식(권장): SVG `linearGradient`
|
||||
- 수평: x1=0% → x2=100% (중앙이 밝고 양끝 투명)
|
||||
- 수직: y1=0% → y2=100% (중앙이 밝고 양끝 투명)
|
||||
|
||||
### 2) 블룸(빛 번짐) 1겹 추가(필수)
|
||||
|
||||
- 스파이크를 2겹으로 그린다:
|
||||
1. **블룸 레이어**: 더 굵고(strokeWidth +0.6~1.2), opacity 낮게(<= 0.25), 약한 blur(가능하면)
|
||||
2. **본선 레이어**: 얇고 선명(strokeWidth 0.5~0.8), opacity는 피크에서만 올라가게
|
||||
- blur는 성능을 위해 최소:
|
||||
- 가능하면 SVG filter(feGaussianBlur) 1개만 사용하거나,
|
||||
- filter 없이도 “굵고 투명한 1겹”만으로 블룸 느낌을 만들 수 있음(우선 이쪽 권장)
|
||||
|
||||
### 3) 코어(중심 원) 개선(필수)
|
||||
|
||||
- 중심 원을 “큰 단색 원”에서 “작은 밝은 코어 + 은은한 글로우”로 변경:
|
||||
- 코어 circle r: 1.2~1.8
|
||||
- 글로우 circle(선택): r을 더 크게(2.8~4.0) 하고 opacity 매우 낮게(<= 0.12)
|
||||
- 코어는 항상 보이되, 살짝만(0.8~1.0) opacity 변화는 허용
|
||||
|
||||
### 4) 반짝임 리듬(필수, opacity only)
|
||||
|
||||
- 스파이크는 기본 opacity 거의 0(또는 0.02~0.05)로 유지하다가,
|
||||
**짧게 피크를 찍는 형태**로 반짝이게 한다.
|
||||
- 권장 keyframe(예시 개념):
|
||||
- 0%, 35%, 100%: 0
|
||||
- 50%: 0.85
|
||||
- 60%: 0.1
|
||||
- 별마다 duration(2~6초), delay 분산(렌더 시 고정)
|
||||
|
||||
### 5) 별별 강약 분산(필수)
|
||||
|
||||
- 모든 별이 같은 크기/스파이크 길이면 도식처럼 보이므로,
|
||||
별마다 아래 중 2개 이상을 분산 적용:
|
||||
- 코어 r (예: 1.2~1.9)
|
||||
- 스파이크 arm 길이(예: 5~11)
|
||||
- 스파이크 피크 opacity(예: 0.6~0.9)
|
||||
- duration/delay
|
||||
- 단, 과하게 다양하면 산만하니 “2~3단계 티어”로만 나눠도 됨(작은 별/중간 별/밝은 별)
|
||||
|
||||
### 6) 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce 에서는:
|
||||
- 애니메이션 OFF(정지 우선)
|
||||
- 스파이크는 아주 낮은 opacity(<= 0.08) 또는 0
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 로비 CTA/항로 카드 구성 변경 금지
|
||||
- /flight 등 다른 페이지 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소): 글로벌 CSS에 keyframes/유틸리티 클래스 추가
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 스파이크가 그라데이션으로 자연스럽게 사라져 “플러스 아이콘” 느낌이 줄었다
|
||||
- [ ] 블룸(은은한 번짐)으로 ‘빛’ 느낌이 생겼다(과하지 않음)
|
||||
- [ ] 코어가 버튼처럼 크지 않고, 작은 밝은 점 + 은은한 글로우로 보인다
|
||||
- [ ] 별마다 강약이 달라 도식 느낌이 줄었다
|
||||
- [ ] 애니메이션은 opacity만 사용하며 transform이 0이다(이동/지터 없음)
|
||||
- [ ] 별자리 외 추가 별/스타필드가 없다
|
||||
- [ ] prefers-reduced-motion에서 애니메이션이 정지(또는 매우 약화)된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
87
.cli/tasks/0007-flight-starfield-diagonal-from-center.md
Normal file
87
.cli/tasks/0007-flight-starfield-diagonal-from-center.md
Normal file
@@ -0,0 +1,87 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 스타필드 방향 수정(중심→4모서리 대각) + 중심부 자연화 + 별 개수 축소
|
||||
- TASK_SLUG: flight-starfield-diagonal-from-center
|
||||
|
||||
## 현재 문제(관찰)
|
||||
|
||||
- 현재 flight 배경 별들이 “위→아래”처럼 흐르는 느낌이 강함(좌상→좌하, 우상→우하).
|
||||
- 실제 유영/전진 느낌은 “중심(시선)에서 바깥으로 퍼져나가며 모서리로 흘러가는” 형태가 필요.
|
||||
- 중심을 점 1개로 두면 어색하고 인공적으로 보임.
|
||||
- 별(스트릭) 개수가 너무 많아 산만함.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/flight/page.tsx`의 배경 스타필드를 다음처럼 변경한다:
|
||||
|
||||
1. 별 이동 방향을 **중심부 → 화면 4개 모서리(대각선) 방향**으로 재구성한다.
|
||||
2. 중심부(소실점)가 어색하지 않도록 “영역”으로 자연스럽게 처리한다.
|
||||
3. 별(스트릭) 수를 줄여 과밀/산만함을 해소한다.
|
||||
4. 타이머/버튼 등 기존 UI는 그대로 유지하고 방해하지 않는다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
### 1) 이동 방향(필수)
|
||||
|
||||
- 별은 화면 중심(또는 중심 근처 영역)에서 생성/등장한 뒤,
|
||||
**NE / NW / SE / SW 네 방향(모서리 대각선)**으로 흘러가야 한다.
|
||||
- “위에서 아래로 떨어지는” 인상(수직 낙하/편향)은 금지.
|
||||
- 구현 가이드(권장):
|
||||
- 각 별에 quadrant(NE/NW/SE/SW) 할당
|
||||
- 중심 벡터(해당 모서리 방향) + 작은 각도 노이즈(±5~15도)로 자연스러운 퍼짐
|
||||
- 속도는 랜덤 티어(느림/중간/빠름)로 분산
|
||||
|
||||
### 2) 중심부 처리(필수)
|
||||
|
||||
- 중심이 “점 1개”처럼 보이지 않게 해야 한다.
|
||||
- 구현 방식 중 택1(권장 순):
|
||||
1. 별 생성 위치를 중심 ‘반경 r(예: 20~60px)’ 안에서 랜덤 분포(중심 영역)
|
||||
2. 중심부에 아주 약한 그라데이션/베일(예: 작은 타원형 glow)을 깔아 소실점을 완화
|
||||
- 중심부가 과하게 밝아져 UI를 방해하면 안 됨(은은하게).
|
||||
|
||||
### 3) 별(스트릭) 밀도/개수 축소(필수)
|
||||
|
||||
- 별이 “너무 많다” 문제 해결:
|
||||
- 기본 별 개수를 현재 대비 **명확히 감소** (권장: 40~90개 범위)
|
||||
- 동시에 화면 전체가 텅 비지 않게 “티어+리사이클”로 유지
|
||||
- 별 크기/밝기/길이도 분산하되 과한 번쩍임 금지.
|
||||
|
||||
### 4) 성능 및 구현 방식(권장)
|
||||
|
||||
- Canvas 사용 중이면 Canvas 유지(권장). DOM 요소 다량 생성은 지양.
|
||||
- requestAnimationFrame 루프는 유지하되,
|
||||
- 불필요한 재생성/과도한 오브젝트 수 금지
|
||||
- 리사이클(화면 밖으로 나가면 중심 근처로 재스폰)
|
||||
- 배경 레이어는 `pointer-events: none` 유지.
|
||||
|
||||
### 5) 모션 접근성(필수)
|
||||
|
||||
- `prefers-reduced-motion: reduce`에서는:
|
||||
- 별 이동을 정지하거나(정지 우선) 속도를 크게 낮춘다.
|
||||
- 배경이 정지해도 UI 사용에 문제 없게.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 타이머 로직/버튼 동작/항해실 UI 요소 추가 금지(기능 유지).
|
||||
- 다른 페이지 수정 금지(필요 시 공통 스타일만 최소 변경 허용).
|
||||
- 신규 기능 추가 금지.
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/flight/page.tsx`
|
||||
- (허용) 필요 시 최소한의 스타일 파일(모션 접근성/배경 레이어 관련)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 별 흐름이 “중심부 → 4모서리 대각선 방향”으로 명확히 보인다(수직 낙하 인상 없음)
|
||||
- [ ] 중심부가 점 1개처럼 어색하지 않고 자연스럽다(영역/베일 처리)
|
||||
- [ ] 별(스트릭) 수가 눈에 띄게 줄어 산만함이 감소했다
|
||||
- [ ] UI(타이머/버튼/라벨) 가독성/클릭이 방해받지 않는다(pointer-events none)
|
||||
- [ ] prefers-reduced-motion에서 이동이 정지 또는 크게 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
97
.cli/tasks/0008-flight-starfield-calm-forward-low-density.md
Normal file
97
.cli/tasks/0008-flight-starfield-calm-forward-low-density.md
Normal file
@@ -0,0 +1,97 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 스타필드(이미지 없이) — “조용한 우주” 점 중심 + 약한 전진감 + 교차 0 (저밀도 튜닝)
|
||||
- TASK_SLUG: flight-starfield-calm-forward-low-density
|
||||
|
||||
## 현재 문제(관찰)
|
||||
|
||||
- 별이 길게 늘어난 스트릭이 많아 산만하고, 교차가 생기면 X자 워프처럼 보인다.
|
||||
- 중앙(타이머) 주변까지 별이 과하게 지나가면 UI 몰입이 깨진다.
|
||||
- 별이 많아 보이는(과밀) 인상이 강하다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/flight/page.tsx` 배경 스타필드를 “조용한 우주” 스타일로 재구성한다:
|
||||
|
||||
1. 대부분은 **정적인 점**에 가깝고,
|
||||
2. **아주 약한 전진감(같은 방향의 미세 이동)**만 느껴지며,
|
||||
3. 별(선) 교차/X자 인상이 **절대** 생기지 않도록 한다.
|
||||
4. 별 개수를 “저밀도”로 튜닝해 산만함을 줄인다.
|
||||
5. UI는 변경하지 않는다(배경만).
|
||||
|
||||
## 핵심 스타일 규격(이미지 없이 구현 가능한 스펙)
|
||||
|
||||
### A. 방향/움직임 (교차 0이 최우선)
|
||||
|
||||
- 별 이동은 **하나의 주 방향 벡터(vBase)**만 사용한다.
|
||||
- 예: (dx=+0.15, dy=+1.0) 처럼 “아주 약한 대각 + 아래” 한 방향
|
||||
- 모든 별은 vBase의 **x 부호가 동일**해야 한다(좌/우 반대 섞기 금지)
|
||||
- 별마다 각도 노이즈는 아주 작게(±3~6도)만 허용.
|
||||
- 속도는 “느림 위주”:
|
||||
- 85~95%: 느림
|
||||
- 5~15%: 중간
|
||||
- 빠른 레이어 금지
|
||||
|
||||
### B. 별 모양(점 중심)
|
||||
|
||||
- 90~97%는 “점” 또는 “매우 짧은 꼬리(2~5px)”만
|
||||
- 3~10%만 “중간 꼬리(6~14px)” 허용
|
||||
- 매우 긴 꼬리(> 16px) 금지
|
||||
- 밝기는 절제(대부분 낮게, 소수만 약간 밝게)
|
||||
|
||||
### C. 밀도(저밀도) — 이번 작업의 핵심
|
||||
|
||||
- 별 개수는 기존보다 확실히 줄인다.
|
||||
- 권장 개수(고정값 상한):
|
||||
- 데스크탑: **18 ~ 45**
|
||||
- 모바일: **12 ~ 30**
|
||||
- 가능하면 개수를 화면 면적에 따라 스케일하되, 위 상한을 넘지 말 것:
|
||||
- `count = clamp(round((width*height)/K), min, max)`
|
||||
- K는 “너무 많아 보이지 않는” 수준으로 크게(예: 30,000~60,000 사이에서 조정)
|
||||
- 중앙 UI 보호:
|
||||
- 타이머 중심 기준 반경 R(예: 150~230px) 영역은 스폰 확률↓ 또는 밝기↓
|
||||
|
||||
### D. 재스폰/리사이클(일관된 흐름 유지)
|
||||
|
||||
- 별이 화면 밖으로 나가면 재스폰.
|
||||
- 재스폰 위치는 흐름 시작 가장자리에서 생성(방향 일관 유지).
|
||||
- 재스폰 후에도 방향은 동일(반대 방향 튀기 금지).
|
||||
|
||||
### E. 기술/성능(권장)
|
||||
|
||||
- Canvas 기반이면 Canvas 유지 권장.
|
||||
- requestAnimationFrame 유지.
|
||||
- 배경 레이어 `pointer-events: none` 유지.
|
||||
- 과도한 blur/고비용 필터 금지.
|
||||
|
||||
### F. 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce:
|
||||
- 이동 정지(우선) 또는 속도 10~20%로 감속
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 타이머/버튼/미션 등 UI 레이아웃 변경 금지(배경만).
|
||||
- 타이머 로직/상태 저장 변경 금지.
|
||||
- 신규 기능 추가 금지.
|
||||
- 다른 페이지 변경 금지.
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/flight/page.tsx`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 별 이동이 “한 방향 전진감”으로만 보이며 X자 교차 인상이 없다(좌/우 반대 혼합 0)
|
||||
- [ ] 별의 대부분이 점(또는 매우 짧은 꼬리)로 보이고, 긴 스트릭이 거의 없다
|
||||
- [ ] 별 개수가 데스크탑 18~45 / 모바일 12~30 범위로 유지되어 산만함이 감소했다
|
||||
- [ ] 중앙(타이머) 가독성이 유지된다(중앙 보호 규칙 적용)
|
||||
- [ ] UI는 변경되지 않았다
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
107
.cli/tasks/0009-flight-starfield-forward-visible-no-dust.md
Normal file
107
.cli/tasks/0009-flight-starfield-forward-visible-no-dust.md
Normal file
@@ -0,0 +1,107 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 스타필드 가시성/전진감 개선 — “먼지 낙하” 제거 + 원근 전진(소실점) + 저밀도 유지
|
||||
- TASK_SLUG: flight-starfield-forward-visible-no-dust
|
||||
|
||||
## 현재 문제(관찰)
|
||||
|
||||
- “한 방향 전진감”을 적용했더니 별이 위→아래로 떨어지는 먼지처럼 보인다.
|
||||
- 별이 너무 희미하고 꼬리가 짧아 거의 보이지 않는다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/flight/page.tsx` 배경 스타필드를 다음처럼 조정한다:
|
||||
|
||||
1. 낙하(먼지) 느낌을 제거하고 **원근 기반 전진감(소실점/투영)**으로 보이게 한다.
|
||||
2. 저밀도(산만하지 않게)는 유지하되, 별이 **확실히 ‘보일 정도’로 가시성**을 올린다.
|
||||
3. X자 교차/워프 느낌은 만들지 않는다(과한 방사형/대칭 금지).
|
||||
4. UI는 변경하지 않는다(배경만).
|
||||
|
||||
## 핵심 구현 방향(권장: 3D 투영 스타필드)
|
||||
|
||||
- 별을 (x,y,z)로 관리하고 z를 프레임마다 감소시키며 투영:
|
||||
- 소실점(vp)은 화면 정중앙보다 **살짝 위**(예: centerY - 40~90px)
|
||||
- 투영: sx = vpX + (x - vpX) / z, sy = vpY + (y - vpY) / z
|
||||
- z가 작아질수록 별이 바깥으로 “퍼져 나가며” 전진감이 생김
|
||||
- “먼지 낙하”가 생기는 vBase 수직 이동 방식은 제거하거나, 투영 방식으로 전환한다.
|
||||
|
||||
## 스타일 규격(이미지 없이 구현 가능)
|
||||
|
||||
### A) 가시성(필수: ‘안 보임’ 해결)
|
||||
|
||||
- 별 밝기(alpha) 최소치를 둔다:
|
||||
- 일반 별: alpha 0.25 ~ 0.55
|
||||
- 강조 별(10~20%): alpha 0.55 ~ 0.85
|
||||
- 별 크기:
|
||||
- 일반: radius 0.7 ~ 1.2
|
||||
- 강조: radius 1.2 ~ 1.8
|
||||
- 색상은 흰색 계열 유지(과한 색 금지)
|
||||
|
||||
### B) 속도/전진감(필수)
|
||||
|
||||
- 너무 느리면 먼지/정지처럼 보임 → 최소 속도 확보:
|
||||
- z 감소량(또는 speed)은 티어로:
|
||||
- 느림(70~85%): 0.006 ~ 0.012
|
||||
- 중간(15~30%): 0.012 ~ 0.022
|
||||
- 빠름(0~5%): 0.022 ~ 0.030 (과하면 워프 느낌, 최소로)
|
||||
- “한 방향”은 수직 낙하가 아니라 **소실점 기반 투영**으로 만든다.
|
||||
|
||||
### C) 꼬리(스트릭)는 ‘소수만’ + 길이는 보일 정도로(필수)
|
||||
|
||||
- 별의 75~90%는 점(꼬리 없음 또는 1~3px)
|
||||
- 10~25%만 짧은 꼬리:
|
||||
- 길이: 4~12px (현재 “안 보임” 이슈 해결을 위해 하한 4px)
|
||||
- 긴 꼬리(> 16px) 금지
|
||||
- 꼬리는 별 이동 벡터의 반대 방향으로 그린다(선형)
|
||||
|
||||
### D) X자/과한 방사형(워프) 방지(필수)
|
||||
|
||||
- 소실점(vp)을 정중앙에 두지 말고 **살짝 오프셋**(위로 + 약간 좌/우 10~30px 랜덤 고정)하여 완벽한 대칭을 깨라.
|
||||
- FOV(퍼짐 정도)가 과하면 워프처럼 보임 → z 범위와 투영 스케일을 조정해 “부드럽게” 퍼지도록.
|
||||
- 별 개수는 적게 유지해 과한 선 교차 인상을 줄인다.
|
||||
|
||||
### E) 밀도(저밀도 유지)
|
||||
|
||||
- 데스크탑: 18 ~ 45
|
||||
- 모바일: 12 ~ 30
|
||||
- 중앙 UI 보호:
|
||||
- 타이머 중심 반경 R(예: 150~220px)에서는
|
||||
- 별 스폰 확률↓ 또는 alpha 하향(완전 공백 금지)
|
||||
|
||||
### F) 리사이클(필수)
|
||||
|
||||
- 별이 화면 밖으로 나가거나 z가 임계치 이하가 되면:
|
||||
- z를 큰 값으로 재설정하고,
|
||||
- x,y는 소실점 주변 영역에서 재스폰(반경 30~120px) → “중심에서 시작” 느낌 유지
|
||||
|
||||
### G) 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce:
|
||||
- 애니메이션 정지(우선) 또는 speed 10~20%로 감속
|
||||
|
||||
## Non-scope
|
||||
|
||||
- UI(A안) 변경 금지
|
||||
- 타이머 로직 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
- 다른 페이지 변경 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/flight/page.tsx`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] “먼지 낙하(위→아래)” 인상이 사라지고, 원근 전진감(소실점 퍼짐)으로 보인다
|
||||
- [ ] 별이 ‘확실히 보이는’ 밝기/크기/꼬리(하한 포함)로 개선되었다
|
||||
- [ ] 과한 대칭 방사형(워프/X자) 인상이 없다(오프셋/스케일로 완화)
|
||||
- [ ] 저밀도(데스크탑 18~45 / 모바일 12~30)가 유지되어 산만하지 않다
|
||||
- [ ] UI는 변경되지 않았다
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
92
.cli/tasks/0010-flight-starfield-spawn-widen-speed-down.md
Normal file
92
.cli/tasks/0010-flight-starfield-spawn-widen-speed-down.md
Normal file
@@ -0,0 +1,92 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 스타필드 튜닝 — 중심 과집중 완화(넓은 스폰) + 속도 감속(유영 느낌)
|
||||
- TASK_SLUG: flight-starfield-spawn-widen-speed-down
|
||||
|
||||
## 현재 문제(관찰)
|
||||
|
||||
- 별이 중심점(소실점)에서만 생성되는 느낌이 강해 인공적이다.
|
||||
- 별 이동 속도가 너무 빠르게 느껴져 “유영”이 아니라 “워프/가속”처럼 보인다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/flight/page.tsx` 배경 스타필드를 아래처럼 튜닝한다:
|
||||
|
||||
1. 별 생성 분포를 넓혀 “중심에서만 뿜는 느낌”을 완화한다(자연스럽게).
|
||||
2. 전체 속도를 낮춰 “조용한 전진/유영” 느낌으로 만든다.
|
||||
3. 가시성(안 보임 문제)은 유지한다(너무 희미해지지 않게).
|
||||
4. UI는 변경하지 않는다(배경만).
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
### 1) 스폰 분포 넓히기(필수)
|
||||
|
||||
- 별의 초기 (x,y) 분포를 “소실점 주변 아주 좁은 반경”에서만 뽑지 말 것.
|
||||
- 아래 중 1개 이상을 적용해 “넓은 영역에서 자연스럽게 시작”되게:
|
||||
- A) 스폰 반경 확대: vp 기준 반경 **120~360px** 범위에서 랜덤 분포
|
||||
- B) 링/도넛 분포: 반경 80~320px에서 더 자주 뽑고(중심은 덜),
|
||||
중심 반경 0~60px 영역은 스폰 확률을 낮춤
|
||||
- C) 화면 전체 분포 + z/스케일로 전진감 유지: (x,y)는 화면 랜덤, z로 원근만 제공
|
||||
- 단, “완전 랜덤”으로 바꾸면 전진감이 약해질 수 있으니,
|
||||
소실점(vp)을 기준으로 하는 투영 구조는 유지하되 **초기 분포만 넓혀**라.
|
||||
|
||||
### 2) 속도 감속(필수)
|
||||
|
||||
- 전체 속도를 1차로 20~40% 낮춘다(체감상 확실히 느려져야 함).
|
||||
- 속도 티어를 아래 범위로 조정(권장):
|
||||
- 느림(75~90%): 0.004 ~ 0.009
|
||||
- 중간(10~25%): 0.009 ~ 0.014
|
||||
- 빠름(0~3%): 0.014 ~ 0.018 (가능하면 0~2%로 제한)
|
||||
- “워프처럼 길게 늘어지는” 인상을 줄이기 위해,
|
||||
꼬리 길이도 속도와 함께 약간 줄이되 ‘안 보임’이 생기지 않게 하한 유지:
|
||||
- 꼬리 있는 별(10~25%)의 길이: **4~10px** (하한 4px 유지)
|
||||
|
||||
### 3) 소실점 위치(권장)
|
||||
|
||||
- 소실점(vp)은 화면 정중앙보다 **살짝 위** 유지(예: -40~-90px).
|
||||
- 완전 대칭을 피하기 위해 x도 소폭 오프셋(±10~25px, 고정) 가능.
|
||||
|
||||
### 4) 밀도/가시성 유지(필수)
|
||||
|
||||
- 저밀도 유지:
|
||||
- 데스크탑 18~45 / 모바일 12~30
|
||||
- 가시성 하한 유지:
|
||||
- 일반 alpha 0.25~0.55, 강조 0.55~0.85
|
||||
- radius 일반 0.7~1.2, 강조 1.2~1.8
|
||||
|
||||
### 5) 리사이클(필수)
|
||||
|
||||
- 화면 밖/z 임계치 도달 시 재스폰하되,
|
||||
재스폰도 위 “넓은 스폰 분포” 규칙을 적용한다(중심에만 몰지 말 것).
|
||||
|
||||
### 6) 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce:
|
||||
- 정지(우선) 또는 speed 10~20%로 감속
|
||||
|
||||
## Non-scope
|
||||
|
||||
- UI(A안) 변경 금지
|
||||
- 타이머 로직 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
- 다른 페이지 변경 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/flight/page.tsx`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 별 생성이 중심점에 과도하게 몰리지 않고 넓은 영역에서 자연스럽게 시작한다
|
||||
- [ ] 속도가 확실히 느려져 “유영/조용한 전진” 느낌이 난다(워프/가속 인상 없음)
|
||||
- [ ] 가시성은 유지되어 별이 충분히 보인다(너무 희미해지지 않음)
|
||||
- [ ] 저밀도 범위(데스크탑 18~45 / 모바일 12~30)가 유지된다
|
||||
- [ ] UI는 변경되지 않았다
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
64
.cli/tasks/0011-home-stars-match-flight-keep-glint.md
Normal file
64
.cli/tasks/0011-home-stars-match-flight-keep-glint.md
Normal file
@@ -0,0 +1,64 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Home 별 모양을 Flight 스타일로 통일 + glint 유지(십자/그라데이션/블룸, opacity only)
|
||||
- TASK_SLUG: home-stars-match-flight-keep-glint
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx`(Home)의 별(점) 모양을 flight에서 사용하는 “별 점 스타일”과 일관되게 맞춘다.
|
||||
단, Home은 기존 요구대로 **glint(십자 빛 번짐)**가 반드시 존재해야 한다.
|
||||
Home 별자리 3개(오리온/마차부/북두칠성) 구조는 유지한다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 별 코어 스타일 통일(필수)
|
||||
|
||||
- Home 별의 core(점/원) 크기/밝기 범위를 flight의 별 느낌과 비슷하게 조정:
|
||||
- 일반: radius 0.7~1.2, alpha 0.25~0.55
|
||||
- 강조: radius 1.2~1.8, alpha 0.55~0.85
|
||||
- 과하게 큰 “노드/버튼” 느낌이 나면 실패.
|
||||
|
||||
2. glint 유지(필수)
|
||||
|
||||
- 각 별은 십자(+) 글린트를 가진다(대각선 × 금지).
|
||||
- 스파이크는 끝으로 갈수록 사라지게(그라데이션 stroke) 구현한다.
|
||||
- 블룸은 1겹만(과하지 않게).
|
||||
|
||||
3. 애니메이션 제약(최우선)
|
||||
|
||||
- Home glint/twinkle 애니메이션은 **opacity만** 변화한다.
|
||||
- transform(scale/translate/rotate) 전부 금지.
|
||||
- 별자리/별 위치 이동 금지.
|
||||
|
||||
4. 타이밍 분산(필수)
|
||||
|
||||
- 별마다 duration(2~6s)과 delay 분산(고정 랜덤 OK).
|
||||
|
||||
5. 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce 에서는 애니메이션 OFF(정지 우선) 또는 매우 약화.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- Home의 카드/CTA/레이아웃 변경 금지(별 스타일만).
|
||||
- 다른 페이지 변경 금지.
|
||||
- 신규 기능 추가 금지.
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- 필요 시(최소): 글로벌 CSS 유틸리티
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] Home 별의 core 크기/밝기가 flight의 별 느낌과 유사해졌다(노드 느낌 감소)
|
||||
- [ ] Home 별에 십자(+) glint가 유지되며, 끝이 그라데이션으로 사라진다
|
||||
- [ ] 애니메이션은 opacity only, transform 0, 위치 이동 0
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
70
.cli/tasks/0012-lobby-stars-smaller-darker-cores.md
Normal file
70
.cli/tasks/0012-lobby-stars-smaller-darker-cores.md
Normal file
@@ -0,0 +1,70 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 배경 별(코어) 더 작고 더 진하게 튜닝
|
||||
- TASK_SLUG: lobby-stars-smaller-darker-cores
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/page.tsx` 로비 배경 별자리(오리온/마차부/북두칠성)의 별(코어)이
|
||||
지금보다 **반지름이 더 작고**, **색/불투명도가 더 진하게** 보이도록 조정한다.
|
||||
glint(십자 빛 번짐) 및 그라데이션/블룸 구조는 유지한다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 코어(중심 점) 크기 축소(필수)
|
||||
|
||||
- 별 코어(circle) radius를 전체적으로 15~35% 축소한다.
|
||||
- 권장 목표 범위:
|
||||
- 일반 별: r 0.6 ~ 1.0
|
||||
- 강조 별: r 1.0 ~ 1.4
|
||||
- “노드/버튼”처럼 보이면 실패(작고 선명하게).
|
||||
|
||||
2. 코어 색/진하기 강화(필수)
|
||||
|
||||
- 코어가 더 “진하게” 보이도록 alpha/색을 조정한다.
|
||||
- 권장 목표 범위(배경이 어두운 기준):
|
||||
- 일반 별: opacity 0.55 ~ 0.85
|
||||
- 강조 별: opacity 0.85 ~ 1.0
|
||||
- 단, 과도한 눈부심/번쩍임 금지(특히 중앙에 몰려 보이면 실패).
|
||||
|
||||
3. glint/블룸은 유지하되 과하지 않게(필수)
|
||||
|
||||
- glint(십자)와 그라데이션 stroke는 유지한다.
|
||||
- 코어를 진하게 만들면서 glint가 더 튀면 아래 중 하나 적용:
|
||||
- glint 피크 opacity를 10~20% 낮춤
|
||||
- 블룸 레이어 opacity를 소폭 낮춤(<= 0.20 권장)
|
||||
- 목표: “작고 진한 별 + 은은한 글린트”
|
||||
|
||||
4. 애니메이션 제약 유지(필수)
|
||||
|
||||
- twinkle/glint 애니메이션은 opacity only 유지
|
||||
- transform(scale/translate/rotate) 금지
|
||||
- 별/별자리 위치 이동 금지
|
||||
- prefers-reduced-motion: reduce 시 정지 또는 크게 약화
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 로비 카드/CTA/레이아웃 변경 금지
|
||||
- 별자리 종류/개수 변경 금지(3개 유지)
|
||||
- 다른 페이지 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일
|
||||
|
||||
- 필수: `@src/app/page.tsx`
|
||||
- (허용) 필요 시 최소 스타일 조정 파일
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 별 코어가 확실히 더 작아졌다(전체적으로 15~35% 감소 체감)
|
||||
- [ ] 별 코어가 확실히 더 진하게 보인다(대비 상승)
|
||||
- [ ] glint는 유지되며 과하게 튀지 않는다(필요 시 소폭 감쇠)
|
||||
- [ ] opacity-only 애니메이션, transform 0, 위치 이동 0
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- AC 항목별 체크 결과(OK/NO)
|
||||
131
.cli/tasks/0013-home-stars-smaller-and-flight-slower.md
Normal file
131
.cli/tasks/0013-home-stars-smaller-and-flight-slower.md
Normal file
@@ -0,0 +1,131 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Home 별자리 별(코어) 더 작게 + Flight 스타필드 속도 추가 감속
|
||||
- TASK_SLUG: home-stars-smaller-and-flight-slower
|
||||
|
||||
## 작업 우선순위(중요)
|
||||
|
||||
1. Home(`@src/app/page.tsx`) 별자리 별(코어) 크기 축소
|
||||
2. Flight(`@src/app/flight/page.tsx`) 별 이동 속도 추가 감속
|
||||
|
||||
- 두 작업은 서로 로직을 섞지 말 것(Home SVG/glint 유지, Flight 캔버스/스타필드 유지)
|
||||
|
||||
---
|
||||
|
||||
# A. Home 작업(필수)
|
||||
|
||||
## 작업 목표
|
||||
|
||||
Home의 각 별자리(오리온/마차부/북두칠성)에서 별(코어)이 지금보다 **더 작게** 보이도록 조정한다.
|
||||
glint(십자)와 그라데이션/블룸, opacity-only 애니메이션 제약은 그대로 유지한다.
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 코어 크기 축소(필수)
|
||||
|
||||
- 별 코어(circle) radius를 전체적으로 추가로 15~30% 축소한다.
|
||||
- 권장 목표 범위:
|
||||
- 일반 별: r 0.5 ~ 0.9
|
||||
- 강조 별: r 0.9 ~ 1.2
|
||||
- “너무 희미해져 안 보임”이 생기면, 크기는 유지하고 opacity를 소폭 올려 해결한다(크기 되돌리기 금지 우선).
|
||||
|
||||
2. glint 유지(필수)
|
||||
|
||||
- 십자(+) glint 유지(대각선 × 금지)
|
||||
- 그라데이션 stroke + 블룸 1겹 유지(과하지 않게)
|
||||
- 코어가 작아지면서 glint가 상대적으로 커 보이면:
|
||||
- glint arm 길이를 10~20% 축소 또는
|
||||
- glint 피크 opacity를 10~20% 낮춘다
|
||||
|
||||
3. 애니메이션/모션 제약(필수)
|
||||
|
||||
- 애니메이션은 opacity only
|
||||
- transform(scale/translate/rotate) 금지
|
||||
- 별/별자리 위치 이동 금지
|
||||
- prefers-reduced-motion: reduce에서 정지 또는 크게 약화
|
||||
|
||||
## Home Non-scope
|
||||
|
||||
- 로비 카드/CTA/레이아웃 변경 금지
|
||||
- 별자리 3개 구성 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## Home 적용 파일
|
||||
|
||||
- `@src/app/page.tsx`
|
||||
|
||||
## Home 완료 조건(AC)
|
||||
|
||||
- [ ] 별 코어가 눈에 띄게 더 작아졌다(추가 15~30% 감소 체감)
|
||||
- [ ] glint(십자) 유지, 과하게 튀지 않음(필요 시 길이/피크 감쇠)
|
||||
- [ ] opacity-only, transform 0, 위치 이동 0
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화
|
||||
|
||||
---
|
||||
|
||||
# B. Flight 작업(필수)
|
||||
|
||||
## 현재 문제(관찰)
|
||||
|
||||
- Flight 스타필드가 여전히 속도가 빠르게 느껴져 유영이 아니라 가속/워프처럼 보인다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
`@src/app/flight/page.tsx` 배경 스타필드의 체감 속도를 **추가로 감속**하여
|
||||
“조용한 전진/유영” 느낌을 강화한다. (가시성은 유지)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 속도 추가 감속(필수)
|
||||
|
||||
- 현재 속도 대비 체감상 15~30% 추가 감속한다.
|
||||
- 권장 speed 티어(이 범위 안으로 재조정):
|
||||
- 느림(80~92%): 0.003 ~ 0.007
|
||||
- 중간(8~18%): 0.007 ~ 0.011
|
||||
- 빠름(0~2%): 0.011 ~ 0.014
|
||||
- “빠름 티어”는 가능하면 0~1%로 더 줄여도 됨.
|
||||
|
||||
2. 꼬리/가시성 유지(필수)
|
||||
|
||||
- 속도를 줄이면 꼬리가 더 안 보일 수 있으므로,
|
||||
꼬리 있는 별(10~25%)의 길이 하한은 유지:
|
||||
- 4~10px 범위 유지(하한 4px)
|
||||
- 너무 안 보이면 “속도를 다시 올리지 말고”
|
||||
alpha(밝기) 또는 꼬리 비율(점:꼬리)을 소폭 조정해 해결한다.
|
||||
|
||||
3. 중앙 보호/저밀도 유지(필수)
|
||||
|
||||
- 저밀도 범위 유지: 데스크탑 18~45 / 모바일 12~30
|
||||
- 중앙 UI 가독성 유지(중앙 보호 규칙 유지)
|
||||
|
||||
4. 모션 접근성(필수)
|
||||
|
||||
- prefers-reduced-motion: reduce에서 정지(우선) 또는 크게 감속
|
||||
|
||||
## Flight Non-scope
|
||||
|
||||
- Flight UI(A안) 레이아웃/버튼/미션 변경 금지(배경만)
|
||||
- 타이머 로직 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## Flight 적용 파일
|
||||
|
||||
- `@src/app/flight/page.tsx`
|
||||
|
||||
## Flight 완료 조건(AC)
|
||||
|
||||
- [ ] 체감 속도가 확실히 느려져 유영/조용한 전진 느낌이 강화되었다
|
||||
- [ ] 가시성이 유지된다(별이 충분히 보임)
|
||||
- [ ] 저밀도 범위/중앙 가독성 유지
|
||||
- [ ] prefers-reduced-motion에서 정지 또는 크게 약화
|
||||
- [ ] UI 변경 없음
|
||||
|
||||
---
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정된 파일 경로 목록
|
||||
- Home AC 체크(OK/NO)
|
||||
- Flight AC 체크(OK/NO)
|
||||
102
.cli/tasks/0014-fsd-refactor-phase1-no-behavior-change.md
Normal file
102
.cli/tasks/0014-fsd-refactor-phase1-no-behavior-change.md
Normal file
@@ -0,0 +1,102 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: FSD 1차 구조로 리팩토링(동작 동일) — lobby/flight 시각 컴포넌트 및 로직 분리
|
||||
- TASK_SLUG: fsd-refactor-phase1-no-behavior-change
|
||||
|
||||
## 작업 목표
|
||||
|
||||
현재 `@src/app/page.tsx`(Home/Lobby)와 `@src/app/flight/page.tsx`에 섞여있는
|
||||
UI/스타필드/글린트/타이머 관련 코드를 **FSD 구조로 분리**하여 읽기 쉽게 만든다.
|
||||
|
||||
- 핵심: **동작/디자인/출력 결과는 변경하지 않는다.**
|
||||
- 변경은 “파일 분리 + import 정리 + 타입 분리” 중심으로 한다.
|
||||
|
||||
## 리팩토링 원칙(필수)
|
||||
|
||||
- 기능 추가 금지 / UI 변경 금지 / 애니메이션 변경 금지
|
||||
- 기존 동작과 시각 결과를 유지(가능하면 스냅샷/수동 확인)
|
||||
- 변수명/함수명은 의미가 더 명확해지면 최소한으로 개선 가능(대규모 리네이밍 금지)
|
||||
- CSS 유틸리티/글로벌 스타일은 이동하더라도 동일하게 동작해야 함
|
||||
|
||||
## 목표 FSD 디렉토리(제안, Next App Router 호환)
|
||||
|
||||
아래 구조로 생성/이동하라:
|
||||
|
||||
- `src/shared/`
|
||||
- `ui/` : 재사용 UI(버튼/칩/베일 등)
|
||||
- `lib/` : 유틸(랜덤 시드, clamp, prefersReducedMotion, resize observer 등)
|
||||
- `config/` : 상수/튜닝 값(별 개수 범위, speed 티어 등)
|
||||
|
||||
- `src/features/`
|
||||
- `lobby-starfield/`
|
||||
- `ui/` : ConstellationScene, Star, GlintCross 등(로비 배경 전용)
|
||||
- `model/` : 별자리 좌표/별 티어 데이터(오리온/마차부/북두칠성)
|
||||
- `flight-starfield/`
|
||||
- `ui/` : FlightStarfieldCanvas (배경 캔버스 레이어)
|
||||
- `model/` : Star 객체 타입, spawn/recycle, speed tiers, vp 설정 등
|
||||
- `lib/` : 투영/렌더 루프 헬퍼(순수 함수)
|
||||
|
||||
- `src/widgets/` (페이지에 꽂는 단위)
|
||||
- `lobby-background/` : 로비 배경 위젯(장면 전체)
|
||||
- `flight-background/` : flight 배경 위젯
|
||||
- `flight-hud/` : flight 타이머/미션/버튼 UI 위젯(있다면)
|
||||
|
||||
- `src/pages/` 는 App Router라 사용하지 말 것(생성 금지)
|
||||
|
||||
## 구체 작업 범위
|
||||
|
||||
### A) Home/Lobby 분리(필수)
|
||||
|
||||
- `src/app/page.tsx`에서 로비 배경(별자리+glint) 관련 JSX/CSS 의존을 분리:
|
||||
- 새로운 위젯/피처 컴포넌트로 이동
|
||||
- page.tsx는 “레이아웃 + CTA + 배경 위젯 호출”만 남긴다
|
||||
- 별자리 좌표/티어/스타 크기/opacity 등의 상수는 `shared/config` 또는 `features/lobby-starfield/model`로 이동
|
||||
|
||||
### B) Flight 분리(필수)
|
||||
|
||||
- `src/app/flight/page.tsx`에서 스타필드 캔버스 로직을 분리:
|
||||
- rAF 루프, star state, spawn/recycle, speed tiers 등은 `features/flight-starfield`로 이동
|
||||
- page.tsx는 “HUD(UI) + 배경 위젯 호출”만 남긴다
|
||||
- prefers-reduced-motion 처리도 shared/lib로 이동(중복 제거)
|
||||
|
||||
### C) import 정리(필수)
|
||||
|
||||
- 절대경로/alias 사용 규칙이 있으면 그것에 맞추고, 없으면 통일(한 방식만)
|
||||
- barrel export(index.ts)는 필요 최소로만(과도한 index 남발 금지)
|
||||
|
||||
### D) 타입/상수 정리(권장)
|
||||
|
||||
- star 타입, 티어 타입, 좌표 타입 분리
|
||||
- “튜닝 값”을 한 파일에 모아 관리 가능하게(예: `shared/config/starfield.ts`)
|
||||
- 단, 값 자체는 바꾸지 말 것(동작 유지)
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 디자인 변경, 애니메이션 변경, 별 개수/속도 변경 금지
|
||||
- 라우팅 변경 금지
|
||||
- 신규 기능 추가 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `@src/app/page.tsx`
|
||||
- `@src/app/flight/page.tsx`
|
||||
- 신규 생성:
|
||||
- `src/features/lobby-starfield/**`
|
||||
- `src/features/flight-starfield/**`
|
||||
- `src/widgets/**`
|
||||
- `src/shared/lib/**`, `src/shared/config/**`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] page.tsx / flight/page.tsx의 코드가 “페이지 조합” 수준으로 짧아졌다(핵심 로직 제거)
|
||||
- [ ] 로비 별자리+glint는 features/widgets로 분리되었고 동작 동일
|
||||
- [ ] flight 스타필드 캔버스는 features/widgets로 분리되었고 동작 동일
|
||||
- [ ] 빌드/타입 에러 없이 동작한다
|
||||
- [ ] 기능/디자인 변경 없이 리팩토링만 수행했다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 변경/생성된 파일 경로 목록
|
||||
- AC 체크(OK/NO)
|
||||
168
.cli/tasks/0015-fsd-settle-phase2-cleanup-and-public-api.md
Normal file
168
.cli/tasks/0015-fsd-settle-phase2-cleanup-and-public-api.md
Normal file
@@ -0,0 +1,168 @@
|
||||
# .gemini/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: FSD 정착 2차 — 잔재 import 제거/중복 정리 + widgets public API 고정 + 분리작업 준비
|
||||
- TASK_SLUG: fsd-settle-phase2-cleanup-and-public-api
|
||||
|
||||
## 작업 목표
|
||||
|
||||
1차 FSD 이관 이후 남아있는 “잔재(import/중복/브릿지)”를 정리하고,
|
||||
페이지(app/\*)가 **widgets의 public API만** import 하도록 고정해
|
||||
향후 기능/스타필드/UI 분리 작업을 안전하게 진행할 수 있는 상태로 만든다.
|
||||
|
||||
**중요:** 동작/디자인 변경 없이 리팩토링(정리/분리)만 수행한다.
|
||||
|
||||
---
|
||||
|
||||
## 0) 작업 순서(반드시 이 순서로)
|
||||
|
||||
1. 잔재 import 탐지 → 2) 잔재 제거/이관 → 3) 중복 소거(단일 소스) →
|
||||
2. widgets public API(index.ts) 구축 → 5) 페이지 import를 widgets로 통일 →
|
||||
3. 브릿지 파일 제거 → 7) 빌드 확인
|
||||
|
||||
---
|
||||
|
||||
# 1) 잔재(import) 탐지 및 제거(필수)
|
||||
|
||||
## 탐지(필수)
|
||||
|
||||
레포에서 아래 경로를 직접 참조하는 import가 남아있는지 모두 확인하고 제거한다:
|
||||
|
||||
- `components/*`
|
||||
- `lib/*`
|
||||
- `types/*` (가능하면)
|
||||
- `features/*/ui/*` 를 page가 직접 import 하는 케이스(페이지는 widgets만)
|
||||
|
||||
> 탐지는 CLI에서 ripgrep을 사용하거나(권장), 코드 검색으로 동일하게 수행한다.
|
||||
|
||||
## 정리 규칙(필수)
|
||||
|
||||
- `components/*`를 직접 import하는 코드가 있다면:
|
||||
- 해당 컴포넌트의 “정식 위치”(shared/ui, features/**/ui, widgets/**/ui)로 import를 바꾼다.
|
||||
- `lib/*` import가 남아있다면:
|
||||
- `shared/lib/**` 또는 `shared/config/**` 또는 `entities/**/model`/`features/**/model`로 교체한다.
|
||||
- `types/*` import가 남아있다면:
|
||||
- 가능 범위에서 `shared/types/**` 또는 도메인 model로 이동/교체한다.
|
||||
- 단, 타입 대수술은 금지(경로 정리 중심).
|
||||
|
||||
---
|
||||
|
||||
# 2) 중복 구현 정리(필수)
|
||||
|
||||
## 대상(필수)
|
||||
|
||||
특히 아래 성격의 파일은 중복이 생기기 쉬우므로 “단일 소스”로 통일한다:
|
||||
|
||||
- `LobbyBackground` 계열
|
||||
- `FlightBackground` 계열
|
||||
- Star/Glint/Constellation 컴포넌트
|
||||
- Starfield Canvas/Loop 관련 유틸
|
||||
|
||||
## 규칙(필수)
|
||||
|
||||
- 동일 기능이 두 위치에 존재하면, 하나를 “정식 소스”로 결정하고 나머지는 제거한다.
|
||||
- 정식 소스 위치 우선순위:
|
||||
1. widgets/\*\* (페이지에 꽂는 단위)
|
||||
2. features/\*\* (기능 단위)
|
||||
3. shared/\*\* (완전 범용)
|
||||
- 제거가 리스크면 임시 re-export 브릿지를 1회만 허용하되,
|
||||
이번 작업에서 최종적으로는 브릿지를 제거하는 방향을 우선한다.
|
||||
|
||||
---
|
||||
|
||||
# 3) Widgets Public API 고정(핵심)
|
||||
|
||||
## 목표(필수)
|
||||
|
||||
페이지(app/\*)는 앞으로 아래만 import 한다:
|
||||
|
||||
- `widgets/**` 의 `index.ts` (public API)
|
||||
|
||||
## 수행(필수)
|
||||
|
||||
- 각 widget 폴더에 `index.ts`를 만들고 public export를 한 곳으로 모은다.
|
||||
예:
|
||||
- `src/widgets/lobby-background/index.ts`
|
||||
- `src/widgets/flight-background/index.ts`
|
||||
- `src/widgets/flight-hud/index.ts`
|
||||
- `src/widgets/lobby-routes/index.ts`
|
||||
- page에서 `widgets/**/ui/*` 또는 `features/**/ui/*` 를 직접 import하는 코드를 전부 제거하고,
|
||||
`widgets/**`의 index.ts에서만 가져오게 수정한다.
|
||||
|
||||
## 금지(필수)
|
||||
|
||||
- page에서 features/entities/shared를 직접 import하지 말 것(예외: 정말 공용 상수 1~2개 정도만, 가능하면 위젯이 먹도록 감춘다).
|
||||
- widget 내부에서만 features/entities/shared를 조합한다.
|
||||
|
||||
---
|
||||
|
||||
# 4) 페이지(app/\*) 정리(필수)
|
||||
|
||||
## 목표(필수)
|
||||
|
||||
- `src/app/page.tsx` 및 `src/app/flight/page.tsx`는 “조합자” 역할만 한다:
|
||||
- 위젯 렌더링 + 라우팅/레이아웃
|
||||
- 별자리/스타필드/글린트/타이머 코어 로직은 페이지에서 제거되어야 한다(이미 분리되어 있다면 유지).
|
||||
|
||||
## 수행(필수)
|
||||
|
||||
- `app/page.tsx`는 `LobbyBackground`(widget)와 라우트/CTA만 남긴다.
|
||||
- `app/flight/page.tsx`는 `FlightBackground` + `FlightHUD`(widget)만 남긴다.
|
||||
|
||||
---
|
||||
|
||||
# 5) 브릿지 파일 제거(필수)
|
||||
|
||||
## 목표
|
||||
|
||||
- 1차 이관에서 남겨둔 임시 re-export/브릿지 파일이 있다면 제거한다.
|
||||
- `components/` 또는 `lib/` 폴더가 남아있다면:
|
||||
- 비어있게 만들고 제거하거나,
|
||||
- 최소한 “더 이상 import되지 않음” 상태로 만든다(최종적으로 삭제 권장).
|
||||
|
||||
---
|
||||
|
||||
# 6) 빌드/런타임 확인(필수)
|
||||
|
||||
- 타입 체크/빌드가 깨지지 않아야 한다.
|
||||
- Home 로비 배경(별자리+glint) 정상 표시
|
||||
- Flight 배경 스타필드 정상 표시
|
||||
- 주요 라우트 이동(/, /boarding, /flight, /debrief, /log, /settings) 깨짐 없음
|
||||
|
||||
---
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 기능 추가/변경 금지
|
||||
- UI/애니메이션/스타필드 튜닝 금지(이번 작업은 구조 고정만)
|
||||
- 라우트/디자인 변경 금지
|
||||
- 스타일 값 조정 금지
|
||||
|
||||
---
|
||||
|
||||
## 적용 범위(예상)
|
||||
|
||||
- `src/app/page.tsx`
|
||||
- `src/app/flight/page.tsx`
|
||||
- `src/widgets/**` (index.ts 생성/수정)
|
||||
- `src/features/**` (중복 제거/정식 소스 확정)
|
||||
- `src/shared/**` (유틸/설정 경로 정리)
|
||||
- 잔재 폴더(`components`, `lib`, `types`) 정리/삭제
|
||||
|
||||
---
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] `components/*`, `lib/*`, `types/*` 직접 import가 레포에서 0이거나(최소화), 남아있다면 정당한 사유가 주석으로 명시됨
|
||||
- [ ] 페이지(app/\*)는 widgets public API만 import한다(직접 features/ui 참조 없음)
|
||||
- [ ] 각 widget은 index.ts(public API)를 가진다
|
||||
- [ ] 중복 구현이 제거되어 단일 소스가 확정되었다
|
||||
- [ ] 빌드/타입 에러 없이 동작이 유지된다
|
||||
|
||||
---
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 변경/생성/삭제된 파일 경로 목록
|
||||
- AC 체크(OK/NO)
|
||||
88
.cli/tasks/0016-lobby-boarding-modal-remove-memo.md
Normal file
88
.cli/tasks/0016-lobby-boarding-modal-remove-memo.md
Normal file
@@ -0,0 +1,88 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Lobby 목표 설정 화면을 모달로 전환 + 메모 기능 제거(동작 유지)
|
||||
- TASK_SLUG: lobby-boarding-modal-remove-memo
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- 우주정거장(로비)에서 항로 선택 후 **“바로 출항”**을 눌렀을 때 이동하던 목표 설정 화면을
|
||||
**페이지 이동 대신 모달로 띄우는 방식**으로 변경한다.
|
||||
- 목표 설정 화면의 **메모 기능은 완전히 삭제**한다.
|
||||
- 모달에서 **“도킹 완료(출항)”**를 누르면 기존과 동일하게 다음 플로우(출항/flight 진입)가 진행되도록 한다.
|
||||
|
||||
## 사용자 플로우(필수)
|
||||
|
||||
1. 로비(/)에서 항로 카드의 “바로 출항” 클릭
|
||||
2. (페이지 이동 없음) 목표 설정 모달 오픈
|
||||
3. 사용자가 목표(미션) 입력
|
||||
4. “도킹 완료(출항)” 클릭
|
||||
5. 기존과 동일한 방식으로 세션 시작 및 flight 화면으로 이동(또는 기존 출항 로직 호출)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
### A) 모달 전환(필수)
|
||||
|
||||
- “바로 출항” 클릭 시 `/boarding`로 라우팅하지 말고,
|
||||
로비 페이지에서 목표 설정 모달을 연다.
|
||||
- 모달 닫기(취소/배경 클릭/ESC 등) 시 로비로 그대로 돌아온다(세션 시작 금지).
|
||||
- 모달 오픈 시 미션 입력 필드에 자동 포커스.
|
||||
|
||||
### B) 메모 기능 삭제(필수)
|
||||
|
||||
- 목표 설정 UI에서 메모 입력(컨디션 메모 등) 관련:
|
||||
- UI 요소 제거
|
||||
- 상태(state) 제거
|
||||
- 저장/로그 스키마에 기록하던 필드가 있다면 더 이상 생성하지 않음(기존 데이터 읽기는 깨지지 않게)
|
||||
- 관련 placeholder/문구도 제거.
|
||||
|
||||
### C) “도킹 완료(출항)” 동작 동일(필수)
|
||||
|
||||
- 모달에서 “도킹 완료(출항)” 클릭 시:
|
||||
- 기존 boarding 페이지에서 하던 세션 생성/저장 로직을 그대로 재사용한다
|
||||
- 성공하면 기존과 동일하게 flight로 이동한다
|
||||
- 유효성:
|
||||
- 미션 입력은 필수(빈 값이면 출항 불가 + 기존과 동일한 방식의 에러 처리)
|
||||
|
||||
### D) /boarding 라우트 처리(권장)
|
||||
|
||||
- “바로 출항” 플로우는 모달로 전환하되,
|
||||
`/boarding` 페이지는 당장 제거하지 말고(링크/북마크 대비),
|
||||
동작을 유지하거나 로비로 리다이렉트하는 방식 중 하나로 정리한다.
|
||||
- 단, 새로운 기능 범위를 넘어 UI/흐름을 크게 바꾸지 말 것.
|
||||
|
||||
## 구현 가이드(권장)
|
||||
|
||||
- 모달 컴포넌트는 이미 있는 공용 Dialog/Modal을 사용한다(`shared/ui/dialog` 또는 동일 역할 컴포넌트).
|
||||
- 모달 내부 폼은 기존 boarding 폼을 재사용 가능한 컴포넌트로 분리해도 됨(동작 동일 유지).
|
||||
- 세션 시작 로직은 `features/*-session/model` 등 기존 모델을 그대로 호출(중복 구현 금지).
|
||||
|
||||
## Non-scope
|
||||
|
||||
- flight/debrief/log/settings UI 변경 금지
|
||||
- 스타필드/애니메이션 튜닝 금지
|
||||
- 신규 기능 추가 금지(메모 삭제 + 모달 전환만)
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `@src/app/page.tsx` (로비에서 모달 제어)
|
||||
- `@src/app/boarding/page.tsx` (필요 시 리다이렉트/호환 처리)
|
||||
- 관련 위젯/피처:
|
||||
- `widgets/lobby-routes` 또는 로비 카드/출항 핸들러 위치
|
||||
- `widgets/boarding-screen` 또는 목표 설정 UI 컴포넌트
|
||||
- 공용 모달/다이얼로그 컴포넌트(이미 있으면 재사용)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 로비에서 “바로 출항” 클릭 시 /boarding로 이동하지 않고 목표 설정 모달이 열린다
|
||||
- [ ] 모달 닫으면 아무 것도 시작되지 않고 로비에 그대로 남는다
|
||||
- [ ] 메모 입력/UI/상태/저장 로직이 모두 제거되었다
|
||||
- [ ] 미션이 비어있으면 출항 불가(기존과 동일한 유효성 처리)
|
||||
- [ ] “도킹 완료(출항)” 클릭 시 기존과 동일하게 세션이 시작되고 flight로 이동한다
|
||||
- [ ] 기존 로그/세션 데이터 읽기 흐름이 깨지지 않는다(기존 데이터 호환)
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
79
.cli/tasks/0017-enter-submit-boarding-and-debrief.md
Normal file
79
.cli/tasks/0017-enter-submit-boarding-and-debrief.md
Normal file
@@ -0,0 +1,79 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Enter로 진행 — 탑승(미션 설정) & 회고(항해일지) 폼을 form submit로 처리
|
||||
- TASK_SLUG: enter-submit-boarding-and-debrief
|
||||
|
||||
## 작업 목표
|
||||
|
||||
1. 탑승(미션 설정) 화면/모달에서 사용자가 **Enter**를 누르면 “도킹 완료(출항)”과 동일하게 다음 흐름으로 진행되게 한다.
|
||||
2. 도착/회고(항해일지 작성) 화면/모달에서도 **Enter**를 누르면 “저장”과 동일하게 제출되어 다음 흐름으로 진행되게 한다.
|
||||
3. 멀티라인 입력(textarea)이 있다면 Enter 제출로 인해 입력이 불편해지지 않게 예외 처리를 한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- 탑승(미션 설정) UI: 페이지(`/boarding`) 및/또는 로비에서 띄우는 탑승 모달(현재 구현 기준)
|
||||
- 회고(항해일지) UI: 페이지(`/debrief`) 및/또는 flight 종료 시 띄우는 회고 모달(현재 구현 기준)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
### A) 탑승(미션 설정) — Enter 제출(필수)
|
||||
|
||||
- 미션 입력 UI를 `<form>`으로 감싼다.
|
||||
- “도킹 완료(출항)” 버튼은 `type="submit"`으로 처리한다.
|
||||
- Enter 키 입력 시 `onSubmit`이 실행되어 기존 출항 로직이 동일하게 호출되도록 한다.
|
||||
- 유효성(미션 필수)은 기존과 동일하게 유지한다.
|
||||
- 제출 성공 시 기존과 동일한 다음 화면(보통 flight)으로 이동한다.
|
||||
|
||||
### B) 회고(항해일지) — Enter 제출(필수)
|
||||
|
||||
- 회고 입력 UI를 `<form>`으로 감싼다.
|
||||
- “저장” 버튼은 `type="submit"`으로 처리한다.
|
||||
- Enter 키 입력 시 `onSubmit`이 실행되어 기존 저장 로직이 동일하게 호출되도록 한다.
|
||||
- 제출 성공 후 흐름은 기존과 동일하게 유지한다(로그 상세/목록/로비 등 현재 구현 따름).
|
||||
|
||||
### C) textarea/멀티라인 입력 예외(중요)
|
||||
|
||||
- 회고 질문이나 입력칸이 textarea(멀티라인)라면:
|
||||
- 기본 Enter는 줄바꿈이 되어야 한다(제출로 가로채지 않음).
|
||||
- 대신 **Cmd/Ctrl + Enter**로 제출되게 하거나,
|
||||
- textarea는 Enter 줄바꿈 유지 + 제출은 버튼/단축키로만(둘 중 하나 선택)
|
||||
- 단, 현재 입력이 전부 단일라인 input이면 Enter=submit로 단순 처리한다.
|
||||
|
||||
### D) 모달 환경(필수)
|
||||
|
||||
- 모달(탑승/회고)에서 Enter 제출이 동작하되,
|
||||
포커스 트랩/닫기 정책과 충돌하지 않게 한다.
|
||||
- 제출 중 중복 submit 방지(버튼 disabled 또는 guard) 적용(권장).
|
||||
|
||||
### E) 접근성(권장)
|
||||
|
||||
- form submit 시 에러가 있으면 입력 필드에 포커스 이동 또는 에러 메시지 노출(현재 방식 유지)
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 문구/UX 대개편 금지
|
||||
- 데이터 스키마 변경 금지
|
||||
- 다른 페이지 UI 변경 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- 탑승 UI 위치:
|
||||
- `@src/app/boarding/page.tsx` 또는 `widgets/boarding-screen/**` 또는 로비 탑승 모달 컴포넌트
|
||||
- 회고 UI 위치:
|
||||
- `@src/app/debrief/page.tsx` 또는 `widgets/debrief-screen/**` 또는 flight 회고 모달 컴포넌트
|
||||
- flight 모달 트리거가 있는 경우:
|
||||
- `@src/app/flight/page.tsx` (필요 시 submit 핸들러 연결만)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 탑승 화면/모달에서 Enter를 누르면 “도킹 완료(출항)”과 동일하게 진행된다
|
||||
- [ ] 회고 화면/모달에서 Enter를 누르면 “저장”과 동일하게 진행된다
|
||||
- [ ] textarea가 있으면 Enter 줄바꿈이 보장되며(또는 Ctrl/Cmd+Enter 제출), 입력 경험이 깨지지 않는다
|
||||
- [ ] 유효성/저장/이동 로직은 기존과 동일하게 동작한다(중복 구현 없음)
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
56
.cli/tasks/0018-station-timer-countup-hhmmss.md
Normal file
56
.cli/tasks/0018-station-timer-countup-hhmmss.md
Normal file
@@ -0,0 +1,56 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: 우주정거장(무제한 체류) 타이머 count-up 복구 및 HH:MM:SS 표시
|
||||
- TASK_SLUG: station-timer-countup-hhmmss
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- 오리온/쌍둥이자리처럼 카운트다운이 있는 항로는 정상 동작한다.
|
||||
- 우주정거장처럼 0초부터 제한 없이 머무는 항로는 타이머가 `00:00`에 고정되어 증가하지 않는다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- 우주정거장 항로에서 경과 시간이 `00:00`부터 정상적으로 증가하고, 1시간 이상 체류를 위해 `HH:MM:SS` 포맷으로 표시되게 한다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 우주정거장 타이머는 카운트다운이 아닌 경과 시간(count-up) 기준으로 동작한다.
|
||||
- 표시 포맷은 항상 `HH:MM:SS`(예: `00:00:05`, `01:02:03`)로 통일한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- 우주정거장 항로의 타이머 계산 로직
|
||||
- 우주정거장 항로의 타이머 렌더링 포맷
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 우주정거장(무제한 체류) 모드에서 타이머가 `00:00`에 멈추지 않고 1초 단위로 증가해야 한다.
|
||||
2. 타이머 표시는 분까지만이 아니라 초까지 포함한 `HH:MM:SS` 형식을 사용해야 한다.
|
||||
3. 1시간 미만일 때도 자리수를 유지해 `00:MM:SS` 형식으로 표시해야 한다.
|
||||
4. 기존 카운트다운 항로(30분/60분)의 진행 로직은 회귀 없이 유지해야 한다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 항로별 제한 시간 정책 변경 금지
|
||||
- 타이머 외 UI/문구/레이아웃 변경 금지
|
||||
- 로그 저장 스키마/세션 모델 확장 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `src/app/flight/page.tsx`
|
||||
- `src/features/flight-session/**` (타이머 계산 훅/모델)
|
||||
- `src/shared/lib/**` (시간 포맷 유틸, 필요 시)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 우주정거장 항로 진입 시 타이머가 `00:00:00`에서 시작해 지속 증가한다
|
||||
- [ ] 우주정거장 타이머가 `HH:MM:SS` 형식으로 렌더링된다
|
||||
- [ ] 1시간 이상 체류 시 `01:00:00` 이상으로 정상 표기된다
|
||||
- [ ] 오리온/쌍둥이자리 카운트다운 동작은 기존과 동일하게 유지된다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
55
.cli/tasks/0019-countdown-routes-timer-hhmmss-display.md
Normal file
55
.cli/tasks/0019-countdown-routes-timer-hhmmss-display.md
Normal file
@@ -0,0 +1,55 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: 오리온/쌍둥이자리 카운트다운 타이머를 HH:MM:SS로 표시
|
||||
- TASK_SLUG: countdown-routes-timer-hhmmss-display
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- 오리온, 쌍둥이자리 항로의 타이머 표시는 현재 시:분:초 형태가 아니다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- 오리온/쌍둥이자리 타이머 표시를 `HH:MM:SS` 형식(예: `00:30:00`, `01:00:00`)으로 통일한다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 이번 작업은 표시 포맷만 변경하며, 카운트다운 동작/제한 시간(30분, 60분)은 유지한다.
|
||||
- 우주정거장(무제한 체류) 타이머 정책 변경은 이번 범위에 포함하지 않는다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- 오리온/쌍둥이자리 항로의 타이머 렌더링 포맷 로직
|
||||
- 시간 문자열 포맷 유틸(필요 시)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 오리온(30분) 타이머 초기값이 `00:30:00` 형태로 표시되어야 한다.
|
||||
2. 쌍둥이자리(60분) 타이머 초기값이 `01:00:00` 형태로 표시되어야 한다.
|
||||
3. 카운트다운 진행 중에도 항상 `HH:MM:SS` 자리수를 유지해야 한다.
|
||||
4. 타이머의 감소 속도/종료 조건 등 기존 카운트다운 로직은 변경하지 않는다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 우주정거장 타이머 로직/표시 변경 금지
|
||||
- 항로별 제한 시간 정책 변경 금지
|
||||
- 타이머 외 UI/문구/레이아웃 변경 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `src/app/flight/page.tsx`
|
||||
- `src/features/flight-session/**` (카운트다운 표시 계산 위치)
|
||||
- `src/shared/lib/**` (시간 포맷 유틸, 필요 시)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 오리온 타이머가 `HH:MM:SS` 형식으로 표시된다
|
||||
- [ ] 쌍둥이자리 타이머가 `HH:MM:SS` 형식으로 표시된다
|
||||
- [ ] 카운트다운 동작(감소/종료)은 기존과 동일하게 유지된다
|
||||
- [ ] 우주정거장 동작에는 영향이 없다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
56
.cli/tasks/0020-flight-mission-view-ux-polish.md
Normal file
56
.cli/tasks/0020-flight-mission-view-ux-polish.md
Normal file
@@ -0,0 +1,56 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 화면 "이번 항해 목표" 뷰 UI/UX 개선
|
||||
- TASK_SLUG: flight-mission-view-ux-polish
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- Flight 화면에서 목표 문구가 단순 인용문 형태로 노출되어 정보 위계가 약하고, 가독성과 완성도가 떨어진다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- Flight HUD 내 목표 영역을 카드형 정보 블록으로 개선해, 목표 인지성/가독성/시각적 완성도를 높인다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 이번 작업은 목표 뷰의 UI/UX 개선에 한정하며, 타이머/일시정지/종료 같은 항해 동작 로직은 변경하지 않는다.
|
||||
- 기존 비주얼 톤(우주 배경, 다크 기반)은 유지한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- 목표 표시 UI 컴포넌트: `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- 필요 시 공용 스타일 유틸/프리미티브: `src/shared/ui/**` (최소 변경)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 목표 문구 영역을 단순 인용문에서 카드형 블록으로 변경한다.
|
||||
2. 카드 내부에 라벨(예: `이번 항해 목표`)과 본문 텍스트를 분리해 정보 위계를 명확히 한다.
|
||||
3. 긴 목표 문구가 레이아웃을 깨지 않도록 줄바꿈/최대 높이/말줄임 처리 중 하나를 적용해 모바일/데스크톱 모두 안정적으로 보이게 한다.
|
||||
4. 텍스트 대비(contrast)와 간격(spacing)을 개선해 현재보다 읽기 쉬운 상태를 만든다.
|
||||
5. 기존 상단 상태 배지, 중앙 타이머, 하단 버튼 동작은 그대로 유지한다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 타이머 계산/표시 포맷 로직 변경 금지
|
||||
- 항해 제어 버튼(일시정지/종료) 기능 변경 금지
|
||||
- 배경 이펙트/스타필드 로직 변경 금지
|
||||
- 신규 라우트/상태 모델 추가 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- `src/shared/ui/**` (필요한 경우에만)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] Flight 화면 목표 영역이 카드형 UI로 변경되어 라벨과 본문이 분리되어 보인다
|
||||
- [ ] 긴 목표 문구 입력 시에도 레이아웃 깨짐 없이 반응형으로 표시된다
|
||||
- [ ] 목표 텍스트 가독성(대비/행간/여백)이 기존 대비 개선된다
|
||||
- [ ] 타이머/버튼 기능과 항해 흐름은 기존과 동일하게 동작한다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
@@ -0,0 +1,61 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 종료 후 회고를 모달로 전환하고 회고 폼 항목/아이콘 정리
|
||||
- TASK_SLUG: flight-finish-debrief-modal-and-copy-cleanup
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- Flight 화면에서 `항해 종료` 클릭 시 별도 `/debrief` 페이지로 이동한다.
|
||||
- 회고 폼에 `다음 항해의 첫 행동 (Next)` 항목이 포함되어 있다.
|
||||
- 회고 상태 옵션 라벨에 이모지(✅, 🌓, 🧭)가 사용되어 톤 일관성이 떨어진다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- Flight 내에서 회고 작성이 모달로 완료되도록 전환하고, 회고 폼을 간결하게 정리한다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 모달 회고 저장 완료 후 최종 이동 경로는 기존과 동일하게 `/log`를 유지한다.
|
||||
- 기존 `/debrief` 라우트는 즉시 삭제하지 않고 호환 경로로 남긴다(리다이렉트 또는 동일 폼 재사용).
|
||||
- 이모지 제거는 텍스트 라벨 정리 또는 아이콘 컴포넌트 대체 중 하나로 처리한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- flight 종료 액션 트리거/상태 연결: `src/features/flight-session/model/useFlightSession.ts`
|
||||
- flight HUD(모달 오픈/렌더): `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- 회고 폼(UI/필드/옵션 라벨): `src/app/debrief/page.tsx` (필요 시 공용 컴포넌트로 분리)
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. Flight 화면에서 `항해 종료` 클릭 시 페이지 전환 대신 회고 모달이 열려야 한다.
|
||||
2. 회고 모달에서 저장/취소 흐름이 정상 동작해야 하며, 저장 시 기존과 동일하게 항해일지 저장 후 `/log`로 이동해야 한다.
|
||||
3. 회고 폼에서 `다음 항해의 첫 행동 (Next)` 입력 항목을 제거한다.
|
||||
4. 회고 상태 옵션의 이모지(✅, 🌓, 🧭, 🚨 등)를 제거하고, 문구 중심 또는 아이콘 컴포넌트 방식으로 일관되게 정리한다.
|
||||
5. 기존 데이터 구조와의 호환을 깨지 않도록 저장 로직을 유지한다(불필요 필드만 제거/미기록 처리).
|
||||
|
||||
## Non-scope
|
||||
|
||||
- Flight 타이머/배경/조작 버튼(일시정지 등) 동작 변경 금지
|
||||
- 로그 목록/상세 페이지의 레이아웃 개편 금지
|
||||
- 항해 시작(boarding) 플로우 변경 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `src/features/flight-session/model/useFlightSession.ts`
|
||||
- `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- `src/app/debrief/page.tsx`
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] Flight에서 `항해 종료` 클릭 시 `/debrief` 페이지 이동 없이 회고 모달이 열린다
|
||||
- [ ] 회고 저장 시 기존과 동일하게 저장되고 `/log`로 이동한다
|
||||
- [ ] 회고 폼에서 `다음 항해의 첫 행동 (Next)` 필드가 제거된다
|
||||
- [ ] 회고 상태 옵션에서 이모지가 제거되어 톤이 정리된다
|
||||
- [ ] 기존 항해 저장/히스토리 읽기 흐름에 회귀가 없다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
53
.cli/tasks/0022-flight-finish-hold-2s-ring-and-modal.md
Normal file
53
.cli/tasks/0022-flight-finish-hold-2s-ring-and-modal.md
Normal file
@@ -0,0 +1,53 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: Flight 종료 버튼 2초 길게 누르기(hold-to-confirm) + 원형 진행선 + 종료 모달 오픈
|
||||
- TASK_SLUG: flight-finish-hold-2s-ring-and-modal
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- 현재는 종료 버튼 클릭 직후 종료 플로우가 진행되어 오작동(실수 클릭) 여지가 있다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- 종료 버튼을 2초간 길게 눌렀을 때만 종료 모달이 열리도록 변경하고, 누르는 동안 버튼 테두리 진행선을 시각적으로 제공한다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 종료 모달이 열리기 전까지는 항해 상태 저장/라우팅 같은 실제 종료 처리는 발생하지 않는다.
|
||||
- 길게 누르기 완료 후에는 기존 종료 모달/종료 확정 흐름을 그대로 재사용한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- flight HUD 종료 버튼 UI/interaction: `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- flight 종료 트리거 상태/핸들러: `src/features/flight-session/model/useFlightSession.ts`
|
||||
- 종료 모달 렌더/연결 위치(필요 시): `src/app/flight/page.tsx`
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 종료 버튼은 단순 클릭으로는 종료되지 않고, 최소 2초 이상 길게 누른 경우에만 종료 모달이 열린다.
|
||||
2. 길게 누르는 동안 버튼 테두리를 따라 0%→100%로 진행되는 원형(또는 버튼 외곽형) 진행선이 표시된다.
|
||||
3. 2초 이전에 누름을 해제하면 진행선은 즉시 취소되고 초기 상태로 복귀한다.
|
||||
4. 진행선이 100%에 도달하는 시점(2초 경과)에 종료 모달이 자동 오픈된다.
|
||||
5. 모달 오픈 후 실제 종료 확정/취소 동작은 기존 정책과 동일하게 유지된다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 타이머 계산/표시 로직 변경 금지
|
||||
- 일시정지 버튼 동작 변경 금지
|
||||
- 배경/스타필드/다른 페이지 UI 개편 금지
|
||||
- 신규 라우트 추가 금지
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 종료 버튼 단순 클릭(짧은 터치/클릭)으로는 종료 모달이 열리지 않는다
|
||||
- [ ] 2초 길게 누르면 종료 모달이 열린다
|
||||
- [ ] 누르는 동안 버튼 테두리 진행선이 시간 경과에 맞춰 표시된다
|
||||
- [ ] 2초 이전 해제 시 진행선이 초기화되고 아무 종료 동작도 발생하지 않는다
|
||||
- [ ] 모달 이후 확정/취소 흐름은 기존과 동일하게 동작한다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
@@ -0,0 +1,56 @@
|
||||
# .cli/current.md
|
||||
|
||||
## TASK_META (수정 금지)
|
||||
|
||||
- TASK_TITLE: 종료 버튼 길게 누르기 진행선 비주얼 어색함 개선(원형 대안 적용)
|
||||
- TASK_SLUG: finish-hold-visual-alt-for-non-circle-button
|
||||
|
||||
## 문제(관찰)
|
||||
|
||||
- 종료 버튼은 원형이 아닌데, 원형 진행선(또는 원형에 가까운 테두리 애니메이션) 표현이 버튼 형태와 맞지 않아 어색하다.
|
||||
|
||||
## 작업 목표
|
||||
|
||||
- 버튼 형태와 일치하는 진행 피드백으로 교체해, 길게 누르기(2초) 인터랙션을 자연스럽고 명확하게 보이게 한다.
|
||||
|
||||
## 합리적 가정
|
||||
|
||||
- 이번 작업은 시각 피드백 방식 개선이 핵심이며, `2초 길게 누르면 종료 모달 오픈` 동작 규칙은 유지한다.
|
||||
- 원형 진행선 대신 버튼 내부 수평 진행(fill) 또는 버튼 외곽 라운드 사각 진행선 중 하나를 채택한다.
|
||||
|
||||
## 적용 범위
|
||||
|
||||
- 종료 버튼 UI/hold 시각 피드백: `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- hold 진행 상태 계산/노출(필요 시): `src/features/flight-session/model/useFlightSession.ts`
|
||||
|
||||
## 작업 요구사항
|
||||
|
||||
1. 원형 진행선 기반 표현을 제거하고, 버튼 형태와 일치하는 진행 피드백으로 교체한다.
|
||||
2. 진행 피드백은 0%~100%가 2초 동안 선형으로 증가하며, 사용자가 즉시 인지 가능해야 한다.
|
||||
3. 눌렀다 떼면 진행률은 즉시 0으로 리셋되어야 한다.
|
||||
4. 100% 도달 시 기존과 동일하게 종료 모달이 열린다.
|
||||
5. 모바일/데스크톱 모두에서 텍스트 가독성과 버튼 상태(기본/누름/완료 직전)가 명확해야 한다.
|
||||
|
||||
## Non-scope
|
||||
|
||||
- 종료 모달 내부 UI/카피 개편 금지
|
||||
- 타이머/일시정지/배경 이펙트 변경 금지
|
||||
- 항해 저장/라우팅 정책 변경 금지
|
||||
|
||||
## 적용 파일(예상)
|
||||
|
||||
- `src/widgets/flight-hud/ui/FlightHudWidget.tsx`
|
||||
- `src/features/flight-session/model/useFlightSession.ts` (필요 시)
|
||||
|
||||
## 완료 조건(AC)
|
||||
|
||||
- [ ] 종료 버튼에서 원형 진행선이 제거되고 버튼 형태와 일치한 진행 피드백이 적용된다
|
||||
- [ ] 2초 길게 누르는 동안 진행 상태가 자연스럽게 증가해 보인다
|
||||
- [ ] 2초 이전 해제 시 진행 상태가 즉시 초기화된다
|
||||
- [ ] 2초 완료 시 종료 모달이 기존 규칙대로 열린다
|
||||
- [ ] 기존 종료 플로우(모달 이후 동작)에 회귀가 없다
|
||||
|
||||
## 완료 후 출력(최소)
|
||||
|
||||
- 수정/생성/삭제된 파일 경로 목록
|
||||
- AC 체크 결과(OK/NO)
|
||||
Reference in New Issue
Block a user