2. 14년 차, IT서비스 기획자이자 프로덕트 매니저
법학과 행정학 전공
온라인 광고 AE로 IT업계 입문
버디버디, 다날 등을 거쳐 12번째 회사 재직 중
그러나 단, 한번도 사수가 없었음
필리핀과 중국에서 2번의 해외 근무 경력
약 3년 간의 스타트업 창업 경험
다양한 서비스 및 플랫폼 기획/구축/운영 경험
유세균무기
@germweapon
https://germweapon.tistory.com
5. 문제 인식
(목표 정의)
시장조사
& 벤치마킹
서비스 분석
정책결정
(요구사항 정의)
서비스 기획
커뮤니케이션
& 매니징
QA
매뉴얼
& 가이드 작성
그로스해킹 서비스 고도화
IT서비스 기획자의 역할
설마 이것이 끝이라고 생각했다면...
어쨌건 Welcome to IT World! ;)
요구사항 정의서 스토리보드
매뉴얼 분석 환경 설계 매뉴얼
사용자 및 환경 분석서
6. 사용자 대변 가치 판단 커뮤니케이션
사람에 대한
관심과 호기심,
공감 능력
합리성,
올바른 가치관과
직업윤리
논리력,
제너럴리스트
이자
스페셜리스트
IT서비스 기획자에게 필요한 역량
9. 관련 법령
외부 환경
(생태계)
외부 환경
(경쟁사)
서비스 정책 작성
불가항력적인 요소를 우선 고려하며 정책을 결정하고 문서로 작성
작성된 정책 문서를 공유하며 합의를 이룰 때까지 수정 및 피드백을 반복
내부 환경 및 리소스 요구사항 정의서
=
구분 설명
관련 법령 국내법은 대륙법 계통의 열거주의로 대다수 법에서 정하고 있기 때문에 서비스 기획 시 관련 법령을 먼저 찾아보는 것이 중요함
산업 생태계 대기업이 아니고서야 산업 생태계를 단숨에 바꾸기 어렵기 때문에 산업 생태계를 살핌
경쟁사 경쟁사를 살펴보며 Pain point를 분석하고, 관련 법령 및 타사 정책을 살피고, 경쟁력 등을 확보
내부 환경 및 리소스 말하지 않아도 알아요... OTL
10. 법령 및 직업윤리 교육의 필요성
IT서비스 기획자에게 법령 및 직업윤리 교육이 필요한 이유는
서비스 기획이 법의 테두리 안에서 현행법을 준수하며 수많은 정책을 만들고 가치 판단을 해야 하는 과정의 연속이기 때문
구분 설명
인터넷 산업 진흥·촉진 관련
정보통신산업 진흥법, 전자문서 및 전자거래 기본법, 전자금융거래법, 전자무역 촉진에 관한 법률, 콘텐츠산업 진흥법, 이러닝(전자학습)산업발전법, 게임산업 진흥에 관한 법률, 신문 등의 진흥에 관한 법률, 인터넷 멀티미디어 방송사
업법, 위치정보의 보호 및 이용 등에 관한 법률, 유비쿼터스도시의 건설 등에 관한 법률, 정보통신 진흥 및 융합 활성화 등에 관한 특별법, 공공데이터의 제공 및 이용 활성화에 관한 법률 등
인터넷 서비스 기반 조성 관련 정보통신망 이용촉진 및 정보보호 등에 관한 법률, 전자서명법, 정보통신 진흥 및 융합 활성화 등에 관한 특별법, 전기통신사업법, 전기통신기본법, 인터넷주소자원에 관한 법률, 국가정보화 기본법 등
인터넷 정보보호 관련 정보통신망 이용촉진 및 정보보호 등에 관한 법률, 정보통신기반 보호법, 전자정부법, 산업기술의 유출방지 및 보호에 관한 법률 등
인터넷 이용자보호 관련
정보통신망 이용촉진 및 정보보호 등에 관한 법률, 개인정보 보호법, 위치정보의 보호 및 이용 등에 관한 법률, 전자상거래 등에서의 소비자보호에 관한 법률, 소비자보호법, 약관의 규제에 관한 법률, 국가정보화 기본법, 통신비밀보호
법, 신용정보의 이용 및 보호에 관한 법률, 저작권법, 전자정부법, 전자금융거래법, 특정 금융거래정보의 보고 및 이용 등에 관한 법률, 전기통신금융사기 피해금 환급에 관한 특별법 등
11. 관련 법령을 모르면...
불법 서비스를 기획하고,
불법 서비스를 개발하여,
불법적으로 운영하며 회사가 망한다.
내용 적용 대상 관련 법령
이용약관 등의 작성 약관 작성 시 약관의 규제에 관한 법률
개인정보의 보호와 관련된 여러 규정
개인정보의 수집 및 이용 동의, 수집 및 이용 제한, 관리 및 파기 방법 등
모든 온라인 서비스 운영 시 정보통신망 이용촉진 및 정보보호 등에 관한 법률
전자상거래 운영과 관련된 여러 규정
- 사이버몰의 운영, 소비자에 관한 정보의 이용, 통신판매업자의 신고, 청약확
인, 재화 등의 공급, 청약철회, 소비자 권익의 보호 등
전자상거래 운영 시 전자상거래 등에서의 소비자보호에 관한 법률
개인정보보호 관련 손해배상책임보험 또는 공제 가입
연간 매출액 5천만원 이상, 개인정보를 저장 및 관리하고 있는 사용자수가 일 평균 1천명 이상
2019년 6월 11일 개정되어 2019년 말까지 계도기간
정보통신망 이용촉진 및 정보보호 등에 관한 법률 시행령 제 18조 2항(손해배상을 위한
보험 등 가입 대상자의 범위 및 기준 등)
(상품판매대금에 관한)이행보증보험 또는 에스크로 가입 상품의 배송 트랙킹이 되지 않거나 일정기간 내 상품이 제공되지 않는 경우 전자상거래 등에서의 소비자보호에 관한 법률 제 24조(소비자피해보상보험계약 등)
상품 상세 페이지 내 상품 정보 고시 통신판매업자가 소비자에게 재화 등을 판매할 시 전자상거래 등에서의 상품 등의 정보제공에 관한 고시
잡지 발행 시 등록 및 신고, 관련 정보 고시 동일한 제호로 연 2회 이상 정기간행물(전자간행물 포함) 발행 시 등록 및 신고 필요 잡지 등 정기간행물의 진흥에 관한 법률
15. 버튼(Button)의 종류
버튼도 다 같은 버튼이 아니다! :(
구분 Tag 설명
링크 버튼 <a href=“”></a> 페이지 이동
실행 버튼 <button></button> 자바스크립트 실행
전송 버튼 <input type=“submit> 입력값을 서버에 전송
17. 링크(Link)의 종류
링크면 링크지,
링크에 무슨 종류가 있다는 거예요! :(
구분 설명 사용 예시
단순 링크(Simple Link) 웹사이트의 URL https://www.google.co.kr
딥 링크
(Deep Link)
Web Deep Link 웹사이트의 특정 페이지로 연결 https://www.google.co.kr/maps?hl=ko&tab=rl
URI Schemes
개발자에 의해 정의된 모바일 앱 내 맞춤 URI(Uniform Resource Identifier) 스킴
웹으로 치자면 http:// 또는 http:// 스킴과 같다고 보면 됨
앱이 설치되어 있지 않거나 두 개 이상의 앱이 동일한 URI를 사용할 경우 출동하는 현상이 발생
앱 내 특정 페이지로 이동
다이렉트 딥링크(Direct Deep Link) ex) iOS의 유니버설 링크, Android의 앱 링크
앱이 설치되어 있는 경우, 앱 내 특정 페이지로 이동
앱이 설치되어 있지 않은 경우, 앱스토어 또는 구글 플레이 스토어로 이동
디퍼드 딥링크(Deferred Deep Link) 다이렉트 딥링크가 발전된 형태로 iOS, Android OS별로 따로 딥링크를 생성해야 함
앱이 설치되어 있는 경우, 앱 내 특정 페이지로 이동
앱이 설치되어 있지 않은 경우, 앱스토어 또는 구글 플레이 스토어 이동 후 사용자가 앱을 설치
및 실행하면 앱 내 특정 페이지로 이동
동적 링크(Dynamic Link)
또는 원링크(One Link)라고 부르기도 함
동적 링크로 다양한 플랫폼(Android, iOS, Web, Unity 등)에서 개발자가 원하는 다양한 링크 연결
이 가능
OS별로 구현해야 하는 디퍼드 딥링크와는 다름
ex) 구글의 Firebase에서 제공하는 Dynamic Link
앱이 설치되어 있는 경우, 앱 내 특정 페이지로 이동
앱이 설치되어 있지 않은 경우, 앱스토어 또는 구글 플레이 스토어 이동 후 사용자가 앱을 설치
및 실행하면 앱 내 특정 페이지로 이동
모바일 웹에서 해당 앱이 설치되어 있지 않은 경우에도 웹의 특정 콘텐츠 페이지(iOS,
Android 설치 유도 페이지 등)로 연결이 가능함.
임베디드 링크(Embedded Link)
다른 웹사이트의 내용을 <embed>, <object>, <video>, <audio> 태그 등을 사용하여 자신의 사이
트에 불러와서 띄움
<embed>, <object>, <video>, <audio> 태그
프레이밍 링크(Framing Link) 웹 페이지에 프레임(frame)을 만든 후 그 안에 다른 웹사이트의 내용을 불러와서 띄움. (frame)
18. 인풋 박스 (Input Box)
Placeholder Message (Label)
Validation message
1) 기본 인풋 박스
2) 포커스 인 상태
Label
germ
3) 텍스트 입력 시 상태
Label
germ
4) 포커스 아웃 시 Valid 상태
Label
●●●m
3) 입력 텍스트 숨김 시
Label
germ
4) 포커스 아웃 시 Invalid 상태
Label
Placeholder massage
인풋 박스 구성요소
Label
Validation message
01 - -
카드번호
- - -
이메일
ge
ge@gmail.com
ge@naver.com
ge@daum.net
ge@nate.com
형식이 있는 인풋 박스의 Input Masking 처리
19. 글자 길이(Length)의 처리
단어나 문장이 길 때 어떻게 처리하지?
게다가 글로벌 서비스라면 언어에 따라 단어나 문장의 길이가 제각각인데... :(
구분 설명 사용 예시
아이콘 처리
디자인 아이콘이나 픽토그램 등의 직관적인 이미지로 대체
특히 글로벌 서비스의 경우, 언어에 따라 글자 길이가 너무 길어질 수 있어 아이콘 처리를 많이 함
아이콘의 모양이나 색상 등에 따라 국가별로 의미 전달이 다르거나 논란의 소지가 있을 수 있기 때문에 세심한 주의가 필요
메뉴명, 텍스트 버튼 등
줄바꿈 처리
아이콘 처리가 불가능하거나 말줄임 처리 후 더보기 버튼 등을 통해 표현이 불가능한 경우에는 줄바꿈 처리를 통해 전문을 표시
줄바꿈 처리의 경우, UI가 깨질 수 있기 때문에 퍼블리싱이나 UI 설계 시 대응 필요
인풋 박스 라벨, 닉네임 등
말줄임 처리 [더보기] 버튼을 통해 추가적인 표시가 가능한 경우 말줄임 처리를 통해 고정된 Width/Height 내에서 표현 컨텐츠 내용 등
그라데이션 처리
글자가 잘리려는 영역에서 희미하게 그라데이션 처리함
키보드 이동이나 마퀴 태그(Marquee)와 같은 효과 등을 통해 전문 확인이 가능
인풋 박스 내 우측에 X 버튼 등의 아이콘이나 버튼 등이 위치한 경우
기타 폰트 사이즈 조정, 표시 방법 변경 등
21. PATH Form(Input Box 및 Button) 설명 PAGE CODE FO-CM-00-01 Function Description
1
상태에 따른 인풋 박스 처리(모든 인풋 박스 공통)
1) 기본 인풋 박스
- UI상 Placeholder Massage와 Label을 동일하게 사용
하여 포커스 인 시 Placeholder Message가 Label 자리로
이동하는 효과로 처리
2) 포커스 인
- Placeholder Message가 Label 자리로 이동 시 Label
텍스트 사이즈 및 컬러 변경
- 포커스 인 시 border 두껍게 처리 및 쉐도우 효과
3) 포커스 인 + 텍스트 입력
- 인풋 박스 우측에 Cancel 버튼 표시
- 포커스 인 시 border 두껍게 처리 및 쉐도우 효과
4) 포커스 아웃 시
- 입력값의 형식 유효성을 체크하여 Validation에 따른 인
풋 박스 처리
- Valid 상태의 경우 border 파란색 처리
- Invalid 상태의 경우 : border 붉은색 처리
5) Invalid 인풋 박스에서 포커스 인 시
-border 속성 변경 : 컬러 원복 및 border 두껍게 처리 및
쉐도우 효고
- Validation Message 초기화
2
인풋 마스킹 처리
: 휴대폰 번호, 카드번호 등 입력값의 형식 체크가 필요한 인
풋 박스의 경우, 인풋 마스킹을 통해 형식에 맞게 입력 지원
1) 기본 인풋 박스
2) 포커스 인 상태
3) 텍스트 입력 시 상태 3) 입력 텍스트 숨김 시
4) 포커스 아웃 시 Valid 상태 4) 포커스 아웃 시 Invalid 상태
1
2
5) Invalid 상태에서 포커스 인 시
Placeholder Message (Label)
Label
germ
Label
germ
Label
●●●m
Label
Validation message
germ
Label
Label
휴대폰 번호
01 - -
카드번호
- - -
형식이 있는 입풋 박스의 Input Masking 처리
이메일
ge
ge@gmail.com
ge@naver.com
ge@daum.net
ge@nate.com
22. PATH Form(Input Box 및 Button) 설명 PAGE CODE FO-CM-00-02 Function Description
1
Button Type 정의(모든 버튼 공통)
1) Small 버튼 : 컨텐츠 내 위치
- Height값 고정
- 버튼별 Width값 고정
2) Basic 버튼 : 팝업(디자인 팝업, 다이얼로그, 모달) 등에
서 사용
- Height값 고정
- Minimum Width Fix, Width값 가변(Default Padding
값 적용) : 최소 width값을 정하고 텍스트의 length가 그
width값을 넘어가는 경우에는 공통된 좌우 padding값을
유지한 상태에서 버튼의 width값이 늘어나게 처리
3) Large 버튼 : 페이지 내 액션 버튼
- Height값 고정
- 버튼별 Width값 고정
Button Color 구분
- 버튼 컬러는 다음과 같이 최대 4가지 타입으로 지정
1) 저장, 등록, 제출, 생성, 추가, 확인 등의 버튼에 사용하는
컬러
2) 뒤로가기, 취소, 별도 페이지 이동 등의 액션이 없는 경우
의 버튼에 사용하는 컬러
3) 탈퇴 등의 버튼에 사용하는 레드 컬러
4) 모든 버튼이 비활성화(Disabled) 상태일 때 사용하는 회
색 컬러
2
필수 입력값 입력에 따른 Submit 버튼 변경 처리(모든
Submit Btn 공통)
- 필수 입력값에 유효한 입력(형식 유효성)을 모두 한 경우
에 한해 다음과 같이 Submit 버튼을 활성화
- Submit 버튼의 경우, Progress Indication 표시
3
Validation Message 처리(서비스 공통)
1) 개별 인풋 박스의 유효성 체크 : 인풋 박스 하단에 메시지
표시
2) 서버를 통해 다중 입력값의 데이터 유효성을 Return 받
은 경우 처리
- 다이얼로그 팝업을 통해 표시
- 이 경우, 팝업 내 [확인] 버튼 클릭 시 팝업이 닫히면서
Invalid한 입력값을 초기화
예, 초기화합니다
아니요
확인
1
2) Basic 버튼
로그인
로그인
3) Large 버튼
복사하기
1) Small 버튼
로그인
로그인
최소 width 값
로그인
이메일
로그인하기
비밀번호 찾기 〉
로그인하기
Yes
Title
Message ~
2
3
다이얼로그 팝업
No, thanks
이메일
비밀번호
자동 로그인하기
Text Length가 길어진 경우 동일한 Padding값을 유지한 상태에서 버튼 Width 값을 늘려 처리
23. PATH 기타 기능 설명 PAGE CODE FO-CM-00-03 Function Description
1
Select 박스/드롭다운 메뉴 UI(모든 필터 박스 공통)
- 선택되어 있는 메뉴의 경우 BG 컬러를 변경, 마우스 오버
시 별도 구분 처리(좌측 라인으로 강조 등)
- 메뉴 10개 초과 시, 스크롤 처리
2
필터/검색 영역 내 검색 기능
- 검색 아이콘 버튼 클릭 시, 검색 박스 활성화
- 검색어 입력 없이 검색 박스 이외 영역 클릭 시, 검색 박스
가 닫힘
3
차트 그리기(모든 차트 공통)
- 페이지 진입 시 애니메이션 효과와 함께 차트를 그립니다.
- 애니메이션 효과
: Start time 500ms, Delay time 1,000ms
- (권장) 마우스 오버 시, 해당 차트 영역이 확장되며 데이터
레이블 및 수치가 표시됨
- 특정 차트에는 클릭 액션을 추가할 수 있으며, 해당 기능은
각 차트에서 별도 설명하도록 함
4
토스트 메시지(모든 토스트 메시지 공통)
- 메시지 창에 오퍼시티 적용
- 좌하단 Margin 60px 공통
- 토스트 메시지 창 Width 및 Close 버튼 영역 Width 값 고
정
- Toast message가 길어서 한 줄 이상 넘어가는 경우 위로
height가 늘어나며, Close 버튼은 Width값 내에서 상하 센
터 정렬해주시기 바랍니다.
- 토스트 메시지는 Close 버튼 클릭과 관계 없이 8,000ms
경과 후 자동으로 사라지게 처리
* 토스트 메시지 중복 시 처리
- 아래에서 과거 토스트 메시지를 밀어 올리며 최신 토스트
메시지가 하단에 표시됨
원화 비트코인 이더리움 이오스
12,735,365
KRW
3
All ▼
All ▲
All
Menu1
Menu2
Menu3
1
All ▲
All
Menu1
Menu2
Menu3
1) 기본 Select 박스/드롭다운 메뉴
2) 마우스 포커스 인 시 3) 마우스 오버 시
☌
|
|
Placeholder message
이더ㄹ
☌☌
2
☌
Placeholder message
Toast message
4
60px
60px
Width Fixed
Width Fixed
Variable
Toast message가 두 줄 이상 넘어가는 경우 토스트 메시지의 하단 위치값은 고정
상태에서 Height를 늘려 처리합니다.
실명인증 | 닫기
Close
25. PATH UI Grid 설명
Menu1 Menu2 Menu3 Menu4 Meun5 ●●●Logo
Content Title Area
3
Sub Menu1
Sub Menu2
Sub Menu3
Sub Menu4
Sub Menu5
상단 네비게이션 바(GNB)
〈
사이드 메뉴 바(SNB)
게재 위치 제목 지역ㅣ기간 시작일시 ▼ 종료일시 ▼ 상태 PV ▼ UV ▼ 관리자 최종 수정 ▼
서비스 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 전체ㅣ동시 2022-02-09 12:00 - 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ지역별 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 N 전체ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 N 전체ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 국가별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
검색전체 게재면 ▼전체 123 ▼┃ 등록중 34 ┃ 예약 13 ┃ 진행중 34 ┃ 종료 34 ┃ 휴지통 34
43 19 :상태 업데이트일괄 변경 ▼ 삭제
43 19 :상태 업데이트일괄 변경 ▼ 삭제
+
컨텐츠(Contents) 영역
타이틀 영역
주요 버튼 영역
주요 버튼 영역
10개씩 ▼필터링 및 검색 영역
26. PATH UI Grid 설명_1
〈
Logo Menu1 광고 회원 상품 보고서 관리자
Function Description
1
알림 기능
: 알림 버튼 클릭 시 알림 영역이 펼쳐지고 재클릭 시 접힘
- 알림창 영역 외 클릭 시 접힘
2
좌측 사이드 메뉴 영역 접기 및 펼치기 버튼
: 사이드 메뉴를 접으면 텍스트 메뉴명이 아이콘으로 표시
- 접기/펼치기 설정값은 마지막 값을 쿠키나 세션 스토리지
에 저장해서 항상 마지막 설정값으로 표시
3 프로필 드롭다운 메뉴 버튼
17
1
X 알림
전체 보기
모두 읽은 것으로 표시
3
알림 제목 표시 2022-02-09 12:00
알림 제목 표시 2022-02-09 12:00
알림 제목 표시 2022-02-09 12:00
알림 제목 표시 2022-02-09 12:00
알림 제목 표시 2022-02-09 12:00
성명 또는 닉네임 표시
나의 계정
관리자 설정
로그아웃
1
2
3
27. PATH UI Grid 설명_2
Logo
공지사항 등록일시
공지 제목 표시 N 2022-02-08 17:00
공지 제목 표시 N 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지 제목 표시 2022-02-08 17:00
공지사항
나의 계정
서비스 정책
3
Function Description
1
Height와 Margin
- 영역 Height
: GNB와 SNB의 Bar 높이, Title 영역, 필터링 및 검색 영역,
주요 액션 버튼 영역, List 영역 등의 Height를 모두 동일한
높이값으로 맞춤
- 버튼 Margin
: 필터링 및 검색 영역과 주요 액션 버튼 영역에서 버튼의 상
하좌우 마진값을 동일한 마진값으로 맞춤
2
Scroll Area
- 파란색 점선 영역이 스크롤 영역이며 스크롤은 마우스 이
동시 표시되고 이동이 없으면 5초 후 사라짐
서비스 광고 회원 코인 보고서 관리자3
전체 123
공지사항
검색
43 19 :
43 19 :
〈
모두 읽은 것으로 표시
모두 읽은 것으로 표시
컨텐츠(Contents) 영역
1
2
28. 게재 위치 제목 지역ㅣ기간 시작일시 ▼ 종료일시 ▼ 상태 PV ▼ UV ▼ 관리자 최종 수정 ▼ 옵션
서비스 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 전체ㅣ동시 2022-02-09 12:00 - 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ지역별 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 N 전체ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 N 전체ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 국가별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
PATH Table structure 설명_1
검색전체 게재면 ▼전체 123 ▼┃ 등록중 34 ┃ 예약 13 ┃ 진행중 34 ┃ 종료 34 ┃ 휴지통 34
Function Description
1 페이지 타이틀 표시
2 캠페인 추가 버튼
3 상태에 따른 필터링 버튼 영역
4 항목에 따른 필터링 및 검색 박스 영역
5 주요 액션 버튼 영역
6
페이징 버튼 영역
1. 9 : : 좌우 맨 마지막 페이지로 이동
2. 34 : 좌우 1 페이지씩 이동
3. 숫자 표시 박스에 해당 페이지 번호가 표시되고 키보드 입
력을 통해 특정 페이지로 빠른 이동 지원
- 숫자만 입력 가능
- 숫자 3자리까지 표시하고 넘어갈 시 박스 내 밀림 처리
- 존재하지 않는 페이지 숫자 입력 시 페이지 이동 없이 현재
페이지 번호로 원복
7 캠페인(리스트) 선택 체크 박스 영역
8
항목별 소팅 버튼 영역
- 위/아래/꺼짐 3가지 타입의 아이콘으로 처리
- 표시 순서 :↕ ▶ ∧ ▶ ∨ ▶ ↕
9
리스트 옵션 버튼 영역
- 개별 리스트에 마우스 오버 시 맨 우측에 리스트 옵션 버튼
표시. 옵션 버튼을 클릭하면 해당 리스트에 대해 개별 처리가
가능한 드롭다운 메뉴 표시
43 19 :상태 업데이트일괄 변경 ▼
Button Description
A
[일괄 변경] 셀렉트 박스
- 전체 또는 특정 캠페인의 선택 체크 박스에 체크 후, [일괄
변경] 셀렉트 박스에서 변경할 상태를 선택하고 [상태 업데
이트] 버튼을 클릭하면 선택한 캠페인(들)의 상태값이 일괄
변경됨
- 개별 캠페인의 상태 변경보다 일괄 변경이 우선
: 리스트에서 개별 캠페인의 상태값을 ‘종료’로 바꿔놓은 상
태에서 리스트에서 해당 리스트를 체크한 다음 [일괄 변경]
셀렉트 박스에서 ‘진행중’ 상태로 상태를 업데이트하면 해당
캠페인은 ‘진행중’ 상태로 변경됨
B
[상태 업데이트] 버튼
- 1) 리스트에서 개별 캠페인의 상태값을 변경하거나 2) 캠
페인을 선택하고 [일괄 변경]에서 변경할 상태값을 선택한
다음 [상태 업데이트] 버튼을 클릭하면 상태값이 실서버에
반영됨
C
선택 리스트 [삭제] 버튼
- 캠페인 선택 체크 박스를 체크한 다음 [삭제] 버튼을 클릭
하면 선택한 캠페인이 일괄 삭제됨
D
개별 리스트 삭제 버튼
- 리스트 옵션 버튼 클릭 시 드롭다운 메뉴가 표시되고 드롭
다운 메뉴 중 [삭제] 메뉴를 클릭하면 해당 리스트가 삭제됨
Page title +
등록중
예약
진행중
종료
삭제
•••
삭제
43 19 :상태 업데이트일괄 변경 ▼
변경할 공지사항 및 상태값을 선택해주세요.
확인
삭제
해당 공지사항을 삭제하시겠습니까?
취소 확인
등록중
예약
진행중
종료
2
3
1
5 6
7 8
9
6A B
삭제할 공지사항을 선택해주세요.
확인
C
D
10개씩 ▼
4
29. 게재 위치 제목 지역ㅣ기간 시작일시 ▼ 종료일시 ▼ 상태 PV ▼ UV ▼ 관리자 최종 수정 ▼ 옵션
서비스 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 - - - 등록중 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 전체ㅣ동시 2022-02-09 12:00 - 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ지역별 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 N 전체ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 N 전체ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ지역별 2022-02-09 12:00 2022-02-09 12:00 예약 ▼ - - ID 2022-02-09 12:00
관리자 공지사항 제목 N 전체ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 N 전체ㅣ타임존 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
관리자 공지사항 제목 대륙별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 진행중 ▼ 12,345 2,456 ID 2022-02-09 12:00
서비스 공지사항 제목 국가별ㅣ동시 2022-02-09 12:00 2022-02-09 12:00 종료 ▼ 12,345 2,456 ID 2022-02-09 12:00
PATH Table structure 설명_2
전체 123 ▼┃ 등록중 34 ┃ 예약 13 ┃ 진행중 34 ┃ 종료 34 ┃ 휴지통 34
Function Description
1
테이블 정렬 규칙
- 타이틀 : 모두 좌측 정렬
- 내용
1) 맨 좌측의 번호 또는 체크 버튼과 맨 우측의 옵션 버튼은
가운데 정렬
2) 모든 텍스트(날짜 포함)는 좌측 정렬
3) 모든 숫자는 우측 정렬
4) 셀렉트 박스의 경우, 버튼은 가운데 정렬하고 버튼 내 텍
스트는 좌측 정렬
5) 버튼은 가운데 정렬
2
스크롤 표시
: 스크롤은 마우스 이동 시 표시되고 이동이 없으면 5초 후 사
라짐
3
Go to top 버튼
: 리스트 페이지에서 스크롤이 생성되는 경우 Go to top 버
튼 표시
- 스크롤 생성 시 표시되며, 1) 5초가 경과하거나 2) 최상단
으로 이동시 사라짐. 스크롤 상태에서 다시 포커스인 후 재스
크롤 시 표시됨
43 19 :상태 업데이트일괄 변경 ▼
Page title +
삭제
Ç
1
•••
3
검색전체 게재면 ▼ 30개씩 ▼
+
2
30. PATH Common Function 설명_1 Function Description
1
Validation 메시지 표시
1) 형식 체크
: 모든 입력박스의 형식 체크에 따른 에러 메시지는 해당 입
력박스 하단에 표시합니다.
- Validation 메시지를 표시하기 위한 마진값 추가 필요)
- 입력박스 테두리 라인을 붉은색으로 표시해주시기 바랍니
다.
2) 데이터 유효성 체크
: 서버 통신을 통한 데이터의 유효성 체크는 최종 저장 또는
제출 등의 버튼 클릭시 체크하고 입력 항목과 관련된 에러 메
시지는 입력 박스 하단에 표시하고 입력 항목과 관련 없는 에
러 메시지의 경우에는 메시지 팝업을 통해서 표시합니다.
2
입력 테이블에서 저장/제출 등의 버튼 활성화
- 필수 입력값을 모두 입력한 경우에 한해 저장/제출 버튼이
활성화합니다.
3
캠페인 상태값 정의
: 대부분의 캠페인 상태값은 등록중/예약/진행중/종료 4가
지로 구분됩니다.
1) 등록중 : 캠페인을 등록중인 상태로 임시저장 상태와 동일
합니다. ‘등록중’ 상태에서는 시작일시가 되어도 캠페인이 자
동으로 노출되지 않습니다.
2) 예약 : ‘예약‘ 상태는 등록이 완료된 상태로 시작일시가 되
면 자동으로 노출됩니다. 예약시점이 현재 시점보다 과거인
경우 예약 등록시 바로 캠페인이 노출됩니다.
3) 진행중 : 실제 노출되는 상태로 종료일이 도래하면 자동으
로 종료로 상태가 변경됩니다.
4) 종료 : 종료일시가 되면 ‘진행중’에서 ‘종료’로 상태로 자
동 변경됩니다. 관리자에 의해 기간과 관계없이 캠페인을 종
료 상태로 변경할 수 있습니다.
4
메시지 팝업
- 별도 메시지 팝업을 디자인해서 띄웁니다.
- 키보드 [Enter] 키 클릭시 ‘확인’ 처리되며, [Esc] 키 클릭
시 ‘취소’ 처리됩니다.
해당 캠페인을 삭제하시겠습니까?
취소
캠페인 상태 * 등록중 ▼
등록중
예약
진행중
종료
확인
3 4
6~10자 이내
서비스에 가입하시면, 서비스 정책에 동의한 것으로 간주합니다.
ex) blockchainfactory아이디 *
이메일 *
비밀번호 *
비밀번호 확인 *
20byte
이메일 인증을 위해 정확한 이메일 주소를 입력해주시기 바랍니다.
* 권장 형식 : 140*140px / JPG, PNG 형식프로필 사진
+
취소
외부 관리자 ▼
저장
저장
germweapon 4byte
germweapon 4byte✕
Validation message 표시
2
이메일 인증을 위해 정확한 이메일 주소를 입력해주시기 바랍니다.
외부 관리자 ▼
1
31. 나만의 UI Component
화면과 페이지를 만드는 기본 요소
꾸준히 좋은 UI/UX로 업그레이드를 하지만 매 프로젝트마다 반복적으로 사용하는 나만의 공식
통일성 있고 완성도 높은 프로젝트를 만들기 위해 프로젝트 멤버들에게 제공되는 메뉴얼 북
몇 장 되지 않잖아요?
나만의 공식이자 메뉴얼 북인 UI Component를 만드세요!
35. 프로그래스 인디케이터(Progress Indicator)의 종류
구분 종류 설명
로딩 완료 시기를 예측할 수 없는
트로버 (Throbber) 로딩 완료 시점을 알 수 없는 로딩 처리 방식
아워글래스 (Hourglass) 시스템 전체가 로딩되는 경우 표시되는 마우스 포인터로 로딩이 끝날 때까지 어떤 액션도 할 수 없음
로딩 완료 시기를 예측 가능한 프로그래스 바 (Progress Bar) 로딩이 완료되는 시기를 예상할 수 있는 바 형태의 인디케이터로 진행 상태 확인 가능
트로버 (Throbber) 아워글래스 (Hourglass) 프로그래스 바(Progress Bar)
36. 팝업(Pop-up)의 종류
구분 종류 설명 기타
팝업(Pop-up)
일반 팝업 공지사항이나 배너 등을 띄우기 위한 팝업
페이지 진입 시 페이지 로딩과 함께 동시에 뜸
팝업창은 브라우저에서 브라우저 옵션을 통해 Default 뜨는 것을 막는 경우가 있으나 모달은 강제할 수
없어 반드시 떠야 하는 경우에는 모달을 사용
다이얼로그
디자인 팝업 직접 팝업을 디자인하여 앱 서비스 내에서 제공하는 메시지를 전달
시스템 팝업 브라우저나 클라이언트 OS에서 제공하는 UI를 사용하여 제공하는 팝업
서비스에서 요청하지 않는 브라우저나 클라이언트와 관련된 팝업 표시 시 사용
ex) 네트워크 연결 장애 등
토스트 메시지
알림을 위한 팝업의 하나로 모니터의 좌우측 하단 또는 모바일 화면에 몇 초간 나타났다 사라지는 형태의
팝업
사용자의 현재 작업의 흐름을 방해하지 않고 저장이나 삭제 등의 액션 처리 결과를 알려주기 위해 사용
토스트 메시지에도 닫기 이외의 액션 버튼 추가 가능
팝오버 (Popover) 마우스 오버 시 뜨는 레이어로 툴팁과 같이 버튼이나 메뉴의 상세한 추가 설명을 하는데 주로 사용 팝오버에서 포커스 아웃 시 팝오버가 닫힘
모달 (Modal) 라이트 박스 (Light Box)
팝업이 뜨는 동시에 백그라운드 화면이 어두워지거나 밝아지는 등 딤(Dim) 처리되어 컨트롤이나 클릭
이 되지 않아 사용자가 팝업에 집중할 수 있는 시각적 효과 제공
해당 페이지에서 호출되는 레이어로 특정 액션에 의해 뜨고 다음 플로우 진행을 위해 필요한 내용을 제공
일반 팝업과 다른 점은 모달을 해제하지 않으면 배경의 요소와 인터랙션이 안 됨
토스트 메시지 (Toast message) 팝오버 (Popover) 라이트 박스 모달 (Light box modal)
37. 쿠키 vs. 세션 vs. 캐시
구분 저장 방식 설명 프로세스 사용 예시
쿠키 (Cookie)
클라이언트 브라우저에 저장
키와 값이 들어있는 작은 데이터 파일
이름, 값, 만료날짜(쿠키 저장기간), 경로
정보 저장
보안 취약
쿠키는 서버에서 생성하여 클라이언트의 브라우저에서 관리
쿠키 정보는 오직 그 쿠키를 작성한 웹 서버만이 열람 가능
쿠키는 사용기한이 정해져 있어 기한이 만료되면 자동으로 삭제됨
클라이언트에 300개까지 쿠키 저장 가능
하나의 도메인당 20개의 값만 가질 수 있음 (초과시 사용빈도가 낮은 쿠키부터 삭제됨)
하나의 쿠키값은 4KB까지 저장
Response Header에 Set-Cookie 속성을 사용해 쿠키 생성
1. 브라우저에서 웹페이지 접속
2. 클라이언트가 요청한 웹페이지를 받으면서 쿠키를 클라이언트 로컬
에 저장
3. 클라이언트가 재요청 시 웹페이지 요청과 함께 쿠키값도 전송
4. 지속적으로 로그인 정보를 가지고 있는 것처럼 사용
자동 로그인
팝업에서 ‘오늘 하루 열지 않기’ 체크
쇼핑몰의 장바구니
사용자가 원하는 스타일의 레이아웃 설정값
저장 시
세션 (Session) 서버에 저장
기능은 쿠키와 비슷하나 서버에 저장되어 보안성 담보
웹 브라우저를 통해 웹 서버에 접속한 이후로 브라우저를 종료할 때까지 유지
클라이언트가 Request를 보내면, 서버가 클라이언트에게 유일한 ID를 부여하는데
이것이 세션 ID임
1. 클라이언트가 서버에 접속 시 세션 ID 발급
2. 서버에서는 클라이언트로 발급해준 세션 ID를 쿠키를 사용해 저장
3. 클라이언트는 다시 접속할 때, 이 쿠키를 이용해서 세션 ID값을 서
버에 전달
로그인 정보 유지
로그인 만료 처리
게시판 글 작성 시 세션에 있는 아이디를 참
조해 작성자 지정
캐시 (Cache) 사용자의 브라우저에 저장
사용자의 브라우저에 이미지나 CSS, js 파일 등을 저장하여 로딩 속도를 빠르게 하고
트래픽을 줄임
단, 관리자를 통해 이미지를 변경해도 바로 사용자에게 반영되지 않는 문제가 발생할
수 있음
캐시를 지우거나 서버에서 클라이언트로 응답을 보낼 때 header에 캐시 만료시간을
명시하는 방법으로 해결
쿠키와 세션을 사용하는 이유?
HTTP 프로토콜의 특징이자 약점을 보완하기 위해 사용
1) 비연결 지향 (Connectionless) : 기본적으로 Http는 먼저 클라이언트가 Request를 서버에 보내면, 서버는 클라이언트에게 요청에 맞는 Response를 보내고 접속을 끊는 특성이 있음
2) 상태 정보 유지 안 함 (Stateless) : 연결을 끊는 순간 클라이언트와 서버의 통신이 끝나며 상태 정보는 유지하지 않는 특성이 있음
HTTP의 이 두가지 특성을 보완하기 위해 쿠키와 세션을 사용
비연결 지향이라는 특성으로 계속 통신을 유지하지 않기 때문에 리소스를 낭비하지 않는다는 장점이 있으나
통신할 때마다 클라이언트는 누구인지 인증을 계속해야 하는 단점이 생겨 쿠키와 세션을 통해 페이지를 옮겨 다닐 때마다 로그인을 다시 안 해도 됨
40. 로그인/회원가입
스플래쉬
프로모션 팝업
설정
내 정보
(회원정보관리)
소식
고객센터
인증/보안
버전정보
공지사항/이벤트
인증
홈 메인
(월렛)
스토어 더보기
보내기
입출금내역
운동 정보
비밀번호 찾기
서비스 정책 사용 내역
알림
연동 앱 정보
소식
(Breaking)
스토어
(Featured)
튜토리얼
인증메일
발송안내
핀번호 등록/인증
패턴 등록/인증
지문 인증 보안비밀번호등록
QR코드 검색
이체 확인
입출금상세
이메일 변경
로그인 이력
비밀번호 변경
비밀번호 찾기
패턴 변경 및
재설정
핀번호 변경 및 재설
정
보안비밀번호
등록 및 재설정
지갑 QR코드
앱 메뉴
41. 로그인
1 아이디/비밀번호 로그인
2 간편 로그인
3 핀번호 로그인
홈메인 (월렛)
1 알림
2 사용 내역
지갑 QR코드
3 보내기
보안비밀번호 등록
이체정보입력
- QR코드 검색
- 회원 검색
이체완료/확인
4 입출금내역
전체 입출금내역 조회
내역상세
5 운동 정보
6 소식
7 스토어
소식
1 타임라인
소식 리스트
소식 상세
튜토리얼
회원가입
1 정보입력 및 약관동의
2 이메일 인증
비밀번호 찾기
1 비밀번호 초기화 메일 발송
스토어
1 * MVP 때 스토어가 없다면 스
토어 대신 마이너 관리 페이지
를 위치?
더보기
1 내 정보 (회원정보관리)
이메일 변경
로그인 이력
비밀번호 변경/찾기
2 인증수단관리
패턴 변경 및 재설정
- 현재 사용중인 패턴 입력
- 패턴 변경
핀번호 변경 및 재설정
- 현재 사용중인 핀번호 입
력
- 핀번호 변경
보안비밀번호 등록 및 재
설정
3 연동 앱 정보
4 고객센터
FAQ 리스트
FAQ 상세
1:1문의내역 작성
1:1문의내역 리스트
5 알림 설정
5 공지사항/이벤트
공지사항 리스트
공지사항 상세
이벤트 리스트
이벤트 상세
6 서비스 정책
이용약관
개인정보취급방침
7 버전 정보
스플래시
프로모션 팝업
핀번호 및 인증 등록
1 핀번호 등록
핀번호 신규입력
사용여부 확인
핀번호 재입력
2 패턴 등록
패턴 신규입력
사용여부 확인
패턴 재입력
3 바이오인증 사용(지원시)
지문 or Face ID 사용여부확인
지문 or Face ID 등록
앱 상세 메뉴
42. 체인점 리스트
(리스트/지도뷰)
로그인 or
로그아웃
잠금화면
(멤버쉽카드)
마이페이지환경설정
(Customized)
편의점 페이지
인트로
(스플래쉬 이미지)
지오태그
서비스 정보 등
푸시 알림
계정 관리
(계정 연동 관리)
프로필 정보
구매내역,
배송조회
1:1 문의하기
FAQ
공지사항
배송지 관리
신분증 관리
로그인
회원가입
아이디/비밀번호
찾기
장바구니
상품 리스트
구매
상품 상세 정보
결제
배송 방식 선택
(배송지 확인)
쿠폰 및 적립금, 포인트
등 사용
추천/베스트/할인
Etc.
카테고리
적립금(선불카드 포함)/
포인트/쿠폰
채팅
회사 정보 등
연관 상품 정보
제공 등
해외직구인 경우,
신분증 인증
또는 선택
자동 로그인 설정
잠금화면
온오프 설정
이벤트
앱 메뉴
로
그
인
필
요
로
그
인
미
노
출
로그인시 이용가능
로그인 필요
43. 로그인
1 아이디/비밀번호 입력
2 비밀번호 찾기
3 Social login(위챗)
회원가입
1 휴대폰 번호 입력
2 인증번호 입력
3 SNS 연동 + 기본정보 입력
4 가입 완료
잠금화면
1 잠금화면 광고(락스크린)
2 멤버십 카드 정보
3 멤버십 카드 관리
구매
1 구매 정보
2 배송지 확인 및 수정
3 배송 방식 선택
4 쿠폰 및 포인트,적립금 사용
5 결제정보 확인
6 영수증 요청
선 신분증 인증 및 관리
8 결제 방식 선택
결제하기
편의점 정보(홈)
1 편의점 정보
2 홈 커스텀 영역
결제
1 결제 모듈 연동
마이페이지
1 프로필 정보
2 적립금(선불카드 포함) / 포
인트/쿠폰
3 구매내역, 배송조회
4 배송지 관리
5 신분증 관리
6 공지사항
7 이벤트
8 FAQ
9 1:1 문의하기
10 회사 정보 등
편의점 매장 리스트(지오태그)
1 리스트뷰
2 지도뷰
장바구니
1 장바구니 히스토리 및 상세
상품 상세 정보
1 상품 이미지
2 상품 정보
3 상품 상세 설명
4 후기/평가(채팅 기능)
5 기타 정보
6 추천/연관 상품 리스트
장바구니 담기
카테고리
1 카테고리 리스트
상품 리스트
1 추천 상품 리스트
2 베스트 상품 리스트
3 할인/쿠폰 상품 리스트
4 신규 상품 리스트
5 기획 상품 리스트
환경설정
1 계정 관리(계정 연동 관리)
2 자동 로그인 설정
3 잠금화면 온오프 설정
4 푸시 알림
5 서비스 정보 등
장바구니 이동
전체 멤버십 이동
배송
1 배송 출발 알림 페이지
9 배송원 변경 알림 페이지
2 배송 완료 평가 페이지
앱 상세 메뉴
44. 대쉬보드
프로필 및 설정
로그인/회원가입
서비스 관리 회원 관리
회원 정보
비밀번호 찾기
홈
이벤트
공지사항
(개인고객, 기업고객)
FAQ/서비스 정책 초대/출석
관리자
기업 관리
관리자 계정 관리
정산 및 통계
회원 통계
광고 통계
지갑/멤버십 통계
매출 통계
상품 관리
상품 관리
판매 관리
판매 관리
교환 및 반품 관리
배송 관리
배송 처리
배송 관리매장 관리
체인점 관리
매장 관리
포인트
쿠폰
쿠폰 생성 및 관리
포인트/쿠폰
체인점 스킨 설정
광고 관리
락스크린
서비스 점검 공지
일반 배너 신분증 인증
푸시 메시지
알림
나의 프로필
일반 설정
서비스 정책
회사 및 서비스 소개
로그아웃
관리자 권한 설정
서브 계정 관리‘기업 계정’인 경우만 노출 ▶
◀ ‘슈퍼 관리자’에게만 노출
특정 권한에게만 메뉴
노출
페이지 누락
환불 처리
배송 담당자 관리
매장/마켓 통계
휴무일 설정
배송 담당자 배정
배송 설정
1단계
2단계
환불 및 정산 설정휴면 사용자문의 관리
재고 관리
상품 입출고
카테고리 관리
마켓 정보 설정
프로모션
관리자 메뉴_1
45. 대시보드
프로필 및 설정
로그인/회원가입
서비스 관리 회원 관리
회원 정보
비밀번호 찾기
홈
이벤트
공지사항
(프런트, 관리자 분기)
FAQ/서비스 정책
강사 괸리
강사
상품 관리
오프라인 강의
판매 관리
판매 관리
교환 및 반품 관리
배송 관리
배송 관리기업 관리
기업 관리
기업 문의
포인트
쿠폰
쿠폰 생성 및 관리
포인트/쿠폰
임직원 관리
광고 관리
일반 배너
푸시 알림
(이메일, SMS 발송)
출결 관리
알림
나의 프로필
일반 설정
서비스 정책
회사 및 서비스 소개
로그아웃
환불 처리
강사비 정산
취소/환불 설정
휴면 사용자 관리
온라인 강의
일반 상품
공연
패키지 상품
관리자 메뉴_2
알림창
CS 관리
문의 관리
환불 처리
카테고리 관리
라벨 관리
번들 상품 관리자
관리자 계정 관리
정산 및 통계
회원 통계
광고 통계
쿠폰/포인트 통계
매출 통계
관리자 권한 설정상품 통계
강의장 관리
강의장 관리
수강 현황 및 통계
리뷰 괸리
강의 평가/후기 관리
리뷰 관리
컨텐츠 괸리
상품 상세 페이지
동영상 관리
장바구니
수강신청올드회원
최우선 순위
현재 개발 중
46. 모바일 이동경로 처리
상품 상세
추천 상품 상품 상세
추천 상품 상품 상세
추천 상품 상품 상세
Menu2Menu1 Menu3 Menu4
depth3
depth4
depth5
depth2
depth1
depth3
depth4
depth5
depth2
depth1
depth3
depth4
depth5
depth2
depth1
depth3
depth4
depth5
depth2
depth1
1
2
3
50. 회원인증 시 고려사항
회원인증 방법
서비스 특성 필요한 데이터 보안 편의성
이메일 인증 모바일 점유 인증 휴대폰 본인 인증
SNS 싱글 로그인
(Single Sign-On,
SSO)
기타
51. 약관 및 인증의 종류
구분 종류 설명
약관 종류
서비스 이용약관
개인정보 수집 및 이용 동의
고유식별정보 처리 동의
개인정보 취급 위탁 동의 사업자의 이익 및 목적을 위해 개인정보 취급업무를 제 3자에게 위탁 시 동의를 받아야 함
개인정보 제 3자 제공 동의 개인정보를 제공받는 자의 이익 및 목적을 위해 개인정보를 제 3자에게 제공하는 경우 동의를 받아야 함
위치정보 이용약관
위치기반 서비스 이용약관
사용자의 위치 정보를 서버에 저장하고 이를 활용하기 위해서는 해당 이용약관의 동의를 받아야 함
(관련법 : 위치정보의 보호 및 이용 등에 관한 법률; 위치정보법)
마케팅 수신 동의
앱 푸시, 문자, 이메일, 전화 등 전자적 전송매체를 이용하여 영리목적의 광고성 정보를 전송하기 위해서는 수신자에게 명시적인 사전 동의를 받아야 함.
이를 위해 광고성 정보 수신동의를 이용약관에 넣어 처리.
(관련법. : 정보통신망 이용촉진 및 정보보호 등에 관한 법; 정보통신망법 제50조제1항)
기타 약관
인증 종류
이메일 인증 가입 시 입력한 이메일로 인증 URL 또는 코드를 발송해 이메일 인증을 통해 사용자 인증
모바일 점유 인증 휴대폰 번호로 코드를 발송해 휴대폰 점유 인증을 통해 사용자 인증
휴대폰 본인 인증
국내 서비스의 경우, 개인정보 및 휴대폰 번호를 입력하여 통신사를 통해 본인확인기관에 CI 생성을 요청하고 이를 고객사에 전달하여 인증
CI(Connecting Information, 개인식별정보), DI(Duplication Information, 중복가입확인정보) 인증 방식
싱글 로그인(SSO)
카카오, 네이버, 페이스북 등에서 제공하는 싱글 로그인(SSO, Single Sign-On) API를 활용하여 사용자 인증
대다수 이메일 주소를 사용자 ID로 제공
기타 인증 아이핀, 공인인증서 등
52. 개인정보 제 3자 제공 및 취급 위탁의 구분
구분 목적 관리 범위 약관 명시 내용 사용 예시
개인정보 취급 위탁
사업자의 이익 및 목적을 위해 개인정보 취급업
무를 제 3자에게 위탁
개인정보를 제공받는 자(제 3자)의 관리범
위에 속함
제공받는 자, 업무 내용 등 명시 필요
사업자가 콜센터(수탁자)와 위탁계약을 맺고, 백화점 고객 개인정보를
콜센터 업체에서 관리 및 운영
개인정보 제 3자 제공
개인정보를 제공받는 자의 이익 및 목적을 위해
개인정보를 제 3자에게 제공
취급위탁을 받은 자(수탁자)가 개인정보를
운영하지만 사업자의 관리 범위에 속함
제공받는 자, 제공받는 목적, 제공되는 개인정보 항목, 보유 및 이용 기
간 등 명시 필요
사업자가 카카오의 싱글 로그인(SSO)을 사용하기 위해 카카오와 제휴
를 통해 카카오에 사용자의 개인정보를 제공
CI와 DI
구분 형식 용도
CI (Connecting Information, 개인식별정보) 88 byte
연계정보, 서비스 연계를 위해 본인확인기관에서 부여하는 개인식별정보
서로 다른 인터넷 서비스 간에도 동일 사용자인지 구분 가능한 정보
DI (Duplication Information, 중복가입확인정보) 64 byte
서비스 별로 각각 관리하는 동일 사용자 구분 수단
한 사람의 명의로 여러 개의 계정을 만들고 악용하는데 막을 수 있는 정보
즉, 한 서비스에 단 하나의 DI만이 존재
53. 로그인 및 비밀번호 찾기 종류
구분 종류 방식 설명
로그인
일반 로그인 회원가입 방식에 따라 ID, 이메일, 핸드폰 번호 등으로 로그인 가능
싱글 로그인 (Single Sign-On, SSO) SNS 싱글 로그인을 통해 로그인 가능
간편 로그인
핀코드
간편 로그인 지원
지문 인식 및 얼굴 인식은 해당 기능을 지원하는 단말기에 한해 사용 가능
패턴
지문 인식
얼굴 인식
기타
비밀번호 찾기
이메일
SMS
질문 및 답변
구매한 상품
기타
54. 모바일 앱 로그인 시 체크 사항
구분 종류 방식 내용 기타
체크 사항
앱 버전
선택 업데이트 꼭 업데이트를 하지 않아도 서비스 이용 가능 디자인 팝업에 [나중에 | 업데이트] 버튼 표시
강제 업데이트 업데이트를 하지 않으면 서비스 이용 불가 디자인 팝업에 [업데이트] 버튼만 표시
네트워크 상태 네트워크 연결 상태 확인 네트워크 연결이 안 된 경우, 디자인 팝업 표시
공지사항 진행 중인 공지사항이 있는 경우, 공지사항 표시
배너 진행 중인 배너가 있는 경우, 배너 표시
계정 잠김 여부 비밀번호 연속 실패 등의 이유로 계정이 잠김 경우
권한 획득
iOS
알림, 위치, 연락처, 사진, 카메라, 마이크, 동작 및 피트니스, 캘린더, Siri 및 검색, 백그라운드 앱 새
로 고침 등 서비스 이용 시 꼭 필요한 권한이 아니라면 서비스 내에서 필요한 상황에 권한 요청
을 하는 것이 좋음
Android
인앱 기록, 기기 및 앱 기록, ID, 주소록, 위치, 휴대전화, 문자 메시지(SMS, MMS), 사진/미디어/
파일, 카메라, 마이크, 기기 ID 및 통화 정보, Wi-Fi/블루투스 연결 정보 등
55. 추가 고려사항
정보 불일치 시
처리 프로세스
중복 로그인 및
단말기 사용 제한
로그인 세션
(로그인 연장)
2단계 인증 캡챠 적용
56. 캡챠 (CAPTCHA)의 종류
CAPTCHA, Completely Automated Public Turing test to tell Computers and Humans Apart
어떠한 사용자가 실제 사람인지 컴퓨터 프로그램인지를 구별하기 위해 사용하는 기술의 하나.
종류 설명 사용 예시
텍스트 CAPTCHA 2000년 대에 흔하게 사용하던 캡챠
광고성 게시물 또는 댓글 방지
아이디 자동생성 방지
이메일 주소 보호
계정 해킹 방지 등
오디오 CAPTCHA 시각장애인을 위해 보통 텍스트나 이미지 CAPTCHA와 함께 제공됨
이미지 CAPTCHA 요샌 웬만하면 그냥 구글 reCAPTCHA를 적용함
슬라이드 CAPTCHA
중국에서 자주 보던 방식 @.,@;;
Drag & Drop CAPTCHA
기타
사람의 얼굴과 이름을 매치 시키는 소셜 CAPTCHA
커서가 이동한 경로를 확인하는 동작 CAPTCHA 등
58. PATH 회원가입 및 로그인 프로세스
회원가입/로그인 프로세스
Function Description
1
인증 메일 발송
- 이메일 인증 메일 발송
2
회원 DB 생성
- 이메일 인증 완료 시 회원 ID 생성
3
가입 환영 메일 발송
- 가입 환영 메일 발송
4
회원가입 완료 전 페이지 이탈 시 알림 팝업
- 회원가입 페이지(+인풋 박스 입력 시), 이메일 인증 안내
페이지에서 페이지 이탈 시 알림 팝업 처리
회원가입
페이지
정보입력
및 약관동의
거래소 또는
이전 페이지 이동
Y
로그인
페이지
N
이메일 인증 안내
페이지
(이메일 발송)
이메일
인증 여부
예, 중단합니다
알림
회원가입을 완료하지 않았습니다.
회원가입을 중단하시겠습니까?
N
로그인
페이지
핀코드
등록 여부
핀코드 등록
페이지
가입 환영
페이지
(이메일 발송)
Y
N
Y
Y
핀코드
등록 여부
N
1
3
4
회원가입 프로세스 이탈 시 알림 팝업
아니요
Button Description
A
[아니요] 버튼
- 클릭 시, 현재 페이지 유지
B
[예, 중단합니다] 버튼
- 클릭 시, 회원가입 페이지(+모든 인풋 박스 입력값 Reset)
로 이동A B
Yes
No
설정에 따라 표시 여부 결정
Next Version
2
59. PATH 중복 로그인 및 기기 변경 시 처리 프로세스 Function Description
* 중복 로그인 미지원 및 기기 변경 시 처리 프로세스는 동일
예, 변경합니다
기기 변경 안내
최근 사용한 기기와 다릅니다.
이메일 인증을 거쳐 해당 기기를 사용하시겠습니까?
아니요 확인
로그아웃 안내
서버 세션이 만료되어 보안상 로그아웃되었습니다.
로그인 페이지로 이동합니다.
1) 기기 변경 알림 2) 사용자 인증 만료 시 알림
Button Description
A
[아니요] 버튼
- 클릭 시, 로그인 페이지에서 팝업만 닫힘
B
[예, 변경합니다] 버튼
- 클릭 시, 이메일 인증 안내 페이지로 이동
C
[확인] 버튼
- 클릭 시, 로그인 페이지로 이동
A B C
신규 로그인 회원 또는 신규 기기
로그인
페이지
1) 기기 변경 알림
기 로그인 회원 또는 기존 기기
2) 사용자 인증 만료
알림
(이메일 포함)
재로그인
여부
이메일 인증 안내
페이지
(이메일 발송)
로그인
상태
이메일
인증 여부
로그인
거래소 또는
이전 페이지 이동
사용 기기 변경
알림
거래소 또는
이전 페이지 이동
2) 사용자 인증 만료
알림
(이메일 발송)
1
Y
N
Y
N
변경 프로세스
Yes
No
설정에 따라 표시 여부 결정
Next Version
60. PATH 비밀번호 찾기 프로세스 Function Description
1
로그인 정보 10회 불일치 프로세스 및 알림 표시
- ID(이메일)별 불일치 횟수를 서버에 저장하여 10회 연속
불일치 시 계정 잠금 알림 처리하고 로그인 성공 시 해당 횟수
를 초기화
비밀번호 찾기
로그인
페이지
로그인 정보
10회 불일치
(이메일 발송)
1) 계정 잠금 알림
(이메일 발송)
비밀번호 재설정
이메일 발송
로그인
확인
계정 잠금 안내
로그인 정보 10회 불일치로 인해 계정이 잠겼습니다.
가입하신 이메일 주소로 비밀번호 재설정 안내 메일이
발송되었습니다.
비밀번호 재설정
비밀번호 찾기
페이지
1) 계정 잠금 알림
Yes
No
설정에 따라 표시 여부 결정
Next Version
프로세스 오류
1
YN
61. PATH 핀코드 불일치 시 처리 프로세스
핀코드 인증
페이지
핀코드
인증 여부
로그인 페이지
이메일 인증 안내
페이지
(이메일 발송)
로그인
핀코드 등록
Yes
No
설정에 따라 표시 여부 결정
Next Version
N
핀코드 재설정1) 핀코드 5회 불일치
이메일 인증
2) 핀코드 초기화
완료 알림
핀코드 초기화 안내
핀코드가 초기화되었습니다.
새로운 핀코드를 등록하시려면 로그인이 필요합니다.
로그인 페이지로 이동하시겠습니까?
예, 이동합니다아니요
회원가입/로그인 프로세스
다음 프로세스
시작
또는 핀코드 변경
2) 핀코드 초기화 완료 알림
Button Description
A
[아니요] 버튼
- 클릭 시, 현재 페이지 유지
B
[예, 초기화합니다] 버튼
- 클릭 시, 이메일 인증 안내 페이지로 이동
C
[예, 이동합니다] 버튼
- 클릭 시, 로그인 페이지로 이동
A C
핀코드 잠금 안내
핀코드 정보 5회 불일치로 인해 핀코드가 잠겼습니다.
이메일 인증을 통해 핀코드를 초기화하시겠습니까?
예, 초기화합니다아니요
1) 핀코드 5회 불일치 시 알림 처리
A B
62. PATH 로그인 만료 안내 모달 팝업 Function Description
1
로그인 만료 안내 모달 팝업
- 10분 간 사용자의 사용이 없으면, 다음 모달 팝업 표시
- 10분 경과 이후 1분간 대기시간을 주고 60초 카운팅 표시
- 1분간 액션이 없으면 자동으로 로그아웃 처리
Button Description
A
[로그인을 연장합니다] 버튼
- 클릭 시, 10분간 로그인 연장
B
[로그아웃합니다] 버튼
- 클릭 시, 즉시 로그아웃 처리
앱 다운로드Menu1 Menu2 Menu3 Menu4 로그인 회원가입
Footer
Logo
로그인 만료 안내
10분 간 사용이 없어 보안 상 자동으로 로그아웃 처리합니다.
로그아웃합니다로그인을 연장합니다
로그아웃까지 60초가 남았습니다.
1
A
B
Logo
64. PATH 회원가입 프로세스
회원가입 프로세스
Function Description
1
튜토리얼
- 앱 최초 설치 시 또는 삭제 후 재설치 시에만 튜토리얼을 보
여줍니다.
2
인증메일 발송
: 이메일 인증을 위한 링크와 함께 인증메일을 발송
3
이메일 인증 여부 확인
: 이메일 인증을 완료한 경우 회원가입이 완료되어 로그인이
가능하며 로그인 시 핀번호 등록 페이지로 이동
- 이메일 인증을 하지 않은 경우 로그인 시 이메일 발송 안내
페이지로 이동
4
간편 로그인 사용 여부 판단
: 디바이스의 바이오 인증(지문, Face ID) 지원 여부에 따라
지원 가능한 간편 로그인 방식을 표시
5
프로모션 팝업
- 관리자에서 현재 라이브 중인 프로모션 팝업이 있는 경우
에 프로모션 팝업을 표시
앱 실행
스플래시
로그인 페이지
(회원가입 버튼)
이메일 인증
안내
이메일
인증여부
정보입력
및 약관동의
튜토리얼
로그인 페이지
(일반 로그인)
Y
N
Yes
No
설정에 따라 표시 여부 결정
Next Version
3
2
1
간편 로그인
사용여부
패턴 등록 지문 등록 Face ID 등록
프로모션 팝업
홈메인 이동
핀번호 등록
4
5
65. PATH 로그인 프로세스 Function Description
1
바이오 인증 사용 여부 판단
: 디바이스의 바이오 인증(지문, Face ID) 지원 여부에 따라
바이오 인증 등록 프로세스를 진행
바이오인증
사용여부
로그인 프로세스
실행
스플래시
프로모션 팝업
홈메인 이동
지문인식
여부
얼굴인식
여부
앱 삭제 후 재설치
실행
스플래시
핀번호 입력
로그인 페이지
(일반 로그인)
핀번호 등록
바이오인증
사용여부
패턴 등록 지문 지원 Face ID 지원
지문
사용여부
Face ID
사용여부
지문
등록/사용
Face ID
등록/사용
프로모션 팝업
홈메인 이동
패턴 로그인
여부
1
Yes
No
설정에 따라 표시 여부 결정
Next Version
66. PATH 중복 로그인 시 처리 프로세스 Function Description
*
중복 로그인 시 처리
- 중복 로그인 미지원 (타 디바이스에서 로그인 시 자동 로그
아웃 처리)
- 중복 로그인 시 알림 처리가 되며 로그아웃 처리를 하고 계
정 보호를 위한 메일을 발송
신규 로그인 회원
실행
로그인
기 로그인 회원
앱 실행
여부
디자인 팝업 푸시
로그아웃
비번변경
여부
완료
비밀번호 변경
푸시
(에러 메시지)
로그아웃
로그인
확인 메일 발송
1
2
Yes
No
설정에 따라 표시 여부 결정
Next Version
67. PATH 로그인 오류 처리 및 해제 프로세스 Function Description
1
계정 잠금 알림 팝업
: 해당 이메일 주소로 비밀번호 10회 오류 시 하단과 같이 디
자인 팝업을 표시
2
임시 비밀번호 이메일 발송
: 해당 이메일 주소로 계정 잠김 안내와 함께 임시비밀번호를
발송
3
바이오 인증 사용 여부 판단
: 인증 오류의 타입과는 관계없이 바이오 인증 사용여부를 재
판단하여 인증방식을 등록
1) 지문 및 Face ID를 모두 지원하는 경우
: 로그인 방식을 선택할 수 있도록 로그인 선택 팝업을 띄웁
니다.
2) 지문만 지원하는 경우
: 지문 인증을 사용할지 선택할 수 있도록 지문 인증 선택 팝
업을 띄웁니다.
3) 지문 및 Face ID 등 바이오 인증을 지원하지 않는 경우
: 패턴 인증을 등록할 수 있도록 패턴 등록 페이지로 이동합
니다.
비밀번호 찾기
계정 잠금 알림
팝업
로그인
페이지
비밀번호
10회 오류
비밀번호 찾기
임시비밀번호
생성
임시비밀번호
이메일 발송
로그인
2
1
확인
계정 잠금 안내
로그인 정보 10회 불일치로 인해 계정이 잠겼습니다.
보안을 위해 가입하신 이메일 주소로 비밀번호 초기화 메일이
발송되었으니 비밀번호를 재설정해주세요.
핀번호/패턴/지문/Face ID 5회 오류
핀번호 입력
패턴/지문/Face ID
인증 페이지
핀번호
5회 오류
핀번호 등록
로그인 페이지
(일반 로그인)
바이오인증
사용여부
패턴 등록 지문 지원 Face ID 지원
지문
사용여부
Face ID
사용여부
지문 등록 Face ID 등록
프로모션 팝업
홈메인 이동
3
패턴 5회 오류 or
지문/Face ID 인식 실패
Yes
No
설정에 따라 표시 여부 결정
Next Version
69. PATH 회원가입 및 로그인 프로세스
회원가입 절차
시작
모바일 인증
Y
N
회원가입
완료
인증
모듈
Step 1
Step 2
Y
시작
휴대폰번호/회원번호/*
이메일주소로
로그인
N
DB
홈 이동
Y
로그인 절차
출석체크
출석포인트
지급
입력값
확인 N
회원
DB
Y
휴대폰 번호, 단말정보,
패스워드(암호화) 등 입
력정보 저장
추천인
고유번호 입
력 (선택)
회원
DB
추천인에
추천인 포인트 지급
인증번호
입력
*연동한 경우
SNS로 로그인
입력값 or 연동Key
확인
* 이메일 로그인 및 소셜 로그인은 ‘마이페이지 〉 설정 〉 계정관리’에서
이메일 인증 및 해당 SNS를 연동한 경우에만 해당 방식으로 로그인이 가능합니다.
Function Description
1
2가지 방식의 로그인 지원
1) 휴대폰번호 or 회원번호 or 이메일주소로 로그인
- 이메일의 경우, ‘마이페이지 〉 설정 〉 계정관리’에서 이메
일 인증을 한 회원만 이메일로 로그인 가능
2) SNS로 로그인
- SNS로 로그인을 하기 위해서는 ‘마이페이지 〉 설정 〉 계정
관리’에서 해당 SNS로 연동을 한 경우에만 해당 SNS로 로
그인 가능
기본정보
입력
1
70. PATH 비밀번호 변경(초기화) 프로세스
비밀번호
찾기
휴대폰번호/회원번호/*
이메일주소 입력
(스와이프 버튼)
Y
N or 기타 방법 선택시
구매 상품 선택
페이지
상품구매
여부
비밀번호 변경 방식
선택 페이지
정답
Y
N
구매한 상품으로
인증하기
휴대폰 번호로
인증하기
(SMS)
질문 및 답변으로
인증하기
고객센터를 통해서
변경하기
답변
입력
Y
Y
비밀번호
변경 페이지
비밀번호
변경 저장
N
N
인증번호
받기
Y
N
휴대폰 번호 &
생년월일 입력
Function Description
*
총 5가지의 비밀번호 변경(초기화) 수단을 지원
1. 구매한 상품으로 인증하기
2. 질문 및 답변으로 인증하기
3. 휴대폰 번호로 인증하기
4. 이메일을 통해서 변경하기
5. 고객센터를 통해서 인증하기
* SNS를 통한 인증방식은 SNS 연동시 하나씩 추가
1
휴대폰번호 or 회원번호 or 이메일주소 확인 및 봇 체크 페
이지
1. 휴대폰 번호 or 회원번호 or 이메일 주소 입력
2. 봇 체크 모듈 적용 : MVP에는 캡챠 또는 스와이프 액션을
적용하고 이후 패턴 인식 등 고도화된 방식으로 변경 예정
2
가장 최근에 구매한 상품 2개, 구매하지 않은 상품 18개 이
미지를 랜덤하게 4x5로 뿌려주고 2개를 선택하게끔 페이지
구성
- 기 구매한 상품 내역이 없거나 상품종류가 1개인 경우에는
‘비번 초기화 방식 선택 페이지’로 바로 이동
3 랜덤 질문을 던지고 답변을 선택하게끔 페이지 구성
4
이메일을 통해서 변경하기 방식은 이메일 인증을 한 회원만
사용이 가능합니다.
때문에 이메일 인증을 하지 않은 사용자에게는 해당 인증하
기 방식을 표시하지 않습니다.
*이메일을 통해서
변경하기
(E-mail)
Y
N
이메일 &
생년월일 입력
1
2 3 4
71. PATH 휴대폰 번호 재인증 프로세스
시작
(자동로그
아웃)
로그인
중복인증
여부 확
인N
홈 이동
Y
휴대폰 번호 재인증 절차
(타인이 동일한 번호로 정상 가입한 경우)
휴대폰 번호를 교체한
기존 A회원
기존 A회원의 번호를 쓰게 된
신규 B회원
모바일 재인증
인증번호
입력
Y
N
인증
모듈
시작
모바일 인증
Y
N
회원가입
완료
인증
모듈
Y
입력값
확인 N
회원
DB
Y
휴대폰 번호, 단말정보, 아
이디, 이메일,
패스워드(암호화) 등 입력
정보 저장
추천인
고유번호 입
력
회원
DBY
Step 1
Step 2
추천인 닉네임에
추천인 포인트 지급
Function Description
1
푸시 발송 및 확인 여부
: 신규 B회원이 기존 A회원의 번호로 정상 회원가입을 한 경
우, 회원가입이 완료됨과 동시에 기존 A회원에게 푸시 메시
지가 발송됩니다.
기존 A회원이 푸시 메시지를 확인하면 바로 모바일 재인증
페이지를 띄우고 변경된 번호로 재인증을 유도합니다.
인증번호
입력
기본정보
입력
푸시 발송
및 확인 여부Y
N
1
73. PATH 로그인 페이지 Function Description
1
이메일 인풋 박스
- 텍스트 입력 제한
: 320자 초과 입력 막음
: 주소 앞자리 64자+@+도메인 255자(최대 320자), 영문/
숫자/일부 기호(‘_(언더바)’, ‘,(마침표)’) 사용 가능
- 이메일 형식 유효성 체크 : XXX@XXX.XXX
2
비밀번호 인풋 박스
- 텍스트 입력 제한
: 8자 이상의 문자/숫자/기호 입력 가능
- 비밀번호 표시 버튼
: 비밀번호 입력 시 실시간 숨김 처리하나 표시 버튼 클릭 시
비밀번호 입력값을 표시합니다.
: Cancel 버튼은 비밀번호 표시 버튼의 좌측에 위치
앱 다운로드Menu1 Menu2 Menu3 Menu4 Menu5 로그인 회원가입
로그인
이메일
비밀번호
로그인
회원가입
비밀번호 찾기 〉
| https://www.url.co.kr
로그인하는 사이트의 주소가 아래와 같은지 꼭 확인해주시기 바랍니다.
로그인
Footer
체크
시점
조건 메시지 노출유형
2 이메일 형식 오류 이메일 주소를 확인해주세요. 인풋 박스 하단 문구
4 아이디(이메일)와 비밀번호 불일치 시 이메일 또는 비밀번호를 확인해주세요. 비밀번호 인풋 박스 하단에 표시
4 계정 10회 불일치 시
Title : 계정 잠금 안내
Message : 로그인 정보 10회 불일치로 인해 계정이 잠겼습니다. 가입하신 이메일 주소로 비밀
번호 재설정 안내 메일이 발송되었습니다.
Button : [확인]
디자인 팝업
4 사용 기기 변경 시
Title : 기기 변경 안내
Message : 최근 사용한 기기와 다릅니다. 이메일 인증을 거쳐 해당 기기를 사용하시겠습니까?
Button : [아니요 | 예, 변경합니다]
디자인 팝업
1
germweapon@gmail.com
이메일
germweapon
이메일
이메일 주소를 확인해주세요.
2
비밀번호
비밀번호
germ
이메일
●●●m
비밀번호
Validation message
●●●●●●●●●●
비밀번호
비밀번호
이메일 또는 비밀번호를 다시 확인해주세요.
기본 입력 박스
포커스 인 상태
이메일의 경우, 텍스트 입력 시 상태
입력 텍스트 숨김 시
포커스 아웃 시 Valid 상태
포커스 아웃 시 Invalid 상태
germweapon@gmail.com
이메일
비밀번호
A
Button Description
A
[로그인] Submit 버튼
- 이메일 및 비밀번호 인풋 박스에 유효(이메일 형식 유효성
체크)한 입력값을 입력한 경우에 로그인 버튼이 활성화됩니
다.
- 활성화 버튼 클릭 시, 이메일 및 비밀번호 데이터 유효성 체
크 후 Invalid한 경우 관련 Validation message를 띄웁니
다.
로그인 정보 10회 불일치 프로세스 및 알림 표시
- ID(이메일)별 불일치 횟수를 서버에 저장하여 10회 연속
불일치 시 계정 잠금 알림 처리하고 로그인 성공 시 해당 횟수
를 초기화합니다.
B
비밀번호 찾기 텍스트 링크
- 비밀번호 재설정 페이지로 이동합니다.
C
[회원가입] 버튼 링크
- 회원가입 페이지로 이동합니다.
B
C
Logo
Logo
74. PATH 회원가입 페이지 Function Description
1
이메일 인풋 박스
- 텍스트 입력 제한
: 320자 초과 입력 막음
: 주소 앞자리 64자+@+도메인 255자(최대 320자), 영문/
숫자/일부 기호(‘_(언더바)’, ‘,(마침표)’) 사용 가능
- 포커스 아웃 시, 이메일 중복 여부 및 형식 유효성 체크:
XXX@XXX.XXX
2
비밀번호 인풋 박스
- 텍스트 입력 제한
: 8자 이상 문자/숫자/기호 입력 가능
: 8자 이하 입력 시 Validation message 표시
- 입력 시 실시간 숨김 처리(●)합니다.
3
비밀번호 확인 인풋 박스
- 비밀번호 입력값과 다른 경우 Validation message 표시
- 입력 시 실시간 숨김 처리(●) 처리합니다.
4
약관 개별 체크 버튼
- 개별 체크 버튼을 모두 체크하면 일괄 체크 버튼이 자동 체
크됩니다.
5
약관 일괄 체크 버튼
- 클릭 시, 모든 약관이 일괄 체크됩니다.
- 약관 개별 체크 버튼을 해제하면 일괄 체크 버튼의 체크가
풀립니다.
6
전문보기 텍스트 링크
- 클릭 시, 서비스 정책 모달 팝업을 띄웁니다.
7
구글 reCAPTCHA v3 적용
- 링크 : https://developers.google.com/recaptcha/
앱 다운로드로그인 회원가입
회원가입
이메일
비밀번호
회원가입
로그인
법인 및 19세 미만의 회원님은 서비스 이용이 불가합니다.
비밀번호 확인
인증메일을 받기 위해 정확한 이메일 주소를 입력해주세요.
구글 reCAPTCHA
[필수] 만 19세 이상 서비스 이용동의 전문보기
[필수] 서비스 이용약관 동의 전문보기
[필수] 개인정보 처리방침 동의 전문보기
[선택] 마케팅 정보이용 동의 전문보기
서비스 정책
모든 이용약관을 확인하였으며 이에 동의합니다.
체크
시점
조건 메시지 노출유형
1
이메일 형식 오류 이메일 주소를 확인해주세요. 인풋 박스 하단 문구
이메일이 사용 중인 경우 이미 사용 중인 이메일 주소입니다. 인풋 박스 하단 문구
2 비밀번호 형식 체크
비밀번호는 8자 이상의 문자, 숫자, 기호로 입
력해주세요.
인풋 박스 하단 문구
3
비밀번호와 비밀번호 확인이
일치하지 않는 경우
비밀번호와 비밀번호 확인이 일치하지 않습니
다.
인풋 박스 하단 문구
기타
회원가입 페이지(+인풋 박스
입력 시), 이메일 인증 안내
페이지에서 페이지 이탈 시
Title : 알림
Message : 회원가입을 완료하지 않았습니다.
회원가입을 중단하시겠습니까? Button : [아
니요 | 예, 중단합니다]
디자인 팝업
비밀번호
비밀번호
germ
이메일
●●●m
비밀번호
Validation message
●●●●●●●●●●
비밀번호
비밀번호
이메일 또는 비밀번호를 다시 확인해주세요.
기본 입력 박스
포커스 인 상태
이메일의 경우, 텍스트 입력 시 상태
입력 텍스트 숨김 시
포커스 아웃 시 Valid 상태
포커스 아웃 시 Invalid 상태
germweapon@gmail.com
이메일
비밀번호
1
2
3
4
5
6
7
A
B
Button Description
A
[회원가입] Submit 버튼
- 아래 조건을 모두 만족한 경우에 한해 [회원가입] 버튼을
활성화합니다.
1) 이메일 및 비밀번호, 비밀번호 확인 인풋 박스에 유효(이
메일 중복 여부 및 형식 유효성, 비밀번호 및 비밀번호 확인
의 형식 유효성 및 일치 여부)한 입력값을 입력
2) 필수 서비스 정책 체크 버튼에 모두 체크
3) 구글 reCAPTCHA v3 Pass
- 클릭 시, 데이터 유효성 체크 후 Invalid한 경우 관련 알림
을 띄웁니다.
B
[로그인] 버튼
- 클릭 시, 로그인 페이지로 이동합니다.
회원가입
Menu1 Menu2 Menu3 Menu4 Menu5Logo
Logo
75. 입력값의 유효성 체크
구분 체크 설명 사용 예시
형식 유효성 서버 통신 없이 클라이언트(자바스크립트)에서 체크
서버 통신 없이 클라이언트(자바스크립트)에서 입력값의 자리수나 형식을 실시간 체크하여 인풋 박스 하단에
Validation message를 띄움
보통 인풋 박스에서 포커스 아웃 시 입력값을 실시간 체크
이메일 형식 체크
비밀번호 자리수 체크
비밀번호 입력 확인 인풋박스에서 일치 여부 체크
데이터 유효성 서버 통신을 통해 체크
서버 통신을 통해 서버에 저장되어 있는 데이터와의 일치 또는 중복 여부 등을 체크하여 인풋 박스 하단이나 팝업 등을
통해 알림 메시지를 띄움
보통 서버와의 잦은 통신을 지양하기 위해 Submit 버튼 클릭 시 입력값의 데이터 유효성을 체크
이미 존재하는 이메일 주소인지 여부 체크
77. PATH 웹사이트 배너 Function Description
*
다중 팝업 지원
- 여러 개의 팝업이 동시 뜰 수 있음
: 홈페이지에 뜨는 모든 팝업 사이즈 및 포지션은 동일하며
z-index값으로 노출 순서 조정 필요
1
텍스트 팝업
- 컨텐츠 영역 내 스크롤 처리 필요
2
이미지 배너 팝업
- Image size : 600*600px
- BG 이미지를 여러 장 등록 가능하게 처리
- 2장 이상 등록 시, 좌우 이동 버튼 및 페이지 인디케이터 표
시
- Autoplay 지원 및 Playtime 3,000ms
- 마우스 오버 시 Stop
- 배너 이미지 링크 연결 지원
Text message ~~
오늘 하루 열지 않기 확인
Title
오늘 하루 열지 않기 닫기
1 2
● ●
Height
600px
Height
60px
Width
600px
Button Description
A
[확인 또는 닫기] 버튼
- 텍스트 팝업과 이미지 팝업의 Close 버튼명 주의
A A
78. PATH 모바일 앱 배너 Function Description
1
프로모션 팝업
- 배너 이미지 영역을 클릭하면 프로모션 상세 페이지로 이
동
- 배너가 여러 개인 경우 좌우 스와이프를 통해서 배너 이동
가능
2
배너 인디케이터
- 프로모션 팝업은 최대 10개까지 동시 띄울 수 있으며 배너
가 2개 이상인 경우에는 이미지 하단에 배너 인디케이터를
표시
Button Description
A
[오늘은 그만보기] 버튼
- 버튼 클릭 시 프로모션 팝업이 닫히고 24시간 이내 프로모
션 팝업을 노출하지 않음
B
[닫기] 버튼
- 버튼 클릭 시 프로모션 팝업이 닫히고 앱 재실행 시에 다시
프로모션 팝업 노출
닫기오늘은 그만보기 닫기오늘은 그만보기
A B
1
2 ● ●● ●
79. 배너 등록 정보
구분 종류 용도 설정 방식 설명
기본정보
게재위치 * 배너 위치 선택 셀렉트 박스 한 관리자에서 여러 곳의 배너를 관리할 경우 배너를 게재할 위치를 선택합니다.
기업명 * 셀렉트 박스 또는 인풋 박스 매출 및 정산 등을 관리하기 위해 광고를 진행하는 기업을 선택합니다.
캠페인명 * 인풋 박스
기간 * 셀렉트 박스 (캘린더 형식)
기간 내 선착순,
일별 분할 선착순
상태 셀렉트 박스 등록중, 예약, 진행중, 종료
광고 설정
광고비 * 인풋 박스 (숫자만 입력 지원)
노출수 또는 클릭수 * 인풋 박스 (숫자만 입력 지원) 제한 없음 선택(하우스 배너 등의 경우) 지원
노출 순서 * 셀렉트 박스
한 지면에 여러 개의 배너를 게시할 수 있는 경우 지원
숫자가 작을수록 먼저 노출되며 숫자가 중복되는 경우에는 램덤하게 노출 (1-10)
노출 빈도 * 셀렉트 박스 또는 인풋 박스 (숫자만 입력 지원) 기간 내 한 유저에게 몇 번 광고를 노출할지 설정
노출 비중 * 인풋 박스 (숫자만 입력 지원) 여러 배너가 한 슬롯에 노출되는 경우 노출되는 비중을 설정
타겟팅 설정 시간, 위치, 성별, 연령, 통신사 등 타겟팅 형식에 따라 입력 방식 상이함
배너 등록
이미지 등록 업로드 버튼
에디터 등록 에디터 지원
링크 연결 연결 없음, 링크 연결, 공지사항/이벤트 등 선택 * 라디오 버튼 및 연결 방식에 따라 셀렉트 박스 또는 인풋 박스
기타
80. AD / Etc.
AARRR Metrics (일명 해적지표)
Acquisition
사용자 획득/유치
Activation
사용자 활동
Retention
사용자 유지
Referral
추천
Revenue
매출
Download
User UAC(CAC)
Duration
Bounce Rate
CCU/ACU/MCU
Frequency
Retention Rate SNS Share Rate
NPS
Conversion
Rate
PU
ASP
Paying User
Rate
Viral
Coefficient
ARPU
ARPDAU
ARPPU Transactions
Purchase
Frequency
LTR
LTV(CLV)
PV
DAU/WAU/MAU
Click
CTR
CPM
CPC
CPA
CPS
ROAS ROI
Impression
CPI
CPE
Latency
Revenue
Abandoned
Cart
Exit Rate
Session
마케터
기획자/프로덕트 매니저
영업/MD
유입경로 분석 순위 분석, 유저환경 분석 사용행태 분석 Funnel 분석 추천 분석 매출 분석
매출 지표사용자 지표
82. 상품 등록 정보
구분 종류 용도 공통 오프라인 강의 온라인 강의 일반 상품 공연
노출정보
라벨 Front display
조합형(단기/장기 + 입문/초급/초중급/중급/중고급/ 고
급/전문가) + 단일선택형, 택2 가능(신규/쿠폰/할인/이
벤트/무료배송)
- 라벨 생성 관리자 지원
필수 선택값 아님
관리자 코멘트 Front display
기본정보
상품명 * Front display 코스명 코스명 상품명 상품명
속성 * 취소/환불 정책 분기 설렉트 메뉴 : 단과, 패키지
카테고리 * Front 필터링 목적
통합 3 depth 카테고리
- 생성 관리자 지원
요약설명 * Front display
상세설명 Front display
키워드 * Front 검색용 메타태그
상태값 해당 상품의 상태 설정 일반 캠페인의 경우 : 등록중/예약/진행중/종료 상품별로 상태값이 상이합니다.
기간정보 기간 * 취소/환불 처리 등
- 입력 완료 시 설정한 기간 정보를 하단에 자동 표시
- 강의의 경우, 강의시수 표시 병기할 것
일정 정보
- 상태(판매대기/판매중/강의중)별 기간 설정 필요
- 일정 입력방식 고민 필요
1) 구간 선택 방식 지원
2) 캘린더 선택 + 일자별 시간 입력 방식 지원
판매기간
- 상태(판매대기, 사전판매, 판매중 기간 설
정 필요
- 판매 종료일이 없는 상품 존재, 무기한 체
크 버튼 지원할 것
판매기간
- 상태(판매대기, 판매중)에 따른 기간 설정 필요
판매기간
- 상태(판매대기, 판매중)에 따른
기간 설정 필요
가격정보
판매단위 * 해당 상품의 판매단위 선택
가격정보 * Front/Back
특별할인가, 출시할인가, 얼리버드가, 최종마감가, 일반
등록가(정상가) 등록
- 할인율/할인금액 입력 지원
부가세 * Front/Back 과세 여부 및 과세율 설정
판매정보
판매수량 * 필수 입력값 지원 안 함 필수 입력값 필수 입력값
최대구매수량
상품 이미지
대표 이미지 * 이미지 등록
상세 페이지 이미지 등록
상품 상세 상품 상세 연결 상품 상세 페이지 생성 후 링크 연결
상세 정보
브랜드, 원산지, 인증정보, 중량, 용량, 포장방식,
기타정보(상품고시정보 입력)
공연 상품 상세 정보
기타 정보
강사 다중 선택 지원 필수 선택값 필수 선택값 지원 안 함 필수 선택값 아님
담당부서 단일 선택 지원 필수 선택값 필수 선택값 필수 선택값 필수 선택값
기업 담당부서가 기업교육팀인 경우에 한해 설정
담당자 다중 입력 지원 필수 선택값 필수 선택값 필수 선택값 아님 필수 선택값 아님
장소 단일 선택 지원 필수 선택값 지원 안 함 지원 안 함 필수 선택값
구매 시 혜택 포인트/쿠폰/증정품
목표
모객 목표 숫자 입력 지원 필수 선택값 아님
매출 목표 숫자 입력 지원 필수 선택값 아님
메모 메모 인풋 박스 지원 필수 선택값 아님
83. 상품정보제공 고시
전자상거래법 제 13조4항의 규정에 따라 통신판매업자는 상품과 관련한 정보를 소비자에게 고시하여야 함
http://www.law.go.kr/admRulInfoP.do?admRulSeq=2100000036285
품목 고시 내용 품목 고시 내용
디지털 콘텐츠(인터넷 강의 등)
1. 제작자 또는 공급자
2. 이용조건, 이용기간
3. 상품 제공 방식(다운로드, 실시간 스트리밍 등)
4. 최초 시스템 사양, 필수 소프트웨어
5. 청약 철회 또는 계약의 해제 ∙ 해지에 따른 효과
6. 소비자상담 관련 전화번호
기타 용역
1. 서비스 제공 사업자
2. 법에 의한 인증 ∙ 허가 등을 받았음을 확인할 수 있는 경우 그에 대한 사항
3. 이용조건(이용가능 기간 및 장소, 추가 비용 등)
4. 취소 ∙ 중도해약 ∙ 해지 조건 및 환불기준
5. 취소 ∙ 환불방법
6. 소비자상담 관련 전화번호
서적
1. 도서명
2. 저자, 출판사
3. 크기(전자책의 경우 파일의 용량)
4. 쪽수(전자책의 경우 제외)
5. 제품 구성(전집 또는 세트일 경우 낱권 구성, CD 등)
6. 출간일
7. 목차 또는 책소개(아동용 학습교재의 경우 사용연령을 포함)
공연
1. 주최 또는 기획
2. 주연
3. 관란등급
4. 상영 ∙ 공연시간
5. 상영 ∙ 공연장소
6. 예매 취소 조건
7. 취소 ∙ 환불방법
8. 소비자상담 관련 전화번호
85. 결제 관련 용어
구분 설명 기타
공급가 외부에서 상품을 매입 또는 공급 받는 경우 해당 상품의 원가
정상가(판매가) 소비자에게 보여주는 정상 판매가격 (권장소비자가)
할인가
할인된 판매가격
* 정상가 할인금액 = 할인가 할인 방식 : 할인율, 할인금액 선택 입력 지원
할인 유형 : 특별할인가, 출시할인가, 얼리버드가, 최종마감가
할인금액 정상가에서 할인된 금액
구매가(구매금액) (정상가 or 할인가) x 상품수량 = 구매금액
상품수량의 경우, 강의 상품을 제외한 일반상품과 공연 상품에만 설정 지원
- 최대 구매 가능 수량 설정 지원
주문금액 정상가 할인금액 + 배송비 + {기타 비용} = 주문금액
결제필요금액 주문금액 할인쿠폰 포인트 = 결제필요금액
모든 정률/정액 할인쿠폰은 구매금액에만 적용됩니다.
배송비 무료쿠폰은 배송비에만 적용됩니다.
모든 포인트는 주문금액을 결제하는데 사용이 가능합니다.
결제금액 주 결제수단을 통해 실 결제한 금액
결제수수료 PG사 수수료
취소금액
환불금액 반품금액 + 배송비 환불 금액 + 쿠폰 환불 금액 + 사업자부담금 = 환불금액
매출 결제금액 - 환불금액 = 매출
86. 상태값 설명
주문중 장바구니에 담겨 있는 상태
결제중 장바구니에서 [결제하기] 버튼을 클릭해서 결제 페이지로 진입한 상태
결제완료 아임포트로부터 결제성공값을 리턴 받은 상태
결제실패 아임포트로부터 결제실패값을 리턴 받은 상태
결제취소 사용자가 결제를 취소한 상태
환불신청 사용자가 환불을 신청한 상태
환불완료 환불처리가 완료된 상태
결제 상태 설명
결제상태 주문중 결제중 결제실패
결제완료
결제취소
환불완료환불신청
87. 일반 상품 구매 및 결제 Flow
판매대기 판매중, 상품준비중 배송중
배송시작 배송완료
기타 상태 : 판매중지, 판매종료구매 상태
주문중 결제중
배송기간
결제기간
결제완료
결제취소 환불신청 환불완료
결제 상태
결제실패
Front Btn 구매하기 출시알림
등록중
배송상태
결제상태
상품준비중
주문중 결제중 결제실패
배송시작 배송중 배송완료
교환요청 교환완료
반품요청 반품완료
결제완료
결제취소
환불완료
배송 상태 상품준비중 배송시작 배송중
배송완료
교환요청 교환완료
반품요청 반품완료
환불신청
88. 상품 배송 상태
상태 서비스 내 버튼 표시 관리자 내 버튼 표시 설명
상품준비중 사용자 결제가 완료되면 구매내역 리스트에 ‘상품준비중’ 상태로 리스트업 됩니다.
포장중
취소는 승인 단계 없이 취소 신청을 하면 바로 취소가 되기 때문에 ＇취소요청’ 단계가 없으며
교환/반품의 경우에는 신청/승인 단계가 있다 보니 교환요청/반품요청 상태가 존재합니다.
포장완료
배송시작
배송중
배송완료(픽업완료)
취소완료
교환요청
교환완료
반품요청
반품완료
교환취소
교환반품
선택 취소 전체 취소
선택 반품 전체 반품
일반 상품 배송 Flow
배송상태
결제상태
상품준비중
주문중 결제중 결제실패
배송시작 배송중 배송완료
교환요청 교환완료
반품요청 반품완료
결제완료
결제취소
환불완료환불신청
89. [ 배송 방식 선정 프로세스 ]
소비자 ‘구매하기’ 클
릭
매장 무료 배송 버튼
활성화
유료 배송 버튼
활성화
소비자 ‘결제하기’ 클
릭
‘상품준비중‘ 상태
구매금액이
무료 배송 지원 조건에
부합하는가?
배송지와 배송매장의
거리가 무료 배송 지원 조건에
부합하는가?
Y
N
Y
Y
매장 픽업 버튼
활성화
해당 매장이
매장 무료 배송을
지원하는가?
해당 매장이
매장 유료 배송을
지원하는가?
Y
배송지와 배송매장의
거리가 매장 유료 배송의
지원 조건에
부합하는가?
해당 매장이
C2C 배송을
지원하는가?
Y
N
N N
Y
N
N
해당 매장이
무료 빠른 배송을 지원하는가?
Y
배송가능시간대와
시간별 배송 가능 횟수
조건에 부합하는가?N
해당 매장이
유료 빠른 배송을 지원하는가?
Y
N
Y
배송가능시간대와
시간별 배송 가능 횟수
조건에 부합하는가?N
Y
N
예약배송만
지원
배송 시간 선택
해당 매장의 배송방법별 배송가능
시간대와 배송가능횟수를 기준으
로 배송가능 시간 표시
픽업 시간 선택
매장 픽업 가능 시간 표시
배송 시간 선택
해당 매장의 배송방법별 배송가능
시간대와 배송가능횟수를 기준으
로 배송가능 시간 표시
C2C 배송의 경우
처리 방법
‘배송 처리’ 페이지에
리스트업
‘담당자 지정’ 권한 있
는 관리자에 의해
배송 담당자 지정
매장 무료 배송
또는 매장 유료 배송의 경
우 배송 처리 방법
배송 출발
담당 배송원 상품 (포
장 &) 담기
‘배송중‘ 상태 변경
배송 도착
‘배송완료’ 상태 변경
배송 완료
배송 시작 알림
담당자 정보 표시
배송원 평가
콜 발송 후
60초 내에
콜 수락이 되었는가?
배송원이 설정한
배송 조건에 맞는 C2C 배
송원에게 콜 발송
Y
배송원 확정
N
배송원 변경시
변경 담당자 정보 표시
포장 완료
90. 온라인 강의 구매 및 결제 Flow
판매대기 사전판매, 판매중 수강중
결제마감 수강종료
기타 상태 : 판매중지, 판매종료, 폐강
주문중 결제중
수강기간
결제기간
결제완료
결제취소 환불신청 환불완료
결제실패
결제상태 주문중 결제중 결제실패
결제완료
결제취소
환불완료환불신청
출시알림 수강신청하기 수강신청하기
강의 상태
결제 상태
Front Btn
등록중
91. 공연 상품 구매 및 결제 Flow
판매대기 판매중 공연중
예매마감
(공연 1시간 전) 공연종료
기타 상태 : 판매중지공연 상태
주문중 결제중
공연기간
결제기간
결제완료
결제취소
환불신청 환불완료
결제 상태
결제실패
결제상태 주문중 결제중 결제실패
결제완료
결제취소
환불완료환불신청
Front Btn 출시알림 예매하기
등록중
판매종료
93. 포인트 정책 예시
제목 내용
포인트 가치 1P의 가치는 1원이며 현금 등으로 환급할 수 없습니다.
사용 방법 상품 구매 시, 전액 또는 타 결제수단과 함께 사용하여 결제할 수 있으며 최소 1,000 포인트부터 사용이 가능합니다.
유효기간 현금 구매한 포인트의 경우, 유가증권으로 간주하여 유효기간은 5년입니다.
이벤트 등으로 지급한 포인트의 경우, 약관을 통해 정책으로 그 유효기간을 정합니다.
소멸 정책 포인트의 유효기간은 월별로 관리되고 지급된 월로부터 5년이 지난 후 익월의 말일에 자동적으로 소멸됩니다.
단, 포인트 사용시 유효기간 만료일이 가까운 포인트부터 먼저 차감됩니다.
예) 8월 3일에 지급된 포인트는 5년 이후 9월 31일에 소멸됩니다.
95. 쿠폰 종류
쿠폰 종류 쿠폰 적용 범위 쿠폰 혜택 및 형식 환불 시 처리방법
정액 쿠폰 특정 상품 XX원 할인쿠폰
특정상품을 환불요청한 경우, 특정상품에 적용한 할인쿠폰의 사용금액을 제외한 금액을 결제방식에 따른 환불 우선순위에 따라 환불처리합니다.
ex) 100원짜리 상품을 ‘10원 할인 정액쿠폰’을 사용해 구매 후 환불요청 시, 90원을 결제방식에 따른 환불 우선순위에 따라 환불함
정률 쿠폰 특정 상품 XX% 할인쿠폰
특정상품을 환불요청한 경우, 특정상품에 적용한 할인쿠폰의 사용금액(%)을 결제금액에서 결제방식에 따른 환불 우선순위에 따라 환불처리합니다.
ex) 100원짜리 상품을 ’10% 할인 정률쿠폰’을 사용해 구매 후 환불시, 90원을 결제방식에 따른 환불 우선순위에 따라 환불함
배송비 쿠폰 배송비 배송비 무료 쿠폰
환불요청 시 변경된 구매내역이 배송비 쿠폰의 사용조건에 맞지 않는 경우
1) 환불금액에서 배송비를 제외하고 환불처리합니다.
2) 1)의 경우, 환불금액이 배송비보다 작은 경우, 보유한 포인트에서 배송비 환불 차액을 차감합니다.
3) 2)의 경우, 보유한 포인트 및 잔고가 없는 경우에는 패캠에서 해당 배송비 차액을 부담합니다.
* 패키지 상품의 경우, 정액 쿠폰을 사용할 수 없습니다.
쿠폰 발행
내용 방식 설명 기타
쿠폰 발행
생성 서버에서 발행 갯수에 따라 난수 코드 발행
등록 외부에서 생성한 난수 코드를 서버에 등록 제휴 프로모션 진행 시 사용
쿠폰 지급
DB에서 선택 방식 개발팀에 요청을 통해 반복된 쿠폰 지급 방식을 생성
파일등록 액셀 파일 업로드
개발등록 개인회원의 이메일을 입력하여 지급 한 행에 한 이메일씩 입력하여 다수 회원 지급 가능
전체회원 전체 회원에게 일괄 지급
97. 일반 상품 취소/환불 정책
구분 내용 환불 방법 기타
일반상품
취소 전액 환불
- 반품 받은 날로부터 3 영업일 이내 환불처리
- 공급 받은 날로부터 3개월 이내, 그 사실을 안 날 또는 알
수 있었던 날로부터 30일 이내 반품 가능반품
상품 수령 후 7일 이내 100% 환불
반품 시 배송비는 소비자가 부담 (단, 판매자 귀책사유의 경우 판매자 부담)
결제완료
배송완료 후
7일 이내
일반 상품의 경우
상품준비중 배송완료
취소 가능
취소 신청 취소는 구매완료 후 상품 주문 및 발주가 시작되기 전까지만 가능합니다.
즉 취소는 ‘결제완료, 상품준비중’ 상태에서만 가능하고 ‘배송시작’ 상태가 되면 불가합니다.
반품 비용 · 고객의 귀책사유로 반품 시 : 배송비는 고객이 부담합니다.
· 회사의 귀책사유로 반품 시 : 고객센터의 안내에 따라 별도의 비용부담 없이 반품하실 수 있습니다.
반품 신청 기준일 · 반품은 상품 수령 후 7일 이내 까지만 가능합니다.
· 상품의 내용이 표시·광고의 내용과 다른 경우에는 상품을 수령한 날로부터 3개월 이내, 그 사실을 안 날 또는 알 수 있었던 날로부터 30일 이내
에 반품이 가능합니다.
반품 제한사항 · 회원에게 책임 있는 사유로 상품 등이 멸실 또는 훼손 등으로 재판매가 불가한 경우
· 회원의 사용 또는 시간경과, 일부 소비로 상품 등의 가치가 현저히 감소한 경우
· 시간이 지나 재판매가 곤란할 정도로 상품 등의 가치가 현저히 감소한 경우
· 복제가 가능한 상품 등의 포장을 훼손한 경우
· 회사가 상품 등의 청약철회 등의 제한에 관해 사전에 고지한 경우
· 그 밖에 거래의 안전을 위하여 법령으로 정한 경우
배송시작
배송중
반품 가능
98. 온라인 강의 취소/환불 정책
구분 내용 환불 방법 기타
단과
취소 수강기간 7일 미만 전액 환불
- 수강시작일은 결제일시(메일발송시점)를 기준으로 함
- 환불 의사를 밝힌 다음날부터 계산하여 환불
- 환불금액은 수업일을 기준(반올림)으로 산정
- 환불금액의 10원 미만은 절삭
- 반환 사유 발생 시 3 영업일 이내 환불
- 90일 이내 또는 문제를 발견하신 날로부터 30일 이내 일할 계산 공제 후 환불
해지
수강기간 1/3 경과 전 : 수강료 2/3 환불
수강기간 1/2 경과 전 : 수강료 1/2 환불
수업시간 1/2 경과 후 : 환불금액 없음
패키지
취소 수강기간 7일 미만 전액 환불
해지
수강기간 7-10일 미만 : 수강료 2/3 환불
수강기간 11-15일 미만 : 수강료 1/2 환불
수강기간 15일 초과 : 환불금액 없음
수업시작일 유료수강기간
종료일 (30일)
온라인 단과 과정의 경우
수강기간
7일째
수업시간
1/3 경과
수업시작일
온라인 패키지 과정의 경우
수강기간
7일째
수강기간
10일째
수강기간
15일째
2/3 환불
1/2 환불
환불 없음
취소가능
2/3 환불
1/2 환불
수업시간
1/2 경과
취소가능
환불 없음
결제일시
결제일시 유료수강기간
종료일 (30일)
99. 공연/세미나/컨퍼런스 취소/환불 정책
구분 내용 환불 방법 기타
공연
세미나
컨퍼런스
취소
공연 10일 전 전액 환불
공연 3일 전까지는 예매 후 24시간 이내 취소 시 전액 환불 (단, 공휴일 등 비영업일
은 시간계산에서 제외)
- 환불금액의 10원 미만은 절삭
- 환불 요청 시 3 영업일 이내 환불
해지
공연 7일 전 : 10% 공제 후 환불
공연 3일 전 : 20% 공제 후 환불
공연 1일 전 : 30% 공제 후 환불
공연 당일 시작 1시간 전 : 90% 공제 후 환불
공연
10일 전
공연 당일
공연/세미나/컨퍼런스의 경우
공연
7일전
공연
3일전
10% 공제 후 환불
20% 공제 후 환불
30% 공제 후 환불
공연
1일전
취소 가능
결제일시
공연 1시간 전
90% 공제 후 환불
예매 후 24시간 이내 취소 가능
101. 고갱님, 일단 입어보시겠어요?
고갱님, 일단 빨리 한번 들어와보세요!
다양한 비밀번호 찾기 방식 지원
들어올 땐 자유지만 나갈 땐 아니다.
이게 저것 같고 저게 이것 같고...
일단 파는 것이 중요하다.
한 곳에서라도 더 팔아야 한다.
상품을 팔기 위해 컨텐츠를 산다.
QR코드, 사진, 음성 등 다양한 검색 방식을 제공
챗봇을 잘 활용한다.
멀티 구매와 배송을 지원
완성도보단 실행력과 속도
중국의 서비스 기획
102. 다중 언어 및 로컬라이제이션에 대한 고려
타임존에 대한 고려
단말기 및 해상도에 대한 고려
네트웍 및 인프라에 대한 고려
글로벌 서비스 기획 시 고려사항
