인터렉션 가이드 제작 서비스, ActiveGuide
목차
1. 인터렉션 가이드 제작 서비스, ActiveGuide
2. 서비스를 배포하기까지 어떤 과정을 거쳤나요?
3. 가설 검증 결과와 넥스트 액션
지난 추석 연휴, 본가에서 시간이 남아 사이드 프로젝트로 ActiveGuide라는 서비스를 만들었습니다. 꽂히는 아이디어가 있다면 서비스로 만들어 테스트해야 직성이 풀리는 스타일이다 보니, 황금 같은 연휴를 서비스를 만드는 데 시간을 쏟아버렸습니다. 기획, 디자인과 개발까지 1주일 정도가 걸렸고, 10월 9일에 MVP 서비스를 출시했으니 벌써 3주가 지났습니다. 경험을 복기하기 위해, 관련 글을 남깁니다.
ActiveGuide를 인터렉션 가이드를 만드는 SaaS 툴로, 서비스 UI에 인터렉션을 추가한 학습 콘텐츠를 제작할 수 있습니다. 궁극적으로, 유저가 우리 서비스를 더 잘 사용할 수 있도록 도와줍니다.
Interactive : 서비스 UI에서 클릭, 더블클릭, 드래그, 드랍 등 다양한 인터렉션을 통해 학습시켜요
Step By Step : 가이드 목표를 설정하고, 전반적인 과정을 차근차근 따라 하며 학습시켜요.
Share : 링크를 공유해 모든 사람들을 참여시키거나, 패스워드를 설정해 학습자를 지정해요.
Embeded : 기존 운영 중인 노션, 사이트 등에서 생성한 가이드를 임베드해 함께 사용하세요.
SaaS 기업에게 유저 온보딩은 필수적이다.
국내 SaaS 시장은 점점 커지고, 많은 SaaS 서비스가 등장하고 있습니다. B2C 서비스와 다르게, SaaS 기업은 2가지 문제를 동시에 풀어야 합니다.
[1] 유저에게 가치를 줄 수 있는 서비스 만들기
[2] 서비스를 유저가 잘 활용하게 만들기
SaaS 기업은 유저를 충성 고객으로 만들어 지속적으로 서비스를 사용하도록 만들어야 합니다. 이때, 아무리 좋은 기능을 구현해도, 이 기능을 유저가 잘 활용하지 못하면 가치가 온전히 전달되지 못합니다. 많은 SaaS 기업이 가이드 문서, 튜토리얼 영상 등을 운영하는 이유도 이 맥락과 일치합니다. 온보딩 과정을 통해 유저에게 서비스를 학습시킴으로써, 기능을 더 잘 활용하도록 만들기 위함입니다.
국내 SaaS 기업들 중 상당수는 유저의 학습을 돕기 위해 고객 가이드 사이트를 운영합니다. 해당 사이트에는 서비스에서 어떤 기능을 어떻게 활용하는지를 안내합니다. 예를 들어, 노션은 유저들이 노션을 더 잘 활용할 수 있도록 여러 가이드를 제공하고 있습니다.
유저는 '글' 중심의 가이드 문서를 읽지 않는다.
하지만, 많은 SaaS 기업이 유저 온보딩을 위해 만든 가이드 문서는 큰 실효성을 전달하지 못합니다. 주변 지인들에게 물어보니 새로운 툴을 접할 때, 공식 가이드 문서를 처음부터 끝까지 모두 읽는 사람은 찾지 못했습니다. 아마, 이 글을 읽는 분들 중 대다수는 공식 가이드 문서를 세심하게 읽은 경험이 없을 겁니다.
이러한 현상이 일어나는 이유는 당연합니다. 애초에 '공부'란 지루하고 재미가 없는 일입니다. 그렇다고, 큰맘 먹고 공부를 하고자 가이드 문서를 본다고 해도, 글이 빼곡한 문서는 지루하고 재미가 없어서 어느새 읽지 않게 됩니다.
가이드 형식을 '글'이 아닌 '인터렉션'으로 바꾸기
유저가 가이드 문서에 몰입하지 않는 이유는 '글'이란 형식 때문입니다. 글은 정보를 일방향으로 전달하는 수동적 방식입니다. 그래서 가이드 문서의 형식을 상호작용 중심으로 바꿔야 해당 문제를 해결하리라 판단했습니다. (1) 서비스 UI를 보여주고 (2) 여기서 인터렉션을 하면서 차근차근 학습하는 방식의 가이드를 제작할 수 있는 툴을 만들기로 했습니다.
기업 고객, 일반 고객을 모두 검증해야 한다.
가이드 문서 제작 툴의 핵심 이해 관계자는 '기업 고객'과 '일반 고객'입니다. 서비스를 구매하는 건 기업 고객이지만, 기업 고객은 서비스의 가치를 일반 고객의 학습 유효도에 의해 평가합니다. 즉, 가이드 문서 제작 툴의 가치는 "일반 고객을 학습하는 데 얼마나 영향을 주는가?"에 의해 결정됩니다. 그래서 기업 고객과 일반 고객, 각각 가설을 설정했습니다.
기업 고객 가설
- 가설 : 기업은 가이드 문서에서 인터렉션 요소가 있다면, 온보딩에 효과적이라 생각할 것이다.
- 핵심 지표 : 가이드 생성률 (= 기업 이메일로 가입한 유저의 가이드 생성 수 / 기업 이메일로 가입한 유저의 수 )
일반 고객 가설
- 가설 : 일반 고객은 서비스 UI와 인터렉션 하면서 배우는 방식에 더 큰 몰입력을 가질 것이다.
- 핵심 지표 : 가이드 완주율 (= 배포 가이드 최종 완료 유저 / 배포 가이드 시작 유저)
필요한 기능을 리스팅 하고, 검증 가설에 맞춰서 우선순위를 분류했습니다.
우선순위 High
- 기업 유저는 가이드를 저장하는 워크스페이스를 개설할 수 있다.
- 기업 유저는 시나리오 형식으로 가이드를 개설할 수 있다.
- 기업 유저는 가이드를 나눌 수 있는 하위 챕터를 만들 수 있다.
- 기업 유저는 챕터 안에 보여줄 서비스 UI를 등록할 수 있다.
- 기업 유저는 서비스 UI 위에 인터렉션 포인트를 지정할 수 있다.
- 기업 유저는 인터렉션 포인트에 상세 설명을 추가할 수 있다.
- 기업 유저는 가이드 제작을 완료하면, 이를 배포할 수 있는 링크를 생성할 수 있다.
- 일반 유저는 가이드를 처음 접속할 때, 가이드에 대한 정보를 가장 먼저 확인한다.
- 일반 유저는 공유받은 링크에 접속해 설정된 시나리오에 따라 인터렉션 포인트를 클릭 해야 한다.
- 일반 유저는 가이드를 끝까지 완료하면, 가이드가 종료됐다는 안내받는다.
우선순위 Mid
- 기업 유저는 인터렉션 포인트에 유형(Ex. 스크롤, 더블 클릭)을 설정할 수 있다.
- 기업 유저는 인터렉션 포인트에 추가된 설명과 관련된 링크를 추가할 수 있다.
- 기업 유저는 배포한 가이드에 비밀번호를 설정할 수 있다.
- 일반 유저는 배포 링크의 메타 태그에서 가이드 정보를 확인할 수 있다.
- 일반 유저는 매 챕터를 시작할 때, 해당 챕터에서 무엇을 배우는지 알 수 있다.
우선순위 Low
- 기업 유저는 워크스페이스 이름과 로고를 변경할 수 있다.
- 기업 유저는 개설된 워크스페이스에 팀원을 초대할 수 있다.
- 기업 유저는 워크스페이스에 초대된 팀원에게 관리자 혹은 일반 유저 권한을 설정할 수 있다.
- 기업 유저는 자신의 닉네임과 프로필 이미지를 설정할 수 있다.
- 기업 유저는 관리자 권한으로 있는 워크스페이스의 플랜을 설정할 수 있다.
최대한 낮은 리소스로 빠르게 빌드하기
테스트 목적의 서비스이기에 설계 및 개발은 최대한 리소스를 줄이는 방향으로 갔습니다. UI 디자인은 투두몰 UI를 최대한 활용해 리소스를 줄였고, 구조만 잡기 위해 데이터베이스 모델링을 진행했습니다. 로직과 정책은 사전에 정의하지 않고, 서비스를 빌드하면서 잡아가기로 했습니다.
대략적인 설계 방향을 잡은 후, 버블을 활용해 개발을 완료했습니다. 참고로 버블은 프론트와 백엔드 작업을 코딩 없이 도와주는 노코드 툴입니다.
마지막으로 여러 엣지 케이스를 고려한 추가 대응 로직을 구현해 서비스 빌드를 완료했습니다.
[예시 1] 워크스페이스에 초대받지 않은 사람이 URL을 입력해 들어간다면, 어떻게 해야 하는가?
[로직 1] workspace_member에 현재 유저가 없다면, 루트 페이지로 리다이렉트 시킨다.
[예시 2] 패스워드를 설정해 가이드를 배포했다. 유저가 가이드 시작 페이지에서 패스워드를 입력하고 학습 페이지로 넘어간 게 아니라, URL을 직접 입력해 학습 페이지에 들어온다면, 어떻게 해야 하는가?
[로직 2] 학습 페이지 이동 시, password 파라미터를 전달 + 해당 파라미터의 값이 유효하지 않으면 가이드 시작 페이지로 리다이렉트 시킨다.
핵심 지표를 어떻게 수집할까?
서비스를 모두 완성한 후, 가설 검증을 위해 핵심 지표 데이터를 어떻게 수집할지 고민했습니다.
핵심 지표
- 기업 고객의 가이드 생성률 (= 기업 이메일로 가입한 유저의 가이드 생성 수 / 기업 이메일로 가입한 유저의 수 )
- 일반 고객의 가이드 완주율 (= 배포 가이드 최종 완료 유저 / 배포 가이드 시작 유저)
[가이드 생성률] 지표는 아래 방식으로 확인하기로 했습니다.
1. 유저 테이블에서 기업 이메일 확인
2. 해당 기업 이메일이 개설한 워크스페이스 확인
3. 해당 워크스페이스가 보유한 가이드 확인
배포한 가이드는 일반 유저가 회원가입 없이 확인할 수 있는 공유 링크로 접속하기 때문에 [가이드 완주율] 지표는 데이터베이스에 저장된 데이터로 확인할 수 없었습니다. 따라서, GA와 GTM을 활용해 가이드가 시작될 때와 종료될 때의 이벤트 데이터를 수집하도록 설정했습니다.
1. 가이드 시작 페이지가 실행되면 "guide_start" 이벤트 데이터 수집
2. 가이드 종료 페이지에서 실행되면 "guide_end" 이벤트 데이터 수집
실험을 위한 최소 모수를 어떻게 모으지?
데이터 수집 환경까지 세팅한 엑티브 가이드를 배포했고, 아래 방식으로 초기 홍보를 진행했습니다. 커뮤니티 업로드는 홍보 지속성이 매우 짧기에, 꾸준한 유입이 발생하는 노션박스를 최대한 활용하기로 했습니다.
1. 창업 커뮤니티(디스콰이엇, EOPlanet)에 홍보 글을 업로드해 관심 기업 유입시키기
2. 노션박스 사이트에 제작한 가이드를 보여줘 일반 유저에게 체험시키고, 전환 유도하기
기업 고객 가설
- 가설 : 기업은 가이드 문서에서 인터렉션 요소가 있다면, 온보딩에 효과적이라 생각할 것이다.
- 핵심 지표 : 가이드 생성률 (= 기업 이메일로 가입한 유저의 가이드 생성 수 / 기업 이메일로 가입한 유저의 수 )
- 결론 : 실험 설계가 잘못 됐다. 기업의 "기존 가이드 사이트 유무"라는 변수를 제거해야 한다.
16명이 회원가입을 했고, 이 중에서 기업 이메일로 가입한 유저는 3명이었습니다. 그리고, 기업 이메일로 가입한 유저가 만든 가이드는 3개였습니다. 가이드 생성률은 100%를 달성했습니다. 다만, 모두가 생성한 가이드를 배포하지는 않았습니다. 단순한 호기심으로 가이드를 생성하고, 완성은 하지 않았는지 확인해 보니 확인했습니다. 페이지와 인터렉션 테이블에서 데이터를 확인하니 가이드는 모두 완성된 상태였습니다. 즉, 가이드를 완성했지만 배포 처리를 하지 않았습니다.
해당 기업들의 사이트를 들어가 보니 (1) 이미 노션을 활용해 가이드 사이트를 운영하고 있거나 (2) 가이드 문서 자체가 없는 기업이었습니다. (2)의 기업은 완성한 가이드를 배포 처리하지 않은 게 당연하며, (1)의 기업은 새로운 가이드 제작 툴을 도입하는 데 허들이 있을 수밖에 없었습니다. 즉, "기존 가이드 사이트의 유무"라는 변수를 고려하지 못한 채로 실험을 설계한 셈입니다.
일반 고객 가설
- 가설 : 일반 고객은 서비스 UI와 인터렉션 하면서 배우는 방식에 더 큰 몰입력을 가질 것이다.
- 핵심 지표 : 가이드 완주율 (= 배포 가이드 최종 완료 유저 / 배포 가이드 시작 유저)
- 결론 : 가설은 참이다. 완주율도 괜찮고, 뒷부분으로 갈수록 전환율이 더 높아진다.
노션박스에 임베드한 가이드를 총 397명이 학습을 시작했고, 이 중에서 가이드를 끝까지 확인한 사람은 56명이었습니다. 즉, 가이드 완주율은 약 14%에 이릅니다. 심지어 각 챕터별 전환율을 확인해 보니, 학습이 길어질수록 전환율은 오히려 높아지는 걸 확인했습니다. 해당 지표로 일반 고객 가설은 맞다고 판단했습니다.
챕터 1 시작 (=가이드 시작) : 397명
챕터 1 완료 : 166명 / 이전 퍼널 전환율 42% / 전체 퍼널 전환율 42%
챕터 2 완료 : 85명 / 이전 퍼널 전환율 51% / 전체 퍼널 전환율 21%
챕터 3 완료 : 70명 / 이전 퍼널 전환율 82% / 전체 퍼널 전환율 18%
챕터 4 완료(=가이드 종료) : 56명 / 이전 퍼널 전환율 80% / 전체 퍼널 전환율 14%
우선 서비스를 현재 상태로 유지하고, 해당 실험을 1개월 정도 더 지속하기로 했습니다. 그리고, 기업 고객 가설을 검증하기 위해선 "기존 가이드 사이트의 유무" 변수를 없애야만 합니다. 그렇지 않으면, 인터렉션 요소를 고려하기도 전에, 기존에 운영 중인 가이드가 있기에 인터렉션 가이드를 도입하기 어렵다고 단정 지을 수 있기 때문입니다.
따라서, "기존에 운영 중인 가이드 사이트와 함께 사용할 수 있다"를 인식시키기로 했습니다. 여러 기업이 가이드 사이트를 노션으로 제작해 활용해 운영하고 있습니다. 따라서, 노션으로 이미 제작한 가이드 사이트 안에 인터렉션 가이드를 임베드할 수 있도록 기능을 추가했습니다.
또한, 홈페이지에 "노션 웹사이트에 임베드가 가능하다"라는 소개 영역을 추가하고, 메타 태그에 "노션에 인터렉션 가이드를 임베드하세요!"라는 문구를 강조했습니다.
Famelee가 국내 버블 유저를 위해 사이드 프로젝트를 시작했습니다. 공식 문서 번역부터 다양한 국내 플러그인과 버블 서비스 레퍼런스를 만나보세요
이렇게 빠르게 서비스를 만들어
실험하고 싶은 능력과 경험을 기르고 싶다면
[노코드로 나만의 서비스 만들기] 강의를 찾아주세요!
(2기 모집 종료 : ~ 23.11.12)