SUNREPORT SYSTEM BOARD · v1.0

공개 사이트·제품 화면·보고서가 같은 상태언어를 씁니다

랜딩에서 본 칩과 판정 라벨이 로그인 후 작업공간과 출력 보고서에서 같은 의미로 다시 나옵니다. 이 보드는 그 어휘와 사용 규칙을 정의합니다.

COLOR

딥 네이비·블랙·백색·앰버 중심입니다. 앰버는 CTA·선택·핵심 상태 한 색으로만 쓰고, 배경 그라데이션에는 쓰지 않습니다.

브랜드 · 마케팅

Brand navy#1B2838
Marketing black#111111
Warm paper#F5F5F0
White#FFFFFF
Solar amber#E39B15
로고 청색 (참조)#3FA9E0 · UI 미사용

상태색 — 반드시 라벨과 함께

계산값#2F5D8A
개략 참고#7A7A7A
고객 제공#5E5A8A
미확인#B8471F
GO#1F6B4B
HOLD#C77F06
STOP#9E2B20
TYPE

타이포

공개 표면은 강한 산세리프, 제품 표면은 숫자 가독성 중심, 보고서 제목에만 한국어 세리프를 제한적으로 씁니다. 숫자는 전부 tabular-nums.

display · 히어로분석을 넘어, 실행 가능한 사업계획까지
h2 · 섹션권고안 하나만 보여주지 않습니다
report title · 세리프비식별 후보지 태양광 사전검토 미리보기
body 16 / 서브 14단계·담당·선행조건·산출물·결정 게이트를 프로젝트에 맞게 정리합니다.
일정은 법정기간·실무기간·미확인으로 분리합니다.
mono · 식별자·기준일SUN-DEMO-001 · v0.3 · suneng.ai.kr · /sunreport
micro 12 · 라벨SUNREPORT · 태양광 사업방향·실행계획 보고서
STATE LANGUAGE

상태언어

모든 상태 칩은 색 도형 + 텍스트 라벨을 함께 갖습니다. 색을 못 보는 조건에서도 라벨만으로 판정이 읽혀야 합니다.

데이터 등급

공식값계산값개략 참고고객 제공미확인

정책 등급 — C~E는 산식 미반영

A 시행 중B 시행 전C 예고·심의D 정책방향E 관측신호

업무 상태

입력대기분석중결과확인추가확인 필요내부검토고객전송열람질문·보완전문가 검토중수정요청납품가능실패·재시도크레딧 부족

방향 · 게이트

권고대안보류GOHOLDSTOP선행조건 미충족정책 영향 있음근거 만료입력 누락

지킨다

  • ·상태 칩 옆에는 항상 「다음 행동」이 붙는다
  • ·수치에는 값 유형과 기준일이 붙는다
  • ·값이 없으면 「예시값 없음 / 견적 필요 / 미확인」으로 남긴다
  • ·보류는 사유와 해제조건을 함께 쓴다
  • ·자동 / 내부 검토자 / 외부 자격자를 분리 표기한다

하지 않는다

  • ×색 하나로 판정 전달
  • ×근거 없는 수익률·처리시간·자동화율 표기
  • ×「연금」·수익 보장·허가 보장·정책 확정 표현
  • ×상세 데이터를 블러로 가려 보호한 것처럼 표현
  • ×C~E 정책 등급을 현행 기준값에 반영
COMPONENTS

컴포넌트

공개 랜딩의 스테이지와 제품 화면이 같은 부품을 씁니다. 아래 부품은 세 파일에서 동일한 클래스로 재사용됩니다.

버튼 · 44px 이상

주 행동보조 행동저강도비활성 · 준비중

죽은 버튼은 두지 않습니다. 준비중이면 비활성 상태와 이유를 함께 표시합니다.

근거 행 (key–value)

조례 이격거리A 시행 중
계통 여유미확인
연간 발전량계산값

지도 · 필지

V-World 기준. 장애 시 대체지도로 전환하지 않고 대기 상태를 덮습니다.

경고 · 안내

확인 필요미확인 항목이 있어 수치를 제시하지 않습니다.
정책시행 예정(B) 기준이 2단계 업무에 영향을 줍니다.
LOGO

로고 사용

회사 로고 원본은 변형하지 않습니다. 비율·색·붓터치·붉은 점을 그대로 두고 배경만 선택합니다.

보호공간

심볼 내부 붉은 점 지름의 2배를 로고 사방 최소 여백으로 둡니다. 워드마크와 병기할 때는 그 여백 안에 구분선을 넣지 않습니다.

최소 크기

웹 데스크톱높이 24px 이상
웹 모바일높이 20px 이상
인쇄폭 28mm 이상

단색 인쇄

원본을 변형하는 대신 회색조 변환본을 별도 파일로 두고, 붉은 점은 K 60% 이상으로 유지해 형태를 남깁니다. 재드로잉·생성형 재현은 하지 않습니다.

RESPONSIVE · A11Y

반응형과 접근성

1440px히어로 2단, 스테이지 4패널, S03 3열
1024px스테이지 2패널, S03 2열, 프로세스 3열
390px스테이지는 장면 스택으로 전환, S03 1열, WBS는 카드로 접힘
reduced-motion히어로 최종 장면 고정 + 5단계 라벨 유지, 스켈레톤 애니메이션 정지

모션 규칙

8초5장면 × 1.6초
2초마지막 장면 정지 후 복귀
금지장식용 부유·회전·무한 패럴랙스
모바일패럴랙스·대용량 비디오·과도한 블러 제거

접근성

터치주요 버튼 44px 이상
포커스앰버 2px 외곽선 + 2px 오프셋
상태색 단독 금지, 라벨 병기
JS 실패헤드라인·CTA·핵심 카피는 정적 HTML

금지 시각 요소

×보라색 AI 그라데이션
×글래스모피즘
×동일 기능카드 3개 반복
×이모지, 농촌 이미지의 장식적 소비