판교 오피스 권역 초저가 카페 주문 앱 · Flutter(라이트 모드 전용) · 디자인 시스템 V7 "코발트 잉크 솔리드" · 현 구현 1:1 추출(새 창작 없음)
아메리카노 890원부터 시작하는 초저가 테이크아웃 카페. 사무실 밀집 지역(판교)을 겨냥해 픽업/배달을 한 토글로 전환하고(배달은 판교 반도 아이비밸리·고등 현대 지산만), 10잔 구매 시 1잔 무료 스탬프 멤버십과 쿠폰으로 재방문을 유도한다. 가입 마찰을 없애기 위해 카카오/네이버 소셜 로그인만 둔다. 빠르게 고르고 빠르게 결제하는 '회전'이 핵심이라, UI는 장식보다 가독·속도·신뢰에 맞춰진다.
이전 V6의 주황 그라디언트를 전면 폐기하고, 단일 코발트 잉크 솔리드(#17324F) 한 색만 강조로 쓴다. 배경은 웜 오프화이트 1톤(#FAF8F4) 위에 흰 카드·따뜻한 회베이지 면들을 면 색차로 구분한다. 따뜻한 종이 위에 깊은 잉크 한 색 — 영수증·메뉴카드 같은 스테이셔너리(문구류) 감성으로, 저가 브랜드가 흔히 빠지는 '싸 보임'을 절제된 인쇄물의 신뢰감으로 상쇄한다. 가격·금액은 살짝 푸른 잉크(#1B3D62)로 찍어 '값'을 차분하게 강조한다.
섀도우 철학: 카드·토글은 그림자 0 — 면 색차 + 1px 무채 헤어라인으로만 위계를 만든다. 실제로 '떠야 하는' 바텀시트만 무채 ambient 1단(0 -4 24 rgba(20,24,30,.10))을 쓰고, 화면 위를 떠다니는 플로팅 하단 nav만 예외적으로 강한 드롭섀도우(0 18 40 rgba(0,0,0,.35))를 허용한다. 컬러 글로우는 전부 0.
시맨틱 색의 절제: 성공/경고/오류/정보 같은 의미색은 토스트·배지 같은 피드백에만 등장하고, 헤더·버튼 같은 크롬(chrome)에는 코발트 한 색만 쓴다 — 한 화면에 강조색이 둘 이상 충돌하지 않게 하는 규율이다.
역할별로 명명된 토큰만 사용한다(하드코딩 금지). 배경 6톤은 모두 따뜻한 무채 계열이라 한 화면 안에서 면을 쌓아도 색이 충돌하지 않는다.
모든 간격은 4px 그리드에 정렬된다(xs4 ~ xxl48). 리듬을 한 축으로 묶어 화면마다 여백이 들쭉날쭉해지지 않게 한다.
모서리 둥글기가 곧 '떠 있는 정도'의 위계다 — 캡슐(999, CTA·토글) > 시트·nav(24) > 카드(16) > 입력·선택칩(12) > 뱃지(8). 캡슐 버튼이 가장 부드럽게 눌리고, 뱃지는 가장 단단하게 붙는다.
단일 폰트 Pretendard로 7단계 램프를 구성한다. 주문번호만 displayLarge(48)로 압도적으로 키워 '완료'의 감정을 만들고, 본문·버튼은 titleMedium(16), 캡션은 12로 떨어뜨린다. 음수 자간(-0.15 ~ -0.45)으로 한글의 글자 사이를 좁혀 밀도를 높인다.