O
UX 시나리오 v1
검토용 · 확정 후 화면 배선에 반영
🧭 전체 앱 시나리오 · 선으로 연결되는 사용자 여정

한 줄기로 흐르는 Osolar Insight UX

무계정 시뮬레이션 → 계정 게이트(로그인/회원가입) → 분석결과 인계 → 데이터 연계 온보딩 → 실측 비교까지. 사용자(발전소 오너) 여정과 내부 운영(연계 오케스트레이터) 화면을 분리해 정의합니다.

1

지금 무엇이 어긋났나 (검증 결과)

지도 화면에서 “등록” 클릭 시의 실제 동작을 코드로 확인.

⛔

등록 버튼이 곧장 “내부 운영자 콘솔”로 점프

screen_01의 등록 → location.href='app.html?plant=…'. 그런데 app.html은 「발전소 등록 · 내 발전소 · 데이터 연계 태스크 보드」 = 기획자/내부팀용 운영 화면입니다. 발전소 오너가 등록 직후 볼 화면이 아닙니다.

⚠️

계정 게이트(로그인/회원가입)가 빠져 있음

상단 “회원가입” 버튼은 동작 없음. 등록은 stub 이메일로 즉시 처리 → “무계정 분석 → 가입 → 데이터 연계” 라는 기획 흐름의 게이트 단계가 부재합니다.

✅

올바른 흐름

지도 분석 → [등록 클릭] → 로그인/회원가입 → (분석결과 인계) → 모니터링/엑셀 연계 선택·진행 → 사용자 대시보드(실측 비교). app.html은 사용자 동선에서 빼고 내부 운영 콘솔로 분리합니다.

2

전체 연결 플로우 (스윔레인)

위에서 아래로 한 줄기. 왼쪽 색띠 = 단계, 우측 = 화면 노드. 있음 목업 신규

A · 획득무계정 탐색사용자
A1

홈 / 랜딩

가치 제안·4단계 퍼널 진입

index.html있음
→
A2

무상 시뮬레이션

지도·주소검색·영역그리기/용량입력 → 예측 발전량·수익. 로그인 불필요

screen_01_…_v2있음
→
CTA

“내 발전소로 등록하고 실측 비교” ▶

여기서 처음으로 계정을 요구 (게이트로 이동)

↓ 계정 게이트는 “이 지점 한 곳”에서만 ↓
B · 게이트로그인 / 회원가입사용자
B1

가입 / 로그인

LINE · Google · 이메일. 기존 고객은 로그인 직행. A2 분석결과(용량·좌표·FIT·이름)를 세션으로 인계

screen_auth (신규)신규
→
B2

발전소 등록 확정

인계된 시뮬값을 기준선(expected)으로 저장

POST /api/plantsAPI있음
↓
C · 온보딩데이터 연계사용자
C1

연계 방식 선택

두 갈래 중 택1/병행

screen_connect (신규)신규
→
C2a

① 엑셀/CSV 업로드

드래그&드롭 + 컬럼 매핑(날짜·발전량·단위) → 프로파일 저장

POST …/ingestAPI있음
C2b

② 모니터링 계정 연계

에코메가네·L・eye·mielooop. 자격증명 암호화 보관 / CSV 내보내기 안내

screen_connect (신규)신규
→
C3

연계 진행 상태

접수→식별→정규화→완료를 사용자에게 진행률/완료 알림으로

screen_connect (신규)신규
↓ 연계 완료 시 ↓
D · 가치사용자 대시보드사용자
D1

대시보드 / 마이페이지

예측 vs 실측·발전비율·놓친 수익 진단

screen_02_dashboard목업
→
D2

정밀 진단 / 히트맵

스트링 단위 음영·이상 탐지

screen_03_diagnosis목업
→
D3

솔루션 제안

IRR · ESS · FIP 전환 시나리오

screen_04_solution목업
⇡ C단계의 업로드/연계는 백그라운드로 아래 운영 콘솔에 “태스크”를 생성 ⇡
E · 운영연계 오케스트레이터내부 · 기획자
E1

태스크 보드 (칸반)

접수~완료 상태머신·SLA. 사용자 화면 아님

app.html → /ops 로 분리있음
·
E2

커넥터 레지스트리

어댑터 자산·버전·재사용

app.html있음
·
E3

AI 자동분석 검수

신규 포맷 어댑터 초안 승인 게이트

(Phase 2)신규
3

화면 인벤토리 & 연결

노드 ↔ 파일 ↔ 다음 화면 매핑. “연결 변경”이 이번에 손볼 배선.

노드화면대상파일상태연결(다음)
A1홈/랜딩사용자index.html있음→ A2
A2무상 시뮬레이션사용자screen_01_…_v2있음→ B1 (현재는 app.html로 잘못 연결)
B1로그인/회원가입사용자screen_auth신규→ B2 → C1
B2발전소 등록 확정시스템POST /api/plants있음→ C1
C1–C3데이터 연계 온보딩사용자screen_connect신규→ D1 / 백그라운드 → E1
D1대시보드/마이페이지사용자screen_02_dashboard목업→ D2 / D3 (+ 데이터 연동)
D2정밀 진단/히트맵사용자screen_03_diagnosis목업→ D3
D3솔루션 제안사용자screen_04_solution목업(전환 CTA)
E1–E3연계 오케스트레이터내부·기획자app.html → /ops있음사용자 동선과 분리
4

설계 원칙

🚪 게이트는 늦게, 한 곳에서만

  • 무계정으로 분석까지 끝까지 경험(획득 깔때기 입구)
  • “데이터 연계” 버튼을 누르는 순간에만 가입/로그인
  • 분석결과(용량·좌표·FIT·이름)는 게이트를 넘어 그대로 인계

👤 사용자 화면 ↔ 🛠 운영 화면 분리

  • 사용자: A→B→C→D (탐색→가입→연계→비교)
  • 운영(app.html): 태스크 보드·레지스트리·검수 = 내부 전용 /ops
  • 사용자의 업로드/연계는 운영 콘솔에 “태스크”로 비동기 생성

🔌 연계의 다양성은 어댑터로 흡수

  • 접수 채널은 2개(엑셀 / 모니터링 계정)로 단순화
  • 코어·대시보드는 표준 스키마만 인지
  • 새 벤더 = 새 어댑터 1개(레지스트리 누적 자산)

🔐 자격증명 (확정 Q4)

  • API 벤더: OAuth/API키 암호화 보관 + 정기 동기화
  • 무단 스크래핑 불채택
  • API 없는 벤더: CSV 업로드/내보내기 경로
5

배선 구현 로드맵

이 시나리오 확정 후 손볼 순서. 굵게 = 이번 사이클.

1차
동선 교정 (가장 급함)
screen_01 등록 → screen_auth(로그인/회원가입) 신규 → 분석결과 인계 → screen_connect(연계 선택·업로드·진행) 신규 → 완료 시 screen_02. app.html은 /ops 내부 콘솔로 분리(라벨 명확화).
2차
대시보드 실데이터 연동
screen_02/03/04 목업을 /api/plants/{id}/comparison 등 실 API에 연결.
3차
인증 실연동 · 운영 고도화
LINE/Google OIDC, 모니터링 API 커넥터, AI 자동분석 검수(E3).