번잡한 UX를 개선했을 뿐인데, 매달 500명이 넘게 다운받는 앱이 되었다 (feat. 누적 4.1천 회)

안녕하세요 K입니다! 오늘은 '리본' 앱을 제작하면서 느낀 점을 공유해보려고 합니다. 
https://apps.apple.com/kr/app/%EB%A6%AC%EB%B3%B8-reborn/id1637041855

‎리본 REBORN

 

배경

리본은 개발 뿐만 아니라, PM과 디자인의 업무까지 경험할 수 있었던 뜻깊은 프로젝트였다. 팀원의 합도 잘 맞아서 다른 팀들보다 순탄하게 흘러갔던 기억이 있다. 뿐만 아니라 괄목할만한 결과까지 거두고 있기에 애착이 많이 가는 프로젝트이자 앱이다. 어떤 요인들로 인해 성공적인 프로젝트를 할 수 있었을까?
 
 

기획

#1

이번 프로젝트의 주제는 '커뮤니티에 임팩트를 주는 것'이었다. 평소 사회에 선한 영향력을 끼치고 싶다는 말을 입에 달고 살았는데, 이와 비슷한 주제라 좋은 결과물을 만들어내고 싶었다. 우선은 각자 관심 있는 분야나 커뮤니티에 대한 얘기를 나눴고, 이 중에서 공통으로 관심이 생기는 분야 몇 개를 필터링했다.

브레인 스토밍 과정

 

#2

그중 우리는 '유기 동물' 커뮤니티로 정했다. 반려 동물을 키우고 있는 팀원이 하나도 없었다는 건 아이러니하지만, 모든 팀원이 어느 정도의 관심을 보이기도 했고, 우리가 타겟팅하기에 규모적으로나, 정보를 접할 경로의 관점으로나 괜찮은 커뮤니티라고 생각했다. 우리는 우선 뉴스 기사나 인터넷 커뮤니티를 중점적으로 정보를 모아갔다. 또한 반려 동물을 키우는 사람이나, 유기 동물에 관심이 많은 사람을 대상으로 리서치도 진행하였다. 우리는 이 과정에서 유기 동물의 안락사 문제, 임시 보호 문제, 유기 동물 입양이 번거롭다는 문제를 발견하게 되었다.

유기 동물 커뮤니티에서 우리가 발견해낸 문제들

 

#3

자료 조사를 통해 얻은 페인 포인트를 조금 더 파고들었고, 입양되지 못해 자연사 및 안락사 위기에 처한 유기 동물을 돕자는 것을 메인 주제로 삼았다. 주제가 정해진 근거로는 모든 팀원이 공감한다는 점 뿐만 아니라, 기존의 문제점 중 우리가 개선할 부분이 많다는 점도 있었다. 일단은 유기 동물에 관한 앱이 몇 개 존재했다. 하지만 iOS 개발을 공부하는 입장에서 봤을 때 여러 문제가 있었다.

 

첫째로 UX가 너무 불편했다. 한 마디로 웹에서 사용되는 UI/UX 템플릿을 모바일 화면에 그대로 옮겨놓은 수준에 불과했다. 특히 Apple에서 진행된 디자인 세션을 들었을 때 모바일에서 햄버거 버튼을 사용하지 말라는 얘기를 들었는데, 기존 유기 동물 앱에는 모두 햄버거 버튼이 있었다.

 

둘째로 너무 많은 정보를 담고 있었다. 앱이 말하고자 하는 바가 명료하지 않았다. 많은 요소들을 작은 화면에 몰아넣다보니 어디서부터 봐야할지 몰랐고, 광고도 너무 많았다. 유기 동물을 위한 앱이라기 보다는 이 사업체를 진행하는 사람을 위한 앱이라는 인식을 받았다. 정말 유기 동물에 도움이 될까 싶었다.

 

셋째로 안락사 위기에 처한 동물을 주로 보여주는 곳이 없었다. 우리의 차별점이자 핵심은 안락사 위기에 처한 동물을 보여주자는 것이었기 때문에 우리만의 정체성을 가질 수 있겠다는 생각이 들었다.

몇 차례 deep dive를 통해 정해진 우리의 솔루션

 

 

디자인

#1

우리가 가장 크게 고려했던 점은, 유저가 유기동물 공고를 곧바로 보게 한 부분이다. 다른 앱들의 UX는 굉장히 번잡했는데, 애플의 HIG에도 맞지 않았고, 마치 하이브리드 웹의 모양새였다. 광고도 정말 많았기 때문에, 눈을 어디부터 둬야할지 몰랐고, 앱에서 강조하거나 말하고 싶은 바가 무엇인지 파악하기 어려웠다. 모든 포인트를 짬뽕해놓은 앱이 대부분이었다.
 

#2
우리의 앱이 말하고자 하는 것은 간단 명료했기 때문에 이 부분을 유저에게 말하고 행동을 유도하고 싶었다. 유기동물의 안락사를 막기 위해 유기동물 공고만을 배치했고, 테이블 셀을 터치해서 들어가면 곧바로 유기동물을 보호하고 있는 센터에 연락할 수 있도록 유도했다. 또한, 동물들이 굉장히 많기 때문에, 마음에 든 동물은 어떤 화면에서든지 좋아요 버튼을 누를 수 있도록 표시했고, 이를 모아서 보는 페이지도 구현했다. 좋아요 목록에서도 마찬가지로, 동물의 공고 기한 레이블을 사진과 같이 표기하여, 마감까지 며칠이 남았는지 알려주도록 했다.

 

 #3
테이블 뷰 셀에 사진이 제일 부각되게 디자인했다. 왜냐하면, 동물 입양을 고려할 때 동물의 생김새가 최우선 고려 순위라고 생각했고, 사람들은 다른 정보보다 사진을 제일 궁금해할 것이라고 생각했기 때문이다. (UT에서 사람들이 사진을 바로 볼 수 있던 점이 좋았다고 한다.)

좌측부터 첫 화면, 상세 정보, 관심 목록

 #4
우리 앱의 가장 큰 특징이자 차별점 중 하나인, 공고 마감 기한 레이블이다. 우리 앱의 취지는 안락사되는 유기동물을 한 마리라도 줄이는 것이기 때문에, 안락사가 얼마 남지 않은 동물부터 목록의 최상단에 배치시켰다. 셀 우측 최상단에도 공고 마감 기한을 표기하였고, 좀 더 직관적인 인식을 위해 신호등의 색을 도입했다. (3일 이내의 동물은 빨간색, 이후는 주황색, 비교적 널널한 기한은 초록색으로 표기하였다.) 메인 색은 눈과 마음이 편할 수 있는 포근한 초록색 (개발자라 이렇게 설명하는 게 최선이다.)을 선정했는데, 그 이유는 동물이 좋은 주인 품으로 돌아가서 자연으로 뛰어놀았으면 좋겠다는 취지였다. 잘 어울리는 것 같다.

공고 기한 레이블과 우리 팀의 디자인 시스템!

 

 

#5

또한, 단어의 디테일에도 신경을 썼다. 시장 조사를 하면서 사람들이 동물을 지칭할 때 '아이들'이라는 단어를 많이 쓰는 것을 볼 수 있었다. 그리고 전체적으로 따뜻한(?) 어투로 말씀하시는 문화가 느껴졌는데, 그 색깔이 우리 앱에서도 느껴졌으면 좋겠다고 생각했다. 

• '유기 동물 입양 공고' -> '입양을 기다리는 아이들'
• '동물 상세 정보' -> '아이의 특징'
• '유기 동물 보호소' -> '아이가 머무는 곳'
• '공고 기한이 지나면 안락사 처리됩니다' -> '공고 종료된 아이들은 자동으로 목록에서 사라져요'

개인적으로 앱 개발할 때 단어의 선택이 앱의 분위기나 느낌, UX에 굉장히 큰 영향을 미친다고 생각하는 편이다. 어떻게 보면 아무것도 아닌 것처럼 보일 수 있는 사소한 부분이지만, 사용자 입장에서 같은 정보라도 어떤 표현으로 접하는 지에 따라 무의식적으로 느끼는 점이 다르다고 생각한다. 그래서 평소에도 이런 디테일을 챙기려고 하는 편이었고, 리본에서도 이런 식으로 텍스트를 표현해봤다. 

따뜻한 텍스트

 

 

개발

#1

나는 메인 UI 개발을 담당했다. 또한, UIKit이 처음이었기 때문에, 이미 UIKit 경험이 풍부한 팀원과 함께 기능을 개발하게 되었다. 본격적으로 개발에 들어가기 전에, 구체적으로 어떤 부분을 개발해야 하는지 분석했다. 메인 뷰에 들어갈 컴포넌트나 클래스 같은 것들을 정리했고, 이를 토대로 플래닝 포커에 적용했다.

 

#2

플래닝 포커를 통해 태스크에 대한 시간을 산정했고, 예상 시간을 도출하는 식으로 스프린트를 계획했다. 나는 플래닝 포커를 통해 태스크를 산정할 때 공부 시간 또한 많이 투자했다. 아무래도 처음이기 때문에 인터넷 강의를 통해 공부하고 익숙해진 다음에 기능을 구현하는 식으로 작업을 해야했기 때문이다. 이전에 태스크를 산정할 때는 공부 시간을 각자 암묵적으로 포함하는 것에 그치는 경우가 많았는데, 플래닝 포커를 통해 공부 시간을 따로 할애하고 전체 작업 시간을 정확하게 계산할 수 있어서 일정 조율이 용이했다.

플래닝 포커 - 1st sprint & 2nd sprint

 

#3
우리는 각자 맡은 부분을 구현해온 다음, 더 나은 코드로 최종 코드를 작성하는 방향으로 작업했다. 이때 나는 우선 인터넷 강의를 듣고, 그 코드를 연습한 뒤에 프로젝트의 기능을 구현하는 식으로 작업했기 때문에, 팀원보다 속도가 느려서 우리 코드의 많은 부분에 기여할 수는 없었다. 하지만, 모르는 것을 많이 물어보고 팀원은 같은 기능을 어떻게 구현했는지 보면서 많이 배울 수 있었다. 어떤 코드가 더 깔끔한지, 내 코드에서 어떤 식으로 개선시킬 수 있는지 등을 배웠고, 코드 컨벤션이라는 개념도 알게 되었다. 직접적으로 많은 코드를 치진 못해고 많은 것을 얻을 수 있었다. 일종의 페어 프로그래밍이 되었다고나 할까.
 
 

 

결론

#1

플래닝 포커 덕분에 마감 기한에 맞춰서 프로젝트를 완수할 수 있었고, 출시까지 무사히 할 수 있었다. 이후 아카데미 사람들을 대상으로 UT(User Test)를 진행하면서 우리가 초기에 세운 가설들과 디자인의 의도가 잘 먹히는지 등을 조사했다. 아직은 디테일한 부분을 손 볼 곳이 많았지만, 우리의 가설이 어느정도 들어맞은 것 같아서 좋았다.

UT 진행 -> 우리의 가설이 얼마나 적중했는지 점검

 

#2
리본은 23년 5월 기준으로 약 4.1천회가 넘는 다운로드 수를 기록하였고, 매달 500명 이상의 신규 유저가 유입되는 앱이 되었다.

리본의 누적 지표들

최근 3개월 동안의 다운로드 수

 
#3
유저가 원하는 건 어쩌면 간단한 일일지도 모른다. 복잡한 기능을 개발하기 전에 진짜 유저가 원하는게 무엇인지 파악하는 능력이 중요하다는 것을 다시금 느꼈다. 개발자로서 구현하고 싶은 게 아니라, 수단을 막론하고 유저가 진짜 원하는 것을 찾아주는 것이 진짜 비즈니스 가치를 실현하는 제 1 원칙이 아닐까 싶다.