🤩 Review
2022 SW 마이스터고 연합 해커톤 회고
category
🤩 Review
10월 5일 - 기획 & 디자인주제 선택 동기기획단계에서 어려웠던 점 디자인단계에서 어려웠던 점10월 6일 - 개발 & 발표자료 준비개발단계에서 어려웠던 점🤯 트러블 슈팅발표자료 준비단계10월 7일 - 개발 & 시연영상 & 발표 & 시상식발표단계에서 느낀점시상식전체적으로 느낀 점가장 기억남는 순간
일시 : 10월 5일(수) ~ 10월 7일(금)
팀원 : 전세현(대덕/백엔드), 금현호(대구/프론트), 김한울(부산/백엔드)
연합해커톤 문서10월 5일 - 기획 & 디자인
아이디어주제 선택 동기
주제는 더 많은 여성의 건강한 삶을 위한 서비스이었습니다.
이미 여성 월경 관련 서비스들은 주기계산, 일정 기록 등이 잘 나와있습니다.
하지만 초경을 시작하는 아이들은 주기가 불규칙적이고 초경을 시작하는 나이가 점점 어려져 혼자 문제 해결능력이 부족합니다. 그래서 타겟을 초경을 시작하는 아이들로 잡고 멘토멘티 서비스를 만들자고 하였습니다! 그래서 저희는
초경을 시작하는 아이들이 여러사람에게 도움을 받을 수 있는 멘토멘티 커뮤니티 서비스
를 제작하기로 하였습니다!
기획단계에서 어려웠던 점
- 문제
- 기존 서비스(헤이문, 핑크 다이어리, 아이폰 건강 앱)가 이미 체계적으로 잘 되어 있습니다. 그래서 더 좋은 아이디어를 내기 어려웠습니다.
- 해결방안
- 기존 앱들을 분석하고 앱스토어 평점을 보며 어떤 장점이 있는지보다 사용자들이 어떤 것들이 불편하였는지 단점을 찾았습니다.
- 저희의 어려운 점을 들은 멘토분이 문제점과 그에 따른 해결방법을 정리하여 기획해보라고 조언해주셨습니다.
- “서비스의 기능에 넣으면 어떤 기능이 주요 기능이고 세부 기능까지 정리가 될것이다.”
멘토님의 조언으로 아래와 같이 문제상황과 핵심기능을 정리하였습니다.
문제상황
- 처음 월경을 겪는 학생들은 정보가 부족하고 부모님의 도움을 받고 싶은데 부담스럽다.
- 생리 주기가 불규칙적이고 아직 어린 초등학교 고학년 애들 + 부모님 연결해서 월경 주기 체크 도와주는 스타일
- 월경을 시작하는 나이가 점점 어려지고 있다.
- 혼자 문제를 해결하는 능력이 부족하기 때문에 다른 사람들에게 도움을 받는다.
- 월경 주기가 불규칙적이여서 주기를 기억하기 힘들다.
- 월경 주기를 예측하여 사용자에게 예상 주기를 보여준다.
- 아빠만 있는 한부모 가족의 딸은 마땅히 물을 사람이 없다
- 멘토링을 받아 고민을 해결한다!
- 월경 앱을 처음 사용하는 학생은 진입 장벽이 높다
- 귀여운 UI로 진입 장벽을 낮춘다 !!
타겟유저 & 핵심기능
- 초경을 시작하는 10대 초반 학생들(멘티)
- 학생들의 부모님
- 한부모가족(아빠만 있는경우)
- 아량넓은 여성(멘토)
- 전문 산부인과의(멘토)
- 멘토멘티 부분에 초점!! (다대다 환경 & 1대1 환경 시스템)
디자인단계에서 어려웠던 점
- 문제
- 디자인 전공인 팀원이 없어 좋은 결과물이 나오지 않았습니다.
- 해결방안
- 디자인 전공인 다른 팀원과 멘토분들에게 계속 질문을 하며 정보를 얻었습니다.
- “UX 상으로 이게 사용자 입장에서 편할까?”라고 계속 생각하며 디자인을 하였습니다.
유용한 사이트
10월 6일 - 개발 & 발표자료 준비
개발단계에서 어려웠던 점
- 문제
- 개발단계에서 어려웠던 점은 시간이 부족하다는 것 빼고는 없었습니다.
- 해결방안
- 개발 하기 전, 각자의 코드스타일을 공유하였습니다. 아래와 같이 계속 상황을 공유하고 코드스타일을 정하니 문제가 없었습니다.
- “이 부분은 너 스타일이 괜찮으니 우리 서비스에 도입해보자”
- “이 부분은 짧게 개발해야하는 해커톤에선 내 스타일이 더 나을 것 같아”
- 협업을 위해 서로의 코드 스타일을 이해해주며 각자의 의견을 제시했습니다.
🤯 트러블 슈팅
- 문제
- 모달 구현 단계에서 원하던 기능이 잘 동작하지 않았습니다.
- 모달 바깥 영역 말고 모달 내의 영역을 클릭을 해도 모달이 꺼져 모달 안에 있는 기능을 사용할 수 없었습니다.
- 원인
- 멘토님께 문제 상황을 공유하고 모르는 것을 질문하였습니다.
- 멘토님이 “부모가 자식에게 이벤트를 물려주고 다시 부모에게로 가는 이벤트 위임때문에 문제가 발생하는 거네요. background 부모 클릭 시 모달이 꺼지게 하는 onClick 이벤트가 자식에게도 전해지고 있어 자식 요소를 클릭해도 모달이 꺼지는 것이죠.”라고 하셨습니다.
- 해결방법
- 추가로 “부모가 자식에게 이벤트 버블링을 막는 함수를 실행시켜야해.”라고 말씀해주셨습니다.
- 모달 아래 자식에게
e.stopPropagation();
을 실행시켰더니 해결이 되었습니다.
- 결론
- 그리고 추가로 멘토님이“이벤트 위임은 면접에나 실전에서도 유용하게 사용하니 잘 알아둬야해.”라고 하셨습니다.
- stopPropagation API는 이벤트가 전파되는 것을 막습니다.
- 이벤트 버블링의 경우 클린한 요소의 이벤트만 발생시키고 상위 요소로 이벤트 전달하는 것을 방해합니다.
- 이벤트 캡쳐의 경우에는 클릭한 요소의 최상위 요소의 이벤트만 동작시키고 하위 요소들로 이벤트를 전달하지 않습니다.
- 참고자료
발표자료 준비단계
발표자료 준비단계에서는 멘토분들의 도움을 정말 많이 받았습니다. 어느 한 멘토분이 저희 주제 맘에 든다고 엄청 열심히 도와주셨습니다. 먼저 문제 상황을 잘 정리하라고 말씀하셨습니다. 그래서 아래와 같이 문제상황을 정리하였습니다.
- 문제
- ppt 제작부분에서 어떤 점을 강조할 지 어려웠습니다.
- 해결방법
- 멘토님들 도움을 많이 받았습니다.
- 문제 상황을 잘 정리 하라 → 아래와 같이 정리 하였습니다.
- 차별점을 표로 강조해라 → 아래와 같이 정리하였습니다.
- “이미 월경 관련 서비스는 널리고 널렸다. 그 널린 서비스들 중 너희 서비스의 차별점을 강조해라”
- “서비스 A는 어떤 기능을 제공하지만 서비스 B는 제공하지 않는다. 서비스 C는 서비스 A와 서비스B에서 없던 기능을 제공해준다. 이렇게 표로 설명하면 청자들에게 너희 서비스의 차별점이 잘 와닿게 될것이다.”
10월 7일 - 개발 & 시연영상 & 발표 & 시상식
발표단계에서 느낀점
- 팀원의 발표 태도가 정말 인상깊었습니다.
- 발표할 때 긴장하는 모습을 보이지 않았다.
- 화면만 쳐다보지 않고 청자를 번갈아 보았다.
- 목소리와 발음은 또렷하였다.
- 설명할 때 화면을 가리켜 내용을 더욱 강조하였다.
시상식
- 결과
- 과학기술정보통신부장관상을 수상하였습니다!
전체적으로 느낀 점
- 상대방의 말을 경청해야 한다.
- 열심히 멘토분들의 말에 경청을 하니, 멘토분들이 먼저 저희 팀에 관심을 가져주셔서 많은 도움을 주셨습니다.
- 저희 팀의 차별점은 유사 서비스와 비교해서 발표했다는 점이었습니다.
- 나중에 발표할 때나 프로젝트 기획할 때 유사 서비스와 비교를 해야겠다고 생각하였습니다.
가장 기억남는 순간
- 같은 프론트엔드 팀원과 대화했던 순간
- 같은 관심사를 가진 팀원과 코드 공유
- 리뷰하면서 서로가 서로에게 도움이 되었던게 정말 인상깊었습니다.