PX Event Live Draw는 오프라인 행사에서 LED 스크린(사이니지)과 연동하여
“참가 등록 → 회차별 추첨 → 실시간 라이브 화면 송출”을 자동으로 운영할 수 있도록 만든
워드프레스 기반의 대형 이벤트 전용 럭키드로우 시스템입니다.

이 시스템은 관리자가 직접 제어하는 부분은 최소화하고,
라이브 화면이 스스로 다음 회차를 감지해 자동으로 진행되도록 설계되었습니다.

🎯 핵심 목적

• 오프라인 현장에서 사용할 라이브 추첨 화면을 자동으로 제어

• 참가자는 이벤트 전체에서 1회만 등록

• 회차는 여러 번 진행되며, 미당첨자만 다음 회차 대상자로 자동 편입

• 실시간 인터랙티브 UI(도형, 애니메이션, 효과)를 LED/프로젝터에 즉시 반영

🔄 전체 진행 흐름 요약

1) 참가 등록 (온라인)

• 방문자는 이벤트 소개 페이지에서 영상 시청 → 설문 입력 → 신청 완료.

• 등록이 완료된 모든 참가자는 **전체 이벤트 풀(풀 목록)**에 편입됨.

• 전화번호 기준 중복 방지.

2) 관리자 회차 생성

관리자는 다음 내용을 설정합니다:

• 회차 이름

• 추첨 시간

• 시상 항목(1등/2등/3등/기타 등)

• 진행 여부(pending/drawing/done)

여러 회차를 미리 만들어두면,
라이브 화면은 자동으로 다음 준비된 회차를 감지합니다.

3) 라이브 화면은 항상 켜져 있음 (사이니지)

LED 또는 프로젝터에서 띄워진 페이지는:

• 현재 진행할 차례의 회차 자동 감지

• 추첨 시간까지 남은 시간 카운트다운

• 관리자 패널 변경 사항을 3초마다 폴링

• 회차 종료 → 다음 회차로 자동 이동

현장에서 사람이 버튼을 누를 필요 없이,
관리 화면과 라이브 디스플레이가 자동으로 동작하도록 설계됨.

4) 추첨 실행 (관리자)

• 관리자가 “추첨 시작” 버튼 클릭

• 당시까지의 미당첨자 중에서 랜덤 추출

• 결과는 즉시 저장 & 라이브 화면에 표시

• 컨페티, 애니메이션, 결과 패널 표시 이후 자동 종료

• 다음 pending 회차가 자동으로 대기 상태로 전환됨

🖥️ 라이브 화면 제어 방식

🔁 3초 폴링 기반의 실시간 업데이트

라이브 화면은 주기적으로 다음 항목을 확인합니다:

• 신규 등록자 수

• 다음 진행해야 할 회차 정보

• 현재 회차의 상태(pending/drawing/done)

• 관리자 패널에서 저장된 결과 JSON

이 정보를 바탕으로:

• 자동 카운트다운

• 자동 결과 표시

• 자동 다음 라운드 이동

• 자동 화면 초기화

• 자동 애니메이션 시작

즉, 현장에서는 단 하나의 화면만 띄워두면 전체 이벤트가 자동 진행됩니다.

🧠 추첨 로직 요약

✔ 미당첨자만 대상

이벤트 등록자는 한 번만 등록되지만,
각 회차에서는 winner_round = NULL 상태의 미당첨자만 추첨 대상이 됩니다.

✔ 랜덤 추출 후 즉시 결과 확정

관리자가 추첨을 실행하면:

1. 대상자 목록에서 무작위 선택

2. 해당 참가자에 당첨 라운드/등수 저장

3. 결과를 JSON 형태로 라이브 페이지로 전송

4. 라이브 페이지가 즉시 결과 표시

✨ 라이브 UI 특징

• 도형 애니메이션(원, 사각형, 삼각형 등) – 다양한 디자인 적용가능

• 참가자 이름 중앙 표시 – 이벤트 타이틀 입력

• 추첨 결과 패널에 정확한 등수 표시

• 콘페티 효과

• 모바일/디스플레이 해상도 반응형

특히 삼각형 포함 모든 도형 레이어는
항상 **최전면(Top layer)**에 고정하여 이벤트 현장에서 효과가 안정적으로 보이도록 제작되었습니다.

⚙️ 관리자 기능 요약

📌 기술적 제어 포인트 정리

✔ 자동 회차 감지

라이브 화면은 특정 회차를 지정하지 않아도
대기 중인 다음 라운드를 자동 선택.

✔ 카운트다운 자동 전환

지정했던 draw_time에 가까워지면
라이브 UI가 자동으로 “곧 추첨 시작” 상태로 변환.

✔ 자동 패널 전환

draw → show result → confetti → reset → next round.

✔ AJAX 기반 재로드 토큰

관리자가 강제 새로고침 신호를 보내면
라이브 화면이 자동으로 완전 초기화.

📌 마무리 소개글 요약

PX Event Live Draw는 워드프레스 기반이지만
일반 플러그인과 다르게 사이니지 하드웨어와 바로 연결되도록 설계된 전문 이벤트 솔루션입니다.

• 단일 등록 후 전체 회차 자동 반영

• 관리자 제어 최소화

• LED 현장에서 안정적인 자동 순환

• 회차별 당첨자 자동 계산

• 실시간 인터랙티브 애니메이션

현장에서 ‘버튼 누르는 인력 없이도’
끊김 없이 진행되는 자동 추첨 시스템을 목표로 제작된 것이 핵심입니다.

The post 픽셀디자인 – 라이브 럭키드로우 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

🔍 각 LMS의 특징과 차이점 분석

1️⃣ LifterLMS

✅ 장점:

• 기본 버전 무료 제공 (필요한 기능을 애드온으로 추가 가능)
• 강력한 멤버십 및 구독 기능 포함 (결제 시스템과 잘 연동)
• 코스 빌더 사용이 직관적이며, 드래그 앤 드롭 지원
• WooCommerce와의 호환성이 뛰어남

❌ 단점:

• 대부분의 중요한 기능(퀴즈 확장, 인증서, 멀티 강사 등)이 유료 애드온으로 제공됨
• SCORM/xAPI 표준을 지원하지 않음
• 기본적으로 프론트엔드 대시보드가 없음 (애드온 필요)

🎯 추천 대상:

• 기존에 멤버십 사이트를 운영 중이거나 WooCommerce와 통합하여 코스를 판매하려는 사용자

2️⃣ Tutor LMS Pro

✅ 장점:

• 강력한 퀴즈 시스템 제공 (여러 유형 지원)
• 멀티 인스트럭터(다수의 강사) 기능이 기본 제공됨
• SCORM/xAPI 지원 (LMS 데이터를 효과적으로 관리 가능)
• 학생 및 강사용 프론트엔드 대시보드 기본 제공
• Elementor 및 Gutenberg와 높은 호환성

❌ 단점:

• 구독 및 멤버십 기능이 기본 제공되지 않음 (WooCommerce를 통해 구현해야 함)
• 기본 버전이 무료이지만, 대부분의 기능은 Pro 버전에 포함됨
• LearnDash에 비해 대규모 강의 플랫폼을 운영할 때 성능 최적화가 다소 부족할 수 있음

🎯 추천 대상:

• 강사 및 다중 강의 사이트를 운영하고 싶거나, SCORM/xAPI가 필요한 기업 및 교육기관

3️⃣ LearnDash

✅ 장점:

• 고급 기능이 많은 LMS (강력한 퀴즈 기능, 성적 관리, 학습 분석 등)
• SCORM/xAPI 기본 지원 (기업용 LMS 구축 가능)
• 강력한 워드프레스 테마 및 페이지 빌더와의 높은 호환성 (Elementor, Divi 등)
• LearnDash Cloud(클라우드 기반)도 지원하여 서버 부담 감소

❌ 단점:

• 가격이 다소 비싸다 (가장 저렴한 플랜도 연간 $199)
• 사용법이 다소 복잡할 수 있음 (초보자에게는 적응이 필요)
• 기본적으로 WooCommerce보다 자체 결제 기능이 우선적으로 사용됨

🎯 추천 대상:

• 기업 및 교육 기관, 혹은 대규모 온라인 강의 플랫폼을 운영하고 싶은 사용자

4️⃣ LearnPress Premium

✅ 장점:

• 기본 버전 무료 제공 (필요한 기능을 애드온으로 추가 가능)
• 워드프레스와의 높은 호환성 (심플한 설치 및 사용)
• 프론트엔드 대시보드 제공
• WooCommerce와 통합이 쉽고, 무료 버전에서도 기본 기능을 사용할 수 있음

❌ 단점:

• 다중 강사 기능이 기본적으로 포함되지 않음 (애드온 필요)
• 퀴즈 기능이 단순하며, 고급 기능을 사용하려면 애드온 구매 필요
• SCORM/xAPI를 지원하지 않음

🎯 추천 대상:

• 초보자 또는 간단한 LMS 시스템을 원하며, 비용을 최소화하고 싶은 사용자

🏆 결론: 어떤 LMS가 가장 적합할까?

• 완벽한 LMS 기능을 원한다면? → LearnDash
• 무료로 시작하고 싶다면? → LifterLMS 또는 LearnPress
• 강사 다중 운영이 중요하다면? → Tutor LMS Pro
• WooCommerce와 완벽한 결합이 필요하다면? → LifterLMS
• SCORM/xAPI 기능이 필요하다면? → LearnDash 또는 Tutor LMS Pro
• 초보자에게 적합한 LMS는? → LearnPress

🎯 SCORM/xAPI란?

SCORM(Sharable Content Object Reference Model)과 xAPI(Experience API)는 온라인 학습 콘텐츠의 표준화된 형식입니다.
이 두 기술은 학습 데이터를 효율적으로 관리하고 다양한 학습 관리 시스템(LMS)과 콘텐츠 간의 호환성을 보장하는 역할을 합니다.

1️⃣ SCORM (Sharable Content Object Reference Model)

SCORM은 e-learning 콘텐츠를 제작하고, LMS에서 문제없이 실행할 수 있도록 규격을 정의하는 표준입니다.

📌 SCORM의 주요 기능

✅ 학습 콘텐츠의 표준화 → 여러 LMS에서 동일한 콘텐츠 사용 가능
✅ 진도 저장 및 재개 기능 → 사용자가 어디까지 학습했는지 저장하고, 중단한 지점에서 다시 학습 가능
✅ 시험 결과 및 점수 저장 → 학습자가 문제를 풀거나 평가를 받았을 때 점수를 기록
✅ LMS와 연동 가능 → 콘텐츠가 LMS와 데이터를 주고받으며, 학습 진행 상황을 LMS에서 확인 가능

⚡ SCORM을 지원하는 주요 LMS

• LearnDash ✅
• Tutor LMS Pro ✅
• LifterLMS ❌ (기본 지원 없음)
• LearnPress ❌ (기본 지원 없음)

2️⃣ xAPI (Experience API, Tin Can API)

SCORM보다 더 진화된 학습 데이터 추적 기술로, 온라인뿐만 아니라 오프라인 학습 경험까지 추적 가능합니다.

📌 xAPI의 주요 기능

✅ 온라인/오프라인 학습 경험 추적 가능 → 모바일 학습, 게임 기반 학습, 시뮬레이션 등 다양한 학습 환경 지원
✅ 광범위한 데이터 기록 → “사용자가 어떤 비디오를 시청했는지”, “어떤 문서를 읽었는지” 등의 세부적인 학습 활동을 저장
✅ LRS (Learning Record Store) 연동 가능 → 학습자의 데이터를 중앙에서 저장하고 분석 가능
✅ SCORM보다 확장성이 뛰어남 → 다양한 디지털 학습 방식과 연동 가능

⚡ xAPI를 지원하는 주요 LMS

• LearnDash ✅
• Tutor LMS Pro ✅
• LifterLMS ❌
• LearnPress ❌

🎯 SCORM vs xAPI 차이점

🏆 어떤 경우 SCORM/xAPI가 필요한가?

✅ SCORM이 필요한 경우

• 표준화된 e-learning 강의를 여러 LMS에서 동일하게 사용하려는 경우
• 학습 진도 및 시험 점수를 저장하고 싶은 경우

✅ xAPI가 필요한 경우

• 모바일 학습, VR 학습, 게임 기반 학습, 오프라인 학습 데이터까지 기록하고 싶은 경우
• 단순한 학습 진행 상황이 아니라, 학습자의 행동 데이터를 더 깊이 분석하고 싶은 경우

🚀 결론

• 기본적인 온라인 코스 운영만 필요하다면 SCORM 지원이 필수는 아님
• 기업, 교육 기관, 혹은 복잡한 학습 환경을 운영하는 경우 xAPI를 지원하는 LMS가 유리함
• SCORM/xAPI를 지원하는 LMS를 선택하려면 LearnDash 또는 Tutor LMS Pro가 적합

만약 학습 데이터를 좀 더 확장해서 관리하고 싶다면 xAPI 지원이 있는 LearnDash를 추천합니다. 🎯

The post 워드프레스 LMS 비교 테이블 ( SCORM/xAPI란? ) first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

기본 글은 블로그, 매거진등의 여러가지 쓰임새로 사용됩니다. 한국형 게시판과는 성격이 약간 다르게 사용됩니다.

커스텀포스트 타입의 성격으로 동작해야 여러가지 플러그인과 공생관계를 유지할 수 있는데

한국형 게시판은 완벽하게 동작하지는 않습니다.

워드프레스 글을 테이블 형태로 출력하는 플러그인을 사용해서 타협점을 찾아 볼 수 있을겁니다.

CSS로 구성은 가능하지만 분류의 필터나 여러가지 기능을 한번에 사용하려면 여간 귀찮은게 아닙니다만

쇼핑몰, 매거진등에서 유용한 활용 방법입니다.

우커머스 제품 테이블 리스트

쇼핑몰은 가끔 한꺼번에 상품을 많이 노출하고 한번에 구매할 수 있는 기능이 필요합니다.

유통업이나 도매쇼핑몰의 경우 상세페이지 보다는 제품단가가 더 중요한 쇼핑몰인 경우 활용할 수 있습니다.

기능목록

The post 워드프레스 테이블양식 플러그인 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

각각 관리하고 있는 SNS계정의 글을 워드프레스페이지로 모아 볼 수 있는 플러그인

무료기능과 추가된 확장기능의 유료플러그인도 판매하고 있다.

SNS컨텐츠의 재생산하기 좋은 플러그인.

The post 워드프레스로 SNS 글 모아보기 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

1. 먼저 라이센스가 있는 폰트(TTF)폰트를 준비합니다.
2. https://www.web-font-generator.com/ <- 접속해서 TTF 폰트를 업로드합니다.
3. I’m uploading a font that is legal for web embedding. I checked with the author and/or EULA. <- 항목을 체크합니다.
4. Generate web font  <- 버튼을 클릭하면 변환된 웹폰트가 다운로드 됩니다.
5. preview.html 파일로 확인합니다.
6. 압축된 파일중 styles.css 파일을 열어서 폰트의 url을 수정해줍니다.
7. src: url(‘폰트이름.eot?#iefix) <– src: url(‘./폰트이름.eot?#iefix) 모든 url 경로를 수정합니다.
8. 적당한 위치에 모든파일을 업로드합니다.
9. css 스타일 시트 최상단에 styles.css 를 임포트명령으로 지정합니다.
10. @import  “/전체 절대경로/styles.css”;
11. font-family: 에서 웹폰트를 지정합니다.

EOT폰트이외 svg, woff는 브라우저별로 지원하는 웹폰트 형식을 지정합니다.

The post 웹폰트 만들기 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

타이틀에서도 알수 있듯 구인/구직을 위한 플러그인입니다.
다양한 옵션과 강력한 검색기능으로 충실한 기본기능이 돋보입니다.

단순한 검색기능뿐만 아니라, 유연한 필터링 기능을 사용할 수 있습니다.

무료기능만으로도 충분한 서비스가 가능합니다만,
강력한 추가기능을 이용하면 단순한 구인/구직 플러그인이 아님을 알 수 있습니다.

Features

• Add, manage, and categorize job listings using the familiar WordPress UI.
• Searchable & filterable ajax powered job listings added to your pages via shortcodes.
• Frontend forms for guests and registered users to submit & manage job listings.
• Allow job listers to preview their listing before it goes live. The preview matches the appearance of a live job listing.
• Each listing can be tied to an email or website address so that job seekers can apply to the jobs.
• Searches also display RSS links to allow job seekers to be alerted to new jobs matching their search.
• Allow logged in employers to view, edit, mark filled, or delete their active job listings.
• Developer friendly code — Custom Post Types, endpoints & template files.

ADD ON

추가기능은 폼을 수정 하거나, 폼의 기능을 확장할 수 있는 다양한 플러그인을 제공합니다.
그리고 워드프레스기반의 다른 플러그인등과도 연동할 수 있습니다.

특히, 우커머스와 연동하면 과금처리까지 가능합니다.

재미있는건 소셜등 외부API등 서비스와도 연동가능한 기능까지 있습니다.

활용

• 구인/구직 홈페이지
• 부동산/ 분양홈페이지
• 여행/ 여행블로그 홈페이지
• 정보공유홈페이지
• 공동기기관리 홈페이지
• 제품리스트 홈페이지

기본적인 기능과 추가기능, 연동가능한 기능에서도 알 수 있드시
복잡한 옵션과 컨텐츠의 검색과 필터링이 가능한 웹사이트를 제작할 수 있습니다.

WP JOB MANAGER가 포함된 워드프레스테마도 존재하지만
사용중인 테마와도 완벽하게 통합 할수 있습니다.

The post WP Job Manager first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

1. 에어비엔비 AirBnb < http://airbnb.com >
2. 마이리얼트립 < http://myrealtrip.co.kr >
3. 숙박/게스트하우스

개발 솔루션

1. 워드프레스
2. 결재를 위한 – 우커머스 < PG사 결재 >
3. 부킹을 위한 – Bookings
4. Metadata Control – WP Job Manager
5. 커스텀포스트타입 – CPT UI
6. 페이지빌더 – VisualComposer 템플릿
7. 현재위치 – geo Location

주요 기능

1. 그리드
2. 필터 및 커스텀필터
3. 상세옵션 및 검색
4. 메인 필터 생성
5. 구글지도 브라우징 <옵션>
6. 사용자등록 상품 <여행상품, 여행, 룸, 하우스, 구직>

The post 여행/숙박/예약/필터링의 워드프레스개발 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

최근 개발문의에 대한  리서치한 내용으로

해외의 도매사이트 및 오픈마켓등에서 제공하는 상품 Data Feed 또는 API Service를 통해서

우커머스와 통합하여 리셀러 사이트개발이나 드랍쉬핑 사이트를 제작할 수 있습니다.

Data Feed를 이용한 리셀러사이트 (Resellser)

상품의 재고를 보유하고 있지 않고 해외 상품을 판매대행 하는 쇼핑몰

구매후 해당 주문건 별로 구매후 고객에게 배송한다.

이때 리셀러 아이디는 구매포인트를 얻을 수 있다.

API Service를 이용한 드랍쉬핑 통합 서비스 (Drop shipping Integration Service)

리셀러사이트와 흡사하지만 조금더 발전된 형태의 서비스로 주문건에 해당하는 오더의 정보를 구매처 쇼핑몰의 API서비스를 이용해서 구매정보를 전달해서 바로 배송처리 할수 있는 정보를 전달한다.

The post 워드프레스 리셀러쇼핑몰 또는 드랍쉬핑 쇼핑몰 제작 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

워드프레스 쇼핑몰 – 우커머스는 여러가지 운영기능을 확장할 수 있습니다.

1. 포인트적립
2. 상품구매 포인트 적립
3. 본인 적립금 결제 < 적립금 결제 할인 >
4. 등급에 대한 할인율

각각 한번에 모든 기능을 하는 플러그인은 아직은 없고, 각각의 기능을 설치해서 기능을 확장해야 합니다.

The post 우커머스 마케팅툴 #1 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.

모바일컴퓨팅과 모바일홈페이지(앱) 는 세계4위 스마트폰 보급률과 87% LTE 사용률의 한국에서 큰비중을 차지 하고 있습니다.

마케팅을 위한 홈페이지나 쇼핑몰 제작은 이제는 단순한 목표가 아닌 필수가 되었고

걱정스러운 WordPress의 속도 문제도 많이 개선 되었습니다.

그리고 PHP7 버전의 WordPress Core 가 곧 출시 될것으로 보고 있습니다.

HHVM은 Facebook이 개발한 PHP의 컴파일머신 엔진으로 (개념이 조금 다를수도…) 상당히 빠른 퍼포먼스를 보여주고 있습니다.

지금도 사용하는 큰 문제 없다라는 개념에서 이제는 아주 만족한다로 바뀌는 시간은 오래 걸리지 않을 듯 합니다.

카페24나 가비아등 대형 호스팅에서는 채택이 느릴것입니다만..

저희 처럼 자체 개발서버와 운영서버를 가지고 있는 업체는 가상머신에서 테스트후 바로 채택해야 겠습니다.

Windows 2012의 IIS 웹서버에서 PHP설치후 서비스 할때 왜이렇게 느리죠? 라는 고객의 질문들이 이제는 아지랭이 처럼 들리네요..

메리 크리스마스.

The post WordPress와 PHP7 / HHVM 그리고 패러다임 first appeared on 픽셀디자인 - 워드프레스 & 반응형앱 제작전문.