1. 배경(Problem)
우리 아이들이 자라나는 지역사회는 점점 디지털화되고 편리함을 추구하고 있습니다. 그러나 그 과정에서 동네의 따뜻함, 이웃 간의 신뢰, 그리고 아이들에게 중요한 사회적 경험은 점점 희미해지고 있습니다. 부모들은 아이들의 안전을 걱정하며 자립심을 키울 기회를 제한하는 경우가 많습니다. 과잉보호가 늘어나는 동시에, 지역사회와의 관계는 점점 약화되어 이웃 간의 교류와 상호작용도 부족한 상황입니다. 육아 정보나 도움 역시 온라인에만 의존하게 되면서, 부모와 아이 모두 지역사회로부터 점점 더 단절된 경험을 하고 있습니다. 변화하고 있는 지역 사회의 모습에서 부모와 아이들이 지역사회와 다시 연결될 수 있는 방법을 고민하며, 우리는 하이퍼로컬이라는 주제를 바탕으로 ‘똑띠’를 개발했습니다.
‘똑띠’는 부모가 제휴된 근처 가게들 중에서 아이를 심부름 보낼 가게를 고르고, 아이가 심부름을 수행하는 동안 진행 과정을 모니터링할 수 있는 서비스입니다. 이 과정에서 가게 사장님과의 소통이 자연스럽게 이루어지며, 아이는 새로운 경험을 통해 자립심을 키우고 부모는 안심할 수 있는 환경을 제공합니다. 단순히 심부름만 하는 것이 아니라, 지역사회 내의 관계를 회복하고 신뢰를 쌓아가는 것이 이 서비스의 핵심입니다.
‘똑띠’는 아이들에게 자기주도적인 활동 기회를 제공하고, 부모에게는 안전한 환경에서 자녀의 성장을 지원할 방법을 제공합니다. 또한, 지역 소상공인과의 연결을 통해 아이, 부모, 그리고 지역사회가 함께 성장할 수 있는 기반을 만듭니다. 이를 통해 단순히 심부름을 대행하는 것을 넘어, 지역사회의 가치를 재발견하고 모두가 연결될 수 있는 하이퍼로컬 서비스를 실현하고자 합니다.
2. 서비스 소개(Solution)
"우리 아이의 첫 심부름을 함께, 안전하게”
똑띠는 아이의 자립심을 키우고, 지역 사회와 이웃 간의 연결을 강화하는 어린이 심부름 모니터링 서비스입니다. 부모님의 걱정을 덜어주고, 아이들에게는 책임감과 성취감을 키울 수 있도록 설계된 안전하고 따뜻한 플랫폼입니다.
서비스 주요 기능
1.
안전한 심부름 환경 제공
•
지역 내 제휴 가게와 협업하여 아이가 안전하게 심부름을 수행할 수 있도록 지원
•
심부름 진행 상황을 실시간으로 모니터링 가능
2.
심부름 가이드 및 교육
•
첫 심부름을 위해 필요한 안전 가이드와 행동 요령 제공
•
아이가 길을 잃거나 위험 상황에 처했을 때 대처 방법 제시
3.
아이와 지역 사회의 연결
•
아이가 심부름을 통해 지역 상점과 소통하며 사회성을 배울 수 있는 환경 조성
•
가게 주인의 따뜻한 도움과 격려를 통해 아이의 자신감과 책임감을 강화
4.
부모와 아이를 위한 맞춤형 서비스
•
심부름 목적, 시간, 장소를 간단히 설정하고, 가게 사장님과 실시간 소통 가능
•
심부름 완료 후 아이와 부모를 위한 긍정적인 피드백 및 리뷰 작성 기능
부모님 버전 (모바일 앱)
•
주요 기능:
1.
심부름 설정: 아이가 갈 가게, 심부름 내용, 예상 도착 시간을 간단히 설정
2.
실시간 알림: 아이의 이동 상황 및 가게 도착 여부를 실시간으로 확인
3.
안전 가이드: 심부름 전 아이와 함께 볼 수 있는 안전 교육 콘텐츠 제공
4.
피드백 작성: 심부름 완료 후 가게에 감사 리뷰 작성
가게 사장님 버전 (POS)
•
주요 기능:
1.
심부름 알림 수신: 부모님이 설정한 심부름 요청이 POS에 알림으로 표시
2.
아이 정보 확인: 심부름을 수행하는 아이의 이름, 인상착의, 출발 시간 등 기본 정보 제공
3.
상태 업데이트: 심부름 완료 시 '심부름 완료' 버튼을 눌러 부모님에게 알림 발송
4.
응대 가이드: 아이가 요청한 물건이나 서비스를 쉽게 제공할 수 있도록 체크리스트 제공
서비스 가치
아이들에게는•
작은 심부름이 스스로 해낼 수 있다는 자신감과 책임감을 키우는 첫 걸음이 됩니다.
•
심부름 과정에서 새로운 사회적 경험을 쌓으며 자립심과 사회성을 배울 수 있습니다.
부모님에게는•
아이가 안전한 환경에서 자립심을 키울 수 있도록 돕는 든든한 파트너가 됩니다.
•
실시간 모니터링과 가이드를 통해 걱정을 덜고, 아이의 성장을 함께 응원할 수 있습니다.
지역 사회에는•
가게와 주민이 서로 협력하며 신뢰를 쌓고, 동네의 따뜻한 관계를 복원할 기회를 제공합니다.
•
이를 통해 지역 경제 활성화와 커뮤니티의 유대감이 강화됩니다.
3. 아키텍처 및 핵심 기능
시스템 구조:
•
3-tier Applicaion으로 UI를 처리하는 프트엔드는 React.js, API, 비즈니스 로직을 처리하고 데이터베이스와의 상호작용 하는 백엔드는 Node.Js, 그리고 데이터베이스로는 MongoDB를 선택하였습니다.
데이터 흐름:
•
부모가 원하는 가게에 심부름 서비스 요청을 전송 -> 요청을 받은 가게에서 수락/거절 -> 사용자 측 아이가 심부름을 시작할 때 시작했다는 알림 전송 -> 아이가 가게에 도착할 시 도착했다는 알림을 부모에게 전송 -> 아이가 심부름을 완료한 후 귀가를 시작했다는 알림 전송 -> 집에 도착했다는 알림을 부모측에서 가게로 전송
4. 활용 라이브러리 및 개발 환경
Front-End
react : JavaScript 라이브러리
react-router-dom : 리액트 라우팅 라이브러리
axios : HTTP 비동기 통신 라이브러리
styled-components : CSS-in-JS 라이브러리
react-kakao-maps-sdk : 리액트 카카오지도 라이브러리
앱에서 제휴된 가게 위치 정보와 아이 위치 등을 제공하기 위해 카카오 지도 라이브러리를 활용했습니다.
swiper : 요소 슬라이드 라이브러리
앱의 TimePicker 구현에 적용된 라이브러리입니다. 시간을 드래그할 때 부드러운 스크롤 효과를 제공합니다.
framer-motion : 리액트용 애니메이션 라이브러리
앱의 바텀시트 애니메이션을 위해 적용한 라이브러리입니다. 바텀시트를 올리고 내릴 때 부드러운 애니메이션 효과가 적용됩니다.
Back-End
Node.js
Express
MongoDB : 데이터 베이스
Axios : 비동기 HTTP 요청 처리
•
해커톤 특성상 제한된 개발 시간 내에 프로젝트의 핵심 기능(Core Features)을 최대한 완성하는 것이 중요했습니다. 따라서 개발 환경 설정에 많은 시간을 소모하기보다 빠르게 개발을 시작할 수 있는 기술 스택을 선택하였습니다. 이러한 이유로 Node.js와 Express를 사용하게 되었습니다. 또한, 팀 내 프런트엔드 개발자가 JavaScript 프레임워크에 대한 경험이 있었기 때문에 동일한 JavaScript 기반 기술을 사용하면 협업 효율이 더욱 높아질 것이라고 판단하였습니다.
•
NoSQL 데이터베이스인 MongoDB를 선택한 이유는 다음과 같습니다. 첫째, 프로젝트 초기 단계에서 다룰 데이터 구조가 불확실했기 때문에 스키마 설계의 유연성이 필요했습니다. 둘째, 클라우드 기반 데이터베이스 서비스를 통해 팀원들이 원격으로 쉽게 데이터베이스에 접근하고 협업할 수 있을 것이라고 기대를 했습니다. 이를 통해 개발 환경 설정 시간을 줄이고 더 빠른 진행이 가능하리라 판단하였습니다.
5. 트러블 슈팅
언마운트된 컴포넌트에서 이벤트 리스너 제거 오류
6. 팀 소개
김유환 | 백엔드 | yhkim8046@gmail.com
똑띠를 이용하는 아이들 처럼 저도 성장 하겠습니다
윤서빈 | UXUI 디자이너 | plumplum01@naver.com
사람과 지역, 마음과 마음을 잇는 디자인을 꿈꿉니다. 신뢰를 기반으로 더 큰 가치를 만들어가는 여정을 이어가며, ‘똑띠’가 아이들과 지역사회를 연결하는 따뜻한 시작이 되길 바랍니다!
윤가은 | 프론트엔드 |
geyun105@gmail.com
원활한 사용자 경험을 만들기위해 고민하고, 소통합니다.
‘똑띠’가 담고있는 모든 의미가 아이들과 부모님들,
지역사회에 전달되길 바랍니다!
선지현 | UXUI 디자이너 | sjhzzang01@naver.com
똑띠를 통한 아이들의 작은 모험이 모두의 마음에 따뜻한 변화를 남기길 바랍니다.