Reliv
반복되는 테스트 과정 줄이기
릴리브는 코드 없이 웹 제품 테스트를 자동화하는 툴입니다. 원하는 사이트를 띄우고 테스트를 하면 동작들을 자동으로 기록합니다. 반복되는 행동을 줄여 테스트 시간을 단축한 사례를 소개합니다.
회사
릴리브 AI
역할
디자인 리드
분야
Dev Tool, SaaS
작업 시기
2023 - 2024
Reliv
반복되는 테스트 과정 줄이기
릴리브는 코드 없이 웹 제품 테스트를 자동화하는 툴입니다. 원하는 사이트를 띄우고 테스트를 하면 동작들을 자동으로 기록합니다. 반복되는 행동을 줄여 테스트 시간을 단축한 사례를 소개합니다.
회사
릴리브 AI
역할
디자인 리드
분야
Dev Tool, SaaS
작업 시기
2023 - 2024
Reliv
반복되는 테스트 과정 줄이기
릴리브는 코드 없이 웹 제품 테스트를 자동화하는 툴입니다. 원하는 사이트를 띄우고 테스트를 하면 동작들을 자동으로 기록합니다. 반복되는 행동을 줄여 테스트 시간을 단축한 사례를 소개합니다.
회사
릴리브 AI
역할
디자인 리드
분야
Dev Tool, SaaS
작업 시기
2023 - 2024



왜 테스트 자동화인가요?
90%가 수동으로 테스트
소프트웨어 테스트에 들어가는 비용은 2022년 기준으로 약 58조 원 규모로, 그 중 무려 90%가 수동 테스트를 위한 인건비로 지출 되었습니다. 다시 말해 대부분의 경우 사람이 직접 제품을 클릭하며 테스트를 하고 있었습니다.
왜 테스트 자동화인가요?
90%가 수동으로 테스트
소프트웨어 테스트에 들어가는 비용은 2022년 기준으로 약 58조 원 규모로, 그 중 무려 90%가 수동 테스트를 위한 인건비로 지출 되었습니다. 다시 말해 대부분의 경우 사람이 직접 제품을 클릭하며 테스트를 하고 있었습니다.
왜 테스트 자동화인가요?
90%가 수동으로 테스트
소프트웨어 테스트에 들어가는 비용은 2022년 기준으로 약 58조 원 규모로, 그 중 무려 90%가 수동 테스트를 위한 인건비로 지출 되었습니다. 다시 말해 대부분의 경우 사람이 직접 제품을 클릭하며 테스트를 하고 있었습니다.
인건비
90.0%
기타
10.0%
목표
자동화 구축 시간을 줄이자
20개의 팀 인터뷰를 통해 테스트를 작성하면서 어떤 어려움이 있는지를 파악했습니다. 그 중 핵심적인 문제로 자동화 구축을 위해 리소스가 너무 많이 든다는 것, 그리고 유지 보수가 어렵다는 점을 발견했습니다. 이 중 테스트 구축에 드는 시간을 단축하는 것을 디자인의 핵심 과제로 잡아 누구나 사용할 수 있는 쉽고 직관적인 노코드 툴을 만드는 것을 목표로 삼게 되었습니다.
Problem
녹음과 재생을 한 화면에서 할 수 없다
이에 노코드 기반의 테스팅 툴을 만들고 있는 경쟁사들을 리서치 했습니다. 리서치를 통해 경쟁 제품들에서 테스트를 만드는 것이 상당히 어렵고 비효율적인 것을 발견할 수 있었습니다. 특히 한 제품에서는 수정 페이지와 플레이 페이지가 나뉘어져 수정한 내용을 확인하기 위해 플레이 페이지로 반복적으로 이동해야만 했습니다.
목표
자동화 구축 시간을 줄이자
20개의 팀 인터뷰를 통해 테스트를 작성하면서 어떤 어려움이 있는지를 파악했습니다. 그 중 핵심적인 문제로 자동화 구축을 위해 리소스가 너무 많이 든다는 것, 그리고 유지 보수가 어렵다는 점을 발견했습니다. 이 중 테스트 구축에 드는 시간을 단축하는 것을 디자인의 핵심 과제로 잡아 누구나 사용할 수 있는 쉽고 직관적인 노코드 툴을 만드는 것을 목표로 삼게 되었습니다.
자동화 구축의 어려움
자동화 구축의 어려움
테스트 자동화 개발 리소스 부재
테스트 자동화 개발 리소스 부재
비개발자 테스트시 8시간+ 소요
비개발자 테스트시 8시간+ 소요
개발자 없이 테스트 자동화 어려움
개발자 없이 테스트 자동화 어려움
누구나 사용 할 수 있는 노코드 툴
누구나 사용 할 수 있는 노코드 툴
직관적인 테스트 편집 및 재생 UX
쉽고 직관적인 테스트 편집 및 재생 UX



기록



편집



재생
핵심 기능
직관적인 테스트 기록, 편집, 재생
페이지를 수차례 오가는 비효율을 막기 위해 한 페이지에서 기록, 편집, 재생을 모두 할 수 있게 했습니다. 기능 3개를 한 인터페이스에 담는 만큼 여러가지 케이스를 고려한 세심한 UX 설계가 필요했습니다. 모든 케이스의 인터랙션을 프로토타입으로 구현하고, 내부 피드백을 주고 받으며 여러 개선 과정을 거쳐 디자인을 완성했습니다.
핵심 기능
직관적인 테스트 기록, 편집, 재생
페이지를 수차례 오가는 비효율을 막기 위해 한 페이지에서 기록, 편집, 재생을 모두 할 수 있게 했습니다. 기능 3개를 한 인터페이스에 담는 만큼 여러가지 케이스를 고려한 세심한 UX 설계가 필요했습니다. 모든 케이스의 인터랙션을 프로토타입으로 구현하고, 내부 피드백을 주고 받으며 여러 개선 과정을 거쳐 디자인을 완성했습니다.
핵심 기능
직관적인 테스트 기록, 편집, 재생
페이지를 수차례 오가는 비효율을 막기 위해 한 페이지에서 기록, 편집, 재생을 모두 할 수 있게 했습니다. 기능 3개를 한 인터페이스에 담는 만큼 여러가지 케이스를 고려한 세심한 UX 설계가 필요했습니다. 모든 케이스의 인터랙션을 프로토타입으로 구현하고, 내부 피드백을 주고 받으며 여러 개선 과정을 거쳐 디자인을 완성했습니다.



개선
상태 변화를 시각적으로 인지 시키기
처음에는 기록의 시작을 아이콘의 변경으로도 충분히 인지할 수 있을 것이라 생각했지만 아니었습니다. 제품을 사용하는 고객을 관찰하니 기록 버튼을 눌러도 기록이 시작되지 않는 것으로 착각해 당황해 하는 것을 확인 할 수 있었습니다. 상태 변경이 직관적으로 보여질 수 있는 시각적 힌트가 필요하다고 판단, 정지 버튼의 배경색을 기록 버튼과 구별되는 흰색으로 변경 하였습니다.
개선
상태 변화를 시각적으로 인지 시키기
처음에는 기록의 시작을 아이콘의 변경으로도 충분히 인지할 수 있을 것이라 생각했지만 아니었습니다. 제품을 사용하는 고객을 관찰하니 기록 버튼을 눌러도 기록이 시작되지 않는 것으로 착각해 당황해 하는 것을 확인 할 수 있었습니다. 상태 변경이 직관적으로 보여질 수 있는 시각적 힌트가 필요하다고 판단, 정지 버튼의 배경색을 기록 버튼과 구별되는 흰색으로 변경 하였습니다.
개선
상태 변화를 시각적으로 인지 시키기
처음에는 기록의 시작을 아이콘의 변경으로도 충분히 인지할 수 있을 것이라 생각했지만 아니었습니다. 제품을 사용하는 고객을 관찰하니 기록 버튼을 눌러도 기록이 시작되지 않는 것으로 착각해 당황해 하는 것을 확인 할 수 있었습니다. 상태 변경이 직관적으로 보여질 수 있는 시각적 힌트가 필요하다고 판단, 정지 버튼의 배경색을 기록 버튼과 구별되는 흰색으로 변경 하였습니다.
문제
어떻게 하면 반복적인 기록을 줄일 수 있을까?
테스트를 하다 보면 매번 동일하게 발생하는 시나리오가 있습니다. 로그인이 대표적인 예시입니다. 기존에는 테스트를 할 때마다 반복적으로 아이디와 패스워드를 입력해 로그인을 해야만 했습니다. 또, 만약 같은 기능에서 다른 권한을 가진 계정이 각각 의도한 대로 작동 하는지 확인 하려면 같은 동작임에도 불구하고 테스트를 여러번 반복해야 합니다.
Problem
어떻게 하면 반복적인 녹음을 줄일 수 있을까?
테스트를 하다보면 반복적으로 발생하는 시나리오가 있습니다. 대표적으로 로그인이 그 예시입니다. 하지만 기존에는 테스터들이 시나리오들을 새로 테스트할 때마다 반복적으로 로그인을 해야만 했습니다. 만약, 로그인을 할 때 권한 별로 다르게 로그인을 한다고 하면 이 문제는 더 커지게 됩니다.
문제
어떻게 하면 반복적인 기록을 줄일 수 있을까?
테스트를 하다 보면 매번 동일하게 발생하는 시나리오가 있습니다. 로그인이 대표적인 예시입니다. 기존에는 테스트를 할 때마다 반복적으로 아이디와 패스워드를 입력해 로그인을 해야만 했습니다. 또, 만약 같은 기능에서 다른 권한을 가진 계정이 각각 의도한 대로 작동 하는지 확인 하려면 같은 동작임에도 불구하고 테스트를 여러번 반복해야 합니다.
관리자 시나리오
관리자 시나리오
로그인
로그인
관리자 ID 입력
관리자 ID 입력
관리자 패스워드 입력
관리자 패스워드 입력
파일 조회
파일 조회
파일 수정
파일 수정
편집자 시나리오
편집자 시나리오
로그인
로그인
편집자 ID 입력
편집자 ID 입력
편집자 패스워드 입력
편집자 패스워드 입력
파일 조회
파일 조회
파일 수정
파일 수정
조회자 시나리오
로그인
조회자 ID 입력
조회자 패스워드 입력
파일 조회
파일 편집 (X)
외부인 시나리오
로그인
외부인 ID 입력
외부인 패스워드 입력
파일 조회 (X)
파일 편집 (X)






해결
기존 기록을 재활용하는 Action Block
액션 블록은 마치 노션의 블록 기능처럼 기존의 기록을 불러와 다시 사용 할 수 있는 기능입니다. 예를 들어 로그인 기능을 액션 블록으로 만들어 두면 매번 로그인을 하지 않고 테스트를 진행할 수 있습니다. 또한 Variable 기능을 사용하면 액션 블록별로 로그인 이메일과 비밀번호를 다르게 설정할 수 있어 여러 시나리오를 편리하게 테스트 할 수 있습니다.
해결
기존 기록을 재활용하는 Action Block
액션 블록은 마치 노션의 블록 기능처럼 기존의 기록을 불러와 다시 사용 할 수 있는 기능입니다. 예를 들어 로그인 기능을 액션 블록으로 만들어 두면 매번 로그인을 하지 않고 테스트를 진행할 수 있습니다. 또한 Variable 기능을 사용하면 액션 블록별로 로그인 이메일과 비밀번호를 다르게 설정할 수 있어 여러 시나리오를 편리하게 테스트 할 수 있습니다.
해결
기존 기록을 재활용하는 Action Block
액션 블록은 마치 노션의 블록 기능처럼 기존의 기록을 불러와 다시 사용 할 수 있는 기능입니다. 예를 들어 로그인 기능을 액션 블록으로 만들어 두면 매번 로그인을 하지 않고 테스트를 진행할 수 있습니다. 또한 Variable 기능을 사용하면 액션 블록별로 로그인 이메일과 비밀번호를 다르게 설정할 수 있어 여러 시나리오를 편리하게 테스트 할 수 있습니다.
성과
프로덕트헌트 일간 2위, 359명의 유저 및 5개 기업 고객 확보
릴리브를 프로덕트 헌트에 런칭한 후 많은 사람들의 관심을 받아 일간 2위 제품에 선정되었습니다. 여기에서 유입된 다양한 국가의 사용자들이 생겼고, 런칭 3개월 만에 359명의 유저와 5개의 기업 고객을 확보 하였습니다.
성과
프로덕트헌트 일간 2위, 359명의 유저 및 5개 기업 고객 확보
릴리브를 프로덕트 헌트에 런칭한 후 많은 사람들의 관심을 받아 일간 2위 제품에 선정되었습니다. 여기에서 유입된 다양한 국가의 사용자들이 생겼고, 런칭 3개월 만에 359명의 유저와 5개의 기업 고객을 확보 하였습니다.
성과
프로덕트헌트 일간 2위, 359명의 유저 및 5개 기업 고객 확보
릴리브를 프로덕트 헌트에 런칭한 후 많은 사람들의 관심을 받아 일간 2위 제품에 선정되었습니다. 여기에서 유입된 다양한 국가의 사용자들이 생겼고, 런칭 3개월 만에 359명의 유저와 5개의 기업 고객을 확보 하였습니다.