📋 개요
프로젝트 내용을 간략히 요약했습니다.
목차
1. 프로젝트 주제
프랜차이즈 커스텀 메뉴를 검색, 반응, 즐겨 찾기할 수 있는 SNS 웹 서비스
- 커스텀 메뉴란?
- 한 메뉴 내 선택
- 메뉴 여러개 선택 후 조합
소비자가 자신의 입맛에 맞게 주문 선택지를 골라서 만든 메뉴
예시
2. 선정 배경
열기
- 커스텀 메뉴를 권장하는 프랜차이즈들이 늘고 있고, 이를 실제로 사용하고 주변 사람들과 공유하는 소비자도 많습니다. 하지만 다음과 같은 불편함이 있어서 프로젝트를 구상하게됐습니다.
- 아직까지 메뉴들을 모아서 볼 수 있는 플랫폼이 없기 때문에 검색하기도 번거럽고 리뷰를 찾아 보기도 힘듭니다.
- 검색 결과를 저장할 때 갤러리나 메모장을 쓰게 되는데 해당 기록물을 일일이 분류해 보관하기도 힘들기 때문에 막상 쓸 때 찾기가 쉽지가 않아서 또 다시 검색을 하게 됩니다.
- 정보글의 경우 사용자들의 리뷰를 보기 쉽지 않고, 사용자들의 리뷰를 봐도 입맛이 다르기 때문에 해당 커스텀 메뉴가 본인에게 맞을 지 알 수 없습니다.
경쟁서비스
- 즐겨찾기, 검색, 댓글 리뷰가 없어서 불편함을 해소해주지 못 합니다.
3. 타겟 사용자
- 커스텀 메뉴에 대해 흥미가 있는 소비자들 (10 - 30대 예상)
4. 주요 기능
killer기능 : 나만의 메뉴판 - 커스텀메뉴 즐겨찾기 + 검색 + 정렬
MUST
- 1순위 기능
- 회원가입, 로그인, 로그아웃, 내정보 변경
- 2순위 기능 : 나만의 메뉴 CUD ⇒ 나만의 메뉴판 R
- 나만의 메뉴판: 마이페이지와 유사 ( 좋아요한 메뉴, 내가 작성한 메뉴 열람, 프로필 )
- 메뉴 등록: 사진 + 메뉴명 + 기존메뉴명 + 설명 + 옵션 + 예상 가격
- 메뉴 상세보기: 나만의 메뉴 & 좋아요한 메뉴 이미지 클릭시
- 나만의 메뉴판 안에서 검색 (메뉴명 || 기존 메뉴명 )
- 검색 결과 정렬 ( 최신순, 좋아요순, 댓글순)
SHOULD
- 3순위: 다른 사람의 메뉴 열람 + 평가 + 전체 검색 + 좋아요
- 메인 페이지에서 사용자들의 메뉴피드 + 정렬 ( 최신순 = 기본값, 좋아요, 댓글순)
- 하단 네비 검색 아이콘 누르면 카테고리 페이지 이동
- 카테고리 페이지에서 프랜차이즈 또는 전체 선택 가능
- ( search/카테고리명 === 프랜차이즈명)
- 위 결과를 바탕으로 검색 페이지에 목록 보기
- 검색페이지에서 해당 카테고리 내 메뉴명 || 기존 메뉴명 검색
- 검색 페이지 맛 태그 필터
- 검색 페이지 정렬
- 메뉴 상세 페이지
- 다른 사용자 메뉴에 댓글달기
- 다른 사용자 메뉴 좋아요 클릭
- 좋아요 누를 시 나의 메뉴판 좋아요한 메뉴 목록에서 열람 가능
- 4순위 : 다른 사람의 메뉴판 열람
- 다른 사용자의 메뉴판 페이지 열람
- 다른 사용자의 메뉴판 안에서 검색
- 메뉴 상세보기: 나만의 메뉴 & 좋아요한 메뉴 이미지 클릭시
COULD
- 팔로우, 팔로잉 기능 ⇒ 팔로우 목록도 구현해야됨
5. 기대 효과
사용자
- 커스텀 메뉴 레시피 관리가 쉽다.
- 검색, 정렬, 마이페이지 기능이 있어서 주문시 바로 찾을 수 있다.
- 리뷰 기능을 통해 정보 공유 가능
- 리뷰 검증 : 메뉴 작성자 또는 리뷰를 남긴 사람의 나만의 메뉴판을 보면 내 입맛과 비슷한지 유추할 수 있음
개발자
FE: 기존 SNS 프로젝트의 경험을 녹여낼 수 있다.
BE: 데이터 구조에 대해 고민해 볼 만큼의 프로젝트 규모이지 않을까? ( 이부분은 제 소견입니다 😅 )
FE & BE : 경쟁사 + 기능 추가 형태라 어떤 서비스를 만들지 파악하기 쉽다.
🖌️ 로고 및 색상
디자인에 사용된 로고와 색상에 대해 쓰여있습니다.
1. 로고
추후 선정
2. 색상
입맛을 돋우는 색 사용
- E7404A
🧑💻 기술 스택
.png?table=block&id=8750853c-d2d0-4699-8f22-38612bbeab45&cache=v2)
- 언어: JavaScript
- 라이브러리: React
- 상태관리: Context API
- UI 스타일링: ?
- 협업툴: git, git-projects, issues , Notion, slack
🏗️ UI 와이어프레임
📄UI 기능 명세서
상단 네비
1. 메인페이지
열기
2. 로그인 페이지
열기
3. 회원가입 페이지
열기
4. 카테고리 페이지
열기
5. 검색 페이지
열기
6. 상세 페이지
/detail/[id]
열기
7. 메뉴 등록 페이지
열기
8. 메뉴 수정 페이지
열기
9. 사용자 메뉴판 페이지
열기
10. 개인 정보 페이지
열기
11. 비밀 번호 변경 페이지
열기
프로젝트에서 사용한 기술을 정리해두었습니다.