사용자 화면 · 마이페이지

찜한 작품

MYP-007 · 2026. 03. 04

화면 이름 찜한 작품
화면 위치 마이페이지 > 찜한 작품
화면 ID MYP-007
작성일 2026. 03. 04
9:41
찜한 작품

작품명

작가명

작품 타입

12,345,678 원

프라이빗 세일

작품명

작가명

작품 타입

12,345,678 원

작품명

작가명

작품 타입

12,345,678 원

작품명

작가명

작품 타입

12,345,678 원

1
2
9:41
찜한 작품

찜한 작품 내역이 없습니다

3
Description
0 화면 접근 조건
  • 찜한 작품은 로그인 사용자만 접근 가능
  • 비로그인 상태에서
    • 마이페이지 > 찜한 작품 클릭 시
    • 로그인 안내 모달(LOG-009) 노출
    • 로그인 완료 후 구매 내역 화면으로 이동
1 헤더 영역
  • 구성
    • 뒤로가기 버튼
    • 타이틀: 찜한 작품
  • 동작
    • 뒤로가기 버튼 클릭 시
      • 마이페이지(메인)(MYP-001)으로 이동
2 찜한 작품 리스트
  • 구성 요소
    • 작품 썸네일 이미지 / 작품 구분 태그(마켓/프라이빗세일) / 작품명 / 작가명 / 작품 타입 / 가격 정보 / 찜 아이콘(하트)
  • 동작
    • 작품 카드 탭 시
      • 해당 작품 상세 화면으로 이동 (MKT-013)
      • 마켓과 프라이빗의 세일은 프라이빗 작품 상세 화면
    • 프라이빗인 세일의 경우는 프라이빗의 작품 상세 확인
  • 찜 해제 시
    • 리스트에서 즉시 변경
    • 찜 해제 결과(마켓/프라이빗 세일 분류에서 반영)
    • 토스트 메시지에서 제거했습니다
    • 찜한 작품에서 제거된 전환의 상세를 취소 확인
  • 프라이빗 세일 표시
    • 리스트는 최신등 순으로 노출
  • 별도 작품을 영억(필터/탭 등) 시
    • 리스트에서는 유지
    • 상세 화면 진입 시 삭제 반영
3 찜한 작품 내역 없음 화면
  • 노출 조건
    • 찜한 작품 내역 데이터가 없는 경우
  • 노출 문구
    • 찜한 작품 내역이 없습니다
7 토스트 메시지 정의
  • 찜한 작품 로딩 실패시
    • "찜한 목록을 불러오지 못했어요. 잠시 후 다시 시도해주세요."
  • 네트워크 오류 발생 시
    • "네트워크 오류"잠시 후 다시 시도해주세요
8 공통 규칙
  • 찜한 작품은 조건 전용 화면
    • 작품명(현재 가격)은 최신 노출
  • 비로그인 접근 시
    • 로그인 안내 모달 노출 후 로그인 유도
    • 마이페이지 접근 시 오류가 아닌 정상 상태
    • 추가 행동 규제 없음
  • 본 화면은 마이페이지 공통 규칙(MYP-001)을 따른다

Design Output

UI 디자인 산출물

위 스토리보드 기획을 CHAART OS 디자인 토큰으로 변환한 결과물. 실제 구현 시 참조할 최종 디자인.

9:41
찜한 작품

작품명

작가명

작품 타입

12,345,678 원

프라이빗 세일

작품명

작가명

작품 타입

12,345,678 원

작품명

작가명

작품 타입

12,345,678 원

작품명

작가명

9:41
찜한 작품

찜한 작품 내역이 없습니다

Applied Design Tokens
요소Token값
전체 배경 --bg #FAFAF8
헤더 타이틀 --sans · 17px · 700 Pretendard, --charcoal, ls: -0.02em
작품 썸네일 --paper + linen 72x72, CHRT 워터마크
작품명 --sans · 14px · 700 --charcoal, ls: -0.01em
작가명 --sans · 12px · --text-secondary #555555
작품 타입 --mono · 11px · --text-muted TASA Orbiter, ls: 0.02em
가격 --sans · 14px · 700 --charcoal, ls: -0.01em
찜 아이콘 (활성) heart · --red-brand fill 18px, square/miter
PS 태그 뱃지 --mono · 9px · border TASA Orbiter, rgba(26,26,26,0.12) border
리스트 구분선 rgba(26,26,26,0.06) 1px solid
빈 상태 문구 --sans · 14px · --text-muted 중앙 정렬 + CHRT 모노그램
좌우 패딩 24px 전체 콘텐츠 마진
Design Description

Update History

2026.03.04초기 디자인 작성
0 화면 접근 조건
  • 찜한 작품은 로그인 사용자만 접근 가능
  • 비로그인 상태에서
    • 마이페이지 > 찜한 작품 클릭 시
    • 로그인 안내 모달(LOG-009) 노출
    • 로그인 완료 후 구매 내역 화면으로 이동
1 헤더 영역
  • 구성
    • 뒤로가기 버튼
    • 타이틀: 찜한 작품
  • 동작
    • 뒤로가기 버튼 클릭 시
      • 마이페이지(메인)(MYP-001)으로 이동
2 찜한 작품 리스트
  • 구성 요소
    • 작품 썸네일 이미지 / 작품 구분 태그(마켓/프라이빗세일) / 작품명 / 작가명 / 작품 타입 / 가격 정보 / 찜 아이콘(하트)
  • 동작
    • 작품 카드 탭 시
      • 해당 작품 상세 화면으로 이동 (MKT-013)
      • 마켓과 프라이빗의 세일은 프라이빗 작품 상세 화면
    • 프라이빗인 세일의 경우는 프라이빗의 작품 상세 확인
  • 찜 해제 시
    • 리스트에서 즉시 변경
    • 찜 해제 결과(마켓/프라이빗 세일 분류에서 반영)
    • 토스트 메시지에서 제거했습니다
    • 찜한 작품에서 제거된 전환의 상세를 취소 확인
  • 프라이빗 세일 표시
    • 리스트는 최신등 순으로 노출
  • 별도 작품을 영억(필터/탭 등) 시
    • 리스트에서는 유지
    • 상세 화면 진입 시 삭제 반영
3 찜한 작품 내역 없음 화면
  • 노출 조건
    • 찜한 작품 내역 데이터가 없는 경우
  • 노출 문구
    • 찜한 작품 내역이 없습니다
7 토스트 메시지 정의
  • 찜한 작품 로딩 실패시
    • "찜한 목록을 불러오지 못했어요. 잠시 후 다시 시도해주세요."
  • 네트워크 오류 발생 시
    • "네트워크 오류"잠시 후 다시 시도해주세요
8 공통 규칙
  • 찜한 작품은 조건 전용 화면
    • 작품명(현재 가격)은 최신 노출
  • 비로그인 접근 시
    • 로그인 안내 모달 노출 후 로그인 유도
    • 마이페이지 접근 시 오류가 아닌 정상 상태
    • 추가 행동 규제 없음
  • 본 화면은 마이페이지 공통 규칙(MYP-001)을 따른다
← 이전 화면: MYP-006 다음 화면: MYP-008 →