[무료 특강] 다크패턴 없이 가입·구독·해지 화면 만들기 — 국내외 서비스 실측과 전자상거래법 안전선

해외 유명 SaaS의 가입 폼, 세전 요금표, 7클릭 해지 모달을 그대로 따라 만들었다가 한국 법령 위반이나 환불 분쟁에 걸리지 않도록 짚어 주는 실전 UI 설계 특강입니다. 2025년 2월 14일 시행 개정 『전자상거래법』(6대 온라인 다크패턴 금지)과 『개인정보 보호법』, 『정보통신망법』(KISA 안내서 7차) 원문을 국내외 9개 서비스 16장의 실측 화면과 1:1로 대조하고, 바로 복사해 쓰는 한국어 UI 문구 5종과 출시 전 12항목 점검표·AI 감사 프롬프트 3종을 제공합니다.

7명 이 수강하고 있어요.

난이도 입문

수강기한 무제한

AI 활용법
AI 활용법
실습 중심
실습 중심
서비스기획
서비스기획
UI/UX
UI/UX
창업
창업
AI 활용법
AI 활용법
실습 중심
실습 중심
서비스기획
서비스기획
UI/UX
UI/UX
창업
창업

수강 후 이런걸 얻을 수 있어요

  • 2025년 2월 14일 시행 개정 『전자상거래법』 제13조제6항 및 제21조의2가 금지하는 6대 온라인 다크패턴(숨은 갱신 · 순차공개 가격책정 · 특정옵션 사전선택 · 잘못된 계층구조 · 취소/탈퇴 방해 · 반복간섭)의 화면별 경계선

  • 『개인정보 보호법』 제15조·제22조(필수 4대 고지 · 선택 미체크 시 진행 버튼 즉시 활성)와 KISA 7차 안내서(「광고성 정보 수신 동의」 명칭 및 전송자 표기)에 맞는 안전한 가입·뉴스레터 온보딩 폼 설계법

  • 첫 화면 부가세(VAT 10%) 포함 총액 표시, 첫 달 할인 후 정가 전환·증액 사전 고지(30일 내 동의 · 7일 전 통지), 다회차 강의 부분 환불 및 단건 디지털 파일의 철회 제한 성립 3단 안전장치(무료 샘플 + 버튼 옆 굵은 고지 + 별도 체크)

  • Typecast · ElevenLabs · Google Workspace 3사 유료 해지 실측을 바탕으로 이탈은 줄이고 법적 분쟁은 막는 「4클릭 완료 + 1회 혜택 제안 + 50:50 대칭 버튼 + 만료일 유지 및 1클릭 복구」 리텐션 모달 설계 공식

지피티쌤 무료 특강 / 본편 6개 14분 / 5쪽 실전 키트 PDF

해외 SaaS 결제창과 해지 모달,
그대로 베끼면 왜 위험할까요?

인공지능(AI)으로 웹 서비스나 유료 뉴스레터, 노션 템플릿, 온라인 강좌를 만들어 출시를 앞둔 1인 제작자와 서비스 기획 담당자를 위한 실전 특강입니다. 해외 유명 서비스의 가입창이나 세전 요금표, 7클릭 해지 모달을 그대로 따라 만들었다가 한국 법령 위반이나 환불 분쟁에 걸리지 않도록 제가 직접 9개 서비스를 결제하고 해지하며 클릭 수와 버튼 크기를 하나씩 재 봤습니다.

2025. 02. 14. 시행

개정 『전자상거래법』 6대 온라인 다크패턴 금지 전면 시행 (위반 시 시정조치 및 과태료 최대 3,000만 원 기준)

2026. 10. 18. 실측

국내외 9개 서비스 16장 실제 화면 캡처 대조 (4클릭 50:50 대칭 해지 모범 사례 vs 7클릭 이메일 타이핑 대조군)

출시 전 15분 점검

바로 복사해 쓰는 한국어 UI 문구 템플릿 5종(T1~T5) + 12항목 자체 감사표 + AI 감사 프롬프트 3종(P1~P3)

결제창을 열기 전 이런 고민이 한 번이라도 들었다면 꼭 확인해 보세요

구독 버튼 밑에 「가입 시 마케팅 수신에 동의한 것으로 간주합니다」라고 적으면 되나요?

첫 달 1,000원 이벤트를 할 때 다음 달 정가 자동결제는 언제 어떻게 알려야 하나요?

노션 템플릿이나 전자책 PDF도 다운로드 직후 환불해 달라고 하면 다 돌려줘야 하나요?

해지하려는 고객에게 30% 할인 쿠폰을 한 번 제안하는 것도 다크패턴 위반인가요?

네 가지 모두 약관 글씨가 아니라 화면의 체크박스와 버튼 배치가 결정합니다. 1강부터 6강까지 법 조문 원문과 실제 화면 캡처로 명쾌하게 정리해 드립니다.

완성품: 현행 법 조문과 9개 서비스 16장 화면 1:1 실측

추상적인 법 이론이 아니라 The Rundown AI, Google Antigravity, Canva, Perplexity, Suno, Kling AI, Typecast, ElevenLabs, Google Workspace 9개 서비스를 직접 눌러 캡처한 16장의 화면과 현행 법령 원문(2026년 10월 15일 기준)을 단계별로 대조했습니다.

1단계 동의창: 무엇을 비워 두고 무엇을 분리해야 하나요?

가입 동의창 실측 비교: 선택 체크박스를 비워 두어도 다음 버튼이 즉시 켜지는 Google Antigravity 모범 화면과 필수 약관을 분리한 Canva 동의 게이트

핵심 안전선 (개인정보 보호법 제22조제5항 및 전자상거래법 제21조의2): 모든 체크박스 초기값은 빈칸으로 두고, 선택 항목을 체크하지 않아도 가입 진행 버튼이 즉시 켜져야 합니다. 또한 KISA 안내서 7차(12쪽)에 따라 약관 본문에 섞어 넣거나 「혜택 알림 동의」로 우회하지 말고 [선택] 광고성 정보 수신 동의 명칭과 전송자를 분명히 적어야 합니다.

2단계 요금표와 청약철회: 세금 가산과 환불 제한의 안전선은?

요금표와 청약철회 실측 비교: 결제 마지막 창에서 세금이 추가되는 해외 결제창 주의 사례와 부가세 포함 총액 및 환불 기준을 사전 고지한 Perplexity 한국 안내 화면

요금표 안전선 (전자상거래법 제13조제6항 및 제21조의2): 첫 요금표에는 세전 금액만 적고 결제 마지막 창에서 부가세 10%를 덧붙이면 순차공개 가격책정 위험이 생깁니다. 첫 화면부터 부가세 포함 최종 총액을 표시하고, 무료체험이나 첫 달 특가 후 정가 전환 시에는 전환일로부터 30일 이내 별도 명시적 동의와 결제 7일 전 사전 고지를 갖춥니다.

디지털콘텐츠 청약철회 (전자상거래법 제17조제2항제5호 단서): 여러 강으로 나뉜 온라인 강좌는 가분적 콘텐츠이므로 「1강만 봐도 전액 환불 불가」 약관은 효력이 부인될 위험이 큽니다(7일 내 미열람 회차 환불 원칙). 쪼갤 수 없는 단건 PDF나 노션 템플릿은 ① 무료 미리보기 샘플 제공 + ② 결제 버튼 바로 옆 굵은 고지 + ③ 별도 체크박스 3단 요건을 모두 갖춰야 철회 제한이 성립합니다.

3단계 구독 해지 동선: 유료 서비스 3사 직접 해지 실측 비교

유료 구독 해지 3사 실측 비교: 4클릭으로 끝나는 Typecast와 50대50 대칭 버튼을 둔 ElevenLabs 모범 사례, 그리고 7클릭과 이메일 직접 타이핑을 요구하는 Google Workspace 대조군 화면

취소 방해와 잘못된 계층구조 예방: 기업용(B2B) 어드민에서나 쓰는 고마찰 해지(더보기 메뉴 은닉, 이메일 직접 타이핑 7클릭)를 일반 소비자(B2C) 구독 서비스에 그대로 복제하면 큰 위험이 됩니다. 아래 실측 비교표처럼 4클릭 완료 + 딱 1회 맞춤 혜택 제안 + 50:50 대칭 버튼 + 만료일 유지 및 1클릭 복구가 가장 깔끔한 공식입니다.

국내 B2C 모범 / Typecast

총 4클릭 완료 + 하위 플랜 제안

결제 관리 첫 화면에서 바로 진입합니다. 월 60,000원을 아끼는 하위 요금제를 1회 제안하고, 해지 완료 뒤에도 남은 결제 주기까지 권한을 유지하며 [플랜 해지 취소] 1클릭 복구 버튼을 둡니다.

글로벌 B2C 모범 / ElevenLabs

총 4클릭 완료 + 50:50 대칭 버튼

남은 30,731크레딧을 약 31분 분량 음성으로 환산해 보여 주고, 사용량 부족 사유를 고르면 다음 달 30% 할인을 딱 1회 제안합니다. 이때 [Accept Offer]와 [Cancel Plan] 버튼을 50:50 같은 크기로 둡니다.

B2B 고마찰 대조군 / Google Workspace

총 7클릭 + 이메일 직접 타이핑

더보기(MORE) 하위 메뉴 은닉, 80% 감액 파란 버튼 비대칭 강조, 관리자 이메일 직접 타이핑까지 거쳐야 해지됩니다(단, 해지 후 51일 내 재구매 시 데이터가 그대로 복구되는 반전 안전장치 확인).

바로 복사해 쓰는 한국어 UI 문구 템플릿 맛보기

1강 수업 자료 PDF에는 가입 동의창부터 요금표, 청약철회, 해지 모달까지 5종의 한국어 표준 문구(T1~T5)가 들어 있습니다. 그중 두 가지를 미리 보여 드립니다.

실전 문구 예시: 광고성 정보 수신 동의(T1)와 4클릭 대칭 해지 모달(T5)

템플릿 T1 (가입 및 뉴스레터 동의창 복붙용)

☐ [필수] 서비스 이용약관 동의 (전문 보기)
☐ [필수] 개인정보 수집 및 이용 동의 (목적: 회원 식별 및 서비스 제공 / 항목: 이메일 / 보유기간: 회원 탈퇴 시 즉시 파기 / 동의를 거부할 권리가 있으며 거부 시 가입이 제한됩니다)
☐ [선택] 광고성 정보 수신 동의 (전송자: [서비스명] / 이메일로 신규 기능, 할인 혜택 및 뉴스레터를 받습니다. 동의하지 않아도 회원가입과 기본 서비스 이용에는 아무 제한이 없습니다)

템플릿 T5 (4클릭 50:50 대칭 해지 모달 복붙용)

잠깐만요! 지금 해지하셔도 이미 결제하신 [만료일]까지는 남은 [잔여 크레딧/이용권]을 끝까지 쓰실 수 있습니다.
혹시 이용 빈도가 낮아 부담스러우셨다면, 다음 달 요금을 30% 할인해 드리는 1회 혜택을 적용해 보시겠어요?
[다음 달 30% 할인받고 유지하기] (50% 너비) | [혜택 없이 해지 완료하기] (50% 너비, 같은 글자 크기와 대비)

강의가 끝나면 가져가는 세 가지

1. 실측 비교 영상 6개(14분)와 3문항 점검 퀴즈

9개 국내외 서비스의 16장 실측 화면(개인정보 단색 가림본)과 6대 다크패턴 안전선을 압축한 6개 수업 + 제출 즉시 정답과 해설이 나오는 자동 피드백 퀴즈

2. 수업 자료 PDF 5쪽 (c13_safe_subscription_funnel_kit.pdf)

6대 다크패턴 안전선 및 3사 해지 비교표, 바로 복사해 쓰는 한국어 UI 문구 템플릿 5종(T1~T5). 1강 우측 상단 [수업 자료]에서 바로 받으실 수 있습니다.

3. 출시 전 15분 12항목 점검표와 AI 감사 프롬프트 3종(P1~P3)

가입 동의창(4항목), 요금표와 청약철회(4항목), 해지 동선(4항목) 출시 직전 자체 감사표와 내 화면 문구를 교정하는 복붙 프롬프트 3종

6개 수업에서 살펴보는 순서

1강

[완성품 먼저] 비로그인 가치 공개와 행동 시점 가입 유도(The Rundown AI)부터 2025년 2월 14일 시행 개정 전자상거래법 6대 다크패턴 전체 지도를 한눈에 잡습니다.

2강

[동의창] 선택 동의 미체크 즉시 통과(Google Antigravity)와 필수 게이트 분리(Canva), 개인정보 4대 고지, KISA 7차 「광고성 정보 수신 동의」 명칭 기준을 맞춥니다.

3강

[요금표] 결제창 세금 뒤늦은 가산(Suno 주의)과 첫 달 특가 강조(Kling AI 주의)를 Perplexity 한국 고지와 비교해 부가세 포함 총액, 30일 전 동의, 7일 전 고지 화면을 설계합니다.

4강

[청약철회] 다회차 온라인 강좌의 미열람분 부분 환불 원칙과 단건 PDF 및 템플릿 파일의 철회 제한 성립 3단 요건(무료 샘플 + 버튼 옆 굵은 고지 + 별도 체크)을 구분합니다.

5강

[해지 동선] Typecast(다운그레이드 및 4클릭), ElevenLabs(31분 환산 및 30% 할인 50:50 대칭 버튼), Google Workspace(7클릭+이메일 타이핑 대조군)를 비교해 건강한 리텐션 모달을 설계합니다.

6강

[실전 적용] 출시 전 15분 만에 끝내는 3구간 12항목 자체 감사 루틴과 내 화면 문구를 AI로 교차 점검하는 프롬프트 3종(P1~P3) 사용법으로 마무리합니다.

프롬프트엔지니어링과 사람의 역할 분담

프롬프트엔지니어링: 내 화면 문구를 AI 감사관에게 먼저 맡기기

출시 전 AI에게 건넬 3단계 점검 프롬프트(P1~P3)

인공지능(AI) 도구(Claude, ChatGPT, Gemini 등)에게 막연히 「약관 써 줘」라고 시키면 법정 고지 항목이 빠지거나 영문 다크패턴 문구를 그대로 번역해 주곤 합니다. 수업 자료 PDF에 수록된 프롬프트엔지니어링 템플릿 3종(P1~P3)에 내 화면 초안을 넣으면 빠진 고지 항목과 비대칭 버튼 문구를 1분 안에 찾아 교정할 수 있습니다.

서비스 기획과 운영에서 사람이 직접 결정할 일

AI 감사 프롬프트(P1~P3)가 돕는 일

가입 입력칸과 체크박스 초안에서 사전선택 위험과 빠진 법정 4대 고지 점검(P1)
요금표와 결제 버튼 위 문구를 부가세 총액 및 적법한 청약철회 문구로 교정(P2)
해지 단계에서 고마찰 요소를 덜어 내고 4클릭 50:50 대칭 모달 문구 작성(P3)

서비스 기획 및 운영자가 직접 챙길 일

사업자등록 및 통신판매업 신고 정보 사이트 하단 상시 표시
단건 디지털 파일 판매 전 무료 미리보기 샘플 실제 제작 및 공개
정기결제 전환이나 요금 인상 전 사전 알림 발송 및 약정한 환불 기준의 성실한 이행

이 강의가 아닌 것

변호사의 개별 사건 법률 자문이나 공정위, 법원 분쟁 대리를 대신하는 강의가 아니며, 특정 전환율이나 매출, 수익 결과를 보장하지 않습니다. 법적 규제를 교묘히 피해 가는 편법도 다루지 않습니다.

현행 법령과 안내서 원문(2026년 10월 15일 대조 기준) 및 9개 국내외 서비스 화면 실측(2026년 10월 18일 기준)을 토대로 제작한 UI 설계 교육 자료이며, 인용한 각 기업의 위법 여부를 단정하지 않습니다. 법령 개정이나 개별 계약 구조에 따라 세부 적용이 달라질 수 있으므로 특수한 약관 심사는 법률 전문가와 함께 확인해 주세요.

실측 화면 속 계정 이메일, 결제 식별값, 구독 토큰은 불투명 단색 상자로 가렸습니다. 강의 음성은 AI 음성(TTS)입니다.

다음 강의

지피티쌤을 팔로우해 두시면 다음 실전 특강 소식을 바로 받아 보실 수 있습니다.

내 화면 문구가 헷갈릴 땐 이렇게 점검하세요

수업 자료 PDF의 프롬프트(P1~P3)에 고객 개인정보는 빼고 내 화면 문구만 넣어 AI에게 먼저 점검받아 보세요.
더 궁금한 점이나 내 가입, 결제, 해지 UI 피드백은 질문 게시판과 오픈채팅방에서 함께 나눕니다.

이런 분들께
추천드려요

학습 대상은
누구일까요?

  • AI로 웹 서비스(SaaS), 유료 뉴스레터, 노션 템플릿·전자책, 온라인 강좌를 만들어 결제창 오픈을 앞둔 1인 제작자 및 소규모 팀

  • 해외 서비스의 요금표(세금 별도·첫 달 특가)나 구독 해지 만류 모달을 벤치마킹하면서 한국 전자상거래법·개인정보 보호법 위반 위험이 걱정되는 기획자·디자이너·개발자

  • 내 가입창·요금표·환불 안내·해지 화면 문구를 출시 전 15분 만에 자체 감사하고 한국어 표준 문구로 깔끔하게 정리하고 싶은 운영자

선수 지식,
필요할까요?

  • 법률 지식이나 코딩 경험이 없어도 이해할 수 있도록 실제 서비스 화면 캡처 16장과 전후 대조 도식 중심으로 설명합니다

  • 준비물: 수업 자료 PDF의 AI 감사 프롬프트(P1~P3)를 붙여 넣을 AI 채팅 도구(Claude · ChatGPT · Gemini 중 아무것이나 가능)

안녕하세요
지피티쌤입니다.

183

명

수강생

9

개

수강평

4.6

점

강의 평점

11

개

강의

AI 에이전트 워크플로우와 콘텐츠 자동화 시스템을 연구·구축하는 지피티쌤입니다.

화제의 글로벌 AI 기술과 워크플로우를 직접 구현·검증한 뒤, 비개발자도 10분 만에 자신의 컴퓨터에서 똑같이 재현할 수 있도록 실행 기록·프롬프트 규격·오픈소스 스타터 킷을 파일째 공개하고 가르칩니다. 조회수나 수익 같은 과장된 약속 대신, 실제로 무엇이 작동했고 어떻게 검증했는지를 데이터와 코드로 보여 드립니다.

[주요 연구 및 강의 분야]

  • AI 에이전트 & 제2의 뇌 구축: Claude Code · Google Antigravity · Karpathy LLM Wiki 기반 지식 컴파일 및 업무 자동화

  • AI 영상·콘텐츠 제작 시스템: Google Flow(Veo) · TTS · 에이전트를 결합한 팩트체크 및 자동 렌더링 파이프라인

  • 무결성 검증 자동화: 대본·위키·데이터의 깨진 링크와 사실 관계를 전수 검사하는 린트(Lint) 파이프라인

[공식 채널 및 오픈소스 실습실]

더보기

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!

지피티쌤님의 다른 강의

지식공유자님의 다른 강의를 만나보세요!

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

무료