사용자 화면 · 프라이빗 세일

프라이빗 세일 — 작품 팔아요

PRS-003 · 2026. 03. 04

화면 이름 프라이빗 세일 - 작품 구해요 등록 화면
화면 위치 프라이빗 세일 > 작품 팔아요 버튼
화면 ID PRS-003
작성일 2026. 03. 04
9:41
작품 팔아요 취소
* 작가 이름
작가 이름을 입력해주세요
* 작품 도상
작품의 도상을 선택해주세요
* 작품 사이즈(호)
작품 사이즈를 입력해주세요
* 판매 희망 금액
판매 희망 금액을 입력해주세요
구매 희망 금액을 입력해주세요
지금 작품 정보를 입력할 수 없어요. (담당자 연결)
취소
다음
1-1
1-2
1-3
1-4
1-5
1-6
1-7
9:41
작품 팔아요 취소
* 작가 이름
작가 이름을 입력해주세요
* 작품 도상
작품의 도상을 선택해주세요
* 작품 사이즈를 입력해주세요
* 구매 희망 금액을 입력해주세요

어쿠님 전용 매니저가 1일 이내 연락드립니다

고객님의 개인정보는 판매 작품 문의 외에 활용되지 않습니다.

성함을 입력해주세요
연락처를 입력해주세요
개인정보 제공 동의 (필수)
본래가기
확인
2
9:41

전용 매니저가 신속하게 연락드리겠습니다

확인
3
Description
0 화면 접근 조건
  • PRS-001 화면에서 "작품 팔아요" 버튼 클릭 시 진입
  • 로그인 사용자만 접근 가능, 비 로그인 시 로그인 화면으로 이동(LOG-009)
  • 본 화면 진입 시 기존 입력된 데이터는 초기화하여 노출
1-1 헤더
  • 구성
    • 뒤로가기 버튼
    • 타이틀: "작품 팔아요"
    • 취소 텍스트 버튼
  • 동작
    • 뒤로가기 버튼 클릭 시 입력 데이터 있는 경우 취소 모달 노출(PRS-004)
    • 입력 데이터 없는 경우 PRS-001 화면으로 이동
1-2 작가 이름 입력필드
  • 구매 희망 작가명 입력
    • 구성
      • 필수값 표시: "* 작가 이름"
      • 플레이스홀더: "작가 이름을 입력해주세요"
  • 동작
    • 텍스트 직접 입력 가능
    • 자동완성 미지원
1-3 작품 도상 드롭다운/선택
  • 구성
    • 필수값 표시
    • 플레이스홀더: "작품의 도상을 선택해주세요"
  • 동작
    • 클릭 시 선택 목록 노출
    • 복수 선택 불가, 단일 선택만 허용
1-4 작품 사이즈 입력필드
  • 필수 작품 크기 입력
  • 호 사이즈를 입력
  • 숫자만 입력 가능
1-5 판매 금액 설정 필드
  • 구성
    • 플레이스홀더: "판매 희망 금액을 입력해주세요"
  • 동작
    • 숫자만 입력 가능
    • 0원 단위로 입력
1-6 작품 원작 등록/라디오버튼
  • 라디오버튼 2종
    • 1-2-1: 5점미만 필드 미생성
    • 1-2-1-5 점미만 필드 생성
    • 라디오 선택에 따라 "등록" 버튼 표시 활성화 관련
1-7 취소/다음 버튼
  • 입력 후 다음 단계 전환
    • 취소 버튼
      • 입력 데이터 있으면 취소 안내 모달 노출(PRS-004)
      • 입력 데이터 없으면 바로 PRS-001 이동
    • 다음 버튼
      • 필수값이 모두 입력된 경우만 활성화
      • 다음 화면(판매 문의 바텀시트) 노출
2 판매 문의 바텀시트
  • 판매 요청 최종 확인 및 연락처 수집
    • 안내 문구
      • "어쿠님 전용 매니저가 1일 이내 연락드립니다"
    • 보조 문구
      • "고객님의 개인정보는 판매 작품 문의 외에 활용되지 않습니다."
  • 입력 필드: 성함, 연락처, 개인정보 동의
  • 버튼
    • 본래가기: 바텀시트 닫힘
    • 확인: 등록 완료 화면(3) 전환
3 작품 판매 요청 완료 화면
  • 구성
    • 체크 아이콘
    • 안내 문구: "전용 매니저가 신속하게 연락드리겠습니다"
  • 동작
    • 확인 버튼 클릭 시
      • PRS-001 화면으로 이동
4 토스트 메시지 정의
  • 필수값 위반 상태에서 "다음" 버튼 클릭 시
    • "작품 정보를 입력해주세요" 토스트 노출
  • 개인정보 미동의시 "확인" 클릭 시
    • "개인정보 제공에 동의해주세요" 토스트 노출
  • 서버 지연 임시
    • "잠시 후 다시 시도해주세요" 토스트 노출
5 공통 규칙
  • PRS-003 작성 미완료시 바텀시트 화면 유지, 화면 진출 미수행
  • 배경 스크롤은 바텀시트 노출 시 잠김
  • 입력 화면의 필수 입력 항목 미기재 시 다음 버튼 비활성 유지
  • 입력 데이터는 사용자가 직접 입력만으로 작성

Design Output

UI 디자인 산출물

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

9:41
작품 팔아요 취소
* 작가 이름
작가 이름을 입력해주세요
* 작품 도상
작품의 도상을 선택해주세요
* 작품 사이즈
작품 사이즈를 입력해주세요
* 판매 희망 금액
판매 희망 금액을 입력해주세요
구매 희망 금액을 입력해주세요
지금 작품 정보를 입력할 수 없어요. (담당자 연결)
취소
다음
9:41
작품 팔아요

어쿠님 전용 매니저가 1일 이내 연락드립니다

고객님의 개인정보는 판매 작품 문의 외에 활용되지 않습니다.

성함을 입력해주세요
연락처를 입력해주세요
개인정보 제공 동의 (필수)
본래가기
확인
9:41

전용 매니저가 신속하게 연락드리겠습니다

확인
Applied Design Tokens
요소Token값
전체 배경 --bg #FAFAF8
헤더 타이틀 --sans · 17px · 700 Pretendard, --charcoal, center
취소 텍스트 버튼 --sans · 13px · --text-secondary 우측 정렬, letter-spacing: -0.005em
필드 라벨 --sans · 11px · 600 Pretendard, --charcoal, 필수: --red-brand *
입력 필드 48px height · --charcoal 4% bg 직각 (R=0), border: rgba(26,26,26,0.07)
안내 아이콘 info · 14px · square --text-muted, 1.5px stroke
바텀시트 배경 --bg 직각 (R=0)
딤 오버레이 --charcoal 45% rgba(26,26,26,0.45)
확인 버튼 --charcoal bg · 50px 직각, 15px, 600 weight
체크 아이콘 (완료) 72px 원형 · square/miter --charcoal border + stroke
좌우 패딩 24px 전체 콘텐츠 마진
Design Description

Update History

2026.03.04초기 디자인 작성
0 화면 접근 조건
  • PRS-001 화면에서 "작품 팔아요" 버튼 클릭 시 진입
  • 로그인 사용자만 접근 가능, 비 로그인 시 로그인 화면으로 이동(LOG-009)
  • 본 화면 진입 시 기존 입력된 데이터는 초기화하여 노출
1-1 헤더
  • 구성
    • 뒤로가기 버튼
    • 타이틀: "작품 팔아요"
    • 취소 텍스트 버튼
  • 동작
    • 뒤로가기 버튼 클릭 시 입력 데이터 있는 경우 취소 모달 노출(PRS-004)
    • 입력 데이터 없는 경우 PRS-001 화면으로 이동
1-2 작가 이름 입력필드
  • 구매 희망 작가명 입력
    • 구성
      • 필수값 표시: "* 작가 이름"
      • 플레이스홀더: "작가 이름을 입력해주세요"
  • 동작
    • 텍스트 직접 입력 가능
    • 자동완성 미지원
1-3 작품 도상 드롭다운/선택
  • 구성
    • 필수값 표시
    • 플레이스홀더: "작품의 도상을 선택해주세요"
  • 동작
    • 클릭 시 선택 목록 노출
    • 복수 선택 불가, 단일 선택만 허용
1-4 작품 사이즈 입력필드
  • 필수 작품 크기 입력
  • 호 사이즈를 입력
  • 숫자만 입력 가능
1-5 판매 금액 설정 필드
  • 구성
    • 플레이스홀더: "판매 희망 금액을 입력해주세요"
  • 동작
    • 숫자만 입력 가능
    • 0원 단위로 입력
1-6 작품 원작 등록/라디오버튼
  • 라디오버튼 2종
    • 1-2-1: 5점미만 필드 미생성
    • 1-2-1-5 점미만 필드 생성
    • 라디오 선택에 따라 "등록" 버튼 표시 활성화 관련
1-7 취소/다음 버튼
  • 입력 후 다음 단계 전환
    • 취소 버튼
      • 입력 데이터 있으면 취소 안내 모달 노출(PRS-004)
      • 입력 데이터 없으면 바로 PRS-001 이동
    • 다음 버튼
      • 필수값이 모두 입력된 경우만 활성화
      • 다음 화면(판매 문의 바텀시트) 노출
2 판매 문의 바텀시트
  • 판매 요청 최종 확인 및 연락처 수집
    • 안내 문구
      • "어쿠님 전용 매니저가 1일 이내 연락드립니다"
    • 보조 문구
      • "고객님의 개인정보는 판매 작품 문의 외에 활용되지 않습니다."
  • 입력 필드: 성함, 연락처, 개인정보 동의
  • 버튼
    • 본래가기: 바텀시트 닫힘
    • 확인: 등록 완료 화면(3) 전환
3 작품 판매 요청 완료 화면
  • 구성
    • 체크 아이콘
    • 안내 문구: "전용 매니저가 신속하게 연락드리겠습니다"
  • 동작
    • 확인 버튼 클릭 시
      • PRS-001 화면으로 이동
4 토스트 메시지 정의
  • 필수값 위반 상태에서 "다음" 버튼 클릭 시
    • "작품 정보를 입력해주세요" 토스트 노출
  • 개인정보 미동의시 "확인" 클릭 시
    • "개인정보 제공에 동의해주세요" 토스트 노출
  • 서버 지연 임시
    • "잠시 후 다시 시도해주세요" 토스트 노출
5 공통 규칙
  • PRS-003 작성 미완료시 바텀시트 화면 유지, 화면 진출 미수행
  • 배경 스크롤은 바텀시트 노출 시 잠김
  • 입력 화면의 필수 입력 항목 미기재 시 다음 버튼 비활성 유지
  • 입력 데이터는 사용자가 직접 입력만으로 작성
← 이전 화면: PRS-002 다음 화면: PRS-004 →