본문으로 건너뛰기
프로젝트개인 작업여정
Eun
프로젝트개인 작업여정

← 개인 목록으로
메이트메이트(MATEMATE) 룸메이트 매칭 캡처 1

프로젝트 한눈에 보기

메이트메이트(MATEMATE) 룸메이트 매칭

쉽게 말하면

한국공학대학교 방학 / 캡스톤 팀 프로젝트로 만든 기숙사 룸메이트 매칭 모바일 웹입니다. 랜덤 배정이나 지인 추천 대신 생활 습관 / 성향 조건을 입력해 맞는 상대를 찾도록 설계했습니다. 소스와 배포는 team-matemate/matemate 저장소와 Firebase에서 관리했습니다.

HTML / SCSS / JavaScript / Firebase Hosting / Firestore / Cloud Functions / Figma

페이지 이동하기GitHub

유형
팀 / 방학 / 캡스톤 (모바일 웹)
기간
2025.01.04~2025.01.30
소요 시간
약 4주
역할
기획 90% / UI 디자인 30% / 퍼블리싱 100% (team-matemate)

01 / PROJECT NOTE

제가 맡고 끝까지 책임진 일

완성 화면만 나열하지 않았습니다. 왜 그렇게 만들었고 어떤 변화를 남겼는지 차례대로 설명합니다.

문제를 이렇게 풀었습니다

  • 문제 정의 / 서비스 기획 / 매칭 / 인증 / 채팅 / 게시판 등 사용자 흐름과 IA 설계
  • `public/html/`에 auth / match / chat / board / cutline / user / main 화면 퍼블리싱 및 SCSS 컴포넌트 구조 정리
  • Firebase Hosting(루트 → main), Firestore / Storage rules, Cloud Functions 백엔드 연동 구성
  • Swiper / 공통 JS로 매칭 / 목록 인터랙션 구현, C2C 반복 수정에 맞춘 UX 정리

그래서 실제로 달라진 점

  • 4주간의 팀 협업으로 핵심 사용자 흐름을 갖춘 MVP와 배포 파이프라인 완성
  • 체크리스트 / 개인 게시글 방식 대비 자동 조건 매칭이라는 서비스 차별점을 UI 흐름으로 구현

이 프로젝트에서 눈여겨볼 점

  • 팀 캡스톤에서 기획 / 퍼블리싱을 담당하고 공통 기준에 따라 화면 단위 업무를 분담
  • Firebase로 호스팅 / DB / 함수를 묶어 모바일 웹 프로토타입을 실제 URL로 공유 가능

02 / SCREENS

화면으로 확인하기

말보다 화면이 빠를 때가 있습니다. 실제 결과물에서 구현의 디테일을 확인해 보세요.

메이트메이트(MATEMATE) 룸메이트 매칭 캡처 1
01 팀 캡스톤에서 기획 / 퍼블리싱을 담당하고 공통 기준에 따라 화면 단위 업무를 분담
메이트메이트(MATEMATE) 룸메이트 매칭 캡처 2
02 Firebase로 호스팅 / DB / 함수를 묶어 모바일 웹 프로토타입을 실제 URL로 공유 가능
메이트메이트(MATEMATE) 룸메이트 매칭 캡처 3
03 팀 캡스톤에서 기획 / 퍼블리싱을 담당하고 공통 기준에 따라 화면 단위 업무를 분담
메이트메이트(MATEMATE) 룸메이트 매칭 캡처 4
04 Firebase로 호스팅 / DB / 함수를 묶어 모바일 웹 프로토타입을 실제 URL로 공유 가능

03 / KEEP EXPLORING

다음 프로젝트

공팅 블라인드 매칭 서비스↗조앤소프트 홈페이지 리뉴얼 아카이브↗포트폴리오 웹사이트 2026↗신길교회 야구 선교단 홈페이지↗
← 다 읽었다면 개인 프로젝트 목록으로

✦

웹 퍼블리셔 / 웹 프론트엔드 개발자 은영환의 2026 포트폴리오

  • 포트폴리오 홈
  • 실무 프로젝트 갤러리
  • 개인 프로젝트 갤러리

© 2026 Eunyounghwan Portfolio