맥락:
- 기존의 우측 상단 Exit(나가기) 버튼이 너무 동떨어져 있었음.
- 목표(Goal) 패널 하단에 Exit 버튼을 두려는 시도가 있었으나, '목표 유지'와 '목표 포기(Exit)'라는 상반된 의미가 한 공간에 묶여 인지적 충돌을 발생시킴.
- 몰입을 방해하지 않는 투명함(Invisible UI)과 본능적인 이탈 경로가 필요함.
변경사항:
- SpaceToolsDockWidget에 새로운 좌측 하단(Bottom-Left) 모서리 Exit 버튼 렌더링 영역 추가.
- 평소에는 투명한 Escape(⎋) 아이콘만 노출하여 배경 공간의 방해 최소화.
- 사용자가 마우스를 Hover할 때만 알약(Pill) 형태로 부드럽게 확장(Expansion)되며 ExitHoldButton(Bar)이 나타나는 고급 인터랙션 구현.
- FloatingGoalWidget에 테스트로 추가했던 Exit 버튼 코드 원복(제거) 및 SpaceFocusHudWidget, SpaceWorkspaceWidget의 불필요한 prop 전달 정리.
검증:
- npm run build 정상 통과.
세션-상태: 몰입 공간(/space)의 하이엔드 UI 레이아웃 재배치 및 디자인 고도화 완료.
세션-다음: 향후 필요 시 통계(Analytics) 또는 결제(Paywall) 세부 기능 구현.
세션-리스크: 없음.
맥락:
- 기존 app 대시보드와 space 화면의 UI가 SaaS 툴처럼 딱딱하고 투박하여, 유저가 기꺼이 지갑을 열 만한 몰입감과 고급스러움(Premium feel)이 부족함.
- 인지적 과부하를 줄이기 위해 제안된 '첫 5분 행동(Micro-step)'이 타이머 영역에 묻혀 있어 행동 유발 효과가 미미함.
변경사항:
- app: 컨테이너 박스를 제거하고 전체 배경 화면(Immersive Background)과 Glassmorphism을 활용한 1.5 Step 진입 플로우로 전면 개편.
- space/hud: 하단의 두꺼운 타이머 패널을 초박형(Slim) 글라스 알약 형태로 축소하여 배경 씬의 개방감 확보.
- space/hud: 목표(Goal)와 첫 단계(Micro-step)를 분리하여 좌측 상단의 우아한 Floating UI로 재배치하고, 체크 완료 시 사라지는 도파민 인터랙션 추가.
- space/tools: 흩어져 있던 노트, 사운드, 설정 도구들을 우측 레일(Right-Rail)로 통합하고 팝오버 디자인을 고급화함.
- ui/contrast: 밝은 배경에서도 텍스트가 잘 보이도록 좌측 상단 비네팅(Vignette) 및 다중 텍스트 그림자(Multi-layered Shadow) 효과 적용.
검증:
- npm run build 정상 통과 확인.
- 브라우저 상에서 micro-step 완료 애니메이션 및 도구막대 팝오버 슬라이드 동작 확인.
세션-상태: app 진입부터 space 몰입까지의 코어 UX/UI 하이엔드 개편 완료.
세션-다음: 프로 요금제(PRO) 전환 유도(Paywall) 흐름 및 상세 분석 리포트(Analytics) 뷰 구현.
세션-리스크: 없음.
- SpaceWorkspaceWidget 로직을 전용 훅 및 유틸리티로 분리 (900줄 -> 300줄)
- useSpaceWorkspaceSelection 훅을 기능별(영속성, 진단 등) 소형 훅으로 분리
- SpaceToolsDockWidget의 상태 및 핸들러 로직 추출
- 거대 i18n 번역 파일(ko.ts)을 도메인별 메시지 파일로 구조화
- AdminConsoleWidget 누락분 추가 및 미디어 엔티티 타입 오류 수정
맥락:
- Focus 경험을 해치지 않으려면 결제 시트는 잠금 항목을 클릭한 의도 순간에만 열려야 합니다.
변경사항:
- Plan Pill(NORMAL) 클릭 시 Paywall을 바로 열지 않고 상태 안내만 노출하도록 조정했습니다.
- 잠금 카드 클릭에서만 Paywall이 열리도록 트리거를 단일화했습니다.
- Paywall Sheet를 3개 가치 포인트 + 2개 CTA 중심의 간결한 구조로 리디자인했습니다.
검증:
- npx tsc --noEmit
세션-상태: Paywall 노출이 잠금 클릭 의도 기반으로만 동작함
세션-다음: (선택) Profiles 저장/불러오기 더미 슬롯을 Packs 영역에 추가 가능
세션-리스크: NORMAL 사용자가 Plan Pill에서 업그레이드 진입을 기대할 수 있어 UX 카피 미세 조정 여지
맥락:
- Control Center에서 Pro 기능이 설정 패널처럼 과밀하게 보이면 Focus 흐름이 끊깁니다.
변경사항:
- Quick Controls의 추천 조합 영역에서 클릭 버튼을 제거하고 정보 1줄만 남겼습니다.
- 하단에 Scene Packs/Sound Packs/Profiles 요약 카드를 추가해 확장 기능을 조용한 카드 형태로 수납했습니다.
- 기본 Scene/Time/Sound는 선택 중심으로 유지하고 Packs 잠금 클릭만 별도 동선으로 연결했습니다.
검증:
- npx tsc --noEmit
세션-상태: Control Center가 Scene/Time 중심 + 조용한 Packs 확장 구조로 정리됨
세션-다음: 잠금 카드 클릭 기반 Paywall 시트를 의도 기반 메시지로 간결화
세션-리스크: Plan Pill normal 클릭 시 paywall 오픈 동선은 다음 커밋에서 제거 예정
맥락:
- Pro 가치는 기본 기능 잠금이 아니라 확장/개인화 영역에서 명확히 보여야 합니다.
변경사항:
- plan 모델에 Pro 기능 카드를 Scene Packs/Sound Packs/Profiles로 재정의했습니다.
- Quick Controls의 기본 Scene/Time/Sound 선택에서 잠금 로직을 제거해 코어 기능을 Free로 유지했습니다.
- Pro 기능 카드를 Control Center 하단 확장 영역으로 이동하고, 잠금 클릭 시 Paywall 트리거 경로를 연결했습니다.
검증:
- npx tsc --noEmit
세션-상태: 기본 조작은 Free, Pro는 확장 카드 기반 잠금 구조로 전환됨
세션-다음: Control Center 하단 영역을 더 조용한 요약 카드 톤으로 다듬고 추천 조합 라인을 비인터랙티브로 정리
세션-리스크: Plan Pill normal 클릭 동선은 paywall 트리거 정책과 추가 정합 조정이 남아 있음
맥락:
- Focus-First 구조에서 패널을 열어둔 채 방치되면 몰입 흐름이 깨질 수 있어, 모드 토글이 아닌 표시 정책 기반 정리가 필요했습니다.
변경사항:
- Quick Controls 패널 하단에 컨트롤 자동 숨김 옵션을 추가했습니다.
- 옵션은 Focus 화면 상시 UI가 아닌 패널 내부에서만 노출되도록 제한했습니다.
- 옵션 ON 상태에서 Control Center가 열려 있고 입력이 없으면 8초 후 패널이 자동으로 닫히도록 UI 상태 로직을 추가했습니다.
- 모드 전환 토스트는 추가하지 않고 상태 변화만 반영했습니다.
검증:
- npx tsc --noEmit
세션-상태: 컨트롤 자동 숨김 정책으로 설정 후 자연스럽게 몰입 화면으로 복귀됩니다.
세션-다음: Scene 추천 매핑 품질과 override UX 체감 검증을 진행합니다.
세션-리스크: 자동 닫힘 8초 타이밍은 실사용 피드백에 따라 추가 조정이 필요할 수 있습니다.
맥락:
- 몰입모드 토글은 상태 인지 비용을 높여 집중 흐름을 끊고, Quick Controls 헤더를 대시보드형으로 보이게 만들고 있었습니다.
변경사항:
- Quick Controls에서 기본/몰입 모드 토글 UI를 완전히 제거했습니다.
- Focus 화면의 HUD 톤은 외부 모드 상태 없이 항상 몰입 톤으로 렌더링되도록 고정했습니다.
- workspace/tools-dock/focus-hud 간 모드 토글 상태 전달 경로를 정리해, 컨트롤은 패널을 열었을 때만 보이는 Focus-First 흐름으로 단순화했습니다.
검증:
- npx tsc --noEmit
세션-상태: 모드 토글 없이 패널 열림 상태만으로 컨트롤 노출이 정의됩니다.
세션-다음: (선택) 컨트롤 자동 숨김 표시 정책 옵션을 패널 내부에 추가합니다.
세션-리스크: 자동 숨김 정책이 아직 없어 패널을 열어둔 채 방치되는 경우 수동 닫기가 필요합니다.
맥락:
- Quick Controls 헤더의 모드 토글이 대시보드형 느낌을 만들어 감성 톤을 해치고 있었습니다.
변경사항:
- Control Center 헤더에서는 모드 조작 UI를 제거하고 Plan Pill + 닫기만 유지했습니다.
- 패널 바디 첫 섹션에 기본/몰입 segmented pill을 배치하고, 선택 상태에 따라 저자극 스타일을 적용했습니다.
- 모드 설명 1줄(기본: 모든 컨트롤 표시, 몰입: 필수만 남기고 숨김)을 추가했습니다.
- 모드 상태를 workspace -> tools-dock -> focus-hud 경로로 연결해 HUD 톤 반영을 유지했습니다.
검증:
- npx tsc --noEmit
세션-상태: Quick Controls 헤더가 깔끔해지고 모드 선택이 패널 바디에서 동작합니다.
세션-다음: Scene 추천 매핑 품질 점검과 override UX 검증을 진행합니다.
세션-리스크: 모드 설명 문구의 톤/길이는 실제 사용성 테스트에서 추가 미세조정이 필요할 수 있습니다.
맥락:
- 사운드 override는 우하단 Quick 변경에서 시작되는 규칙이 핵심이라, 코드 경로를 분명히 분리할 필요가 있었습니다.
변경사항:
- SpaceToolsDockWidget의 사운드 선택 콜백을 onQuickSoundSelect로 분리해 Quick 전환 경로를 명시했습니다.
- workspace에서 우하단 Quick 선택 콜백을 override.sound 활성화 핸들러에 직접 연결했습니다.
검증:
- npx tsc --noEmit
세션-상태: 우하단 Sound Quick 선택이 override.sound 규칙과 1:1로 연결됩니다.
세션-다음: (선택) Scene/Timer/Sound 및 override 상태를 로컬에 저장/복원합니다.
세션-리스크: Setup에서의 수동 사운드 선택도 override를 켜므로 UX 기대치 점검이 필요할 수 있습니다.
맥락:
- Control Center가 설정 패널처럼 무거워 보여 Focus 몰입 흐름에서 탐색 부담이 컸습니다.
변경사항:
- Control Center에서 Sound 섹션과 Preset Packs 섹션을 제거하고 Scene/Time 2개 핵심 섹션만 유지했습니다.
- 추천 정보를 비인터랙션 1줄(추천 사운드 · 추천 타이머)로 노출하도록 구성했습니다.
- 하단에 tertiary 액션 '추천으로 되돌리기'를 추가해 override 초기화 + 추천값 복원 진입점을 만들었습니다.
- 더 이상 사용하지 않는 quick pack 모델 파일을 제거했습니다.
검증:
- npx tsc --noEmit
세션-상태: Control Center가 Scene/Time 중심의 경량 구조로 정리되었습니다.
세션-다음: 우하단 Sound Quick 변경 시 override.sound가 명시적으로 적용되는 경로를 분리합니다.
세션-리스크: 추천 정보는 현재 텍스트 기반이라 향후 다국어/라벨 변경 시 매핑 점검이 필요합니다.
맥락:
- 목표 입력 후 바로 시작할 수 있도록 Scene 기반 추천값을 자동으로 채우되, 사용자가 직접 바꾼 값은 유지해야 했습니다.
변경사항:
- RoomTheme에 recommendedSoundPresetId, recommendedTimerPresetId 필드를 추가하고 각 Scene 더미 데이터에 추천 preset id를 매핑했습니다.
- /space 초기 진입 시 선택된 Scene 추천값으로 타이머/사운드 기본값이 설정되도록 초기화 로직을 정리했습니다.
- /space 상태에 override.sound/override.timer 플래그를 추가하고, Scene 변경 시 override가 false인 항목만 자동 동기화하도록 반영했습니다.
- 추천 복원 액션(추천으로 되돌림)을 위한 핸들러/props 경로를 workspace -> tools-dock -> control-center까지 연결했습니다.
검증:
- npx tsc --noEmit
세션-상태: Scene 추천 자동 적용과 override 기반 자동 동기화가 동작합니다.
세션-다음: Control Center를 Scene/Time 중심 구조로 단순화하고 추천 정보/되돌리기 UI를 적용합니다.
세션-리스크: Control Center UI가 아직 기존 구조(Sound/Pack 포함)라 다음 커밋에서 정리가 필요합니다.
맥락:
- /space 진입 경험이 설정 패널처럼 보여 몰입형 라운지 톤이 약했습니다.
- 목표 입력 후 시작 전환 동선을 더 빠르고 일관되게 만들 필요가 있었습니다.
변경사항:
- 도크 아이콘을 이모지에서 단일 라인 SVG 세트로 통일해 시각 언어 일관성을 맞췄습니다.
- Setup Drawer 밀도를 낮추고(타이포/테두리/칩 크기) 3-step 리추얼 흐름을 더 간결하게 정리했습니다.
- 목표 입력 필드 자동 포커스를 추가해 진입 즉시 타이핑이 가능하도록 했습니다.
- 시작 버튼을 form submit으로 연결해 Enter 입력과 버튼 클릭이 동일하게 동작하도록 변경했습니다.
- SpaceSideSheet에 300ms 닫힘 전환(오버레이/시트 opacity+translate) 애니메이션을 적용했습니다.
- Focus 진입 토스트 카피를 목표 중심 문구로 바꾸고 Setup 선택지를 최소 개수로 제한했습니다.
- 배경에 미세 stage-pan/light-drift 키프레임을 추가해 정적인 평면감을 줄였습니다.
검증:
- npx tsc --noEmit
- npm run build
세션-상태: /space에서 목표 입력 후 10초 내 Focus 전환 가능한 리추얼 흐름이 정리되었습니다.
세션-다음: 실제 브라우저에서 애니메이션 강도와 드로어 밀도 체감 QA를 진행합니다.
세션-리스크: 저사양 환경에서 배경 미세 모션이 과하게 느껴질 수 있어 추후 reduce-motion 강화를 검토할 수 있습니다.
맥락:
- /space 첫 화면이 그라데이션 안내 화면처럼 보이며 공간 서비스의 무대감이 약했습니다.
- Setup 안내 카드/상단 크롬/도크 존재감이 커서 몰입형 인상(Portal/LifeAt 톤)을 해치고 있었습니다.
변경사항:
- 배경을 실제 공간 프리뷰 이미지 우선 렌더로 전환하고, 실패 시 그라데이션 fallback만 남기도록 조정했습니다.
- 배경 오버레이를 과한 비네팅 대신 단일 규칙(얕은 읽기용 필터 + 고정 그레인)으로 정리했습니다.
- Setup 상태의 중앙 안내 카드를 제거하고, 진입 시 Setup Drawer 자동 오픈 흐름만 남겼습니다.
- Setup Drawer 헤더 안내 문구를 1줄로 축약하고 섹션을 3단(Space/Goal/Sound) 번호 체계로 고정했습니다.
- Setup 상태에서는 Drawer 닫기를 막아 설명 박스 없이도 자연스러운 입력 흐름을 유지했습니다.
- 상단 크롬을 최소화하고 Focus 상태의 Setup 열기 버튼을 약한 보조 액션으로 낮췄습니다.
- 오른쪽 도크 레일의 폭/간격/아이콘 박스를 정돈하고 Focus 기본 opacity를 낮춰 몰입 방해를 줄였습니다.
검증:
- npx tsc --noEmit
- npm run build
세션-상태: /space 첫 진입이 장면+드로어 중심으로 정리되어 설명 없이도 시작 흐름이 읽힙니다.
세션-다음: 필요 시 Setup Drawer 내부 타이포 스케일과 칩 밀도를 추가 미세 조정합니다.
세션-리스크: 외부 이미지 소스 품질 편차에 따라 장면 밝기 체감이 달라질 수 있습니다.
맥락:
- /app 첫 화면의 정보량이 많아 LifeAt/Portal 같은 몰입형 경험과 거리가 있었습니다.
- Start, 공간 선택, 메모 진입을 점진 노출 구조로 재정렬할 필요가 있었습니다.
변경사항:
- AppHub를 데스크톱 2열(컨트롤/씬) 구조와 모바일 스택 구조로 재편했습니다.
- Start CTA를 컴팩트 위계로 정리하고 커스텀 액션을 2순위 텍스트형으로 유지했습니다.
- Room 영역을 선택 Hero 1개 + 추천 썸네일 스트립 + 더보기 시트 구조로 전면 변경했습니다.
- 최근 생각은 단일 진입점 + 인박스 시트로 통합하고 localStorage 기반 thought inbox를 추가했습니다.
- /space 종료 동선에 세션 요약 시트(최근 메모 3개)를 연결해 허브 복귀 흐름을 정리했습니다.
- AppHub 기본 비주얼 모드를 cinematic으로 고정하고 배경 오버레이를 가독성 중심으로 재조정했습니다.
검증:
- npx tsc --noEmit
- npm run build
세션-상태: 씬 중심 허브 리빌드와 메모/시트 기반 점진 노출 구조 반영 완료
세션-다음: 실제 사용자 테스트 후 카드/텍스트 밀도 미세 조정
세션-리스크: 실디바이스 대비(특히 저사양 모바일)에서 배경/블러 렌더링 비용 확인 필요
맥락:
- /space 하단 사운드 바를 제거하고 도구를 우측 도크에 수납해 배경 몰입을 강화하며, 몰입 모드 ON 체감을 높이기 위해
변경사항:
- 하단 사운드 프리셋 바를 제거하고 도크에 🎧 Sound 패널을 추가
- features/sound-preset + widgets/sound-sheet를 추가해 프리셋 선택/믹서 UI(더미) 구성
- features/immersion-mode + shared/ui/Toggle을 추가하고 Quick 시트 토글과 연결
- 몰입 모드 ON 시 상단 Current Room 숨김, 허브 버튼 소형화, 레일 미니화, HUD 저대비, 비네팅/그레인 강화
- widgets/space-chrome를 신설해 /space 상단 크롬 렌더링을 분리
- docs/90_current_state.md, docs/session_brief.md 최신 상태로 갱신
검증:
- npx tsc --noEmit
세션-상태: /space는 사운드 시트 기반 도크 구조와 몰입 모드 UI를 제공함
세션-다음: RoomSheetWidget 인원수 기반 정보를 큐레이션 표현으로 전환
세션-리스크: 터치 환경에서 미니 레일 발견성이 낮을 수 있어 보조 힌트가 필요할 수 있음
맥락:
- 기존 라우트/컴포넌트 구조를 FSD 기준으로 정리하고, /app 허브와 /space 집중 화면 중심의 목업 흐름을 구성하기 위해
변경사항:
- App Router 구조를 /landing, /app, /space, /stats, /settings 중심으로 재배치
- entities/session/room/user 더미 데이터와 타입 정의 추가
- features(커스텀 입장, 룸 선택, 체크인, 리액션, 30초 리스타트 등) 단위로 로직 분리
- widgets(허브, 룸 갤러리, 타이머 HUD, 툴 도크 등) 조합형 UI 추가
- shared 공용 UI(Button/Chip/Modal/Toast 등) 및 유틸(cn/useReducedMotion) 정비
- 로그인 후 이동 경로를 /dashboard 에서 /app 으로 변경
- README를 현재 프로젝트 구조/라우트/구현 범위 기준으로 갱신
검증:
- npx tsc --noEmit
세션-상태: 허브·스페이스 목업이 FSD 레이어로 동작 가능하도록 정리됨
세션-다음: /space 상단 및 도크의 인원 수 카피를 분위기형 카피로 후속 정리
세션-리스크: build는 네트워크 환경에서 Google Fonts fetch 실패 가능