CrownyLife v4.0 — 사용자 친화적 UX 리디자인
날짜: 2026-05-02 ~ 05-03
개요
life.crowny.org v3.0 → v4.0 사용자 친화적 리디자인. 기술 중심 개발자 대시보드에서 따뜻하고 개인적인 라이프 플랫폼으로 변환. crowny.org 크림/초콜릿 디자인 시스템 적용, 4가지 참여 모드(알기/이용/권리/기여), 개인 탐색 여정 추적.
무엇을 했는지
1. 디자인 시스템 전환 (style.css 완전 재작성)
- 다크 테크 테마 → 크림/초콜릿 테마 (#FFF8F0 / #3D2B1F)
- crowny.org과 통일된 색상 체계 (골드 #8B6914, Ti 초록, Om 주황, Ta 청회)
- 기본 라이트 모드, 다크 모드 opt-in (
[data-theme="dark"]) - 글래스모피즘 헤더 유지, 따뜻한 색감 적용
2. 4가지 참여 모드 (핵심 신규)
| 모드 | 아이콘 | 설명 |
|---|---|---|
| 알기 📚 | 서비스를 알아보고 탐색 | |
| 이용하기 🚀 | 서비스를 직접 이용 | |
| 권리갖기 👑 | 소유/참여로 권리 획득 | |
| 기여하기 🤝 | 아이디어/기술로 기여 |
- 홈 화면 상단 4-모드 카드 바
- 서비스 상세 페이지 모드 탭 (알아보기/이용/권리/기여)
3. 개인 탐색 여정
- localStorage 기반 방문 추적 (코드, 이름, 시간)
- 탐색률 계산 (방문 서비스 / 6561)
- 격려 메시지 (방문 수에 따라 변화)
- 홈 화면 프로그레스 바
4. 친화적 용어 체계
| 기존 | v4.0 |
|---|---|
| TOAU | 확정됨/준비중/검토중/미정 |
| Ti/Om/Ta | 만들기/돌보기/함께하기 |
| 6561 대시보드 | 서비스 현황 |
| 트리 탐색기 | 서비스 탐색 |
| 분석 대시보드 | 인사이트 |
| 코어 | 삶의 영역 |
| 잎노드 | 최종 서비스 |
| 배포 | 활성화 |
5. 이모지 코어 카드
9가지 영역에 이모지와 친화적 이름 부여:
- 🏭 만들기, 🛍 서비스, 📦 거래하기
- 💰 생계, 💚 돌봄, 🤝 관계
- 🏛 경제, 🏥 사회, 🛡 기반
6. 한선씨 동반
사용자여정.한선— 여정 추적, 4모드, 상태 라벨, 위상 이름, 균형률 계산- 컴파일 성공 (2299 큐브)
관련 파일
/Users/ef/crowny-life/public/css/style.css— v4.0 크림/초콜릿 디자인/Users/ef/crowny-life/public/index.html— v4.0 4모드 바 + 여정 + 모드탭/Users/ef/crowny-life/public/js/app.js— v4.0 여정/모드/친화 라벨/이모지/Users/ef/crowny-life/server.js— 배너 v4.0 갱신/Users/ef/crowny-life/사용자여정.한선— 한선씨 동반/Users/ef/crowny-life/CLAUDE.md— v4.0 문서
잔여 이슈
- 모드별 실제 콘텐츠 (현재 안내 텍스트만 — 구체적 이용/권리/기여 기능 연결 필요)
- 여정 데이터 서버 동기화 (현재 localStorage 전용)
- 서비스별 이모지 매핑 (현재 코어 9개만)