콘텐츠로 이동
✍️ 수정가능누구나 고쳐도 됩니다. 고치면 하단 frontmatter의 갱신일·작성자·변경요약을 남겨 주세요.작성 Claude · 2026-06-04 · v12 재편·raw 컴파일·인간화

과제 관리 디자인 (Design)

요지

과제 화면은 생성·목록·제출·피드백·보기로 이뤄진다. 아래 화면·컴포넌트·상태는 디자인 전용 원본이 없어 기획(prd)·개발 명세(frd)의 정책에서 역산한 초안이다.

🚧 내용 추가 필요

과제 관리 전용 Figma(화면흐름·컴포넌트·상태 시안) 미입수. 디자이너가 확정 시 — 생성/목록/제출/피드백/보기 5화면 레이아웃·제출 상태 배지(제출 전/완료/지연) 디자인·현황 요약 카드·날짜시각 피커·역할별(선생님/학생/보호자) 화면 차이를 본문에 명세. 아래는 그 전까지의 정책 기반 골격.

상위 PRD

기획(생성→제출→피드백 루프, 지연 제출, 공용 첨부)은 prd, 상태머신·권한은 frd·homework가 기준이다.

사용자 플로우

MS3 기획의 세 가지 사용자 플로우를 화면으로 옮기면 다음과 같다.

  • 과제 생성(선생님): '새 과제 생성' → 제목·내용(에디터) + 기한(날짜/시각 피커) + 대상 선택(전체/개별) + (선택)수업노트 연결 + 알림 발송 시점 옵션(1h/3h/6h/1d 전 …) → 생성 → 학생 알림 전송.
  • 과제 목록(선생님): 제출 현황 요약(제출/미제출/지연) + 정렬(제출 순서·시간·이름·상태), 학생 카드별 진입.
  • 과제 제출(학생): 상세 열람 → 답글 폼(본문 + 다중 첨부) → 제출 완료. 마감 후 진입 시 '지연 제출' 안내.
  • 피드백(선생님): 학생 제출물 진입 → 댓글/피드백 작성·수정·삭제.
  • 과제 보기(학생/보호자): 학생=제출 전 상세/제출 후 내역+피드백, 보호자=제출 상태·피드백 요약 보기 전용.

수업노트 ↔ 과제 상호 링크는 클릭 시 새 창으로 연결 상세 조회(frd).

화면 · 컴포넌트

  • 제출 상태 배지: 제출 전 / 제출 완료 / 지연 제출 — 별도 색상·태그.
  • 현황 요약 카드(제출/미제출/지연 카운트), 피드백 댓글, 첨부 칩(아이콘+파일명+용량, 다운로드), 날짜/시각 피커, 대상 선택(전체/개별).
  • 빈 상태(과제 없음), 마감 임박 경고, 필수 누락 경고, 과거 기한 경고.
  • 토큰·배지·버튼은 design-system. 첨부 에디터는 에디터 공용.

인터랙션 · 상태

  • 생성 시 필수 누락(제목·내용·기한·대상) 차단, 기한이 현재보다 이전이면 경고.
  • 제출 후 재제출 = 기존 수정 대체(수정 시각 기록). 마감 이후 제출 자동 '지연 제출' 표시.
  • 첨부 확장자·용량 초과 시 경고(에디터 업로드 정책 준수).

엣지케이스

  • 대상이 '개별'인데 학생 미선택 시 생성 불가.
  • 비로그인/권한 없는 사용자의 첨부 다운로드 → 로그인 화면 라우팅 후 복귀(에디터 공통 정책).
  • 룸/수업노트 삭제 시 과제도 cascade soft delete — 화면에서 더 이상 노출 안 됨(homework).

접근성

브레이크포인트·그리드는 responsive. 날짜/시각 피커 키보드 접근, 상태 배지 색상 대비 준수.

개발 핸드오프 노트

dev-handoff 규약. 상태머신·권한 계약은 frd·homework SSOT.