메인 카테고리 : 편의점/마트

• 카테고리 참고예시

• 마즐 와이어프레임

https://www.figma.com/file/mBxeqLbDep0d6dJnV4ZsEv/마즐-와이어프레임?node-id=0%3A1

<aside> 💡 노란색 : 의식의 흐름대로 적었으니 논의해야하는 부분들…인 것 같슴다 -다은

</aside>

• 홈 **(로그인 안하면 둘러보기 가능??)

  • 상황별 레시피, 음료 추천
    • (어떤 상황인지 정해야할듯, 친구들과 마시기, 부모님과 마시기, 애인과 마시기 등 최소 3~4개.. 음료 추천은 우리가 해주는건지 아니면 자세한 방법 생각해보기)
  • 인기 레시피 (좋아요가 많은 순서대로)
  • 인기 리뷰 (좋아요가 많은 순서대로)

• 레시피 공유 (커뮤니티 형식)

  • 레시피 공유 게시글 리스트 조회

  • 레시피 공유 게시글 상세 페이지

  • 레시피 공유 게시글 작성 폼

    • 줄글식 : 블로그처럼 그냥 사진&글로만 구성. 따로 음료 및 재료 선택하는 폼 아님. → 추후 제공
    • 단계식
      1. 단계 or 줄 글 선택
      2. 음료 검색
      3. 음료 선택 → 선택한 음료 정보 자동 등록
      4. 계량 정도 선택
         • 아빠 숟가락
         • 소주잔
         • 맥주잔
         • 종이컵
      5. 설명 입력
      6. 단계 추가 및 등록
         1. 단계 추가 → 다음 단계로 넘어가서 다시 음료 검색 및 선택부터…
         2. 등록 → 게시글 등록 된 상세페이지로 이동

  • 레시피 게시글 좋아요, 하트 (스크랩)

    • 좋아요 or 하트 동작 완료 시 → alert로 성공 메세지
    • 좋아요 or 하트 동작 실패 시 → alert로 실패 메세지

• 음료 정보 (선택은 대분류/중분류까지 보여주고 소분류에서는 검색) → 술일 때 성인인증이 안되어있다면 성인인증 페이지로 이동

  • 음료 리뷰 작성 폼 제공 (별점 & 한줄평)
    • 음료 정보 조회 페이지
      • 음료 정보 (음료 검색 후 없으면 아래와 같은 폼을 제공하여 입력할 수 있도록 함)
        • 음료 사진
        • 제품명
        • 제조사
        • 칼로리
        • 분류(탄산 등..)
      • 내가 쓴 리뷰(선순위) (이건 마이페이지에도 있긴한데)
        • 음료 리뷰 작성
        • 음료 리뷰 수정
        • 음료 리뷰 삭제
  • 리뷰 좋아요
    • 좋아요 성공시 → 좋아요 누른 리뷰의 좋아요 버튼이 마킹되어 있음.
    • 이미 누른 좋아요를 재클릭 시 → 좋아요 해제

• 마이 페이지

  • 개인 정보 수정 및 탈퇴
    • ID 수정
    • PW 수정?
    • 닉네임?
    • 연락처?
    • 탈퇴 → 홈으로 이동
  • 하트한 레시피
    • 레시피 목록 → 레시피 상세페이지로 이동
  • 내가 쓴 리뷰 조회(후순위)
    • 리뷰 목록(제품 간략 정보 & 리뷰 간략 보기 제공)
      • 목록에서 수정하기 기능(후순위)
      • 음료 정보 페이지로 들어가서 나의 리뷰로 조회해서 수정하게 유도(선순위)
    • 제품 클릭 시 제품 상세 페이지로 이동

  ---

• 인증

  • 로그인
    • 홈에서 이동 → 별도 페이지
    • 로그인 성공 → 홈(메인) 화면으로 이동
    • 로그인 실패 → alert 실패 메세지 출력
  • 회원가입
    • 홈에서 이동 → 별도 회원가입 페이지로 이동
    • 입력 값
      • id
      • pw
      • pw check
      • nickName → nickName을 따로 입력 받지 않고 id를 닉네임으로 사용해도 무방.
      • name → 인증할 때 필요하나요?
      • Phone Number (이때 전화번호 인증을 하거나 아니면 처음에 가입할 때 19세 이상인가요 미만인가요 이거 선택하게 해야할듯)
    • 비밀번호 유효성 검사
      • 8자 이상
      • 영문자
      • 특수 문자 포함 필수
      • 숫자 포함 필수
    • 빈칸이 없고, 유효성 검사 통과 시
      • 성공 → 로그인 화면으로 이동
    • 빈칸이 있을 시
      • 실패 → alert 빈칸이 있음을 알리는 메세지 출력
    • 유효성 검사 탈락 시
      • 실패 → alert 실패 메세지 출력