우리 회사는 다양한 IT 제품을 가지고 있습니다. 회사 정보의 원천 RTB, 사무실 중개에 초점이 맞춰져 있는 R.Find, 국내 최초 상업용 부동산 애널리틱스인 R.A까지. 이렇게 만들어진 제품들은 각 이용자의 특성에 맞춰 설계되고, 편리한 이용을 위해 트렌드를 반영하고 진화해 갑니다.
프로덕트디자인팀은 사용자 행동을 분석하고, 최적의 제품 디자인을 만들어 냅니다. 황지선 프로덕트디자인팀 팀장을 만났습니다.
R: 알스퀘어 프로덕트 디자이너는 무슨 일을 하나요?
알스퀘어디자인 황지선 프로덕트디자인팀 팀장
황지선 팀장(이하 황): 프로덕트 디자인팀은 IT 부문에 소속되어 있어요. 온라인 경험이 필요한 서비스를 만들죠. 알스퀘어의 브랜드 가치를 전하고, 사용자 경험을 설계 및 책임지는 역할을 맡고 있어요. 데이터와 VOC(Voice of Customers), 사용자 니즈 등을 통해 어떤 문제가 있는지 찾아요. 그리고 서비스에 해결 방안을 제안하죠. 문제 해결 방법과 서비스 전달 방식을 고민하면서 서비스의 모든 설계 과정에 참여해요. 서비스 출시 혹은, 배포 후 문제가 해결됐는지, 더 나은 사용자 경험을 위해 이 과정을 반복하죠.
R: 일하는 방식이 궁금해요.
황: 프로덕트 디자이너의 모든 업무 프로세스는 스쿼드 내 구성원 간 공감으로부터 시작해요. 어떤 디자인 개선을 해야 하는지, 그리고 어떻게 해결해야 긍정적인 임팩트를 줄 수 있는지 논의해요. 각 서비스의 로드맵을 바탕으로, 스쿼드 구성원과 일 단위 또는, 주 단위 회의를 통해 문제 해결점을 찾아요.
제품 개발이 시작되면 디자이너는 서비스 개선을 위해 벤치마크 등의 리서치를 진행하고, 피그마로 화면을 설계해요. 의견을 나눌 정도의 시안이 나오면 팀 내부 또는, PM과 공유하고 피드백을 주고받아요. 이를 통해 서비스 이해도를 높이고, 더 나은 서비스가 되도록 디자인 작업을 반복하고 있어요.
공감으로부터 시작되는 프로덕트 디자인
개발이 진행되면, 의도된 디자인대로 개발되도록 소프트웨어 엔지니어와 긴밀하게 협업하죠. 개발이 완료되면 디자인 QA를 통해 서비스를 출시해요. 이후에는 VOC나 사용자 인터뷰를 통해 개선 사항을 수집하죠.
R: 프로덕트 디자인을 할 때 어떤 점을 가장 신경 쓰나요.
사용성과 문제 해결을 통한 리텐션을 고려하는 프로덕트디자인팀
황: 사용성을 많이 고려해요. '부동산'이라는 주제가 어렵기도 하지만, 사용자의 연령대가 다양해요. 그래서 화면을 보고 바로 액션을 수행할 수 있는 직관적 디자인이 중요하죠. 문제 해결 역시, 신경 쓰는 부분 중 하나인데요. 서비스 문제 해결을 통해 사용자의 리텐션을 높일 수 있도록 지속적인 개선 및 빠른 업데이트를 하려고 해요.
R: 최근 진행한 프로젝트 중 기억에 남는 서비스가 있나요.
황: 7월에 막 오픈한 알스퀘어 애널리틱스(R.A)가 가장 기억에 남아요. 약 2년 반 만에 출시된 서비스 이기도 하지만, 디자인에 대한 오랜 고민이 묻어나는 제품이에요.
오랜 고민을 통해 탄생한 알스퀘어 애널리틱스 UI/UX 디자인
초기 시작 단계에는 디자인 없이 진행하다가, 중간에 디자이너가 합류하면서 수차례 디자인을 변경하고 있었죠. 보여주고 싶은 기능과 데이터가 계속 추가되며 줄을 서고 있는 상황이었어요. 화면과 내용을 보면서 할 일이 굉장히 많구나(!)를 직감하며 UI/UX 측면에서 빠른 우선순위 정리했죠.
포인트1. 알스퀘어 애널리틱스 경험을 개선하는 여정
신규 제품에 있어 중요한 것은 우리 사용자가 누구이며, 어떤 목적을 갖고 있으며, 이러한 목적을 달성하기 위해 제품 내에서 어떠한 경로로 이동하는지 파악하는 것이라고 생각했는데요. 이에 사용자를 크게 3가지 타입으로 분류하고, 우리의 ‘페르소나’로 명명했어요.
• 특정 건물을 매입하기 위해 정보를 찾고 싶은 고객사 직원
시나리오1
• 정해진 매입/매각 기준으로 해당 범위의 건물 리스트를 보고 싶은 자산운용사
시나리오2
• 경쟁 건물 정보와 평균 임대료 확인을 하고 싶은 건물주
시나리오3
그리고 각 케이스별로 알스퀘어 애널리틱스 제품을 사용할 때에 어떻게 들어와서 빠져나가는지, 처음부터 끝까지 모든 경험 과정을 기록했는데요. 이러한 정리를 통해 화면 간의 매끄러운 전환과 경로를 고민해 볼 수 있었어요.
포인트2. 데이터를 보고, 지도도 보고 싶어
알스퀘어 애널리틱스에서 메인으로 등장하는 메뉴는 ‘탐색’ 이에요. 로그인 시 해당 화면으로 랜딩되어, 지도에서 필터링을 거쳐 사용자가 원하는 맞춤 데이터를 확인할 수 있어요. 그래서 탐색 화면에서는 지도와 데이터 확인, 두 가지 모두 중요했어요.
기존의 화면은 지도가 차지하는 영역이 절반가량으로 답답한 느낌을 주는데요. 디자인을 개선하면서 지도 탐색을 넓은 화면에서 막힘없이 하고, 필요시 데이터를 자세히 보려 주는 것을 최우선 과제로 생각했죠. 여러 시도 끝에 상세화면을 두 가지 버전으로 보여줘서 많은 양의 데이터를 지도로 보거나, 표로 볼 수 있도록 설계했어요.
RSQUARE Analytics 베타버전
RSQUARE Analytics 오픈버전
이렇게 지도와 상세페이지는 해결했는데, 다음은 목록이 문제였어요.
목록에 여러 대상 정보를 한 번에 보고 싶은데, 가독성과 지도 마커와의 매칭을 위해 우리가 생각하는 타사 서비스들의 지도목록 화면과 같이 카드 방식으로 보여주는 것이 더 효율적이었죠.
그 결과, 목록 화면도 두 가지 버전이 필요하다고 생각했죠. 결국 하나의 탐색 화면 내에서 4가지의 형태를 바꿔가며 쓰는 방식을 적용하게 되었어요. 최종으로 여러 경험에 대응할 수 있는 유연한 화면 설계가 완성되었죠.
RSQUARE Analytics 최종 오픈버전
포인트3. 자연스럽게, 다각형으로 데이터 분석 연결하기
지도를 보며 탐색을 완료했다면, 다음은 대상을 분석하거나 비교할 수 있는 것이 알스퀘어 애널리틱스의 주요 시나리오에요. 이 때 중요하게 생각했던 것은 여러 경로로, 다양한 방식으로 분석/비교로 이동할 수 있어야 해요. 이동하고 나서도 대상들을 쉽게 변경하거나 추가할 수 있어야 된다는 점이었죠.
현재 지도 화면 안의 모든 건물을 분석, 내가 필터링한 목록 또는 선택한 하나의 건물을 비교/분석할 수 있도록 경로를 제공했어요. 이때 툴과 비슷한 느낌으로 제공하되 내용은 사용자가 쉽게 변경할 수 있게끔 구성했죠. 또한 처음 접하는 사용자를 위해 대표건물을 지정해서, 튜토리얼처럼 내용을 미리 확인할 수 있도록 만들었어요.
RSQUARE Analytics 데이터분석 시나리오
비효율적인 일이 반복되는 것만큼 싫은 순간은 없는 것 같아요. 디자이너와 개발자 모두 이런 상황을 막기 위해, 디자인 라이브러리 구축은 반드시 필요한 것 중 하나였어요.
RA는 공통되는 디자인 요소의 규칙을 정해서 관리하며, 사용하고 있어요. 뿐만 아니라 제품의 폰트, 컬러 그림자 등에 대해서도 기본 가이드를 규정해 사용하죠. 그래서 어떤 디자이너가 작업을 진행해도 RA의 디자인 정체성을 유지하게끔 관리 중이에요.
RSQUARE Analytics에서 사용되는 버튼과 체크박스 가이드
잘 아는 기업이나 디지털 서비스의 경우, 각자의 UX라이팅 가이드를 가지고 있는데요. 서비스 전체에 통일된 보이스를 제공하고, 사용자 목적 달성에 도움을 주는 글을 가이드하는 것이 UX라이팅이에요.
알스퀘어 애널리틱스도 명확하고 전문적인 정보전달을 목적으로 하는데요. 쉽고 친절하게 고객과 소통하는 것을 보이스톤으로 규정했어요.
RSQUARE Analytics 명확한 정보 전달과 보이스톤으로 더 나은 경험 제공
보이스톤에 따라 기본적으로 서비스 내에서 사용하는 숫자, 층수, 금액, 날짜 등 표기법 또한 규정해서 통일된 목소리를 제공할 수 있게 되었죠. 이후 새로운 문구를 정하거나 팝업을 추가한다고 해도, 누구든 가이드를 보고 문구를 작성하면 되어요. 관리 포인트가 줄어드는 일석이조 효과를 얻었어요.
지금까지 작업해온 제품들과 비교했을 때, RA는 화면의 양은 적지만 방대한 내용이 들어 있는 꽉 찬 제품이에요. 실제 사용할 사용자의 입장에서 생각하며 지도부터 설계하다 보니 출시에 다다른 같아요. VOC를 통해 실제 사용자들의 다양한 목소리를 듣고, 유저 데이터를 확인하며 더욱 나아진 경험을 제공할 생각에 많은 기대가 돼요.
R: 앞으로 프로덕트 디자인팀이 해결해야 할 과제나 고민이 무엇인지 궁금해요.
황: 회사가 빠른 성장을 이룬 만큼, 디자인 히스토리나 원칙, 제품을 효율적으로 관리하기 위해 통일성 있는 환경을 마련합니다. 또 디자인 측면에서 우리만의 디자인 시스템을 준비하고 있어요.
R: 알스퀘어에서 프로덕트 디자인팀이 기여하는 지향점이 궁금해요.
황: 알스퀘어가 상업용 부동산 시장에서 탑인 만큼 온라인 서비스도 탑으로 만들고자 해요. 지금은 우리가 다른 제품을 벤치마크하고 장단점을 분석해서 사이트에 적용하고 있는데요. 역으로 타사가 우리를 벤치마크 하도록 만드는 것이 목표예요.
알스퀘어 서비스가 외부로 서비스되기 시작한 만큼 브랜드 측면에서 알스퀘어의 서비스 아이덴티티도 적극적으로 만들어 가려고 해요.
알스퀘어의 온라인 아이덴티티를 만들어가는 IT프로덕트 디자인팀
우리 회사는 다양한 IT 제품을 가지고 있습니다. 회사 정보의 원천 RTB, 사무실 중개에 초점이 맞춰져 있는 R.Find, 국내 최초 상업용 부동산 애널리틱스인 R.A까지. 이렇게 만들어진 제품들은 각 이용자의 특성에 맞춰 설계되고, 편리한 이용을 위해 트렌드를 반영하고 진화해 갑니다.
프로덕트디자인팀은 사용자 행동을 분석하고, 최적의 제품 디자인을 만들어 냅니다. 황지선 프로덕트디자인팀 팀장을 만났습니다.
R: 알스퀘어 프로덕트 디자이너는 무슨 일을 하나요?
알스퀘어디자인 황지선 프로덕트디자인팀 팀장
황지선 팀장(이하 황): 프로덕트 디자인팀은 IT 부문에 소속되어 있어요. 온라인 경험이 필요한 서비스를 만들죠. 알스퀘어의 브랜드 가치를 전하고, 사용자 경험을 설계 및 책임지는 역할을 맡고 있어요. 데이터와 VOC(Voice of Customers), 사용자 니즈 등을 통해 어떤 문제가 있는지 찾아요. 그리고 서비스에 해결 방안을 제안하죠. 문제 해결 방법과 서비스 전달 방식을 고민하면서 서비스의 모든 설계 과정에 참여해요. 서비스 출시 혹은, 배포 후 문제가 해결됐는지, 더 나은 사용자 경험을 위해 이 과정을 반복하죠.
R: 일하는 방식이 궁금해요.
황: 프로덕트 디자이너의 모든 업무 프로세스는 스쿼드 내 구성원 간 공감으로부터 시작해요. 어떤 디자인 개선을 해야 하는지, 그리고 어떻게 해결해야 긍정적인 임팩트를 줄 수 있는지 논의해요. 각 서비스의 로드맵을 바탕으로, 스쿼드 구성원과 일 단위 또는, 주 단위 회의를 통해 문제 해결점을 찾아요.
제품 개발이 시작되면 디자이너는 서비스 개선을 위해 벤치마크 등의 리서치를 진행하고, 피그마로 화면을 설계해요. 의견을 나눌 정도의 시안이 나오면 팀 내부 또는, PM과 공유하고 피드백을 주고받아요. 이를 통해 서비스 이해도를 높이고, 더 나은 서비스가 되도록 디자인 작업을 반복하고 있어요.
공감으로부터 시작되는 프로덕트 디자인
개발이 진행되면, 의도된 디자인대로 개발되도록 소프트웨어 엔지니어와 긴밀하게 협업하죠. 개발이 완료되면 디자인 QA를 통해 서비스를 출시해요. 이후에는 VOC나 사용자 인터뷰를 통해 개선 사항을 수집하죠.
R: 프로덕트 디자인을 할 때 어떤 점을 가장 신경 쓰나요.
사용성과 문제 해결을 통한 리텐션을 고려하는 프로덕트디자인팀
황: 사용성을 많이 고려해요. '부동산'이라는 주제가 어렵기도 하지만, 사용자의 연령대가 다양해요. 그래서 화면을 보고 바로 액션을 수행할 수 있는 직관적 디자인이 중요하죠. 문제 해결 역시, 신경 쓰는 부분 중 하나인데요. 서비스 문제 해결을 통해 사용자의 리텐션을 높일 수 있도록 지속적인 개선 및 빠른 업데이트를 하려고 해요.
R: 최근 진행한 프로젝트 중 기억에 남는 서비스가 있나요.
황: 7월에 막 오픈한 알스퀘어 애널리틱스(R.A)가 가장 기억에 남아요. 약 2년 반 만에 출시된 서비스 이기도 하지만, 디자인에 대한 오랜 고민이 묻어나는 제품이에요.
오랜 고민을 통해 탄생한 알스퀘어 애널리틱스 UI/UX 디자인
초기 시작 단계에는 디자인 없이 진행하다가, 중간에 디자이너가 합류하면서 수차례 디자인을 변경하고 있었죠. 보여주고 싶은 기능과 데이터가 계속 추가되며 줄을 서고 있는 상황이었어요. 화면과 내용을 보면서 할 일이 굉장히 많구나(!)를 직감하며 UI/UX 측면에서 빠른 우선순위 정리했죠.
포인트1. 알스퀘어 애널리틱스 경험을 개선하는 여정
신규 제품에 있어 중요한 것은 우리 사용자가 누구이며, 어떤 목적을 갖고 있으며, 이러한 목적을 달성하기 위해 제품 내에서 어떠한 경로로 이동하는지 파악하는 것이라고 생각했는데요. 이에 사용자를 크게 3가지 타입으로 분류하고, 우리의 ‘페르소나’로 명명했어요.
• 특정 건물을 매입하기 위해 정보를 찾고 싶은 고객사 직원
시나리오1
• 정해진 매입/매각 기준으로 해당 범위의 건물 리스트를 보고 싶은 자산운용사
시나리오2
• 경쟁 건물 정보와 평균 임대료 확인을 하고 싶은 건물주
시나리오3
그리고 각 케이스별로 알스퀘어 애널리틱스 제품을 사용할 때에 어떻게 들어와서 빠져나가는지, 처음부터 끝까지 모든 경험 과정을 기록했는데요. 이러한 정리를 통해 화면 간의 매끄러운 전환과 경로를 고민해 볼 수 있었어요.
포인트2. 데이터를 보고, 지도도 보고 싶어
알스퀘어 애널리틱스에서 메인으로 등장하는 메뉴는 ‘탐색’ 이에요. 로그인 시 해당 화면으로 랜딩되어, 지도에서 필터링을 거쳐 사용자가 원하는 맞춤 데이터를 확인할 수 있어요. 그래서 탐색 화면에서는 지도와 데이터 확인, 두 가지 모두 중요했어요.
기존의 화면은 지도가 차지하는 영역이 절반가량으로 답답한 느낌을 주는데요. 디자인을 개선하면서 지도 탐색을 넓은 화면에서 막힘없이 하고, 필요시 데이터를 자세히 보려 주는 것을 최우선 과제로 생각했죠. 여러 시도 끝에 상세화면을 두 가지 버전으로 보여줘서 많은 양의 데이터를 지도로 보거나, 표로 볼 수 있도록 설계했어요.
RSQUARE Analytics 베타버전
RSQUARE Analytics 오픈버전
이렇게 지도와 상세페이지는 해결했는데, 다음은 목록이 문제였어요.
목록에 여러 대상 정보를 한 번에 보고 싶은데, 가독성과 지도 마커와의 매칭을 위해 우리가 생각하는 타사 서비스들의 지도목록 화면과 같이 카드 방식으로 보여주는 것이 더 효율적이었죠.
그 결과, 목록 화면도 두 가지 버전이 필요하다고 생각했죠. 결국 하나의 탐색 화면 내에서 4가지의 형태를 바꿔가며 쓰는 방식을 적용하게 되었어요. 최종으로 여러 경험에 대응할 수 있는 유연한 화면 설계가 완성되었죠.
RSQUARE Analytics 최종 오픈버전
포인트3. 자연스럽게, 다각형으로 데이터 분석 연결하기
지도를 보며 탐색을 완료했다면, 다음은 대상을 분석하거나 비교할 수 있는 것이 알스퀘어 애널리틱스의 주요 시나리오에요. 이 때 중요하게 생각했던 것은 여러 경로로, 다양한 방식으로 분석/비교로 이동할 수 있어야 해요. 이동하고 나서도 대상들을 쉽게 변경하거나 추가할 수 있어야 된다는 점이었죠.
현재 지도 화면 안의 모든 건물을 분석, 내가 필터링한 목록 또는 선택한 하나의 건물을 비교/분석할 수 있도록 경로를 제공했어요. 이때 툴과 비슷한 느낌으로 제공하되 내용은 사용자가 쉽게 변경할 수 있게끔 구성했죠. 또한 처음 접하는 사용자를 위해 대표건물을 지정해서, 튜토리얼처럼 내용을 미리 확인할 수 있도록 만들었어요.
RSQUARE Analytics 데이터분석 시나리오
비효율적인 일이 반복되는 것만큼 싫은 순간은 없는 것 같아요. 디자이너와 개발자 모두 이런 상황을 막기 위해, 디자인 라이브러리 구축은 반드시 필요한 것 중 하나였어요.
RA는 공통되는 디자인 요소의 규칙을 정해서 관리하며, 사용하고 있어요. 뿐만 아니라 제품의 폰트, 컬러 그림자 등에 대해서도 기본 가이드를 규정해 사용하죠. 그래서 어떤 디자이너가 작업을 진행해도 RA의 디자인 정체성을 유지하게끔 관리 중이에요.
RSQUARE Analytics에서 사용되는 버튼과 체크박스 가이드
잘 아는 기업이나 디지털 서비스의 경우, 각자의 UX라이팅 가이드를 가지고 있는데요. 서비스 전체에 통일된 보이스를 제공하고, 사용자 목적 달성에 도움을 주는 글을 가이드하는 것이 UX라이팅이에요.
알스퀘어 애널리틱스도 명확하고 전문적인 정보전달을 목적으로 하는데요. 쉽고 친절하게 고객과 소통하는 것을 보이스톤으로 규정했어요.
RSQUARE Analytics 명확한 정보 전달과 보이스톤으로 더 나은 경험 제공
보이스톤에 따라 기본적으로 서비스 내에서 사용하는 숫자, 층수, 금액, 날짜 등 표기법 또한 규정해서 통일된 목소리를 제공할 수 있게 되었죠. 이후 새로운 문구를 정하거나 팝업을 추가한다고 해도, 누구든 가이드를 보고 문구를 작성하면 되어요. 관리 포인트가 줄어드는 일석이조 효과를 얻었어요.
지금까지 작업해온 제품들과 비교했을 때, RA는 화면의 양은 적지만 방대한 내용이 들어 있는 꽉 찬 제품이에요. 실제 사용할 사용자의 입장에서 생각하며 지도부터 설계하다 보니 출시에 다다른 같아요. VOC를 통해 실제 사용자들의 다양한 목소리를 듣고, 유저 데이터를 확인하며 더욱 나아진 경험을 제공할 생각에 많은 기대가 돼요.
R: 앞으로 프로덕트 디자인팀이 해결해야 할 과제나 고민이 무엇인지 궁금해요.
황: 회사가 빠른 성장을 이룬 만큼, 디자인 히스토리나 원칙, 제품을 효율적으로 관리하기 위해 통일성 있는 환경을 마련합니다. 또 디자인 측면에서 우리만의 디자인 시스템을 준비하고 있어요.
R: 알스퀘어에서 프로덕트 디자인팀이 기여하는 지향점이 궁금해요.
황: 알스퀘어가 상업용 부동산 시장에서 탑인 만큼 온라인 서비스도 탑으로 만들고자 해요. 지금은 우리가 다른 제품을 벤치마크하고 장단점을 분석해서 사이트에 적용하고 있는데요. 역으로 타사가 우리를 벤치마크 하도록 만드는 것이 목표예요.
알스퀘어 서비스가 외부로 서비스되기 시작한 만큼 브랜드 측면에서 알스퀘어의 서비스 아이덴티티도 적극적으로 만들어 가려고 해요.
알스퀘어의 온라인 아이덴티티를 만들어가는 IT프로덕트 디자인팀