Files

corpi 7867bd39ca style(space): stage 배경 overscan과 문서 상태 갱신

맥락:
- space stage 배경 pan 애니메이션 중 가장자리 빈틈이 보일 수 있었다.
- 관련 코드와 세션 문서 상태를 함께 맞춰둘 필요가 있었다.

변경사항:
- SpaceWorkspaceWidget 의 stage background layer 를 로 확장했다.
- 90_current_state, session_brief 에 overscan 보정과 관련 리스크를 반영했다.
- work.md 를 다음 브라우저 QA 작업 기준으로 갱신했다.

검증:
- npx tsc --noEmit

세션-상태: stage 배경 overscan 보정과 문서 정리를 마쳤다.
세션-다음: forest/green-forest manifest 변형을 실제 브라우저에서 QA 한다.
세션-리스크: overscan 으로 좁은 화면에서 배경 crop 체감이 조금 더 커질 수 있다.

2026-03-11 13:46:59 +09:00

19 KiB

Raw Blame History

90. Current State

Last Updated: 2026-03-11

DONE

/space stage 배경 overscan 보정:
- pan 애니메이션 중 가장자리 빈틈이 드러나지 않도록 stage background layer를 -inset-8로 확장
/space 배경 asset 해석 안정화:
- media manifest scene key를 scene alias까지 정규화해 green-forest와 forest를 동일 asset으로 해석
- scene/sound asset에 source(fallback|remote) 메타를 추가해 실제 fallback 사용 여부를 구분 가능하게 정리
- remote manifest load 실패 시 error 상태를 노출하고, /space에서 manifest 실패/scene fallback 사용을 진단 로그로 남기도록 보강
Focus 피드백 채널 단일화:
- HUD 내부 status line을 제거하고 상단 중앙 고정 토스트로 통합
- Notes 저장/Undo, Goal 전환, 잠금 안내 피드백이 동일 위치에서 노출
Free 코어 루프 개방:
- Quick Controls Time의 90/20 잠금을 제거
- 기본 Sound 잠금 제거로 Free에서도 기본 3~6 프리셋 선택 가능
Pro 가치 재배치:
- Pro 잠금 대상을 Scene Packs / Sound Packs / Profiles로 재정의
- 기본 Scene/Time/Sound는 잠금 없이 선택 중심으로 정리
Control Center UI 재구성:
- Scene/Time/Sound 중심 구조 유지
- 추천 조합을 정보 1줄로 축소(비인터랙션)
- 하단에 Packs/Profiles 요약 카드(작은 🔒 배지) 추가
Paywall 의도 기반 트리거 적용:
- 잠금 카드 클릭 시에만 Paywall Sheet 오픈
- Plan Pill(NORMAL) 클릭은 즉시 결제창 대신 상태 안내만 표시
- Paywall Sheet를 3개 가치 포인트 + 2개 CTA로 간결화
Focus-First 전환:
- Quick Controls의 기본/몰입 토글 제거
- HUD를 외부 모드 상태 없이 기본 몰입 톤으로 고정
- 컨트롤 노출은 패널 열림 상태에서만 보이도록 단순화
표시 정책 옵션 추가:
- Quick Controls 패널 하단에 컨트롤 자동 숨김 옵션 추가
- 옵션 ON 상태에서 Control Center 8초 무입력 시 자동 닫힘 처리
Quick Controls 모드 전환 UI 재정렬:
- 헤더에서 모드 토글 UI를 제거하고 Plan + 닫기만 유지
- 패널 바디 첫 섹션에 기본/몰입 segmented pill 배치
- 모드 설명 1줄(기본: 모든 컨트롤 표시, 몰입: 필수만 남기고 숨김) 추가
- 모드 상태를 workspace -> tools-dock -> focus-hud 경로로 연결해 HUD 톤 반영 유지
/space Scene 기반 자동 추천 적용:
- RoomTheme에 recommendedSoundPresetId, recommendedTimerPresetId 필드 추가
- 첫 진입/시작 시 Scene 추천 타이머/사운드가 자동 반영되도록 초기화 로직 정리
- Scene 변경 시 override.sound/timer가 false인 항목만 자동 동기화
/space 사용자 override 존중 규칙 도입:
- override.sound, override.timer UI 상태 추가
- 사용자가 직접 고른 항목은 이후 Scene 변경에도 자동 덮어쓰기되지 않도록 반영
- 추천으로 되돌리기(더미) 액션으로 override 초기화 + 추천값 즉시 복원 지원
Control Center를 Scene/Time 중심으로 단순화:
- Sound/Preset Packs 섹션 제거
- 비인터랙션 추천 정보 1줄(추천: 사운드 · 타이머) 추가
- 하단 tertiary 액션 추천으로 되돌리기 추가
우하단 Sound Quick 경로를 override 적용의 명시적 경로로 분리:
- onQuickSoundSelect 콜백으로 연결해 override.sound 규칙을 코드 레벨에서 고정
세션 상태 더미 저장/복원 추가:
- sceneId, timerPresetId, soundPresetId, goal, override(sound/timer)를 localStorage에 저장
- 복원 우선순위: 쿼리 파라미터 > 저장 상태 > Scene 추천
/space 진입 Resume CTA 추가:
- 저장된 목표가 있고 쿼리 오버라이드가 없을 때 지난 한 조각 이어서 블록 1회 노출
- 이어서 시작: 저장 목표로 즉시 Focus 진입
- 새로 시작: 목표를 비워 새 세션 입력 흐름으로 전환
세션 복구 운영 문서 추가:
- docs/06_commit_convention.md
- docs/07_session_recovery.md
워크플로우 토큰 절약 모드 추가:
- docs/context_core.md 신설
- docs/workFlow.md를 기본 3문서 + 조건부 로드로 변경
워크플로우 기본 로드를 2파일로 축소:
- docs/work.md
- docs/session_brief.md
복구 스크립트 추가:
- scripts/session/recover-context.sh
npm run session:recover 명령 추가
/app Start Ritual에서 절차감을 높이던 건너뛰기 제거
/app에서 다시 시작(30초) 제거
/space HUD에 features/restart-30s 기반 ↻ 다시 시작 + 30초 배지 추가
/space 하단 사운드 프리셋 바 제거, 오른쪽 🎧 Sound 시트로 이동
features/sound-preset + widgets/sound-sheet 추가
features/immersion-mode 추가, Quick 시트에서 몰입 모드 토글 연결
/space 상단 헤더 크롬 최소화:
- 헤더 프레임(border/강한 배경) 제거
- 패딩 축소로 배경 노출 증가
타이머 HUD 하단 위치를 safe-area 기반 최소 여백으로 조정
몰입 모드 ON 시 상단 액션을 나가기 버튼으로 전환
- 클릭 시 토스트 나가기(더미) 노출 + 몰입 모드 OFF
/space 상단 우측 나가기 액션을 롱프레스(1초)로 변경
- 0.05초에 진행률 20%까지 빠르게 상승
- 1초 유지 시 나가기(더미) 토스트 + 몰입 모드 OFF
- 몰입 OFF: 좌→우 fill(bar), 몰입 ON: 원형 ring 진행 표시
롱프레스 bar 진행 표시 버그 수정:
- 눌렀을 때 즉시 fill이 보이도록 CSS keyframes 기반으로 교체
- 완료 후 fill이 0으로 역방향 축소되는 현상 제거(짧은 유지 후 언마운트)
- fill 끝단을 직선 형태로 정리(rounded 캡 제거)
30초 복귀 액션 카피를 감성 라운지 톤으로 리브랜딩:
- 버튼 라벨: 숨 고르기 30초
- 진입 시 HUD 모드 라벨: BREATHE
- 클릭 시 저자극 안내 문구 노출(2초 이내 미니 안내 + 토스트)
/landing 이후 앱 플로우 배경 톤을 밝은 무드로 조정:
- /app 허브 배경 오버레이를 밝게 조정하고 룸 카드 어두운 마스크 강도 완화
- /space 배경 오버레이/비네팅 강도를 낮춰 배경 노출 증가
- /stats, /settings 배경/패널을 라이트 팔레트로 전환
/app 룸 카드 hydration 에러 수정:
- RoomPreviewCard의 중첩 <button> 구조 제거
- 카드 내부 칩을 비인터랙티브 span으로 변경해 HTML 규칙 위반 해소
/app 허브 배경/카드 가시성 안정화 패치:
- 허브 배경에 blur + 밝기 보정 + 저채도 필터를 적용해 배경 복잡도 완화
- 허브 전역 오버레이를 밝은 워시 중심으로 조정하고 그레인 강도 축소
- RoomPreviewCard 내부 콘텐츠 영역에 반투명 패널을 추가해 배경 변동과 텍스트 대비를 분리
- GlassCard 표면을 조금 더 밝고 가벼운 글래스 톤으로 보정
커스텀 입장 모달 톤/레이아웃 안정화:
- 모달 표면/오버레이를 허브 밝은 톤과 유사한 저대비 글래스로 전환
- 공간/사운드/타이머 탭 콘텐츠 영역을 고정 높이로 통일해 전환 시 모달 크기 흔들림 제거
- 탭/옵션 버튼과 입력 필드를 밝은 팔레트로 정리해 가독성 개선
/app 핵심 카드(시작/공간) 라이트 카드 전환:
- 지금, 몰입을 시작해요 / 오늘의 공간 컨테이너를 흰 표면 + 어두운 텍스트 톤으로 조정
- 입력/칩/보조 버튼 색상도 라이트 카드 기준으로 재정렬
- 허브 배경은 가상 공간 이미지를 더 강한 blur로 노출해 카드 외곽 배경으로 유지
/app 오늘의 공간 카드/배경을 룸별 단색 팔레트로 전환:
- entities/room에 룸별 hubColor를 추가하고 색이 서로 겹치지 않도록 분리
- 오늘의 공간 카드는 이미지 대신 룸 고유 단색 배경으로 렌더링
- 허브 페이지 배경도 선택된 룸의 동일 색으로 전환되도록 연결
/app 오늘의 공간 카드에 실제 사진(외부 URL) 적용:
- entities/room에 cardPhotoUrl, googleImageSearchUrl, managedCardPhotoUrl 필드 추가
- 카드 배경은 실제 사진을 사용하고, Google 이미지 검색 링크를 룸별로 보관
- 추후 managedCardPhotoUrl만 채우면 자가 관리 이미지로 전환되도록 fallback helper 추가
/app 배경을 카드 사진 기반 블러로 전환:
- 허브 배경이 선택된 카드의 실제 사진을 블러 처리해 표시되도록 변경
- 앱 첫 진입 시 ROOM_THEMES[0]를 초기 선택으로 명시해 배경/선택 테두리 기준을 고정
/app 헤더/프로필/공간 카드 디테일 조정:
- AppTopBar 배경 제거 및 로고 왼쪽 원형 V 배지 제거
- 프로필 트리거의 이름 왼쪽에 멤버십 등급(PRO/NORMAL/TEAM) 배지 노출
- 공간 카드 높이를 고정해 카드 사진 사이즈를 통일
- 배경 사진 전환 시 resize처럼 보이던 transition-all 제거
/app 헤더/프로필 시각 위계 재정렬:
- 헤더 배경/보더/텍스트를 Start Ritual 카드와 동일한 라이트 톤(bg-white/78, text-brand-dark)으로 통일
- 멤버십 등급 뱃지를 프로필 드롭다운 트리거 외부로 분리해, 프로필 왼쪽 독립 뷰로 배치
- 프로필 드롭다운 트리거는 아바타+이름만 유지하도록 단순화
/app 멤버십 등급 배지의 프리미엄 톤 강화:
- 배지 타이포를 text-xs 이상으로 상향하고 칩 높이/패딩을 키워 가독성과 존재감을 개선
- PRO MEMBER 라벨과 저채도 그라데이션/내부 하이라이트/부드러운 그림자로 유료 멤버 위계를 강화
- NORMAL/TEAM도 등급별 표면 톤과 마커를 분리해 동일 구조 안에서 차분한 구분을 제공
/app 멤버십 배지 고급화 2차 적용:
- 등급 칩 높이를 h-9, 최소폭을 부여해 헤더 내에서 배지가 독립된 프리미엄 토큰처럼 보이도록 정렬
- PRO는 모바일 축약 라벨, 데스크톱 PRO MEMBER 라벨을 분리해 밀집을 완화
- 헤더 우측 그룹 간격을 gap-3으로 조정해 배지와 프로필 트리거의 시각 충돌을 완화
몰입 모드 ON 시 /space 크롬 정리:
- 상단 Current Room 블록 숨김
- 우상단 허브 버튼 소형 아이콘화
- 오른쪽 아이콘 레일 기본 미니화(hover/click 시 확장)
- HUD 대비/불투명도 완화
- 비네팅/그레인 강화
/app 룸 카드의 인원수 기반 정보 제거
entities/room에 분위기/추천 필드 추가:
- recommendedSound
- recommendedTime
- vibeLabel
룸 카드 정보 표현을 큐레이션 중심으로 전환

/space에서 forest / green-forest manifest 변형을 실제 브라우저 기준으로 QA
Goal Complete Sheet 플로우(완료 → 다음 한 조각) 전환 감도/카피 마감
Stage 가독성/모션/레이어 폴리시 최종 통일

RISKS

stage background overscan으로 좁은 화면에서 배경 crop이 조금 더 강하게 느껴질 수 있어 실기기 확인이 필요하다
remote manifest 실패 시 원인 진단은 가능해졌지만, 사용자용 복구 액션 UI는 아직 없다
alias 목록에 없는 legacy scene id가 추가되면 같은 fallback 문제가 재발할 수 있다
npm run build는 네트워크 제한 시 Google Font fetch 실패 가능
localStorage 포맷 변경 시 이전 세션 저장값과의 호환성 이슈 가능
Scene 추천값과 실제 사용자 선호가 어긋나면 자동 적용 체감 품질이 낮아질 수 있음
터치 기기에서 레일 미니 상태가 발견성 낮을 수 있어 추가 힌트가 필요할 수 있음
일부 시트(예: Room)는 아직 인원수 중심 문구가 남아 있어 톤 불일치 가능성 존재
safe-area 값이 작은 기기에서는 HUD가 너무 낮게 느껴질 수 있어 세부 조정 여지 존재
롱프레스 인터랙션은 첫 사용자에게 즉시 인지되지 않을 수 있어 시각적 힌트 필요 가능성 있음
bar/ring 진행 표시는 서로 다른 구현(JS/CSS)이라 동기화 규칙 변경 시 회귀 점검이 필요
안내 카피가 HUD 목표 문구와 교체 표시되므로 정보 밀도 균형 점검 필요
밝아진 배경 구간에서 일부 white 텍스트의 대비가 환경(디스플레이 밝기)에 따라 약해질 수 있음
배경 필터/블러 적용으로 저사양 환경에서 스크롤 시 미세한 페인팅 비용 증가 가능성 존재
모달 본문 고정 높이 적용으로 작은 화면에서 내부 스크롤 의존도가 이전보다 높아질 수 있음
룸 프리뷰 카드 내부는 이미지 기반 다크 텍스트 체계라 컨테이너와 톤 차이가 남아 추가 톤 정리가 필요할 수 있음
단색 팔레트가 일부 기기 색감에서 유사하게 보일 수 있어 실제 디스플레이 기준 재점검 필요
외부 이미지 URL(임시) 의존이라 소스 만료/속도 이슈 가능성이 있어 자가 호스팅 전환 필요
전체 배경 블러 강도 증가로 저사양 환경에서 GPU 부담이 늘 수 있어 실기기 체감 점검 필요
밝은 배경 사진과 라이트 헤더 조합에서 상단 경계 인지가 약해질 수 있어 대비 점검 필요
등급 칩 최소폭 증가로 초소형 화면에서 헤더 가로 여유가 줄어들 수 있어 간격 점검 필요
Plan Pill에서 바로 결제창이 열리지 않도록 바뀌어, 일부 사용자는 업그레이드 진입 경로를 늦게 인지할 수 있음
Packs 카드가 더미 상태이므로 Pro 가치 설명 카피가 약하면 클릭 동기가 낮아질 수 있음

CHANGED FILES

(이번 세션)
- src/entities/media/model/types.ts
- src/entities/media/model/resolveMediaAsset.ts
- src/entities/media/model/useMediaCatalog.ts
- src/widgets/space-workspace/ui/SpaceWorkspaceWidget.tsx
- docs/work.md
- docs/90_current_state.md
- docs/session_brief.md
(최근 workflow 반영)
- src/widgets/space-workspace/ui/FocusTopToast.tsx
- src/widgets/space-workspace/ui/SpaceWorkspaceWidget.tsx
- src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx
- src/widgets/space-timer-hud/ui/SpaceTimerHudWidget.tsx
- src/entities/plan/model/mockPlan.ts
- src/entities/plan/model/types.ts
- src/widgets/control-center-sheet/ui/ControlCenterSheetWidget.tsx
- src/widgets/space-tools-dock/ui/SpaceToolsDockWidget.tsx
- src/features/paywall-sheet/ui/PaywallSheetContent.tsx
src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx
src/widgets/space-tools-dock/ui/SpaceToolsDockWidget.tsx
src/widgets/space-workspace/ui/SpaceWorkspaceWidget.tsx
src/widgets/control-center-sheet/ui/ControlCenterSheetWidget.tsx
src/entities/room/model/types.ts
src/entities/room/model/rooms.ts
src/widgets/space-tools-dock/model/applyQuickPack.ts (삭제)
docs/06_commit_convention.md
docs/07_session_recovery.md
docs/context_core.md
docs/session_brief.md
docs/workFlow.md
docs/README.md
.gitmessage-session.txt
scripts/session/recover-context.sh
package.json
src/widgets/start-ritual-widget/ui/StartRitualWidget.tsx
src/widgets/app-hub/ui/AppHubWidget.tsx
src/entities/room/model/types.ts
src/entities/room/model/rooms.ts
src/features/room-select/ui/RoomPreviewCard.tsx
src/widgets/app-hub/ui/AppHubWidget.tsx
src/widgets/app-top-bar/ui/AppTopBar.tsx
src/entities/user/model/types.ts
src/entities/user/model/mockUser.ts
src/entities/user/ui/MembershipTierBadge.tsx
src/features/profile-menu/ui/ProfileMenu.tsx
src/features/restart-30s/index.ts
src/features/restart-30s/model/useRestart30s.ts
src/features/restart-30s/ui/Restart30sAction.tsx
src/features/immersion-mode/index.ts
src/features/immersion-mode/model/useImmersionMode.ts
src/features/immersion-mode/ui/ImmersionModeToggle.tsx
src/features/sound-preset/index.ts
src/features/sound-preset/model/useSoundPresetSelection.ts
src/features/sound-preset/ui/SoundPresetControls.tsx
src/shared/ui/Toggle.tsx
src/widgets/sound-sheet/index.ts
src/widgets/sound-sheet/ui/SoundSheetWidget.tsx
src/widgets/space-chrome/index.ts
src/widgets/space-chrome/ui/SpaceChromeWidget.tsx
src/widgets/quick-sheet/ui/QuickSheetWidget.tsx
src/widgets/space-shell/ui/SpaceSkeletonWidget.tsx
src/widgets/space-tools-dock/model/useSpaceToolsDock.ts
src/widgets/space-tools-dock/ui/SpaceToolsDockWidget.tsx
src/widgets/space-timer-hud/ui/SpaceTimerHudWidget.tsx
src/widgets/space-chrome/ui/SpaceChromeWidget.tsx
src/features/immersion-mode/model/useImmersionMode.ts
src/features/exit-hold/index.ts
src/features/exit-hold/model/useHoldToConfirm.ts
src/features/exit-hold/ui/ExitHoldButton.tsx
src/app/globals.css
src/features/restart-30s/model/copy.ts
src/features/restart-30s/model/useRestart30s.ts
src/features/restart-30s/ui/Restart30sAction.tsx
src/features/restart-30s/index.ts
src/widgets/space-timer-hud/ui/SpaceTimerHudWidget.tsx
src/widgets/app-hub/ui/AppHubWidget.tsx
src/features/room-select/ui/RoomPreviewCard.tsx
src/app/(app)/space/page.tsx
src/widgets/space-shell/ui/SpaceSkeletonWidget.tsx
src/widgets/stats-overview/ui/StatsOverviewWidget.tsx
src/widgets/settings-panel/ui/SettingsPanelWidget.tsx
src/shared/ui/GlassCard.tsx
src/widgets/app-hub/ui/AppHubWidget.tsx
src/features/room-select/ui/RoomPreviewCard.tsx
src/shared/ui/Modal.tsx
src/shared/ui/Tabs.tsx
src/features/custom-entry-modal/ui/CustomEntryModal.tsx
src/widgets/start-ritual-widget/ui/StartRitualWidget.tsx
src/widgets/rooms-gallery-widget/ui/RoomsGalleryWidget.tsx
src/widgets/app-hub/ui/AppHubWidget.tsx
src/entities/room/model/types.ts
src/entities/room/model/rooms.ts
src/features/room-select/ui/RoomPreviewCard.tsx

QUICK VERIFY

/app: 건너뛰기/다시 시작 노출 없음
/app: 룸 카드에 사람 수 문구 없음, 추천 정보 노출
/space: 하단 사운드 바 없음, 오른쪽 🎧 Sound 시트에서 프리셋 선택 가능
/space: 몰입 모드 ON 시 상단 룸 블록 숨김 + 레일 미니화 + HUD 저대비 적용
/app: 콘솔에 button cannot be a descendant of button hydration 에러가 재발하지 않음
/app: 숲/벽난로처럼 텍스처가 많은 룸 선택 시에도 카드 내부 텍스트 시인성이 유지됨
커스텀 입장 모달 탭 전환(공간/사운드/타이머) 시 외곽 모달 크기가 유지됨
/app: 시작 카드/공간 카드가 흰 표면 + 어두운 텍스트로 표시되고, 카드 밖 배경은 블러된 가상 공간으로 노출됨
/app: 오늘의 공간 카드가 룸별 단색으로 표시되고, 허브 배경도 선택 카드 색으로 동기화됨
/app: 오늘의 공간 카드가 실제 사진으로 표시되고, room 데이터에 Google 검색 링크/자가 이미지 전환 필드가 포함됨
/app: 첫 진입 시 첫 카드가 선택된 상태로 보이며, 배경도 해당 카드 사진 블러로 시작됨
/app: 헤더가 시작 카드와 같은 라이트 톤으로 표시되고, 등급 배지가 프로필 왼쪽 독립 뷰로 노출됨
/app: 공간 카드가 동일 높이로 맞춰지고 카드 전환 시 배경 resize 느낌이 완화됨

19 KiB Raw Blame History

90. Current State

DONE

NEXT

RISKS

CHANGED FILES

QUICK VERIFY

19 KiB

Raw Blame History