전체 화면 · 4개 그룹

안부 와이어프레임

가디언(Expo) + 홈(Android Native) 앱의 모든 페이지를 당근(Karrot) Seed 디자인 시스템을 따른 warm 톤으로 정리한 정적 목업입니다. 실제 packages/ui 토큰 값으로 렌더됩니다.

4
그룹
14
HTML 파일
50+
화면 · 상태
2
앱 (Guardian + Home)
01
Warmth over precision
완벽한 정렬보다 따뜻한 느낌이 우선. 테라코타 웜톤 중심, 중성색도 틴팅.
02
Reassurance through feedback
모든 인터랙션에 즉각적 피드백. "잘 되고 있구나"를 항상 느끼게.
03
Alive, not anxious
활기는 불안과 다르다. 빨간 알림 폭탄이 아닌 자연스러운 모션과 색상.
04
Family, not surveillance
카메라 기능이지만 CCTV 미학을 따르지 않는다. 가족 사진앨범처럼.
GROUP A · Guardian 핵심 경로

스트리밍 & 알림

가디언 앱의 핵심 가치 전달 경로. 실시간 영상 뷰어와 이벤트 알림 흐름.

📹
스트리밍 뷰어 (세로)
preview box + 리모트 컨트롤. 기본/카메라 끄기/통화 중 3 상태.
Primary3 상태
🖥️
스트리밍 뷰어 (풀스크린)
Glass header + bottom bar. 기본/PTT 활성/카메라 꺼짐 3 상태.
Dark3 상태
🔔
알림 상세
히어로 + 클립 + 실시간 확인 CTA + 체크리스트 + 피드백.
Action2 상태
📋
하루 요약
이벤트 카드 + 인라인 피드백. 리스트/빈 2 상태.
2 상태
GROUP B · Guardian 본체

탭 · 인증 · 설정

메인 탭 4개(기록용) + 로그인/회원가입 + 약관 + 설정 상세 페이지.

🏠
탭 4개
Dashboard · Messages · Alerts · Settings. 현재 리뉴얼된 디자인 기록.
4 탭기록용
🔐
인증
로그인(OAuth+데모) · 회원가입 · 비밀번호 재설정.
3 화면
📜
약관 / 개인정보
이용약관(9조) · 개인정보처리방침(8섹션).
2 화면
⚙️
설정 상세
프로필 편집 · 알림 설정 · 회원 탈퇴(2 step) · FAQ.
5 화면
GROUP C · Guardian 셋업 플로우

온보딩 · 페어링 · 가구 관리

첫 진입 후 가구 등록 → 홈 기기 페어링 → 기기 설정. 상태 머신이 가장 많은 영역.

🚀
온보딩 (3 Step)
선택 → 가구 등록 → 완료. Progress bar 기반 단계 진행.
3 Step
🔗
기기 페어링
코드 입력 → 연결 → 승인 대기 → 완료/거절. 상태 머신 6개.
State machine
👨‍👩‍👧
가구 관리
새 가구 생성 · 초대 코드 입력 · 확인 · 참여 완료(콘페티).
4 화면
📱
기기 설정
홈 기기 상세 설정 + 위험 영역(해제 다이얼로그).
2 상태
GROUP D · 안부 홈 (Android Native)

부모님 집 거실 기기

Kotlin + Jetpack Compose. 대기 모드가 메인. 대형 폰트 · 번인 방지 · 밤낮 자동 전환 · 대형 터치 타겟.

🖼️
대기 화면 (Ambient)
디지털 포토 프레임 · 시계 · 날씨 · 사진 슬라이드쇼 · 음성 메시지 재생. 4 상태.
Primary4 상태
🔗
페어링 플로우
Setup → ShowCode(6자리+QR) → Pending Approval → Paired.
4 상태
📺
대시보드 / 카메라
관리자 홈(6 설정 카드) + 카메라 프리뷰(통계) + 스트리밍 설정.
3 화면
📞
통화 수신 / PIN
자동 수락 · 수동 수신 · 관리자 PIN 키패드.
3 상태
🎛️
설정 7개
사생활 · 키오스크 · 보호자 · 기기 · 디스플레이 · 안전 · AI 능력.
7 화면
📊
시청 기록 · 재연결
ViewerHistory 요약/세션 + Reconnect 2 상태(복구 중/실패).
3 화면