콘텐츠로 이동
✍️ 수정가능누구나 고쳐도 됩니다. 고치면 하단 frontmatter의 갱신일·작성자·변경요약을 남겨 주세요.작성 Claude · 2026-06-05 · 본문 인라인 raw 출처 → source 이관

오픈챌린지 디자인 (Design)

요지

공개 유입의 바깥 화면과 전체 흐름을 다룬다. 안으로 들어가 실제로 문제를 푸는 단계는 챌린지식-풀이 디자인이, 막혔을 때의 AI 코치 대화는 사고력-답변구조 디자인이 맡으므로, 여기서는 리스트·상세·결과 같은 컨테이너만 본다.

상위 PRD

기획(5화면, 비로그인→로그인 전환 정책)은 prd, 공개 엔드포인트·visibility 계약은 frd가 기준이다.

사용자 플로우

ID 화면 접근
S1 문제 리스트 전체 공개
S2 AI 코치 + 풀이 전체 공개 / 제출은 로그인
S3 결과 + 다른 사람 풀이 로그인 필요
ST1 선생님 모니터링 홈 선생님
ST2 학생 상세 선생님
[비로그인] SNS 유입 → S1 리스트 → S2 풀이(풀이 가능 / AI 불가) → 제출 시 로그인 유도(전환)
[로그인]   S1 → S2 풀이(+AI 코치) → 제출 → S3 결과 + 다른 사람 풀이 → 난이도 자가평가 → 다음/종료

화면 · 컴포넌트

  • 문제 리스트(S1): 과목 필터 탭(MVP 수학만), 스트릭 바(7일 도전), 문제 카드(수능 이미지 썸네일), 훅 문구(통과율 37%·지금 N명 도전 중), 정렬(최신/인기/정답률).
  • 결과(S3): 스탯 3개(정답 여부/통과율/상위 %), AI 한줄 평가(캐릭터+코멘트), 다른 사람 풀이(추천순·베스트 고정), 다음 문제 추천 카드.
  • 뱃지: 혼자 해결·색다른 풀이·연속 도전·첫 도전.
  • 비로그인 상태(풀이 가능, AI/제출 차단), 빈 상태, 시즌 spike 로딩.
  • 카드·뱃지·스트릭 바·캐릭터 토큰은 design-system. 와이어프레임 원본은 S3 임시 URL이라 미첨부.

인터랙션 · 상태

  • 카드 클릭 → 풀이, 제출 시 비로그인은 로그인 유도(핵심 전환 지점).
  • 난이도 자가 평가, 다음 문제 추천(오답 시 유사 문제 권장).

접근성

리스트 그리드/카드 반응형·모바일 최적화 진행 중(오픈챌린지 MVP 현황) — responsive. 훅 문구·스탯 대비, 필터 탭 키보드 접근.

개발 핸드오프 노트

dev-handoff 규약. 공개 엔드포인트·visibility 계약은 frd SSOT. MVP 이후 옵션(포인트·풀이 댓글·랭킹)은 prd 범위 밖.