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경품 구성표

이벤트 방식에 따라 아래 두 가지 중 하나로 정리해 주세요. 당첨 확률은 경품 수량과 꽝 갯수의 비율로 자동 계산되므로 별도로 지정하실 필요 없습니다.

Case 1 · 100% 당첨 이벤트 꽝 없음

경품명과 실물 수량만 알려 주시면 됩니다. 참여자는 반드시 어떤 경품을 받게 됩니다.

작성 예시 — 100% 당첨 이벤트
경품명수량
스타벅스 아메리카노100개
배스킨라빈스 싱글50개
에코백30개

Case 2 · 꽝이 있는 이벤트 확률형

경품별 실물 수량과 함께 꽝 갯수를 알려 주세요. 꽝 갯수가 많을수록 당첨 확률이 낮아집니다.

작성 예시 — 꽝 갯수로 당첨 확률 조절
경품명수량
스타벅스 아메리카노100개
배스킨라빈스 싱글50개
에코백30개
꽝 (다음 기회에)200개

위 예시 · 총 380 시도 중 경품 180 · 꽝 200 → 당첨률 약 47%. 꽝을 400 으로 늘리면 약 31%, 100 으로 줄이면 약 64% 가 됩니다.

수량은 자동으로 관리됩니다 준비하신 수량이 모두 당첨되면 그 경품은 더 이상 나오지 않습니다. 모든 경품이 소진되면 룰렛은 “준비된 경품이 모두 소진되었습니다”로 바뀝니다. 실물보다 많은 수량을 적으시면 지급할 수 없는 당첨이 발생하니 실제 준비 수량을 적어 주세요.

룰렛 이미지 칸과 실제 당첨은 독립입니다

룰렛 이미지의 칸 갯수·배치는 시각적 표현이고, 실제 당첨 확률은 위에서 정하신 수량·꽝 갯수로 결정됩니다.

경품 이미지 선택

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

3룰렛 이미지 제작 가이드

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

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

글자 배치 팁

글자는 칸 가운데에, 경계선에서 충분히 떨어뜨려 배치해 주세요. 경계선에 걸치거나 원 바깥으로 넘치면, 룰렛이 멈췄을 때 어느 칸이 당첨인지 참여자가 헷갈립니다.

글자는 칸 가운데, 경계선에서 떨어뜨리기
글자 배치경계선에 걸치거나 원 바깥으로 넘치면, 멈춘 칸이 어디인지 참여자가 헷갈립니다.
어느 칸에 어느 경품인지만 알려 주세요 이미지에 경품명이 그대로 적혀 있으면 그것으로 충분합니다. 경품명 없이 색·번호·아이콘만 있는 경우, “빨간 칸 = 아메리카노, 파란 칸 = 배스킨라빈스” 처럼 자연스럽게 알려 주시면 됩니다. 칸별 위치·번호는 터치라이크 관리자가 등록합니다.

4화살표 이미지 선택

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

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

5브랜드 색상 · 버튼 문구

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

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

브랜딩 완성도를 높이는 3가지 요소

아래 3가지를 브랜드 정체성에 맞추면 팝업 전체가 하나의 브랜드 화면처럼 보입니다.

1. 포인트 색상브랜드 메인 컬러를 그대로 넣어 주세요. 룰렛 돌리기 버튼·수령번호·플로팅 버튼이 이 색으로 통일됩니다.
2. 룰렛 이미지칸 색상·글꼴·아이콘을 브랜드 톤에 맞춰 디자인해 주세요. 이 이미지가 팝업의 얼굴입니다.
예: 카페 브랜드 = 원두색·라떼색 그라디언트 · 화장품 = 파스텔·골드 · 자동차 = 다크·메탈 톤
3. 화살표 이미지브랜드 로고 형태·아이콘·마스코트를 화살표로 만들어 주시면 브랜드 인지도가 크게 올라갑니다. 선택
예: 카페 = 커피콩 아이콘 화살표 · 신제품 = 제품 실루엣 · 캐릭터 IP = 마스코트 손가락
배경 이미지는 기본으로 권장하지 않습니다 배경 이미지가 룰렛보다 시선을 끌면 참여율이 오히려 떨어지는 경우가 많습니다. 위 3가지 요소만 브랜드 톤으로 통일해도 대부분의 이벤트에서 브랜드 정체성이 충분히 전달되므로, 시즈널 테마(크리스마스·신년 등)는 룰렛 이미지 자체에 담아 주시는 편을 권합니다.

다만 제품 실루엣·캐릭터 IP·브랜드 패턴을 배경으로 반드시 표현해야 하는 이벤트라면 별도로 문의해 주세요. 이벤트 성격에 맞춰 개별 검토·적용해 드립니다.

6개인정보 고지 정보

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

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

7홈페이지 정보

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

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

자료 전달 방법

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

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

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

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

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

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

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

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

자주 묻는 질문

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

전달 전 체크리스트

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

이벤트명 · 주최자명 · 수령처 · 기간 확정
경품 품목 · 실제 준비 수량 확정 (당첨 확률은 자동 계산)
꽝 있는 이벤트라면 꽝 갯수 확정 (100% 당첨은 생략)
룰렛 이미지 — 정사각형 · 800×800 이상 · 투명 배경 PNG
룰렛 이미지 — 칸이 균등 분할되어 있음
어느 칸이 어느 경품인지 텍스트로 안내 (이미지에 이미 적혀 있으면 생략 가능)
화살표 이미지 — 투명 배경 · 끝점이 가로 정중앙
포인트 색상 HEX 코드 · 플로팅 버튼 문구
개인정보 수집·이용자명 · 보유기간 확정
홈페이지 주소가 https로 시작하는지 확인
스크립트를 넣을 수 있는 웹 담당자 지정
이미지는 원본 파일로 첨부 (메신저 압축 주의)