프로덕트 디자이너의 SaaS 프로덕트 리서치 뽀개기

Jiyu Han
6 min readMar 30, 2021

--

오늘은 프로덕트 디자이너인 제가 평소에 어떻게 SaaS 프로덕트 리서치하고 있는지 공유하려고 합니다. ‘완전한 무에서 유를 만들 수 없다.’고들 하잖아요. 프로덕트 디자인할 때 완전히 새로운 레이아웃과 플로우를 만들기보다는 다른 서비스에서 비슷한 기능이 어떻게 설계되어있는지 리서치하는 게 중요한데요. 그 이유는 사용자에게 친숙한 패턴을 사용하기 위함이고 또 여러 가지 레퍼런스를 통해 우리 유저에게 가장 좋은 구조와 플로우를 고안할 수 있기 때문입니다. 여러 프로덕트에서 좋은 점을 뽑아 합쳐본다거나, 약간 변형해서 적용해본다거나 하면서 더 사용하기 편리하고 유용한 프로덕트를 만들어 나갈 수 있겠죠.

사실 모바일 앱의 경우, 이미 UI 아카이빙 사이트도 많고 우리가 평소에 많이 사용하기 때문에 ‘좋다 안 좋다’, ‘어떤 식으로 분석해야겠다’하는 감이 있는 경우가 많은 것 같아요. 하지만 웹 프로덕트인 경우, 특히 사용자가 제한적이거나 B2B SaaS 프로덕트인 경우는 어떻게 리서치를 해야 하는지 감을 잡기가 어렵습니다. 네비게이션 바도 많고, 탭도 다양하고, 탭 하나 안에도 수많은 기능과 디테일이 존재하기 때문에 어디서부터 어떻게 시작해야 할지 도무지 감이 안 잡히기도 하죠.

사실 저도 리서치를 시작한 초창기에는 한참을 헤맨 것 같아요. 한 서비스를 분석하러 들어가서 A를 보다가 B를 보고 C를 보고 그러다 보면 전체 구조를 보지도 못하고 시간은 흘러가고 리서치는 제대로 하지 못한 것 같은 기분이 들곤 했습니다. 하지만 어느 정도 리서치를 하자 이제는 어떤 식으로 리서치를 해야겠다는 나름의 감이 조금 생겼고 최근에는 습관적으로 혹은 업무를 하면서 필요할 때 마다 SaaS 프로덕트 리서치를 진행하고 있습니다. 이것이 정답은 아니고 프레임워크도 아니지만 제 방식을 공유하려 합니다. 혹시 SaaS 프로덕트 리서치를 어떻게 해야 할지 감이 안 잡혀서 어려웠다면 도움이 되시길 바라요! (디자인 포커스 리서치입니다!)

Product channel

우선, 제가 프로덕트에 관한 정보를 얻는 채널 3가지입니다.

그리고 팀원들에게 들은 프로덕트 관련 정보를 얻는 꿀팁인데요.

  • Twitter, Facebook 같은 SNS 활용하기
    새로운 프로덕트를 자주 포스팅하는 사람, 페이지, 프로덕트 관련 종사자 팔로우해두면 자연스럽게 관련한 정보를 많이 얻을 수 있다고 했어요.
  • Slack communities, Discord communities 활용하기
    슬랙이나 디스코드 커뮤니티를 활용하고, 특정 분야 안에서 사용하는 프로덕트가 궁금하다면 질문해서 추천받는 것도 좋다네요.

Research Template

저는 프로덕트 리서치를 Notion에 아카이브하고 있는데요. 공유가 필요한 경우에 여러 사람과 공유하기도 편리하고 포맷이 자유로워서 Notion을 이용하고 있습니다.

리서치 포맷은 크게 Basic info, General UXUI, Feature UXUI로 나뉘어요. 이미지를 먼저 보시고 아래 내용을 보시면 더 이해가 빠르실 것 같아요.

Roam research 스터디 예시

Basic info

  • B2B/B2C: B2B인지 B2C인지, 둘 다 해당하는지
  • Tags: 모아볼 수 있게 인더스트리나 메인 기능 기반으로 태그
  • One-liner: 한 줄 설명
  • Link: 웹사이트 링크
  • Summary: 프로덕트에 관한 정보 간략하게 메모

General UI・UX (공통)

  • Website — 웹사이트는 SaaS 마케팅의 꽃! 어떤 포인트가 좋았는지
  • Onboarding — 초기에 온보딩을 얼마나 잘하고 있는지
  • Tutorials — 새롭게 기능을 릴리즈할 때, 혹은 초기에 얼마나 기능에 대해 잘 알려주고 있는지
  • Upselling — 유료 고객을 유치하기 위해 업셀링을 얼마나 잘하고 있는지
  • Feedback — 사용자 피드백을 어떻게 잘 받고 있는지

여기서는 스크린샷 위주로 아카이빙 하되 좋은 포인트가 있으면 함께 기록합니다. 사실 저는 웹사이트만 비교하고 싶을 땐 웹사이트만, 온보딩만 보고 싶을 땐 온보딩만 볼 수 있게 각각 다른 페이지에 태그를 달아 모아두고 있어요. 그리고 원본 문서에 링크를 걸어서 찾기 쉽게 해둡니다.

General UIUX Database

Feature UI・UX (프로덕트 특화 기능)

  • 참고하고 싶은 기능 중심으로
  • 프로덕트 메인 기능 중심으로

위의 두 파트는 거의 모든 프로덕트에 적용되는 부분이었다면, 이제 마지막 파트는 프로덕트 특화 기능들을 기록하는 곳입니다. 특정 기능 디자인을 위한 레퍼런스를 찾기 위해 리서치를 진행 중이라면 참고하고 싶은 기능 중심으로, 목적이 따로 없이 스터디를 위해 리서치를 진행 중이라면 해당 프로덕트의 메인 기능을 중심으로 기록합니다.

처음부터 모든 기능을 캡쳐, 기록하려고 하기보다는 한번 프로덕트를 전반적으로 훑어보고 어떤 항목을 기록하고 싶은지 리스트를 작성한 후에 캡쳐하고 넣어두면 편합니다. 이것 또한 사용하면서 정말 좋은 Aha-moment가 있다면 추가로 메모해둡니다.

그리고 이렇게 프로덕트 하나를 전반적으로 스터디하는 것이 아니라 정말 명확하고 디테일한 기능을 디자인하기 위한 리서치를 할 때에는 이렇게 하지 않고 명확한 하나의 주제를 잡고 최대한 다양한 프로덕트에서 레퍼런스를 수집해두는 편이고, 이것은 피그마에 따로 모아둡니다.

+ 마지막 꿀팁

프로덕트 하나를 아카이빙할 때마다 엄청난 스크린샷을 찍습니다. 혹시 맥북 유저라면 꿀팁을 드릴게요! cmd+shift+5를 눌러 캡쳐하면 지정 영역 혹은 지정 윈도우를 캡쳐할 수 있어서 빠르게 일정한 크기로 캡쳐할 수 있어서 좋고, 되도록이면 터미널 세팅에서 파일 확장자를 png에서 jpg로 바꿔두세요! 파일 크기 차이가 크게 나더라고요.

Dataframe에서 리드 프로덕트 디자이너를 채용중입니다. 프로덕트, 마케팅, 개발 팀과 협력하며 Dataframe을 새로운 게임체인저로 만들어가실 ‘리드 프로덕트 디자이너’를 찾고 있습니다.관심 있으시다면 아래 채용 공고를 참고해주세요!
https://jobs.lever.co/Dataframe/52aaec02-3a8d-4c0c-b19f-d54e42600a72

--

--

Jiyu Han
Jiyu Han

No responses yet