[Interwiew] 모두에게 만족스러운 중간 지점을 찾아서 : 중간 지점 탐색 서비스, 콕(kok)

안녕하세요! 디자이너와 프로그래머가 만났을 때, 디프만 17기 운영진입니다.

16기에서 대상을 수상한, 많은 관심과 사랑을 받았던 서비스인 콕을 소개하려 합니다! 서비스를 만들어 나갔던 과정을 더 자세히 들여다보기 위해 콕의 제작자분들을 만나 다양한 비하인드 스토리를 들어보았어요.

안녕하세요! 먼저 간단한 자기소개를 부탁드려요:)

허준영(Web)
디프만 14, 15, 16기 세 기수를 참여했고, 팀원부터 팀장까지 하면서 마지막에 대상을 수상한 허준영이라고 합니다.

이예린(Server)
디프만 16기 4팀 서버 개발자 이예린입니다. 반갑습니다.

임효진(Design)
콕 팀 디자이너 임효진입니다. 서비스 기획부터 UXUI 설계에 참여했습니다.

Part 01. 콕(kok)이 궁금해요!

콕(kok)은 어떤 서비스인가요?

임효진(Design)
콕은 모임원의 중간 장소를 추천하는 서비스예요. 각 모임원이 공유 링크에 접속해 자신의 출발지를 입력하면, 각 모임원들의 출발지를 자동으로 취합하여 중간 장소를 추천해 줘요. 모임 유형에 따라 2가지 이상의 후보지를 주고 선호하는 장소에 부담 없이 익명으로 투표할 수 있어요.

허준영(Web)
모임원들이 카카오톡으로 링크를 공유해서 사용할 수 있는 서비스에요. 설치하는 것보다 더 편리하게 이용할 수 있죠.

중간지점이라는 아이디어는 어떤 방식으로 기획되었나요?

이예린(Server)
기획은 팀 내부의 상황에서 출발했어요. 팀원들의 거주지가 분산되어 있었거든요. 인천, 용인, 일산, 서울 등등 멀리 흩어져있다 보니 어디서 만날지 정하기가 어려웠어요. 거기에서 아이디어가 출발했어요.
중간 장소를 추천해 주는 기존의 서비스를 사용해 봤었는데 아쉬움들이 있었어요. 물리적인 중간지점을 추천해 줄 뿐 다인원 수용이 가능하지 않거나 먹거리들, 놀거리들이 없는 곳을 추천해 줬었거든요.
중간지점이라는 게 사용자마다 기준이 다를 수도 있다고 생각해서 모임원들이 만족할 수 있는 중간 지점 서비스를 만들고 싶었어요.

사용자마다 ‘중간지점’에 대한 인식이 다르다는 지점이 흥미로운데요, 이런 부분들은 서비스의 어떤 곳에서 풀어나가려고 하셨나요?

이예린(Server)
거리 외의 부가적인 요소를 더해 사용자 모두의 니즈를 만족시키는 방향성으로 기획했어요.
모임원들이 선호할 장소가 지하철역이라고 생각했고, 서울권과 수도권의 지하철역을 중심으로 서비스를 설계했어요. 참여하는 사람들이 본인의 선호 구역을 지정하는 등의 요소들을 추가해 알고리즘 설계를 진행했어요.

중간 장소를 산출하기 위해서 복잡한 알고리즘 설계가 필요했던 거군요. 알고리즘이라는단어만 들어도 굉장히 복잡해 보이는데요, 어떤 방식으로 알고리즘 설계를 진행하시게 되었나요?

이예린(Server)
중간 지점 선출 알고리즘 설계의 경우 다른 팀원분께서 주도적으로 진행해 주셨는데요, 서비스에서 추구하는 중간지점이 물리적 중간지점이 아니다 보니 중간지점을 어떻게 추천해 줄 수 있을까? 고민하다 사용자들이 선호하는 서울과 경기 지역에서 ‘지하철역’이라는 포인트를 도출해 냈습니다.
해당 지하철역에 놀거리가 많은가에 대한 여부를 통해서 가중치를 선정했었습니다. 디프만 기간 내에는 지하철역별로 팀원들이 조사를 해서 수동으로 가중치를 매기게 되었고요, 지금은 공공데이터 일별 사용량 통계로 가중치를 수정하고 있습니다.

Part 02. 콕(kook)의 특장점

콕의 특장점이라고 생각하는 것 중 하나가 바로 인터랙션인데요, 우선 인터랙션을 다양하게 활용해야겠다는 목표가 생긴 이유가 무엇인가요?

임효진(Design)
콕은 각 모임원이 원하는 후보지를 추가할 수 있다 보니, 최소 2가지에서 최대 17가지의 투표 후보가 나타날 수 있어요. 경우의 수가 워낙 많아서 몰입된 투표 경험과 적절한 비교 경험이 모두 필요했어요. 그래서 단일 카드형 UI와 리스트형 UI 두 가지 뷰를 통일성 있게 디자인하게 되었는데요, 그렇다 보니 각 뷰의 전환 설계가 필요했고, 매끄러운 전환 경험을 위해 인터랙션에 집중하게 된 것 같아요.
결론적으로는 투표 플로우에서 인터렉션에 많이 집중하게 되었던 거죠.

서비스의 매끄러운 사용자 경험을 위해 인터랙션이 필요했던 거였군요..!
인터랙션의 경우 개발자와의 밀접한 소통이 필요한 부분이라고 생각되는데요, 소통을 어떤 식으로 하셨는지 궁금해요.

임효진(Design)
저희 팀에는 인터랙션 전문 개발자분이 계셨어요. 함께 일하면서 다양한 인터렉션을 시도해 볼 수 있었습니다. 기본 UI는 프로토타입으로 전달을 드렸고, 이후에 고민하고 있던 전환 인터렉션 관련해서는 개발자분께서 먼저 제안해 주셨어요! 그걸 기반으로 디벨롭을 진행했었습니다.
인터렉션을 초 단위로 끊어서 전환 시 컴포넌트의 배치와 전환 속도 등 하나하나 논의를 하는 과정을 거쳤는데요, 슬랙을 이용해 1:1로 소통하며 구현해 냈던 것 같습니다.

허준영(Web)
또한 인터렉션을 모두가 다 함께 고민했던 게 좋은 결과물을 내는 데 도움이 되었다고 생각해요. 디자이너분들께서 디자인을 진행해 주시면, 저희는 그 디자인을 보면서 “이런 인터랙션을 넣어보면 어떨까?” 하는 식으로 제안을 많이 드리면서 적극적으로 의견을 나눴어요. 이런 상호작용 덕분에 결과물의 완성도가 더 높아질 수 있었다고 생각해요.

Part 03. 우리들의 성장 포인트!

4개월의 여정 속에서 다양한 경험들이 있었을 것 같습니다. 프로젝트를 진행하면서 기억에 남는 어려움들은 무엇이 있었는지, 그걸 어떤 방식으로 해결하려 하셨는지가 궁금합니다.

허준영(Web)
세 기수를 거치면서 개인적으로 가장 어려웠던 점은, 프론트엔드 팀원으로 참여했을 때 다른 파트의 진행 상황을 파악하기 어려웠던 점이에요. 프론트엔드에만 집중하다 보니 백엔드나 디자인 파트에서 어떤 일이 진행되고 있는지 공유가 잘되지 않았고, 그게 가장 힘들었어요.
그래서 이번에는 팀장을 맡으면서 그런 문제를 줄이기 위해 많이 신경을 썼어요. 팀원들에게 지속적으로 “어디까지 진행했는지”, “언제까지 가능한지” 물어봤고, 백엔드 상황은 Swagger를 통해 API 진행 현황을 확인하고, 디자인은 Figma를 통해 어떤 작업이 언제까지 완료될 수 있는지 파악하려고 노력했어요. 말 그대로 발로 뛰면서 중간에서 상황을 조율하려고 많이 움직였던 것 같아요.
물론 이런 역할은 팀장으로서 당연히 해야 한다고 생각했고요. 그래서 프론트엔드뿐만 아니라 팀 전체의 상황을 신경 쓰면서, 각 파트의 진행 상황을 통합적으로 파악하고 공유하려고 정말 많이 노력했어요.

이전 기수를 경험하시며 어려웠던 지점을 직접 해결하려 하신 거네요. 그 과정에서 도움이 되었던 구체적인 방법이 있나요?

허준영(Web)
회의를 주에 두 번 진행했던 게 도움이 되었던 것 같아요. 화요일 목요일을 정기 회의로 잡고 그때마다 업무 진행 상황을 파악하고 데드라인 설정을 자주 논의했던 것 같아요. 각자 상황을 공유하면서 다음 할 일들을 논의해 가는 과정이 도움이 많이 되었습니다.

두 번의 팀 회의라니, 정말 많은 시간을 커뮤니케이션에 투자하셨군요! 그렇다면 효진님께서는 기억나는 어려움이 있으신가요?

임효진 (Design)
저의 경우엔 해커톤 주간에 브랜딩을 다시 디자인했던 경험이 기억에 남아요! 디프만 활동이 반 이상 진행된 상태였는데요. 해커톤의 마지막 팀별 공유 시간을 통해, 저희 서비스의 UI와 브랜딩의 통일성이 낮다는 걸 체감했어요.
무박 해커톤이 마무리된 후에 저희 팀은 연장 회의를 진행했고, 개발자분들과 소통하며 빠르게 통일감을 높여나갔어요. 정말 시간과 정성을 많이 쏟아서 체력적으로 쉽지 않았지만, 그 시간 덕분에 보다 완성도 높은 서비스를 제작할 수 있었던 것 같아 뜻깊었어요.

이번 해커톤은 유독 길었는데 그 이후에도 팀 연장 회의를 했다니, 엄청난 체력의 소유자들이셨군요!!
그렇다면, 이러한 어려움을 극복해 가며 어느 부분에서 가장 많은 성장이 이루어지셨다고 생각하나요?

허준영(Web)
사실 처음 디프만에 참여했을 때는, 여러 명의 프론트엔드 개발자들과 함께 협업하는 경험이 처음이라 주어진 개발 작업을 해내는 데 급급했어요. 15기 때는 기획이 많이 늦어졌던 탓에, 그때도 개발만 빠듯하게 진행할 수밖에 없었고요.
그런데 이번 기수에서는 코드 품질에도 신경을 많이 썼어요. 팀원과 함께 리팩토링 대안을 논의하면서 코드의 완성도를 높이려 노력했고, 그 과정에서 품질 개선에 대한 경험을 많이 쌓을 수 있었어요.
또한 GitHub Actions 같은 자동화 도구를 활용해서, 다른 개발자들이 신경 써야 할 반복적인 작업을 최대한 줄여주려 노력했던 것도 기억에 남아요.

이예린(Server)
저는 평소에 가지고 있던 두려움을 내려두고 새로운 도전을 해보는 것에 대한 두려움이 없어진 게 가장 큰 성장으로 느껴집니다. 저의 개인적인 성장은 학습 방식이 충분한 공부를 한 후에 사용해 보는 학자형에 가까운데요, 이번 기수를 진행하며 저에게 익숙하지 않은 새로운 기술을 바로 사용해가며 익혀야 하는 상황에 놓였어요. 그걸 도전으로 받아들이고 해나가는 과정에서 많은 성장을 할 수 있었던 것 같아요.
팀원들이 가진 경험을 기반으로 피드백을 하거나, 학습해 보면 좋을지 공유해 주는 과정도 많은 도움이 되었던 것 같네요.

임효진(Design)
저는 커뮤니케이션 측면에서 가장 많이 성장한 것 같아요. 사실 개발자와 이렇게 긴밀하게 협업할 기회가 잘 없어서, 이번 디프만을 통해 어떻게 하면 개발자분들에게 디자인 의도나 요청 단위들을 더 잘 전달할 수 있을지 계속해서 고민하고 행동하다 보니 빠르게 성장할 수 있었어요.
개발자와의 협업 경험 혹은 소통 역량을 성장시키고 싶은 디자이너분들이 참여하시면, 많은 걸 얻어 갈 수 있는 시간이 될 것이라고 생각합니다!

Part 04. 예비 디퍼들에게 한마디

다음 기수의 디퍼들을 위한 코너도 마련해 봤어요!
다음 기수의 디퍼들이 새로운 프로덕트를 만들며 고려하면 좋을 것들이 어떤 것들이 있을까요?

허준영(Web)
새로운 프로덕트를 만들 때, 처음부터 너무 상업적으로만 접근하지 않았으면 좋겠어요. 시장성이나 수익성만 고려하기보다는, 팀원들이 진짜로 흥미 있어 하고 좋아하는 주제를 가지고 이야기하면서 방향을 정해 나가면 더 재미있고 즐겁게 임할 수 있다고 생각해요.
물론 시장성을 전혀 고려하지 말라는 건 아니에요. 다만, 4개월이라는 짧지 않은 기간 동안 하나의 서비스를 개발해야 하는 상황에서, 시장성이 높아 보이는 아이디어를 정했다고 해도, 정작 팀원들 중 일부는 그 주제에 흥미를 못 느낄 수 있거든요.
우리는 이 서비스가 성공할 것 같다고 말할 수 있지만, 실제로는 기대만큼 성과를 못 낼 수도 있고, 그럴 땐 성취감도 떨어질 수 있어요. 그래서 차라리 모두가 재미있어하고 흥미를 느낄 수 있는 주제를 정해서, 진심을 담아 애정을 가지고 개발하는 게 더 좋은 결과로 이어질 수 있다고 생각해요.
사이드 프로젝트는 팀원들의 자발적인 참여와 오너십이 정말 중요한데, 시작부터 흥미가 없는 사람이 있다면 시간이 갈수록 자연스럽게 관심이 떨어질 수 있어요. 그래서 저는 팀원 모두가 흥미를 느끼고 함께 재미있게 몰입할 수 있는 주제를 선택하는 게 가장 중요하다고 생각해요.

임효진(Design)
MVP를 보다 명확하게 설정하고 프로젝트를 진행하면 좋을 것 같아요. 콕은 초기 MVP에서 제공하려 했던 핵심 기능들의 볼륨이 커서 의견을 조율하는데 다소 많은 시간이 소요된 것 같아요. 핵심 기능을 명확히 하고 추가 기능들을 확장하는 형식으로 개발해 나간다면, 더욱 의미 있는 서비스가 개발되지 않을까 싶어요!

마지막으로, 디프만을 하며 ‘이것 하나는 얻어갔다.’ 하는 것이 있다면 어떤것인가요?

이예린(Server)
저에게는 ‘사람’이라는 자원이 가장 크게 얻어가는 것이었다고 생각합니다.
다양한 분야들의 사람들과 소통할 수 있었고, 선배나 동료들과 스터디하면서 하드 스킬과 소프트 스킬 면에서 시야가 넓어지는 장점이 있었습니다.
디프만 하게 된다면 프로젝트 전 과정에서 배우는 게 많은 것들이 있을 텐데 네트워킹을 통해서 배우는 것도 굉장히 많으니까 이를 소홀히 하지 않고 여러 사람들과 어울리기를 추천합니다!

중간지점 탐색 서비스 콕 탄생부터, 4개월간 각 팀원들의 여정까지 4뢍해요~ 팀의 이모저모를 알아보는 시간을 가졌습니다!
앞으로도 계속 발전해 나갈 콕에 많은 관심 부탁드려요!

콕에 대해 궁금하시다면? 아래의 링크로 접속해 주세요!
https://www.kokokok.com/

Define your direction. Depromeet.

E-mail : depromeet@gmail.com
Website : https://www.depromeet.com/