W7D4
직방의 원룸 지도로 찾기 검색 과정은 어떤 구조로 되어 있을까?
2주전 W6D1때 특정 서비스를 선정 후, 고객이 서비스에서 할 수 있는 행동을 'Flow Chart'로 작성해보고, 그 과정 속에서 'UI, 클라이언트, 서버, DB'가 어떻게 보이고 작동되는지 생각해볼 수 있었다. 당시 주제로 '직방의 원룸 지도로 찾기 검색 과정'을 선정했고, 오늘은 2주간의 학습 이후 전에 작성한 내용과의 비교를 중점으로 내부 구조를 예상해보고자 한다.
Flow Chart를 통해 내부 구조 예상해보기 (직방, Before) / 코드스테이츠 PMB 16기 W6D1
W6D1 직방의 원룸 지도로 찾기 검색 과정은 어떤 구조로 되어 있을까? 오늘은 특정 서비스를 선정 후, 고객이 서비스에서 할 수 있는 행동을 'Flow Chart'로 작성해보고, 그 과정 속에서 'UI, 클라이언
pmjsb.tistory.com
1. Flow Chart 변경 점
1) 기존
2) 수정
- 전체적인 문구 수정
- '적용하기' 클릭 과정에서 원룸의 수 데이터가 서버를 통해 DB에서 오는 과정을 진행하고, '이 지역 매물보기' 클릭 과정을 통해 조건과 지역에 맞는 상세한 원룸 데이터가 서버를 통해 DB에서 온다고 판단해 과정 추가
2. 수정 된 Flow Chart를 통해 내부 Flow 예상해보기
1) 앱 실행
- 클라이언트는 앱을 실행한다.
- '메인 홈' UI가 표시된다.
2) '원룸' 버튼 클릭
- 클라이언트는 '원룸' 버튼을 클릭한다.
- '원룸 페이지' UI가 표시된다.
3) '지도로 찾기' 클릭 & 지도에서 지역 선택
- 클라이언트는 '지도로 찾기' 버튼을 클릭하고, 표시된 지도 UI에 따라 설정하고싶은 지역이나 범위를 선택한다.
- 서버는 클라이언트가 선택한 지역을 DB에 전달한다.
- DB는 서버에서 선택된 지역에 해당하는 원룸 수 데이터를 추출해 서버로 전송한다.
- 서버는 DB에서 온 데이터를 UI를 통해 클라이언트에게 전달한다.
4) 조건 설정 창 클릭 & 조건 선택
- 클라이언트는 조건을 설정하고 싶을 시 조건 창('전월세, 금액', '구조, 면적' 조건 총 두개의 창)을 클릭하고 원하는 조건을 선택한다.
- 조건 설정을 원하지 않을 경우 바로 6)'이 지역 매물보기' 버튼을 클릭한다.
- 조건 창 클릭 시 해당되는 창의 UI가 표시되고, 설정할 수 있는 조건들을 표시해준다.
5) '적용하기' 클릭
- 클라이언트는 4)의 과정을 통해 조건을 선택하고, 적용하기를 클릭한다.
- 서버는 클라이언트가 선택한 조건을 DB에 전달한다.
- DB는 서버에서 선택된 조건에 해당하는 원룸 수 데이터를 추출해 서버로 전송한다.
- 서버는 DB에서 온 데이터를 UI를 통해 클라이언트에게 전달한다.
6) '이 지역 매물보기' 클릭 & 추출된 원룸 보기
- 클라이언트는 이 지역 매물보기를 클릭한다.
- 서버는 클라이언트가 선택한 조건과 지역을 DB에 전달한다.
- DB는 서버에서 선택된 조건과 지역에 해당하는 원룸 상세 데이터를 추출해 서버로 전송한다.
- 서버는 DB에서 온 데이터를 UI를 통해 클라이언트에게 전달한다.
- 클라이언트는 조건과 지역에 맞는 원룸들을 볼 수 있고, 검색의 과정은 끝이 난다.
마치며,
오늘은 지난 W6D1때 작성해본 '직방의 원룸 지도로 찾기 검색 과정'의 Flow Chart를 수정하고, 수정된 Flow Chart를 바탕으로 내부 Flow 즉, 클라이언트, UI, 서버, DB가 어떻게 작동하는지를 생각해볼 수 있었다. 이용자가 클라이언트를 통하여 원하는 정보를 서버에 요청해 데이터베이스의 정보를 사용하는 전체 과정에서, 클라이언트 부분이 핵심이 되는 프론트엔드(Front-end)와 서버 부분이 핵심이 되는 백엔드(Back-end)에 대해서 좀 더 이해하게 된거 같다. PM이 프론트엔드, 백엔드 개발자만큼 개발 실력이 있어야하고, 관련 지식을 전부 다 적용할 줄 알아야하는건 아니지만, 결국에 중요한건 다시금 '소통'이다. 개발자를 비롯해 함께 협업하는 모든 이해관계자들과 원활하게 커뮤니케이션 하기 위해서 PM은 소통이 가능한 수준의 관련 개발 지식을 꾸준하게 이해하는 것이 필수나 다름없다. 그 소통이 원활해지고, 더 원활해질 수록 함께 일하는 관계자들이 더 신뢰할 수 있는 프로덕트 매니저가 되는 것이 아닐까 생각하며 글을 마치겠다.
직방 (2023년 1월 30일) https://www.zigbang.com/
No.1 부동산 앱, 직방
여기를 눌러 링크를 확인하세요.
www.zigbang.com
'PMB daily' 카테고리의 다른 글
| 스크럼 가이드 요약 정리 / 코드스테이츠 PMB 16기 W8D2 (0) | 2023.02.02 |
|---|---|
| 테이블링의 개선점 스토리 형식 작성 & 이해관계자 파악 / 코드스테이츠 PMB 16기 W8D1, W8D3 (0) | 2023.02.01 |
| 카카오 오픈 API 탐색하기(로컬, 주소 검색하기) / 코드스테이츠 PMB 16기 W7D3 (0) | 2023.01.27 |
| 라프텔의 서비스 유형 분석 / 코드스테이츠 PMB 16기 W7D2 (0) | 2023.01.26 |
| 더브이씨(THE VC)의 랜딩페이지 프로트엔드 탐색 / 코드스테이츠 PMB 16기 W7D1 (0) | 2023.01.25 |
