🌹Flora & Dér

프로젝트 소개

프로젝트 기간
2024.02.19 - 2024.03.01

프로젝트 인원

역할	이름
백엔드	박찬주(팀장), 박지원
프론트엔드	안지영, 유경아, 최인영, 박진솔

쇼핑몰 이름 및 의미

• 🌹 플로라앤더 (Flora & Dér)

• '꽃과 더' 라는 뜻으로, 꽃을 중심으로 다양한 아이템과 서비스를 제공하는 쇼핑몰을 의미

목적
5팀의 목적은 꽃의 아름다움과 향기를 통해 사용자에게 긍정적인 경험을 제공하는 플랫폼을 만들자는 마음으로 시작했습니다. 이를 위해 현대적인 웹디자인을 활용하고, 트렌드에 민감하게 반응하는 사용자들의 취향과 요구를 반영하려 합니다.

목표

• 매출 증가: 세련된 디자인과 향기로운 꽃 상품을 통해 매출을 증가시키고 쇼핑몰의 수익을 높이는 것을 목표로 합니다.

• 사용자 경험 개선: 사용자들이 편리하게 꽃을 주문하고 구매할 수 있도록 웹사이트 내 주문 프로세스를 최적화합니다.

• 수익 모델 구축: 다양한 종류의 꽃 상품 판매와 빠르고 안전한 꽃 배송 서비스를 통해 수익을 창출합니다.

프로젝트 도메인

🔗 http://kdt-sw-8-team05.elicecoding.com

구현 기능

• 상품 조회 (ALL / 카테고리)
• 상품 상세
• 회원가입 / 회원정보 수정 / 회원탈퇴
• 로그인 / 로그아웃
• 장바구니 (추가 / 조회 / 수량 변경 / 삭제)
• 비회원 주문 (조회 / 배송지 변경 / 취소)
• 회원 주문 (조회 / 배송지 변경 / 취소)
• 관리자 (주문 관리 / 상품 관리 / 회원관리)
• 도로명주소 검색 (우편번호 자동 입력)

메인화면 피그마
https://www.figma.com/file/pxxz7RIieJjifPBBTTo9aW/Untitled?type=design&node-id=0-1&mode=design&t=iAq3wBSVguortGI4-0

사용자가 가능한 가장 적은 클릭으로 상품을 구매하거나 판매할 수 있도록 직관적인 사용자 인터페이스(UI)를 설계하였습니다. 전통적인 웹 쇼핑몰의 구조를 기반으로, 필수적인 기능들 위주로 구현하였습니다.

인터랙션

• 상품 상세보기
  사용자가 상품 리스트에서 특정 상품을 클릭했을 때, 그 상품의 상세 설명, 가격, 사진 등을 볼 수 있는 페이지로 이동합니다. 이는 사용자가 상품에 대해 더 많은 정보를 얻고 구매 결정을 내릴 수 있게 합니다.

• 장바구니 추가
  각 상품 카드에 "장바구니에 추가" 버튼을 포함. 버튼 클릭 시, JavaScript를 사용하여 해당 상품 정보를 로컬 스토리지에 저장하거나 장바구니 목록에 동적으로 추가되어사용자는 원하는 상품을 장바구니에 추가하고, 나중에 한 번에 결제할 수 있습니다.

프로젝트 기술 스택

Front-End

• html
• css
• javascript

Back-End

• node.js
• express.js
• mongodb (DB)
• mongoose (ODM)

레퍼런스

디자인 레퍼런스 https://www.market-apartmentfull.kr/all
컨셉 레퍼런스 https://www.kukka.kr/