Touchlike Web Roulette

터치라이크 웹룰렛
준비 가이드

의뢰사 준비 자료 안내

이벤트를 열기 위해 의뢰사에서 준비해 주셔야 하는 자료를 정리한 문서입니다. 특히 룰렛 이미지는 규격을 지키지 않으면 화살표와 당첨 경품이 어긋나 보이므로, 디자인 담당자께 이 문서를 그대로 전달해 주세요.

자료가 모두 모이면 이벤트 세팅은 1~2일 경품·이미지·문구가 확정되면 터치라이크에서 이벤트를 만들고 테스트 링크를 드립니다. 그 뒤 홈페이지에 스크립트 한 줄을 넣으면 시작됩니다.
⬇ PDF 다운로드 HTML 파일 저장 PDF가 열리지 않으면 인쇄 → 대상을 PDF로 저장으로 선택하세요.

준비 자료 한눈에 보기

아래 7가지입니다. 담당자가 나뉘는 항목은 오른쪽에 표시했습니다.

1이벤트 기본 정보이벤트명 · 주최자명 · 수령처 · 기간기획 담당
2경품 구성표품목 · 수량 · 당첨 확률 · 꽝 포함 여부기획 담당
3룰렛 이미지정사각형 PNG · 칸 번호 매핑표 포함디자인 담당
4화살표 이미지세로형 PNG · 투명 배경 선택디자인 담당
5브랜드 색상 · 버튼 문구HEX 색상코드 · 플로팅 버튼 문구디자인/기획
6개인정보 고지 정보수집·이용자명 · 보유기간 · 문의처법무/기획
7홈페이지 정보주소 · 제작 도구 · 스크립트 삽입 권한웹 담당
3번 룰렛 이미지가 가장 오래 걸립니다 나머지는 메일 한 통으로 끝나지만 이미지는 제작·수정이 필요합니다. 가장 먼저 시작해 주시고, 초안이 나오면 완성 전이라도 한 번 보내주세요. 규격이 맞는지 미리 확인해 드립니다.

1이벤트 기본 정보

화면과 문자에 그대로 표시되는 값입니다.

이벤트명룰렛 화면 맨 위와 당첨 문자 첫 줄에 들어갑니다.
예: “더프라임 모델하우스 오픈 이벤트” — 15자 안팎이 보기 좋습니다.
주최자명개인정보 동의 전문의 수집·이용자로 표기됩니다. 법인명 또는 사업장명.
수령처경품을 받는 장소. 화면 부제와 문자의 수령처에 표시됩니다.
예: “더프라임 모델하우스 (○○시 ○○구 ○○로 12)”
이벤트 기간시작일시 · 종료일시. 종료 후에는 룰렛이 “종료된 이벤트입니다”로 바뀝니다.
수령 가능 시간현장 운영시간. 문자 안내에 넣을지 알려주세요. 선택

2경품 구성표

아래 형식으로 정리해 주시면 그대로 세팅됩니다.

작성 예시 — 수량은 실제로 준비하신 실물 개수를 적어 주세요
경품명수량당첨 확률룰렛 칸 번호
스타벅스 아메리카노100개10%1번, 4번
배스킨라빈스 싱글50개5%2번
에코백30개3%5번
꽝 (다음 기회에)나머지 전부3번, 6번
수량은 자동으로 관리됩니다 준비하신 수량이 모두 당첨되면 그 경품은 더 이상 나오지 않습니다. 모든 경품이 소진되면 룰렛은 “준비된 경품이 모두 소진되었습니다”로 바뀝니다. 실물보다 많은 수량을 적으시면 지급할 수 없는 당첨이 발생하니 실제 준비 수량을 적어 주세요.

꽝 칸은 두는 편이 좋습니다

꽝 없이 전부 당첨으로 만들면 경품이 하루 만에 소진됩니다. 또한 꽝이 나왔을 때 화살표가 멈출 칸이 없으면, 화살표는 경품 칸을 가리키는데 “다음 기회에”가 뜨는 어색한 상황이 생깁니다. 룰렛에 꽝 칸을 최소 1개 넣어 주세요.

경품 이미지 선택

당첨 화면에 경품 사진을 넣고 싶으시면 경품별로 정사각형 PNG/JPG (400×400 이상)을 주세요. 없으면 경품명만 크게 표시됩니다.

3룰렛 이미지 제작 가이드

가장 중요한 자료입니다. 아래 규격을 지켜 주세요.

파일 형식PNG (배경 투명 가능) — JPG도 가능하지만 가장자리가 지저분해질 수 있습니다
크기800 × 800 px 권장 (최소 480 × 480). 반드시 정사각형
가로세로가 다르면 원이 찌그러집니다. 실제 화면에는 340px 폭으로 줄여 표시하므로, 고해상도 화면에서 선명하려면 800px가 좋습니다.
용량500KB 이하 권장 — 모바일에서 늦게 뜨지 않도록
모양원이 이미지 정중앙에 오고, 원 바깥은 여백(또는 투명)
칸 나누기균등 분할만 지원합니다. 6칸이면 60°씩, 8칸이면 45°씩.
칸 크기를 다르게 만들면 화살표가 엉뚱한 칸에 멈춥니다.
칸 수4 ~ 12칸 권장. 칸이 많을수록 글자가 작아집니다.
글자 위치칸 경계선에서 충분히 안쪽에. 경계에 붙으면 어느 칸인지 헷갈립니다.
파일명이벤트명-wheel.png 형식 (영문·숫자). 예: theprime-wheel.png

칸 번호 매기는 규칙 — 가장 자주 틀리는 부분

12시 방향에서 시작해 시계 방향으로 1번, 2번, 3번… 입니다. 즉 1번 칸은 12시에서 오른쪽으로 첫 번째 칸입니다. 이 번호로 “어느 칸에 어느 경품”인지 알려주셔야 화살표가 정확한 칸에 멈춥니다.

1 2 3 4 5 6 ▲ 화살표는 항상 12시 고정
6칸 예시12시에서 시계 방향으로 1 → 6. 같은 경품을 여러 칸에 넣어도 됩니다(예: 1번·4번 모두 아메리카노).
글자는 칸 가운데, 경계선에서 떨어뜨리기
글자 배치경계선에 걸치거나 원 바깥으로 넘치면, 멈춘 칸이 어디인지 참여자가 헷갈립니다.
칸 번호 매핑표를 반드시 함께 보내주세요 이미지만 받으면 어느 칸이 어느 경품인지 알 수 없습니다. “1번 = 아메리카노, 2번 = 배스킨라빈스, 3번 = 꽝 …” 처럼 적어 주시거나, 이미지에 번호를 표시한 캡처를 함께 주세요. 이 매핑이 틀리면 화살표가 가리킨 칸과 실제 당첨 경품이 다르게 보입니다.

4화살표 이미지 선택

따로 주지 않으시면 기본 화살표를 사용합니다.

파일 형식PNG, 배경 투명 필수
크기세로로 긴 형태. 폭 60 ~ 120px 권장
화면에서는 룰렛 폭의 12%(약 41px)로 줄여 표시되므로, 그보다 크게 만들어 주시면 선명합니다.
길이화살표는 룰렛 맨 위에서 아래로 놓입니다. 이미지가 길수록 끝점이 룰렛 안쪽 깊숙이 들어갑니다.
끝점이 바깥 테두리 부근에 오도록 길이를 잡아 주세요. 폭의 1.5배 안팎이면 대체로 맞습니다.
색상룰렛 테두리와 다른 색으로. 같은 색이면 화살표가 안 보입니다.
방향룰렛 위쪽에서 아래(룰렛 중심)를 향하는 모양
파일명이벤트명-arrow.png 예: theprime-arrow.png
뾰족한 끝이 이미지의 가로 정중앙에 와야 합니다 화살표는 이미지 가운데를 기준으로 룰렛 꼭대기에 놓입니다. 끝점이 한쪽으로 치우쳐 있으면 그만큼 옆 칸을 가리켜, 당첨 경품과 화살표가 어긋나 보이는 문제가 생깁니다. 좌우 여백을 똑같이 주고 끝점을 정확히 가운데 두세요.
✓ 끝점 = 이미지 정중앙
올바른 예이미지 좌우 여백이 같고, 뾰족한 끝이 중앙선 위에 정확히 놓입니다.
✕ 끝점이 왼쪽으로 치우침
잘못된 예이만큼 옆 칸을 가리키게 되어, 당첨 경품과 화살표가 달라 보입니다.

5브랜드 색상 · 버튼 문구

홈페이지 분위기에 맞추는 값입니다. 안 주시면 기본값으로 진행합니다.

포인트 색상HEX 코드로 주세요. 예: #12695E
룰렛 돌리기 버튼, 수령번호 글자, 플로팅 버튼에 함께 쓰입니다. 기본값 #E2467A
배경색팝업 내부 배경. 기본 흰색.
플로팅 버튼 문구참여자가 팝업을 닫으면 우측 하단에 남는 버튼의 글자.
기본값 “🎁 룰렛 이벤트”. 10자 이내를 권합니다.
팝업 노출 시점페이지가 열리고 몇 초 뒤에 띄울지. 기본 3초.

6개인정보 고지 정보

동의 전문에 그대로 들어갑니다. 법적으로 반드시 필요한 값입니다.

수집·이용자동의 전문에 표기될 주최자 이름 (법인명 또는 사업장명)
보유·이용 기간기본값 이벤트 종료 후 3개월. 다르게 하시려면 알려주세요.
문의 · 철회 연락처참여자가 동의 철회나 문의를 할 연락처 선택
마케팅 활용 범위선택 동의로 받을 내용. 기본값은 “분양 정보 안내, 모델하우스 방문·상담 안내 등”
전문은 화면에서 바로 열립니다 — 별도 페이지를 만드실 필요 없습니다 동의 항목 옆 전문보기를 누르면 수집 항목·목적·보유기간·처리 위탁이 적힌 전문이 표시됩니다. 위 값만 확정해 주시면 됩니다.
마케팅 동의는 경품 조건이 될 수 없습니다 필수(수집·이용)와 선택(마케팅)은 별도 체크박스로 분리되어 있고, 마케팅에 동의하지 않아도 경품은 정상 지급됩니다. 법적 요건이라 변경할 수 없습니다.

7홈페이지 정보

스크립트를 넣을 홈페이지에 대한 정보입니다.

홈페이지 주소이벤트를 띄울 페이지 주소. https로 시작해야 합니다.
http 사이트에서는 브라우저가 차단합니다. SSL 인증서는 대부분의 호스팅에서 무료로 제공합니다.
제작 도구워드프레스 · 카페24 · 아임웹 · 윅스 · 직접 제작 등
네이버 모두/스마트스토어는 외부 스크립트를 지원하지 않아 진행이 불가합니다.
노출 범위전체 페이지인지, 특정 페이지(메인·분양 안내 등)만인지
스크립트 삽입 담당홈페이지를 수정할 수 있는 분의 연락처
보안 설정(CSP)을 쓰는 사이트라면 도메인 허용이 필요할 수 있습니다.

자료 전달 방법

  1. 1~2, 5~7번은 메일 본문이나 표로

    양식은 자유입니다. 위 항목 이름 그대로 적어 주시면 됩니다.

  2. 3~4번 이미지는 원본 파일로

    메신저로 보내면 자동으로 압축되어 화질이 떨어집니다. 메일 첨부나 구글 드라이브 링크로 보내주세요.

  3. 룰렛 이미지는 초안 단계에서 한 번 보내주세요

    규격(정사각형·균등 분할·칸 번호)을 먼저 확인해 드립니다. 완성 후 발견하면 다시 만들어야 합니다.

  4. 세팅 후 테스트 링크를 드립니다

    홈페이지에 넣기 전에 룰렛·당첨 화면·문자를 직접 확인하실 수 있습니다.

자주 묻는 질문

룰렛 이미지를 만들 디자이너가 없습니다
경품명과 브랜드 색상만 주시면 기본 디자인으로 제작해 드립니다. 다만 브랜드 이미지와는 차이가 있을 수 있습니다.
이벤트 도중에 경품을 추가하거나 확률을 바꿀 수 있나요
가능합니다. 홈페이지를 다시 수정하실 필요는 없고 터치라이크 쪽에서 설정만 바꾸면 됩니다. 다만 룰렛 칸 구성이 바뀌면 이미지도 다시 만들어야 합니다.
당첨 확률은 어떻게 정하나요
예상 참여자 수와 준비 수량으로 역산합니다. 예를 들어 1,000명 방문 예상에 경품 100개면 당첨률 10%입니다. 정하기 어려우시면 예상 방문자 수만 알려주세요.
꽝이 나오면 참여자가 실망하지 않을까요
모두 당첨으로 하면 경품이 조기 소진되어 이벤트가 일찍 끝납니다. 작은 경품(음료 쿠폰 등)의 비율을 높이고 꽝을 줄이는 방식을 권합니다.
경품을 받으러 오지 않으면 어떻게 되나요
관리자 화면에서 미수령 상태로 남습니다. 목록을 엑셀로 내려받아 재안내하실 수 있습니다.

전달 전 체크리스트

자료를 보내시기 전 확인용입니다.

이벤트명 · 주최자명 · 수령처 · 기간 확정
경품 품목 · 실제 준비 수량 · 당첨 확률 확정
룰렛에 꽝 칸 최소 1개 포함
룰렛 이미지 — 정사각형 · 800×800 이상 · PNG
룰렛 이미지 — 칸이 균등 분할되어 있음
칸 번호 ↔ 경품 매핑표 작성 (12시부터 시계 방향 1번)
화살표 이미지 — 투명 배경 · 끝점이 가로 정중앙
포인트 색상 HEX 코드 · 플로팅 버튼 문구
개인정보 수집·이용자명 · 보유기간 확정
홈페이지 주소가 https로 시작하는지 확인
스크립트를 넣을 수 있는 웹 담당자 지정
이미지는 원본 파일로 첨부 (메신저 압축 주의)