N 바이탈N 바이탈 디자인 가이드
원본 docs/DESIGN-GUIDE-2026-10-23.md
노바 패밀리 공통 nova-design(NovaTheme·NovaButton·NovaChip·NovaField) 위에 N 바이탈만의 얼굴 「해 뜨기 전 하늘」을 입혔어요. 2026-10-23(N 베이비 뼈대에서).
1. 바탕
아침 약 먹을 시간, 해 뜨기 전 하늘(#14122B → #2E2350)에 별 몇 개가 천천히 반짝이고 복숭아빛 새벽 빛이 숨 쉬어요. 머리 판은 늘 어두워 큰 흰 숫자(먹은 고리의 「2/4」)가 또렷해요.
2. 색 — 뜻으로만 쓴다
| 이름 | 값 | 쓰는 곳 |
|---|---|---|
| 새벽 남색 | #14122B | 머리 판 위 |
| 새벽 라벤더 | #2E2350 | 머리 판 아래 |
| 민트 | #5FE0C0 | 먹음 · 혈압 정상 · 혈당 목표 안 |
| 호박 | #FFC58A | 「지금」 먹을 약 · 다음 약 시각 |
| 하늘 | #7CB8FF | 예정 · 주의혈압 · 체중 · 이완기 선 |
| 노랑 | #FFC53D | 고혈압 전단계 · 목표 밖 · 남은 약 적음 |
| 산호 빨강 | #FF6464 | 놓침 · 2기 범위 · 낮은/아주 높은 혈당 · 안전 안내 · 수축기 선 |
| 보라 | #9D8CFF | 혈당 |
| 노바 주황(행동) | #FF7B00 | 단추 |
약 점 색 여섯(민트·하늘·호박·복숭아·보라·노랑)은 약을 눈으로 구분할 때만 써요. 상태 색과 헷갈리지 않게 점(10dp)으로만.
3. 먹은 고리
오늘 먹을 칸 수만큼 마디를 나누고(마디 사이 6°), 먹은 마디를 민트로 채워요. 채우는 움직임은 0.7초 한 번. 칸이 없으면 마디 없이 「먹을 약 없음」.
4. 움직임
- 빠른 적기 단추의 동그라미가 1.4초로 천천히 숨 쉬어요(1 → 1.04).
- 그래프는 왼쪽부터 점이 차례로 찍혀요(0.9초).
- 움직임 줄이기면 반복 움직임을 아예 만들지 않고(
loopFloat), 고리·그래프는 바로 다 그려요.
5. 아이콘·시작 화면
- 아이콘: 주황 바탕, 흰 알약 캡슐(왼쪽 아래 → 오른쪽 위로 기울임, 가운데 이음 틈) + 오른쪽 아래 흰 동그라미 안 주황 체크(「먹음」).
_nova-brand/glyphs.py의vital. N 큐어(십자 + 심전도)와 겹치지 않게 심전도는 쓰지 않았어요. - 시작 화면: 흩어진 점 넷이 모여 캡슐이 되고, 두 쪽이 다가와 틈이 닫히며, 동그라미 안에 체크가 그어져요(약 1.1초). 마지막 장면은 아이콘의 반전.
6. 말투
- 존댓말, 짧은 문장, 어르신도 읽기 쉬운 말. 「복용」 대신 「먹음」, 「투약」 대신 「약」.
- 장담하지 않아요: 「정상입니다」「끊어도 돼요」「두 번 드세요」는 쓰지 않아요(StringKeysTest 가 막아요). 혈압 구간에는 늘 「참고」를 붙여요.
- 화면 글에 「—」를 쓰지 않아요(패밀리 규칙).