SW·AI 융합 우수성과 발표회

  • ONESTAR

    팀장
    김벼리 (융합공학부 | 4)
    팀원
    정지원 (융합공학부 | 4)
ONESTAR-Study Place : 중앙대 학생 공부 장소 추천 웹 애플리케이션 개발
  • 개요
  • [개발동기 및 제작목적] 


    재학생의 수에 비해 현저히 적은 학술정보원의 열람실 좌석의 수는 매년 시험기간 학생들의 고민거리였다. 최근 지난 2년은 코로나 바이러스로 인해 대부분의 수업이 비대면으로 진행되었고 학술정보원과 교내 카페들이 코로나 창궐 이전 시기에 비해 한산해져 큰 문제가 되지 않았다. 그러나 이제는 대부분의 대학이 전면 대면 수업을 선언하였다. 따라서 비대면으로 진행되었던 학교 생활이 대면으로 전환되었다.

    중앙대학교에서는 대면 시절, 시험 기간이 시작되면 학술정보원의 열람실 자리 부족은 매년 있던 연례행사 같은 일이었다. 학술정보원에 자리를 잡지 못한 학생들은 학교 인근의 카페에서 공부를 하거나 공강시간을 보냈다.

    그러나, 학교 근처 유명한 카페들은 자리가 없는 경우가 비일비재하여 팀 프로젝트를 진행하거나 공부를 하기 한 자리를 찾기 위해 카페, 저 카페 돌아 다녀도, 자리를 찾지 못하는 일이 자주 발생한다. 게다가, 공부 하기 좋은 장소를 찾기 위해 미리 단순히 인터넷 검색을 하는 행위만으로는 학교 주변의 공부가 잘 되는 카페를 찾기도 어렵다. 사람마다 다양한 관점이 있어 공부가 잘 되는 카페의 기준도 천차만별이다. 카페에서 공부를 하는 경우, 중요하게 생각하는 포인트의 차이를 반영해주는 프로그램은 아직 존재하지 않았다.

    학생들이 원하는 여러 개의 특징을 가진 카페를 쉽게 찾을 수 있고, 자주 가는 카페에 자리가 없을 때 그 카페와 비슷한 다른 카페를 찾을 수 있다면 시험기간과 공강을 보내는 중앙대 재학생들은 시간을 효율적으로 사용할 수 있고 학교 생활의 만족도도 올라갈 것이라고 예상했다. 그래서 이런 서비스를 제공하는 웹 서비스를 직접 제작하면 좋을 것이라는 판단을 하게 되어 이번 프로젝트를 계획하게 되었다.

     

  • 세부내용
  • [기술 현황]


    카페에서 공부하는 대학생들은 많지만, 카페 공부를 하기 위해 좋은 장소에 대해서는 웹/앱을 찾을 수 있기 보다는 실제 블로그/인스타그램 포스팅으로 정보를 얻을 수 있다.

    실제 학교에서 중앙도서관은 시험기간만 되면 자리를 잡기 힘들며 근처 카페들 역시 자리가 꽉차서 학교 근처에서  공부할 수 있는 공간을 찾기가 너무 힘들었다. 또한, 인터넷 검색을 단순히 하는 것으로는 주변 공부가 잘 될 만한 카페를 찾기에도 한계가 있다. 사람마다 다양한 관점이 있어 공부가 잘 되는 카페의 기준도 천차만별인데, 완전 조용한 분위기를 좋아하는 사람, 또는 적당히 조용한 분위기를 좋아하는 사람, 조용한 것 여부보다는 맛있는 커피를 먹으면서 공부하고 싶은 사람들 등 공부가 잘 되는 카페의 기준도 사람마다 천차만별이다. 그러나 카페에서 공부를 하는 경우, 이런 중요하게 생각하는 포인트의 차이를 반영해주는 프로그램은 아직 존재하지 않았다.


     

    [과제 수행 과정 및 상세 설계 내용 설명]


    1. 데이터 수집

     중앙대 근처 카페, 중앙대 근처 스터디 카페를 웹 크롤링을 통해서 데이터를 수집한다. 이 때 중앙대 근처 카페의 경우 카페 이름, 평점, 카페 위치, 영업 날짜, 영업 시간, 최소 가격, 키워드 리뷰에서 가장 많은 비중을 차지한 5개의 키워드와 각 키워드 별 리뷰 수에 대한 정보를 수집했다. 이 때 총 201개의 카페에 대한 정보를 얻었다. 중앙대 근처 스터디 카페의 경우 카페 이름, 주소, 영업 날짜, 영업 시간에 대한 정보를 수집했으며 총 100개의 스터디 카페에 대한 정보를 얻었다.

     또한, 공부하러 가기 위한 카페들의 경우 어떤 키워드 리뷰가 많이 등장하는 지에 대해서 알아보고, 이 특징들을 바탕으로 공부하기 좋은 카페들을 추천하는 기능을 구현하고자 했다. 공부하기 위한 카페로 조용한 카페를 선호할 것이라고 생각하여 서울조용한카페”, “조용한카페”, 그리고 책이 많고 조용해서 독서하기 좋은 북카페에 대한 키워드 5개를 웹 크롤링을 사용하여 추출하였다. “서울조용한카페”, “조용한카페”, “북카페”  각각 250개의 데이터를 얻어서 총 750개의 데이터를 수집하였다.


    2. 데이터 가공

    수집하여 저장된 데이터의 경우 분석을 바로 하기에는 데이터 형식이나 문자열 자체로부터 추출하기 어려우며, 결측치들 또한 존재하기 때문에 이에 대한 처리 후 데이터를 분석해야 했다. 키워드 수의 경우 또한 문자열 형식으로 되어 있는 것을 숫자형으로 다시 바꿔주었다. 키워드 중에서도 커피가맛있어요’, ‘커피가 맛있어요와 같이 띄어쓰기에 의해 다른 것으로 인식하는 데이터들의 경우 띄어쓰기를 모두 없애서 키워드에 대한 분석을 할 수 있도록 처리하였다.


    3. 데이터 분석

    키워드 리뷰 수 자체를 더하는 것 자체는 리뷰가 많은 인기가 많은 카페 데이터에 의해 결과가 편향될 가능성이 있다고 판단하여 카페마다 각 리뷰 수가 많은 5개의 키워드의 빈도 수에 대한 합을 구해서 분석을 진행하였다. “서울조용한카페”, “조용한카페”, “북카페에 대한 데이터를 합쳐서 분석을 진행하였다. 또한, 카페의 경우는 친구들과 대화를 하는 목적도 있기에 별도로 책과 커피를 목적으로 가는 북카페에 대한 데이터만 분석해서 둘의 공통점과 차이점을 위주로 분석을 진행하였다

    516351f4fd4b8f47ba1459003facc97b_1662387065_3266.png

    위 사진은 "조용한카페", "서울조용한카페", "북카페"를 키워드로 해서 모은 데이터들을 바탕으로 키워드 리뷰의 빈도수를 시각화한 결과이다.



    516351f4fd4b8f47ba1459003facc97b_1662387075_3584.png
    위 사진은 "북카페"를 키워드로 해서 모은 데이터들을 바탕으로 키워드 리뷰의 빈도수를 시각화한 결과이다.


    시각화를 통해 분석해 본 결과 북카페, 조용한 카페들 모두 커피, 음료가 맛있는 것과 친절하다는 리뷰를 선택하는 것을 알 수 있었다북카페의 경우 다음으로 집중하기 좋다, 멋진 인테리어, 읽을 만한 책이 많다, 가성비, 대화하기 좋은, 맛있는 디저트, 편한 좌석 등이 주로 등장하였다. 조용한 카페와 북카페 데이터를 통합하여 분석한 경우, 공통된 3가지 키워드 다음으로는 멋진 인테리어’, ‘청결’, ‘대화하기 좋은’, ‘집중하기 좋은’, 가성비 등이 주로 등장하였다. 이런 결과들을 바탕으로 공부하기 좋을 것이라 예상되는 키워드들 중 중요 키워드로는 집중하기 좋은’, ‘대화하기 좋은’, ‘편한 좌석’, ‘청결’, ‘가성비를 선정하였다.


    4. 분석 결과를 바탕으로 가중치를 설정하여 공부가 잘 될 것이라 예상되는 카페 추출하기

    중요 키워드들 중 공부하는 것에 있어 가장 중요할 것이라 예상되는 키워드는 집중하기 좋은’, ‘편한 좌석이었다. 따라서 이 키워드가 있는 경우에는 5점을 주고, 그 다음대화하기 좋은’, ‘청결’, ‘가성비의 경우는 좀 더 낮은 가중치(3)를 주었다커피가 맛있다, 음료가 맛있다, 친절하다의 경우는 기본적으로 카페들이 가지고 있는 것이라 여겨서 1점을 주었고 평점 정보가 있는 카페들 중 평점 4.3이 넘어가는 카페들의 경우 3점을 주었다. 이 점수들을 바탕으로 계산한 결과 아래의 카페들이 가장 높은 점수를 받은, 즉 공부하기 좋을 것이라고 예상되는 카페들이다. 20위까지 데이터프레임으로 만들어서 정리하여 csv파일로 저장한다.


    516351f4fd4b8f47ba1459003facc97b_1662387333_6028.png
     

     실제로 하나하나 다 가본 카페가 아니기 때문에 정확하게 다 카페에서 공부하기에 적합한 장소인지는 알기 어려웠다. 그러나 주로 공부하는 블루포트, 310관 카페, LITTITCOFFEE, 커피나무 랩 등이 높은 순위로 등장하는 것을 볼 때, 꽤 괜찮은 정확도를 보일 것으로 예측한다.


    5. 카페 별 비슷한 카페 찾기

    카페 별 키워드 5개와 얻은 리뷰 수를 바탕으로 카페끼리의 코사인 유사도를 구해서 자기 자신을 제외한 10개의 카페를 추천해주는 기능을 구현하였다. 이 때 리뷰 수가 카페마다 차이가 크기 때문에 최대값을 1, 최소값을 0으로 하여 스케일링을 진행한 후 코사인 유사도를 구했다. 코사인 유사도를 구한 결과는 아래와 같다. (5개의 행만 표시)


    516351f4fd4b8f47ba1459003facc97b_1662387435_4259.png각 카페 별로 자기 자신을 제외한 코사인 유사도가 가장 높은 10개의 카페를 가지고 데이터프레임을 구성하여 csv로 저장한다. 결과는 다음과 같다. 


    516351f4fd4b8f47ba1459003facc97b_1662387544_6504.png
     


    6. html/CSS를 사용하여 웹 디자인 

    무료로 다운받아서 사용할 수 있는 프론트엔드 프레임워크인 bootstrap에서 기본 코드를 통해 이를 기반으로 카페, 스터디카페를 추천하는 웹을 디자인하여 웹 어플리케이션을 개발한다. 이 때 데이터 분석을 바탕으로 추출한 중앙대 근처 공부하기 좋은 카페 20개를 추천하는 기능과 좋아하는 카페와 비슷한 카페를 추천하는 기능 그리고 스터디카페를 보여주는 기능을 사용자가 사용할 수 있도록 디자인한다.


    7. Springboot를 활용하여 서버 구축 및 데이터베이스 연동

    자바 언어를 사용하는 서버 개발 프레임워크 스프링을 사용했다. DataJPA 등 웹 개발에 적합하게 스프링을 발전시킨 스프링 부트를 사용하여 개발을 진행하였다. 데이타베이스는 mariaDB를 사용하였다. mariaDB를 사용하여 데이타베이스를 생성하고 csv 파일을 읽어와 데이타베이스에 데이터를 저장하였다.


    8. thymeleaf 템플릿 엔진을 활용하여 mvc 패턴을 구현 및 프론트와 벡엔드 연결

    데이타베이스에 저장된 정보와 view에 해당하는 웹페이지(프론트파트)를 연결시키기 위해 MVC 패턴을 사용하여 Model(entity), View, Controller를 분리히여 코드를 작성했고 이를 편리하게 사용하기 위해 스프링부트에서 제공하는 thymeleaf를 사용하였다.


    9. 네이버 클라우드 플랫폼의 네이버 지도 API를 활용하여 지도 띄우기

    네이버 클라우드에서 제공하는 지도 API를 사용하여 웹페이지에 지도를 띄웠다. 학교 주변의 스터디 카페와 카페들을 대상으로 하는 프로젝트이기에 기준이 되는 지도의 주소를 중앙대학교로 설정하고 스터디 카페들의 위치를 지도에 표시했다. 이때 네이버 지도 API에 위치를 표시하려면 도로명 주소가 아닌 위도와 경도를 사용해야 했으므로 주소를 위도,경도로 바꿔주는 Geocoding api를 활용하여 스터디 카페들의 위도, 경도 데이터를 가져왔다.


    [구성원 간 역할 분담]

    김벼리 - 1 ~ 6 내용 수행

    정지원 - 6 ~ 9 내용 수행



  • 기대효과
  • 1. 공강 시간, 시험 기간에 공부할 카페 찾기가 쉬워짐

    : 평소 가던 카페 자리가 없어도 비슷한 카페 및 공부 장소를 쉽게 찾을 수 있을 것으로 기대한다.


    2.  소상공인 매출 증진

    : 인지도가 있는 카페, 프랜차이즈를 기준으로 추천하기 보다는 비슷한 특징들을 가진 카페, 조용한 카페들을 위주로 추천하므로 잘 알려지지 않은 조용한 분위기를 가진 개인 카페들도 노출될 확률이 높아진다.


    3. 자신의 취향에 부합하는 여러 카페 발굴 가능

    : 자신이 좋아하는 카페와 유사한 카페들을 추천해주므로 잘 알지 못했던 중앙대 근처 여러 카페들을 알게 될 수 있다.


    4. 카페 이용 인구 분산

    : 다양한 카페들을 추천해줌으로써 이용자들이 보다 다양하게 카페를 방문한다면, 전반적으로 일정 카페에 사람들이 밀집되기 보다는 분산될 것으로 기대한다.

  • 결과물
  • Github : https://github.com/OneStar-CAUIE 


    1. 기본 home page design 




    2. 데이터 분석 기반으로 추출한 공부 장소로 추천하는 카페 보여주는 페이지




    3. 카페 이름을 선택하면 유사한 카페를 추천해주는 페이지



    4. 중앙대 근처 스터디 카페 리스트와 지도로 위치를 볼 수 있는 페이지

    :노란 박스의 StudyCafe Map을 누르면 지도를 확인할 수 있음

     

    5. 스터디 카페들 지도에 위치 표시한 결과


     


기타파일

첨부파일

중앙대학교 다빈치 sw tech fair 참가신청 닫기