Portfolio

서비스 소개와 메인 페이지 조회

지금부터 최종 프로젝트 비드마켓의 서비스 시연을 시작하겠습니다.

지금 보시는 화면은 저희 서비스의 메인 페이지입니다. 여러분들이 자주 사용하시는 당근 마켓의 디자인처럼 한 눈에 여러 중고 상품을 확인할 수 있는데요.

여기서 잠깐, 당근마켓과 저희 서비스의 차이점을 먼저 살펴보고 갈까요? 당근 마켓은 상품을 원하는 가격을 올리고 그 상품을 가지고 싶은 사용자가 채팅하는 구조로 대부분 선착순으로 진행되는 것을 모두 알고 계실 겁니다.

하지만 저희는 반대로 판매자는 시작가를 넣고, 일정한 남은 시간동안 다른 사용자들이 본인이 원하는 가격으로 입찰을 진행하여 상품을 낙찰받는 형식으로 진행됩니다.

현재, 다양한 상품의 경매가 진행중인 것을 볼 수 있는데 스크롤을 내릴 수록 경매 종료까지 남은 시간이 많은 것을 확인할 수 있습니다. 여기서 원하는 상품을 하나를 선택하게 되면 이 상품의 상세 정보 페이지로 넘어오게 됩니다.

상세 페이지 조회, 로그인

이 신발 상품을 자세히 한 번 살펴보겠습니다. 상품의 상태를 이미지로 확인할 수 있으며 낙찰은 (D-Day로) 오늘까지 진행한다는 것을 한 눈에 확인할 수 있습니다. 또한, 경매 시작가는 n만원부터, 남은시간도 실시간으로 확인이 가능한데요. 이 상품에 한 번 입찰해보겠습니다.

→ 현재, 입찰은 이미 가입한 회원만 가능하기 때문에 로그인을 먼저 진행해보겠습니다. 사용자가 구글 소셜 로그인 버튼을 누르게 되면 자동으로 로그인을 진행하여 다시 메인 페이지로 이동하게 됩니다.

검색

아까 입찰을 하고 싶었던 신발 상품을 찾기 위해 검색해보겠습니다.

검색은 종료 입박순, 최신순 그리고 시작가에 따라 필터링이 되고 또한 다양한 카테고리 별로 나누어 검색 결과를 보여 줄 수 있습니다. 또한, 낙찰이 완료된 상품도 확인할 수 있습니다.

입찰

(판매자 화면, 입찰자 화면 모두 보여주기) (맥스 등장)

아까 진행하지 못했던 입찰을 다시 한 번 진행해보겠습니다. (남은 시간이 얼마 없어야 빠른 시간 안에 시연가능)

현재 왼쪽은 실제 입찰을 진행하는 입찰자 화면이고, 오른쪽은 상품을 판매하는 판매자 화면입니다.

입찰자는 입찰하기 버튼, 판매자는 본인 상품에 입찰을 할 수 없기 때문에 입찰이 진행중입니다 라는 버튼으로,이 보이는데요, 입찰 시간이 얼마 안 남았기 때문에 서둘러 실제 입찰을 진행해보겠습니다.

(입찰 진행) 입찰은 판매자가 올려놓은 시작가보다 무조건 높게 불러야만 합니다. 만약 시작가보다 낮게 입찰 할 경우 다음과 같이 경고 문구가 뜨게 됩니다.

200020 원에 다시 입찰했을 경우에도 경고문구가 뜹니다.

그럼 20만원에 입찰을 해보겠습니다. 입찰이 완료가되면 경매 종료가 되기 전까지는 내가 입찰한 금액을 다음과 같이 확인할 수 있습니다.

낙찰

입찰시간이 종료되었다면 자동으로 입찰 버튼을 클릭할 수 없게 되며 잠시 후에 낙찰 결과가 공개됩니다. 버튼으로 변경됩니다. 낙찰 결과는 모든 입찰을 한 사람들 중 가장 높은 금액을 입력한 사용자를 낙찰자로 선정해서 판매자와 연결시켜주는 작업을 위해 약 1분 뒤에 공개되는데요.

그 동안 판매자의 마이페이지를 구경하고 오겠습니다. (같이 마이페이지로)

마이페이지

왼쪽 사용자가 보는 판매자의 화면은 판매자를 신고할 수 있는 신고 버튼과 판매 상품만을 확인할 수 있습니다, 오른쪽에 보이는 판매자의 화면에는 본인의 판매 상품, 입찰 상품, 찜한 상품 확인과 계정을 설정할 수 있습니다.(알림으로 ㄲ)

다시 낙찰 + 알람

다시 돌아와서 낙찰이 종료되었는지 확인해보겠습니다!

(입찰자 화면) 낙찰이 종료되면 입찰자 화면에서는 ~~라는 문구와 함께 낙찰된 사용자와 채팅할 수 있는 버튼이 생긴 것을 확인할 수 있습니다.

또한 낙찰이 종료되면 판매자와 입찰자 모두에게 낙찰이 종료되었다는 알림이 다음과 같이 가게 됩니다. (게시글 진입) 여기서 판매자가 알림이 온 상품에 들어가면 아까와 같은 채팅하기 버튼을 볼 수 있습니다.

채팅

이제 판매자와 입찰자가 채팅을 해보겠습니다.

채팅 진행~

수경 - 안녕하세요!

재호 - 네! 안녕하세요!

수경 - 신발 문의 드려도 될까요?

재호 - 넵! 어떤게 궁금하신가요?

이제 채팅을 마무리 하겠습니다.

낙찰 - 재등록버튼

만약 여기서 낙찰이 종료되었고 아무도 낙찰되지 않았을 경우에는 어떻게 될까요?

(판매자 입장 → 이미 낙찰 완료되었고 아무도 낙찰하지 않은 상품 들어가기) 그럴 경우에는 재등록 하기 버튼이 생겨 상품을 재등록 할 수 있습니다.

(맥스 퇴장)

상품 등록

만약에, 상품을 입찰하고 싶은 것이 아니라 상품을 판매하고 싶다면 어떻게 해야할까요?

메인페이지로 돌아와서 오른쪽 아래 + 버튼을 눌러서 상품을 등록해보겠습니다. 사진은 최대 5개까지 넣을 수 있고수박 상품을 경매에 올려보겠습니다.


입력 제목 : 수박 팔아요 ~
입력 금액 : 20,000원
입력 카테고리 : 생활/가공 식품
입력 지역 : 강남구
입력 본문 :
여름엔 수박이죠!
많은 입찰 부탁드립니다!

사진 + 제목 + 금액 + 판매 설정 + 카테고리 + 희망 거래 지역 + 상세 내용 넣을 내용 적어두기

상품의 항목을 모두 적고 등록을 완료하면 방금 등록된 상품의 상세 페이지에서 확인할 수 있습니다.

찜하기

앗 예전부터 워터파크를 가고 싶었는데 티켓이 있네요!

2개의 티켓을 파는데 누구랑 갈지 고민이네요,,

일단 찜을 해보겠습니다!

찜이 잘 되었는지 확인해보겠습니다

유저 신고

상품이 맘에 들어 판매자의 다른 상품도 둘러보겠습니다.

(찜 목록 → 판매자 회원 정보 → 판매 상품)

맥북 판매가 너무 많아서 의심스러워보입니다. 맥북 프로의 상품 중 1개를 신고해보겠습니다.


작성 내용 :
맥북 모두 진품이 맞나요?!
관리자님 확인 부탁드립니다!

회원 탈퇴 + 로그아웃

사실 저는 제 닉네임이 맘에 들지 않아 회원 정보 수정을 해보겠습니다.

닉네임을 워터로 프로필 사진을 감자로 변경하겠습니다. 변경이 제대로 된 것을 확인할 수 있습니다.

회원 정보 페이지의 계정 설정에서 회원 탈퇴와 로그아웃을 할 수 있습니다.

이제 로그아웃을 하며 마치겠습니다.

지금까지 저희 서비스 비드마켓의 시연 영상을 봐주셔서 감사합니다.

정지버튼눌러

로그인, 로그아웃 - 메인 -> 로그인 -> 메인 - 메인 -> 회원 정보 -> 계정 설정 -> 로그아웃

검색 - 메인 -> `신발` 검색 -> 정렬 필터 (2번) -> 카테고리 필터 (남성 신발)(여성 신발) -> 낙찰된 상품 조회 -> 상품 상세

입찰 - 입찰자 : 메인 -> 상품 상세 -> 사진 슬라이드 -> 입찰 금액 (100원 단위 입력하기로 validation) -> `입찰 금액 확인` 버튼 - 판매자 : 메인 -> 회원 정보 -> 판매 상품 목록 -> 상품 상세 -> `입찰중입니다` 버튼

낙찰 + 채팅 - 입찰자 : 상품 상세 -> 1분 -> `입찰이 종료되었습니다` 안내 메시지 확인 - 낙찰자(채팅) : 상품 상세 -> 1분 -> `채팅하기` 버튼 -> 채팅들어가서 대화 - 판매자(채팅) : 상품 상세 -> 1분 -> `채팅하기` 버튼 -> 채팅들어가서 대화 - 판매자(재등록) : 상품 상세 -> 1분 -> `재등록하기` 버튼 -> 상품 등록

상품 등록 - 메인 -> 상품 등록 -> [사진 4개 -> 제목 -> 카테고리 -> 지역 -> 본문 -> 등록] -> 상품 상세 -> 사진 슬라이드

신고 - 메인 -> 상품 상세 -> 회원 정보 -> 신고 -> 제출

찜 - 메인 -> `맥북` 검색 -> 찜하기 2개

회원정보 수정 - 메인 -> 회원 정보 -> 프로필 수정 -> 사진 선택 -> 닉네임 변경 -> 회원 정보 - 404, 500

404 : url에 아무거나 작성하면 나오는 페이지
500 : `/products/[없는 상품 아이디]` 로 진입하면 나오는 페이지

회원 탈퇴 - 회원 정보 -> 계정 설정 -> 회원 탈퇴

준비 상태 - 맥북 키워드 상품 13개 - 신발 키워드 상품 10개 (남성 신발 3개, 여성 신발 7개(낙찰된거 2개))

최종 발표 시연 대본