공강구조대는 공강 시간이 있는 학생들이 학교 안에서 어디로 가면 좋을지 쉽게 찾을 수 있도록 돕는 캠퍼스 시설 탐색 웹사이트입니다.
오래 학교를 다닌 학생도 잘 모르는 교내 시설이 많고, 신입생이나 외국인 유학생은 학교 시설 정보를 찾는 데 더 큰 어려움을 겪을 수 있습니다. 공강구조대는 이러한 문제를 해결하기 위해 공강 시간, 원하는 활동, 현재 상황을 바탕으로 학생에게 적합한 학교 시설을 추천하고 안내하는 것을 목표로 합니다.
공강 시간에 학생들은 쉬거나, 공부하거나, 식사를 하거나, 친구를 기다리는 등 다양한 활동을 하게 됩니다. 하지만 학교 안에 어떤 시설이 있는지, 어디에 위치해 있는지, 운영시간은 어떻게 되는지 한눈에 확인하기 어려운 경우가 많습니다.
공강구조대는 사용자가 자신의 공강 상황을 입력하면 목적에 맞는 교내 시설을 추천하고, 시설 정보와 위치를 함께 제공하는 웹 서비스입니다.
- 캠퍼스 시설 위치를 파악 중인 신입생
- 학교 생활에 다시 적응하는 복학생
- 한국어 정보 접근이 어려운 외국인 유학생
- 공강 시간을 효율적으로 활용하고 싶은 재학생
사용자가 공강 시간, 원하는 활동, 위치, 언어 등을 입력하면 조건에 맞는 교내 시설을 추천합니다.
예를 들어 사용자가 “1시간 공강”, “공부”, “가까운 위치”를 선택하면 공부하기 좋은 공간을 추천하고, 식사를 선택하면 학식이나 카페 정보를 제공하는 방식입니다.
학교 안의 다양한 시설 정보를 확인할 수 있습니다.
- 학식
- 카페
- 휴게실
- 공부 공간
- 기타 교내 시설
각 시설은 위치, 운영시간, 이용 목적 등을 함께 제공하여 사용자가 빠르게 판단할 수 있도록 구성합니다.
사용자가 원하는 시설을 더 쉽게 찾을 수 있도록 지도 기반 탐색 기능을 제공합니다. 단순히 시설 목록만 보여주는 것이 아니라, 사용자가 캠퍼스 안에서 실제로 이동할 수 있도록 위치 정보를 함께 안내합니다.
외국인 학생도 학교 시설 정보를 쉽게 이해할 수 있도록 다국어 기능을 지원합니다. 한국어 정보 접근이 어려운 학생들도 공강구조대를 통해 학교 시설을 편리하게 확인할 수 있도록 하는 것이 목표입니다.
학교 시설 정보를 단순히 읽는 것에서 끝내지 않고, 게임을 통해 자연스럽게 익힐 수 있도록 구성합니다.
게임 페이지에서는 교내 장소 사진을 보고 장소를 맞히거나, OX 퀴즈를 통해 학교 시설 정보를 학습할 수 있습니다. 점수, 제한 시간, 랭킹 시스템 등을 활용하여 사용자가 재미있게 참여할 수 있도록 합니다.
서비스의 목적과 핵심 기능을 소개하는 메인 페이지입니다.
- 서비스 소개
- 주요 기능 안내
- 사용 대상 안내
- 각 페이지로 이동할 수 있는 네비게이션 제공
프로젝트 팀원과 역할을 소개하는 페이지입니다.
- 팀원 이름
- 팀원별 역할
- 수행 업무
- 프로젝트 진행 과정 및 팀 구성 정보
학교 시설 정보를 게임 형식으로 학습하는 페이지입니다.
- 장소 맞히기 게임
- OX 퀴즈
- 점수 시스템
- 제한 시간
- 랭킹 시스템
사용자의 조건을 입력받아 공강 공간을 추천하는 페이지입니다.
- 공강 시간 입력
- 원하는 활동 선택
- 위치 선택
- 언어 선택
- 맞춤형 시설 추천 결과 제공
공강구조대는 단순히 학교 시설 정보를 나열하는 웹사이트가 아니라, “공강 시간”이라는 실제 학생 생활 상황을 중심으로 정보를 구조화합니다.
또한 게임 페이지와 폼 페이지가 사이트 주제와 자연스럽게 연결됩니다. 게임은 학교 시설을 익히는 도구가 되고, 폼은 사용자의 상황에 맞는 시설 추천으로 이어집니다.
| 기간 | 진행 내용 |
|---|---|
| 05/26 | 계획서 발표 |
| 05/27 ~ 06/01 | 각 페이지 구조 및 디자인 구현 |
| 06/02 ~ 06/06 | 게임 및 폼 기능 JavaScript 구현 |
| 06/09 ~ 06/10 | 통합, 디버깅, 다국어 기능 적용 |
| 06/11 | 최종 발표 |
| 이름 | 역할 |
|---|---|
| 전예찬 | 팀장, 와이어프레임 제작, Team/Form 페이지 구현 |
| 김영원 | Main / Team 페이지 구현, 공통 레이아웃 및 Navigation Bar 제작, 반응형 UI 구현 |
| 박예은 | Form / Game 페이지 구현, JavaScript 기능 개발, 게임 로직 및 인터랙션 구현 |
| 박재현 | 전체 프로젝트 기획, 페이지 구성 설계, 발표 자료 제작, 일정 관리 |
| 이성민 | 학교 시설 및 학식 정보 조사, 다국어 번역 자료 정리, 테스트 및 발표 보조 |
- HTML
- CSS
- JavaScript
외부 프레임워크나 라이브러리 없이 Vanilla HTML, CSS, JavaScript를 사용하여 구현합니다.
공강구조대는 신입생, 재학생, 복학생, 외국인 유학생이 학교 시설을 더 쉽게 이해하고 활용할 수 있도록 돕는 것을 목표로 합니다.
학생들이 공강 시간을 더 효율적이고 편리하게 사용할 수 있도록, 학교 시설 정보와 추천 기능을 하나의 흐름으로 연결한 웹 서비스를 구현합니다.