Major UI/UX and architecture improvements
- Implemented new navigation system with NavigationProvider and route management - Added adaptive theme system with ThemeProvider for better theme handling - Introduced glassmorphism design elements (app bars, scaffolds, cards) - Added advanced animations (spring animations, page transitions, staggered lists) - Implemented performance optimizations (memory manager, lazy loading) - Refactored Analysis screen into modular components - Added floating navigation bar with haptic feedback - Improved subscription cards with swipe actions - Enhanced skeleton loading with better animations - Added cached network image support - Improved overall app architecture and code organization 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
58
doc/color.md
Normal file
58
doc/color.md
Normal file
@@ -0,0 +1,58 @@
|
||||
## 구독관리 앱 글래스모피어즘 색상 가이드
|
||||
**신뢰성, 편안함, 트렌드함**을 모두 잡는 컬러 조합 추천
|
||||
|
||||
### 1. 컬러 선정 원칙
|
||||
|
||||
- **신뢰성:** 블루 계열, 그레이, 화이트 등 안정적이고 전문적인 느낌의 색상
|
||||
- **편안함:** 저채도 파스텔, 연한 블루·민트, 따뜻한 베이지 등 눈에 부담 없는 색상
|
||||
- **트렌드함:** 그라디언트, 반투명 레이어, 약간의 네온 포인트 등 현대적 감각
|
||||
|
||||
### 2. 추천 컬러 팔레트
|
||||
|
||||
| 용도 | 추천 색상 예시 (Hex) | 설명 |
|
||||
|--------------|-------------------------------|---------------------------------------|
|
||||
| 메인 | #2563eb, #60a5fa, #e0e7ef | 신뢰감 주는 블루 계열 그라디언트 |
|
||||
| 서브 | #f9fafb, #f1f5f9, #f3f4f6 | 밝은 화이트·그레이, 편안한 배경 |
|
||||
| 포인트 | #38bdf8, #7dd3fc, #f472b6 | 트렌디한 민트, 연핑크, 밝은 블루 |
|
||||
| 테두리/블러 | rgba(255,255,255,0.3) | 글래스 효과용 반투명 화이트 |
|
||||
| 그림자 | rgba(0,0,0,0.08) | 부드러운 깊이감 부여 |
|
||||
|
||||
### 3. 실전 적용 예시
|
||||
|
||||
- **배경:**
|
||||
연한 블루(#e0e7ef) 또는 밝은 그레이(#f9fafb)
|
||||
- **글래스 카드:**
|
||||
반투명 화이트(예: rgba(255,255,255,0.2)), 블루 그라디언트 테두리
|
||||
- **포인트 버튼:**
|
||||
밝은 민트(#38bdf8) 또는 연핑크(#f472b6)
|
||||
- **아이콘/텍스트:**
|
||||
진한 블루(#2563eb), 다크 그레이(#334155)
|
||||
- **그라디언트 예시:**
|
||||
LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0xFF2563eb), Color(0xFF60a5fa), Color(0xFFe0e7ef)],
|
||||
)
|
||||
|
||||
### 4. 참고 팁
|
||||
|
||||
- 글래스모피어즘은 **투명도·블러**와 함께 **밝고 깨끗한 색상**을 조합하면 신뢰감과 트렌디함을 동시에 줄 수 있습니다.
|
||||
- 포인트 컬러를 너무 강하게 쓰기보다는, 전체적으로 **밝고 부드러운 톤**에 약간의 컬러만 더하는 것이 편안함을 극대화합니다.
|
||||
- 실제 인기 앱(Reflect, T.RICKS, Coffee 등)도 블루·화이트·민트 계열을 주로 활용합니다.
|
||||
|
||||
### 5. 컬러 팔레트 예시
|
||||
|
||||
| 이름 | Hex 코드 | 용도/느낌 |
|
||||
|-------------|------------|-------------------|
|
||||
| Deep Blue | #2563eb | 신뢰, 메인 |
|
||||
| Sky Blue | #60a5fa | 트렌드, 그라디언트|
|
||||
| Soft Mint | #38bdf8 | 포인트, 상쾌함 |
|
||||
| Light Gray | #f1f5f9 | 배경, 편안함 |
|
||||
| White Glass | #ffffff(투명도) | 글래스 효과 |
|
||||
| Pink Accent | #f472b6 | 포인트, 트렌디 |
|
||||
|
||||
### 6. 마무리
|
||||
|
||||
- **블루+화이트+민트** 조합은 신뢰성, 편안함, 트렌드함을 모두 만족시킵니다.
|
||||
- 글래스모피어즘 효과와 함께라면, 위 팔레트로 세련되고 현대적인 구독관리 앱 UI를 완성할 수 있습니다.
|
||||
- 실제 적용 시, 밝은 배경과 부드러운 그라디언트, 포인트 컬러를 적절히 조합해보세요.
|
||||
Reference in New Issue
Block a user