dev.rdard.app · 섹션을 선택하세요

live

개발 문서

docs 체계 · 결정 이력

building

디자인 시스템

컬러 · 컴포넌트 · SVG Motion

building

DB 스키마

Place · Extension · Typed ORM

plan

REST API

엔드포인트 명세

live

앱 빌드

iPhone · iOS 우선 검증

building

지도 시스템

Google Cloud 스타일 · SVG 마커

live

마커 Lab (독립)

6상태 · 조형 A/B · 건물 매핑

review

지도·스팟 테스트베드

레이어 · 마커 · Spot 모음

live

진척 상태

현재 S0 · 기반 엔진 단계

M1 · Rive PoC 관문통과
M1c · 지도+Rive 관문통과
M2 · 앱 스캐폴드진행 중
M4 · SVG Motion Lab빌드업
M5 · API 엔진착수 가능

지도·스팟 테스트베드

기본 시설·Place·검색 결과·개인 Spot 레이어와 SpotCollection을 한 흐름에서 검증

MY RDARD

내 스팟

저장한 장소를 한 번만 관리하고, 필요한 모음에 자유롭게 담습니다.

4저장한 스팟

2나의 모음

1공개 스팟

모음 아이콘선택한 모음에 적용

저장한 스팟

4곳

역할 분리 — 카테고리 × 6상태 매트릭스와 상태 전환 애니메이션은 디자인 시스템 → 마커 Lab으로 이관했습니다. 이 화면은 실지도 위 클릭·필터·저장 상호작용 검증 전용입니다(공용 렌더러 renderRdardMarker()는 동일).

검증 규칙 — 이 웹 화면에서 구조·명칭·동작을 먼저 확정한 뒤 동일 계약을 iPhone 앱에 반영합니다. Android export는 승인 기준으로 사용하지 않습니다.

DB 스키마

Place 핵심은 유지하고, 전문 기능은 Extension으로 추가하는 구조 (canon)

3개 계층만 기억하기

places

모든 장소의 이름·좌표·상태

place_extensions

장소와 전문 기능을 연결하는 공통 ORM

Typed Extension

교통·방문·문화재·숙박의 실제 전문 데이터

새 분야가 생겨도 places는 고치지 않고, 확장 타입과 전문 테이블만 추가한다.

관계도

users
├ spots ─ places  개인이 저장한 실제 장소
│    └ waypoints  개인이 찍은 임의 좌표
└ spot_collections ─ spot_collection_items ─ spots

maps  지도 표현·공유·본사 검수 단위

places
├ place_names · place_addresses · place_media
├ place_category_assignments ─ place_categories
├ place_map_display_overrides  개별 표시 예외
├ place_tags ─ tags
├ external_place_refs ─ data_sources
└ place_extensions
    ├ transit_facility_extensions
    ├ visitor_extensions
    ├ heritage_extensions
    └ lodging_extensions

place_categories
└ category_map_display_profiles  줌·라벨 기본값

spots는 principal이 소유한 독립 저장 기록이다. 여러 spot_collections에 동시에 넣을 수 있고, maps는 개인 분류와 분리한다.

핵심 테이블

테이블	최소 컬럼	역할
`users`	id · provider · email	사용자 신원
`places`	id · canonical_name · location · status	공유 POI · PostGIS Point
`maps`	id · owner_id · title · visibility	지도 표현·운영 검수
`spots`	id · owner_principal_id · place_id/waypoint_id · note	개인의 독립 저장 위치
`spot_collections`	id · owner_principal_id · name · visibility	개인 스팟 모음
`spot_collection_items`	collection_id · spot_id · sort_order	Spot 다중 모음 배치
`waypoints`	id · created_by_principal_id · location · label	Place 없이 저장한 좌표
`place_extensions`	id · place_id · type_code · schema_version · status	전문 확장 연결부
`extension_types / schemas`	type_code · version · status	허용 타입·버전 관리
`category_map_display_profiles`	category_code · min/standard/detail_zoom · label_min_zoom · priority	카테고리 표시 기본값
`place_map_display_overrides`	place_id · nullable zoom/priority	개별 Place 표시 예외

핵심 제약: UNIQUE(owner_principal_id, place_id) · PK(collection_id, spot_id) · UNIQUE(place_id, type_code). Spot 모음에는 해당 owner의 Spot만 들어간다.

Extension 생성 규칙

단계	하는 일
`DRAFT`	`place_extensions`와 타입별 전문 행을 하나의 트랜잭션으로 생성
검증	필수 값·타입·스키마 버전·FK를 확인
`ACTIVE`	검증을 통과한 확장만 API에서 사용

createTransitExtension()과 같은 타입별 서비스를 사용하고, 무제한 범용 insert는 열지 않는다.

DB와 SVG의 경계

DB에는 SVG 파일 경로나 버전을 저장하지 않는다. marker_kind, variant, line_codes 같은 의미만 전달한다.

DB / API  의미 데이터
↓
SVG manifest  파일·버전 선택
↓
Map renderer  상태·애니메이션 표현

개발 문서

docs 체계 (정본: repo) · 상태 표기 규칙

문서 상태 canon 12 · draft 14

canon 정본(참조만) · draft 논의 중(인용 금지) · superseded 대체됨. 리부트 초기라 개념·엔지니어링 문서 다수가 아직 draft — 확정되면 canon 승격. 홈 타일의 live는 docs 체계 가동 중(문서별 상태와 별개).

문서 트리

00-meta/ 문서규칙 · 용어집canon · 미결질문
10-product/ 컨셉 · 단계 · 코어루프 · PRD인덱스
20-domain/ 장소 확장형 데이터 모델canon
40-engineering/ 엔진 · 지도 · Rive · 서버스택canon · 명명canon
50-ops/ 도메인canon
90-history/ 데이 히스토리

확정 결정 이력

07-04

서버 스택 = NestJS + Drizzle + PostGIS + RLS

07-04

컨셉 = 반딧불·정령 코어루프 · 다중 니치

07-05

기반 스키마 = 표준 지도 · spots 명명 · 게임용어 분리

07-06

개발 도메인 = rdard.app (dev.rdard.app 보드)

디자인 시스템

형태는 단순하게. 움직임은 절제되게.

Pretendard · letter-spacing −1% · 숫자 tabular-nums

Display 800 · ₩14,000

H1 800 · 섹션 타이틀

H2 800 · 서브 타이틀

Body 600 · 본문 텍스트 — 읽기 편한 단락

Body 400 · 레귤러 본문

Caption 400 · 보조 캡션·메타

Mono · 1,234,567 · 09:41 · ×12

폰트 = Pretendard Variable v1.3.9 self-host. 웹 미리보기 적용 완료 · 앱 번들은 후속.

스페이싱 (4pt grid)

4

아이콘·텍스트 간격

8

인접 요소

12

카드 내부 gap

16

카드 패딩

24

섹션 간격

32

블록 간격

라운드

xs 6 · sm 10

배지·인풋

md 14

버튼

lg 18

카드

pill

필터·스테퍼

터치 타깃

모바일 최소 44px. (POS 52 · 키오스크 64는 RDARD 비적용 — 모바일 우선.)

버튼 · 변형

버튼 · 크기 · 상태

버튼 · 풀폭 (폼 · 로그인 제출)

태그

Accent 완료 주의 오류 정보 중립

폼

필수 항목입니다

알림 배너

정보 새 업데이트가 있습니다.

완료 정상적으로 저장되었습니다.

주의 저장 공간이 부족합니다.

오류 요청을 처리하지 못했습니다.

버밀리언 accent는 solid, danger는 tint+딥레드(둘이 같은 형태 안 남). 포커스 링은 info 파랑으로 분리. 상단 테마 토글로 라이트/다크 확인.

MARKER LAB

지도 위에 남는 최소한의 신호.

공용 렌더러 renderRdardMarker()가 이 Lab과 #spotlab 실지도를 동일하게 구동합니다. 배경을 바꿔가며 상태 사다리를 비교하세요.

6 states

AdvancedMarker는 화면 정면 유지 — 기울어진 지도 위 가독성 비교용. 플랫 카드에는 적용되지 않음.

B안: 교통·공공시설(도서관·공원·문화유산·관광지)=사각 실드(radius≈30%) · 상업시설(카페)=원형 유지. #spotlab 실지도는 기본 A안 고정.

idle → filtered → event → selected 순환 · reduced-motion 시 명시적 재생 버튼만 동작

마커 상태 Lab — 카테고리 × 6상태

공용 렌더러 renderRdardMarker()로 카테고리 5종과 지하철·버스 예외를 idle→filtered→event→selected→saved→collected 순으로 검증합니다. 기본 행은 standard(16px), 마지막 행은 detailed(20px) 기준입니다. (2026-07-13 #spotlab에서 이관 — 상호작용 검증은 #spotlab에서 계속합니다.)

ring 1.5px(standard, far 1.2 / detailed 1.8) · filtered·event 그림자 0 1px 2px rgba(23,23,26,.10) · selected 그림자 0 2px 6px rgba(23,23,26,.14) · saved·collected 흰 테두리 2px·상시 그림자 0 1px 2px rgba(23,23,26,.08)·1.15×(2026-07-14 그림자 1단 톤다운) (조형은 상단 A/B 토글: A=전 카테고리 원형 통일 · B=의미 조형 — 교통·공공 사각 실드 30% radius, 상업 원형) · "!" 배지 지름 마커의 약 40% · collected 미니 배지 지름 마커의 약 45~50% · 글리프는 자체 제작 filled 실루엣(24 viewBox, ≤3 primitive, svg/glyph-*.svg), 배지-글리프 크기는 정수·짝수 차 상수표(--marker-glyph-*, 2026-07-14 % 방식 폐기)로 고정. 상세 계약은 팀 리드 보고 참고.

자산 추적표0 svg assets

앱 iconPaths 키는 웹 정본 CATEGORY_ICON_FALLBACK ↔ app-client ASSET_KEY_ICON_NAME(PlaceGlyphMarker.tsx) 1:1 대응을 수동 대조한 값입니다 — 두 저장소가 분리돼 있어 API로 노출되지 않습니다.

SVG Motion 프리뷰 · 7종 자산Signal · Location 등 · 정본 예시 보존

manifest 로딩 중…

Asset 선택

svg/manifest.json

자산을 준비하는 중…

manifest 대기 · reduced-motion 지원

Layers0 layers

Playback speed

자산을 선택하세요.

Asset detailsmanifest

source: svg/manifest.json

RIVE · HOLD M1/M1c 실기기 검증 자산은 보존합니다. 신규 지도 애셋과 모션 저작은 SVG Motion Lab에서 진행하며, Rive 신규 제작·수정은 재개 조건이 생길 때까지 중단합니다.

검증·샘플 자산 아카이브 (읽기 전용)

브라우저 Rive 런타임은 HOLD 동안 로드하지 않습니다. 기존 .riv 파일과 M1/M1c 실기기 검증 결과만 보존하며, 신규 저작 경로는 SVG Motion Lab이 정본입니다.

REST API

엔드포인트 명세 (계획) — 서버 M5부터 구현

인프라

base

api.roadaround.com → :30100

인증

JWT (access/refresh) · 소셜(카카오·애플·구글)+이메일

문서

@nestjs/swagger 자동 생성 예정

엔드포인트 (계획)

GET/health

POST/auth/login · /register · /refresh

GET/maps · POST/maps

GET/spot-collections · POST/spot-collections

GET/spot-collections/:id/spots

GET/places?bbox= 뷰포트 검색

POST/spots 장소 저장

스키마 확정 후 OpenAPI 명세로 대체.

앱 빌드

EAS preview 빌드 · standalone(번들 임베드) · internal distribution (등록 기기)

대시보드

Expo 빌드 목록 (최신 전체)

설치

검증 순서: 기능·디자인을 dev.rdard.app에서 먼저 확인 → 승인된 결과만 iPhone/iOS preview에 반영 → 등록된 아이폰에서 설치 페이지를 열어 OTA 설치. Android 링크는 과거 호환 증거로만 보관하며 승인 기준으로 사용하지 않는다. 번들 ID app.rdard.roadaround.

지도 시스템

provider 재선정 검증 · 모바일 뷰 · 실시간 스타일 옵션

로딩…

Google 장소 가져오기 검수 후보

Google 원본 아이콘을 클릭하거나 현재 화면을 검색하고, RDARD SVG 마커로 겹쳐 확인합니다.

후보는 메모리에만 유지됩니다. Google Place ID 외 정보는 정본 저장 전 출처 검수가 필요합니다.

아직 가져온 장소가 없습니다.

저장 경계 — 지금은 DB 저장이 아니라 검수용 JSON 복사까지 지원합니다. Places API의 viewport는 실제 영역 polygon이 아니므로 polygon은 별도 GIS GeoJSON만 사용합니다.

스타일 옵션 · 실시간 반영

팔레트 시안 (vector · 즉시 전환)

다크 미리보기 (ROADMAP_DARK · 초안)

테마

라이트 (몽환 비비드) 다크 (몽환 비비드)

구글 기본 표시 요소 (끄기 = 체크 해제)

POI 이름·아이콘 (경복궁·상점 등 · 지질 색은 항상 표시) 도로명 라벨 지하철 노선·역 정보 (교통시설) 행정경계

RDARD 주입

RDARD 장소 마커 RDARD 장소 영역 polygon

vector(Cloud) 모드 적용 중 — 스타일은 서버 StyleConfig에서 내려오고, 장소·교통 데이터는 data/seoul-core fixture를 ORM/API와 같은 모양으로 읽는다. DB는 의미만 전달하고 실제 파일·버전은 SVG manifest가 선택한다.

진척 상태

현재 S0 · 기반 엔진 단계

다음 액션

M2 앱 스캐폴드 + M4 SVG Motion Lab
M1·M1c의 Rive 기술 검증 결과는 보존하고 신규 모션 저작은 SVG + code motion으로 전환. M2(레이어 구조·expo-router·글래스 탭바)와 M4(자산·상태 모션)를 빌드업하며 M5(API 서비스 엔진)는 병렬 착수 가능.

S0 마일스톤

수행 이력

확정 스택

클라: Expo/RN · New Arch · Naver지도 · SVG+code motion (Rive PoC HOLD) · TanStack Query · zustand · MMKV
서버: NestJS · Drizzle · PostgreSQL+PostGIS · RLS · Redis
인프라: qnx · 포트 30xxx · roadaround.com/api · dev.rdard.app(개발 포털)

지도·스팟 테스트베드

내 스팟

저장한 스팟

스팟

DB 스키마

3개 계층만 기억하기

관계도

핵심 테이블

Extension 생성 규칙

DB와 SVG의 경계

개발 문서

문서 상태 canon 12 · draft 14

문서 트리

확정 결정 이력

디자인 시스템

지도 위에 남는 최소한의 신호.

마커 상태 Lab — 카테고리 × 6상태

REST API

인프라

엔드포인트 (계획)

앱 빌드

최신 빌드 다운로드

대시보드

설치

지도 시스템

Google 장소 가져오기 검수 후보

스타일 옵션 · 실시간 반영

Naver Maps 상품 · 과금 · 참고

진척 상태

다음 액션

S0 마일스톤

수행 이력

확정 스택