← 작업 목록

현장 참여형 모바일 웹 · 제작 중

동신대학교 모바일 투어

역할
참여 방식·콘텐츠 기획·화면 구성 및 구현 검수
사용 도구·기술
React, TypeScript, Tailwind CSS, Vite
시기
2026 · 진행 중
분류
참여형 콘텐츠

프로젝트 소개

동신EXPO의 학과 체험과 성과전시를 QR 인증과 미션으로 연결하고, 참여할 때마다 에너지가 충전되는 모바일 투어를 제작하고 있습니다.

구성과 의도

캠퍼스 곳곳의 프로그램을 체험하고 전시를 살펴보는 과정이 하나의 투어로 이어지도록 기획했습니다. 서로 다른 학과·부서의 프로그램 세 곳에 참여하면 60%, 성과전시에서 숨은 글자를 찾아 정답을 입력하면 40%를 충전하는 구조입니다. 참여자는 휴대폰에서 현재 충전량과 남은 미션, 공간별 안내를 확인합니다.

부스에서는 QR로 참여를 인증하고, 전시에서는 내용을 살펴보며 글자를 찾도록 참여 방식을 나누었습니다. 각 장소에서의 경험이 화면의 충전량으로 쌓이고, 100%에 도달하면 경품 참여 안내로 이어지도록 구성했습니다. 현재 참여 등록과 미션, 공간 안내, 인증 화면을 구현하고 등록부터 참여 인증, 완료 확인까지 점검하고 있습니다.

동신대학교 모바일 투어의 시작, 진행률, 공간 안내 화면

02 / PROCESS

구성과 제작 과정

01

장소의 경험에 맞춘 두 가지 참여 방식

학과·부서 체험은 부스 QR 인증으로, 성과전시는 숨은 글자를 찾는 미션으로 구성했습니다. 같은 학과·부서에서 반복 인증한 경우에는 충전량을 더하지 않도록 규칙을 정했습니다.

02

현재 상태와 다음 행동을 함께 안내

홈에서 전체 충전량과 캠퍼스·갤러리의 진행 상태를 함께 보여주고, 각 미션의 안내로 이동하도록 구성했습니다. 공간 안내와 행사 일정은 하단 메뉴에서 확인할 수 있도록 배치했습니다.

03

등록과 경품 수령 확인

등록 전에 부스 QR을 읽은 경우에는 등록 후 해당 참여를 이어서 처리하도록 구성했습니다. 완료 이후에는 스태프가 경품 수령 여부를 확인하는 단계까지 나누어, 참여자 화면과 현장 운영이 이어지도록 설계했습니다.

03 / MAKING

기획과 구현

기획 의도

캠퍼스 체험과 성과전시의 서로 다른 참여 방식을 하나의 진행률로 연결하고, 휴대폰에서 다음 행동과 장소를 확인하도록 기획했습니다.

구현 방식

참여 상태에 따라 홈의 충전량과 미션 안내, 인증 결과가 달라지도록 구성했습니다. 실제 서버와 시험용 데이터를 분리해 단계별 화면을 확인하며, QR을 통한 진입과 등록, 중복 참여 안내, 완료 후 수령 확인까지 각 상태에 맞는 화면을 점검하고 있습니다.