요약: 누구나 가상 기기를 활용해 페이 서비스를 쉽게 테스트할 수 있는 플랫폼, 멀티버스를 소개합니다.
💡 리뷰어 한줄평
dean.cool 크루마다 사용 목적은 다르지만 필요는 같은 도구, 그게 바로 멀티버스
dale.hyuk 협업하는 동료도 고객으로 생각하고 제품을 만든 게 인상 깊었어요! 멀티버스 너무 유용하게 잘 사용하고 있어요.
시작하며
안녕하세요, 카카오페이 클라이언트 플랫폼 팀에서 iOS 개발을 하고 있는 헤이즐입니다!
서비스를 개발하면서 우리는 늘 ‘테스트’라는 과정을 거칩니다. 그런데 혹시 테스트를 하면서 이런 경험 없으셨나요?
👩🏻💻 서버/FE 개발자: 샌박에서 배포된 형상 확인하려고 하는데, 샌박 앱 설치 어떻게 하나요?
💁 기획자: 개발 중인 기능을 테스트하기 위해 여러 버전의 앱을 설치하고 제거해야 하는 과정이 번거로워요.
👩🏼🎨 디자이너: 다양한 해상도에서 디자인 검수를 하기 위해 여러 기기들이 필요해요.
이러한 어려움은 비단 저희 팀만의 문제는 아닐 겁니다. 다양한 환경에서의 테스트는 필수적이지만, 이를 위한 환경 구축은 생각보다 많은 시간과 비용을 투자해야 합니다.
저희 카카오페이 클라이언트 플랫폼 팀은 이러한 문제를 해결하고자 사내 테스트 플랫폼 멀티버스를 개발했습니다.
멀티버스는 테스트 기기 없이 맥북 하나로 다양한 환경에서 앱을 테스트할 수 있도록 가상 기기를 제공하고, 가상 기기에서 사용할 수 있는 여러 가지 테스트 편의 기능을 지원하는 macOS 앱입니다.
이 글에서는 멀티버스를 통해 저희가 앞선 문제들을 어떻게 해결했는지, 그리고 멀티버스가 어떤 가치를 창출하고 있는지를 공유하고자 합니다.
멀티버스 개발 배경
-
테스트 기기 부족 및 관리 비용
모바일 서비스를 개발하신 분들이라면 한 번쯤은 테스트 기기를 찾아 헤맨 경험이 있으실 거라 생각합니다. 같은 코드라도 실행되는 OS 버전이나 기기 종류에 따라 결과가 다르게 나올 수 있기 때문에, 다양한 환경에서 동작을 확인하는 과정이 반드시 필요합니다. 하지만 테스트 기기는 늘 부족합니다. 필요한 순간에 원하는 기기를 찾지 못해 동료들에게 빌리러 다니거나, 아예 보유하지 못한 기기는 테스트 자체가 불가능하기도 합니다.
이런 문제를 해결하기 위해 저희 팀에서는 개발자들의 테스트 기기 보유 현황을 문서화하여 테스트 기기를 쉽게 빌릴 수 있도록 하거나, 각 테스트 기기마다 OS 업데이트를 제한해 최대한 다양한 OS의 기기를 보유할 수 있도록 관리하였습니다. 하지만 이런 방식은 관리 비용이 많이 소모되었고 문제의 근본적인 해결책이 되지는 못했습니다.
-
다양한 버전에서의 테스트
개발을 하다 보면 기존 버전과의 동작을 비교해야 하는 경우가 종종 생기는데요. 특정 버전에서 테스트를 하기 위해선 해당 버전의 브랜치로 다시 돌아가서 새로 빌드를 해야 하는데 이런 방식은 시간이 오래 걸려 불편함이 있었습니다. 특히 비개발 직군의 경우 특정 버전의 빌드를 직접 구해서 기기에 재설치하는 과정을 반복해야 하기 때문에 더욱 큰 불편함을 겪었습니다.
멀티버스에서는 바로 이런 현실적인 불편함들을 해결하고 오직 테스트와 서비스 개발에만 집중할 수 있도록 돕는 것을 목표로 개발되었습니다.
멀티버스 주요 기능
서비스를 개발할 때마다 겪는 이런 불편함들을 어떻게 해결할 수 있을까요? 사실 모바일 개발자들은 이에 대한 해답을 알고 있습니다.
바로 시뮬레이터(Simulator)나 에뮬레이터(Emulator)와 같은 가상 기기를 사용하는 것이죠. 모바일 개발자들은 자신의 맥북에서 실제 기기 없이도 앱을 빌드하고, 다양한 OS 버전과 기기 환경에서 손쉽게 기능을 확인하며 테스트를 진행합니다. 실제 기기를 연결하고 세팅하는 번거로운 과정 없이, 코드 수정부터 결과 확인까지의 과정을 매우 빠르게 가져가는 것입니다.
만약 모바일 앱 개발뿐만 아니라 다양한 서비스 개발 환경에서도 이러한 가상 기기를 손쉽게 사용할 수 있다면 어떨까요? 멀티버스에서는 이렇게 맥북에서 사용할 수 있는 가상 기기를 제공하고, 이 기기들을 통해 서비스를 테스트할 수 있는 다양한 테스트 유틸 기능을 제공합니다.
가상 기기의 정식 명칭은 iOS는 시뮬레이터, Android는 에뮬레이터이지만 이 글에서는 통칭하여 가상 기기라고 부르겠습니다.
지금부터 멀티버스만을 활용하여 아이폰 17 에어 기기에서 카카오페이 앱을 테스트하는 과정으로 멀티버스의 주요 기능을 소개하겠습니다.
1. 환경 구축
가상 기기를 사용하려면 iOS, Android 개발 환경을 갖춰야 합니다. 하지만 이런 환경 설정 과정은 모바일 개발자가 아니면 이해하기 어렵고, 개발자에게도 시간이 꽤나 소요됩니다.
멀티버스는 클릭 한 번으로 가상 기기 사용에 필요한 도구들을 자동으로 세팅해 줍니다. 사용자는 별도의 설정 없이 바로 가상 기기를 실행할 수 있습니다.
2. 가상 기기 생성 및 관리
환경 설치가 완료되었다면, 이제 가상 기기를 사용할 준비를 마쳤습니다!
원하는 OS와 기기 조합을 직접 고르고, 생성하기 버튼만 누르면 됩니다. 저는 디바이스로는 아이폰 17 에어를 선택했고, OS 버전은 iOS26을 선택하여 새 가상 기기를 생성했습니다.
생성된 가상 기기는 멀티버스 안에서 한눈에 확인할 수 있고, 실행·종료·삭제 같은 관리 작업도 간단하게 할 수 있습니다. 원래는 이런 기능을 사용하기 위해서 복잡한 개발자 툴을 설정하거나, 터미널 명령어를 사용했어야 했는데 멀티버스가 있다면 더 이상 그런 과정이 필요하지 않습니다.
3. 앱 설치 및 실행
앱 센터 메뉴에서는 가상 기기에 손쉽게 내가 원하는 버전의 앱을 설치할 수 있습니다. 현재는 카카오페이, 카카오톡, 사장님플러스 같은 앱을 지원하고 있으며, 향후 다양한 공동체 앱과 개발용 샘플 앱을 지원할 예정입니다.
카카오페이 최신 버전인 25.8.0을 설치했고, 카카오톡 로그인을 위해 카카오톡도 함께 설치했습니다.
최종 배포 버전이 아니라 특정 브랜치나 태그 버전의 앱을 테스트하고 싶다면 직접 설치 기능을 통해 특정 버전의 앱을 설치할 수 있습니다. 원하는 버전의 앱 설치 파일을 다운로드하고 이를 멀티버스에 업로드하면 됩니다.
4. 테스트 편의 기능
이렇게 앱 설치 과정을 마쳤다면 이제 설치된 앱을 이용해 실제 서비스를 테스트해야겠죠. 멀티버스에서는 가상 기기에서 활용할 수 있는 다양한 유틸 기능도 함께 제공해 테스트 편의성을 높이고자 했습니다.
딥 링크 실행
앱 내에서 특정 딥 링크를 실행하고 싶을 때, 딥 링크 주소만 입력하면 원하는 가상 기기에서 바로 실행할 수 있고, 해당 링크가 유효한 주소인지 검증하고 링크 정보를 확인할 수 있습니다.
화면 캡처와 녹화
테스트 중 필요한 화면을 바로 캡처하거나 영상으로 녹화해 맥북에 바로 저장하고 확인할 수 있습니다. 이미지를 다운로드하거나 복사하여 업무용 툴에 편하게 공유할 수 있도록 합니다.
실시간 이벤트 로그 확인
실 기기에서 이벤트 로그(사내 사용자 행동 로그 시스템)를 멀티버스 내에서 실시간으로 확인할 수 있습니다. 기존에는 이벤트 로그를 확인하기 위해 테스트 기기에서 인터넷 DNS 설정 등 사전 설정이 필요했지만, 멀티버스에서는 별도의 세팅 없이도 가상 기기의 사용자 행동 로그를 실시간으로 확인할 수 있습니다.
멀티버스 활용 사례
이런 멀티버스를 카카오페이 내에서 동료들이 어떻게 활용하고 있는지, 그 이야기를 직접 들어보았습니다!
1. 다양한 기기에서의 테스트
멀티버스에서는 원하는 기기와 OS의 조합으로 자유롭게 가상 기기를 만들고 테스트할 수 있기 때문에, 다양한 직군의 사용자들이 이를 활용하고 있습니다.
멀티버스를 실제로 사용해 주신 분들의 의견을 들어보면
👩🏻💻 FE 개발자: 개인 폰이 iOS여서 안드로이드 앱 테스트가 어려웠는데, 멀티버스를 활용하면 확인하기 편해요
💁 기획자: 서버 배포 후 다양한 버전에서의 클라이언트 형상을 확인하기 편리해요
👩🏼🎨 디자이너: 여러 디바이스를 동시에 띄워 놓고 볼 수 있어서, 다양한 해상도에서 디자인 검수를 하기 좋아요
라는 의견을 주셨습니다.
2. 웹 디버깅
웹 개발을 하다 보면 모바일 기기에서의 동작을 확인하고 디버깅해야 할 때가 많습니다. 보통 실제 기기를 맥북에 USB 케이블로 연결하여 Safari, Chrome 브라우저를 통해 웹 인스펙터 기능을 이용하는데요. 사내 환경에서 실 기기를 맥북에 연결하기 위해서는 여러 가지 복잡한 사전 절차가 필요합니다.
하지만 가상 기기를 이용하면 이런 사전 세팅 없이 바로 웹 디버깅을 할 수 있습니다. 아이폰 가상 기기를 예시로 살펴보겠습니다.
사파리 브라우저를 열고 상단 메뉴 막대의 개발자용 (Develop) 메뉴를 클릭하면 메뉴 아래에 연결된 기기의 이름이 나타납니다. 멀티버스에서 추가한 가상 기기를 선택하면, 해당 기기에서 열린 웹 페이지 목록이 표시됩니다.
디버깅하고자 하는 웹 URL에 접속하면 사파리 브라우저에서 웹 인스펙터가 열리며 화면을 디버깅할 수 있습니다.
향후 계획
멀티버스는 단순히 가상 기기를 제공하는 앱이 아닙니다. 더 나아가 모든 직군이 활용할 수 있는 다양한 테스트 및 유틸 기능을 제공하는 하나의 플랫폼을 지향합니다.
따라서 현재 버전에서 더 나아가서, 다음과 같은 기능들을 추가할 예정입니다.
-
확장된 로그 콘솔
현재는 사용자 행동 로그만 확인할 수 있지만 앞으로는 OS 로그, 네트워크 로그, RUM 등 다양한 로그를 종류별로 쉽게 확인할 수 있도록 지원할 예정입니다. 더 이상 로그를 확인하기 위해 앱을 직접 빌드하는 불편함을 해소하고, 클라이언트 개발자 이외의 모든 직군이 편하게 로그를 확인하기 위함입니다.
-
사내 테스트 도구 및 어드민 연계
기존에 사내에서 제공되고 있던 여러 가지 테스트 도구들이 있는데요, 다양한 팀에서 서로 다른 도메인으로 제공되다 보니 아는 사람들만 사용하고 있는 경우가 있습니다. 멀티버스에서 이런 사내 도구들을 모아보고 바로 이동할 수 있는 기능을 제공할 예정입니다.
또 기존에 어드민 페이지에서만 할 수 있었던 테스트 계정 확인, 계정 정보 설정 등의 작업들도 멀티버스 내에서 지원할 계획입니다.
-
직군별 테스트 편의기능 제공
같은 서비스를 개발해도 각 직군별로 확인하고자 하는 부분이 다른데요. 멀티버스 사용자의 직군 정보를 받아서 각 직군에 특화된 테스트 기능을 제공하고자 합니다. 예를 들어 디자이너는 가상 기기 화면의 각 컴포넌트를 정보를 디버깅하거나, Figma 화면과 가상 기기 화면을 겹쳐서 비교할 수 있는 기능을 제공할 수 있습니다. BE, FE 개발자는 API 요청, 응답을 프록시하여 개발 테스트할 수 있는 기능, iOS 개발자는 Xcode 프로젝트 세팅이나 Provisioning 인증서 설정과 같은 환경 설정을 쉽게 해주는 기능을 제공하려고 합니다.
마치며
테스트 기기를 찾아 헤매고, 복잡한 테스트 환경 설정에 시간을 허비했던 경험. 우리 모두가 한 번쯤은 겪었던 이 불편함이 바로 멀티버스의 시작이었습니다. 만약 저희와 비슷한 문제로 고민하신다면 이 글에서 소개한 저희의 경험을 읽고, 조금이라도 영감을 얻으셨길 바랄게요.
macOS 앱을 개발하면서 도입했던 Modular Architecture, SwiftUI, SwiftData, Shell Process 등 여러 기술을 활용했는데, 이런 기술적인 내용들은 기회가 된다면 다른 창구를 통해 이야기드리도록 하겠습니다.
지금까지 많은 카카오페이 동료분들이 멀티버스와 함께해 주셨고, 덕분에 긍정적인 변화들을 만들어낼 수 있었습니다. 앞으로도 보내주시는 의견에 귀 기울이며, 더 많은 앱을 지원하고 더욱 편리한 기능들을 더해나가며 진화하는 멀티버스가 되겠습니다.
긴 글 읽어주셔서 감사합니다. 🙇♀️