사용자 화면 · 마켓 / 판매등록

판매등록 - 직접 업로드 - 작품정보

MKT-010 · 2026. 03. 04

화면 이름 판매등록 - 직접 업로드 - 작품정보
화면 위치 마켓 > 판매 등록 > 직접업로드 > 작기명 > 이미지 > 보증서 > 각종 정보
화면 ID MKT-010
작성일 2026. 03. 04
9:41
마켓 - 판매 등록
취소

작품명 *

작품명을 입력해주세요

제작연도 *

YYYY

카테고리 *

선택

작품 재료

재료를 입력해주세요

작품 사이즈

가로 x 세로 (cm)

작가 서명

선택

컨디션 (상태)

상태를 입력해주세요

프레임 (액자)

선택
이전
다음
1
9:41
마켓 - 판매 등록
취소

구매처

구매처를 입력해주세요

구매일자

YYYY.MM.DD

구매금액

금액을 입력해주세요
삭제
이전
다음
2
9:41
마켓 - 판매 등록
취소

희망 판매 가격 *

가격을 입력해주세요

작품 설명

작품에 대한 설명을 입력해주세요

작품 설명이 자세할수록 많은 관심을 받아요

이전
완료
3
Description
0 화면 접근 조건
  • MKT-009에서 다음 클릭 시 진입
  • 직접 업로드 플로우 전용
  • 작품 기본정보 → 구매정보 → 가격/설명 순으로 단계 구성
1 작품 정보 입력 화면
  • 작품 기본 식별 정보
    • 작품명 (필수 *)
    • 제작연도 (필수 *)
    • 카테고리 (필수 *, 드롭다운)
    • 작품 재료
    • 작품 사이즈
    • 작가 서명 (드롭다운)
    • 컨디션 (상태 + info 아이콘)
    • 프레임 (액자, 드롭다운)
  • 필수 입력 필드 표시: * 마크
  • 입력값 유효성 검증 후 다음 단계 진행
2 작품 구매정보 입력화면
  • 구매처 / 구매일자 / 구매금액 필드
  • 해당 항목에 대한 토스트 메시지 노출
    • 구매일자 형식 오류 시 안내
    • 구매금액 숫자만 허용
3 희망 가격, 작품 설명 화면
  • 판매 조건 및 작품 소개를 입력하는 최종 단계
  • 희망 판매 가격 입력 필드 (필수 *)
    • 숫자만 입력 허용
    • 천 단위 콤마 자동 포맷
  • 작품 설명 입력 텍스트 영역
    • 자유 입력 (최대 1,000자)
    • 안내: "작품 설명이 자세할수록 많은 관심을 받아요"
  • 완료 버튼 클릭 시 MKT-011로 이동
4 토스트 메시지 정의
  • 필수 입력 미충족
    • "필수 항목을 모두 입력해주세요."
  • 가격 입력 기준
    • "숫자만 입력 가능합니다."
5 공통 규칙
  • 각 단계 전환 시 입력 데이터 유지
  • 상단 뒤로가기 버튼으로 이전 단계 이동
  • 직접 업로드 전용 (OCR 자동 입력 없음)
  • 완료 시 MKT-011 (판매등록 완료 화면)로 이동

Design Output

UI 디자인 산출물

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

9:41
마켓 - 판매 등록
취소

작품명 *

작품명을 입력해주세요

제작연도 *

YYYY

카테고리 *

선택

작품 재료

재료를 입력해주세요

작품 사이즈

가로 x 세로 (cm)

작가 서명

선택

컨디션 (상태)

상태를 입력해주세요

프레임 (액자)

선택
이전
다음
9:41
마켓 - 판매 등록
취소

구매처

구매처를 입력해주세요

구매일자

YYYY.MM.DD

구매금액

금액을 입력해주세요
삭제
이전
다음
9:41
마켓 - 판매 등록
취소

희망 판매 가격 *

가격을 입력해주세요

작품 설명

작품에 대한 설명을 입력해주세요

작품 설명이 자세할수록 많은 관심을 받아요

이전
완료
Applied Design Tokens
요소Token
전체 배경 --bg #FAFAF8
헤더 --sans · 14px · 600 Pretendard, --charcoal, square/miter 아이콘
입력 필드 --sans · 14px · border-bottom rgba(26,26,26,0.12) 하단 보더, 직각
드롭다운 chevron-down · square/miter --text-muted, 16px, 1.5px stroke
플레이스홀더 --text-muted #888888
info 아이콘 circle · --text-muted 14px, 1.5px stroke, vertical-align:middle
텍스트에어리어 --sans · 13px · border rgba(26,26,26,0.1) border, 직각, 200px height
이전/다음/완료 버튼 --charcoal bg · 50px 직각, 15px, 600 weight
좌우 패딩 24px 전체 콘텐츠 마진
Design Description

Update History

2026.03.04초기 디자인 작성
0 화면 접근 조건
  • MKT-009에서 다음 클릭 시 진입
  • 직접 업로드 플로우 전용
  • 작품 기본정보 → 구매정보 → 가격/설명 순으로 단계 구성
1 작품 정보 입력 화면
  • 작품 기본 식별 정보
    • 작품명 (필수 *)
    • 제작연도 (필수 *)
    • 카테고리 (필수 *, 드롭다운)
    • 작품 재료
    • 작품 사이즈
    • 작가 서명 (드롭다운)
    • 컨디션 (상태 + info 아이콘)
    • 프레임 (액자, 드롭다운)
  • 필수 입력 필드 표시: * 마크
  • 입력값 유효성 검증 후 다음 단계 진행
2 작품 구매정보 입력화면
  • 구매처 / 구매일자 / 구매금액 필드
  • 해당 항목에 대한 토스트 메시지 노출
    • 구매일자 형식 오류 시 안내
    • 구매금액 숫자만 허용
3 희망 가격, 작품 설명 화면
  • 판매 조건 및 작품 소개를 입력하는 최종 단계
  • 희망 판매 가격 입력 필드 (필수 *)
    • 숫자만 입력 허용
    • 천 단위 콤마 자동 포맷
  • 작품 설명 입력 텍스트 영역
    • 자유 입력 (최대 1,000자)
    • 안내: "작품 설명이 자세할수록 많은 관심을 받아요"
  • 완료 버튼 클릭 시 MKT-011로 이동
4 토스트 메시지 정의
  • 필수 입력 미충족
    • "필수 항목을 모두 입력해주세요."
  • 가격 입력 기준
    • "숫자만 입력 가능합니다."
5 공통 규칙
  • 각 단계 전환 시 입력 데이터 유지
  • 상단 뒤로가기 버튼으로 이전 단계 이동
  • 직접 업로드 전용 (OCR 자동 입력 없음)
  • 완료 시 MKT-011 (판매등록 완료 화면)로 이동
← 이전 화면: MKT-009 다음 화면: MKT-011 →