혼잡다 Honzapda는 카페의 실시간 혼잡도 제공에 초점을 맞춘 카페 정보 제공 애플리케이션으로, 혼잡도 정보 제공뿐만 아니라 오늘의 카페 추천 등 큐레이션 서비스도 제공한다. (5월에 런칭 예정 ... 소곤소곤) 이번 글에서는 데모데이가 끝난 기념으로 전체적인 프로젝트와 디자인으로 참여한 회고를 적어보려고 한다!

혼잡다 디자인을 시작하게 된 계기

디자인은 사실 1학기 때 개발자로 학과 프로젝트를 이것저것 경험하면서 자연스럽게 접했던 것 같다. 피그마를 제대로 공부했던 게 아니라서 그냥 부딪히면서 안되는 건 노가다로 구현하고 정 모르겠을 때만 서치해가면서 기능 하나하나를 익혔었는데... 물론 지금도 많이 부족하지만 그때 디자인 실력은 지금 보면 진짜 많이 부끄럽다. 아무튼 그렇게 작업하다보니 자연스럽게 디자인을 좀 더 배워보고 싶다는 생각이 들었다. iOS 개발자로서 프로젝트에 참여하면서 피그마를 많이 봤던 경험도 영향을 끼쳤다. 가장 컸던 이유는 주먹구구식의 디자인을 그만하고 싶다는 생각이었다. 분명 이걸 피그마에서 조금 더 효율적으로 구현할 수 있는 방법이 있을텐데 ... 혼자 하는 디자인은 이런 부분을 채우기가 힘들었고 디자인 자체도 조금 더 많은 사람들과 공유하면서 더 나은 방향으로 발전시키고 싶다는 생각도 있었다.

그래서 23년 2학기에 IT 연합 동아리인 UMC에서 5기 디자인으로 활동했다! 좋은 스터디원 언니들을 만나고 디자인을 같이 배우고 이야기하면서 얻는 것들이 많았다. 디자인 시스템과 유저 친화적 디자인에 눈을 뜨게 됐고, 내 첫 디자인 프로젝트에서는 이런 점을 적용시켜서 간지나는 프로젝트로 만들겠다 ... 는 꿈을 꾸었으나 결론적으로는 실현하지 못하긴 했다.

그렇게 UMC 스터디를 마치고 매칭된 내 첫 디자인 프로젝트가 혼잡다였다! 여러가지 아쉬운 점도, 잘했다고 생각하는 점들도 있는데 하나씩 정리해보려고 한다 👊

아쉬웠던 부분: 디자인 시스템

사진은 내가 열심히 찾아서 저장해두고 본 레퍼런스들 헤헤 스터디 때 처음 디자인 시스템 개념을 접하게 되면서 프로젝트에서 디자인 시스템을 깔끔하게 정리해두고 시작하고 싶다는 생각을 했었다. 그래서 처음 프로젝트 매칭이 되고 PM 언니와 이야기를 했을 때도 나는 디자인 시스템을 먼저 작업하고 앱을 디자인하고 싶다! 고 했었는데 ... 현실은 생각보다 녹록지 않았다. 가장 미스라고 생각했던 점은 아무것도 없던 상태에서 무작정 나는 디자인 시스템을 만들겠다! 고 생각했던 점이었다. 내가 봤던 기업에서 정리한 디자인 시스템 정립기들은 보통 플로우가 다음과 같았는데,

1. 앱이 이미 있음
2. 디자인 시스템이 없는 것에 불편함을 느낌 (통일성 x, 작업 효율 저하, ...)
3. 개발자-디자이너-PM 상호 합의 후 디자인 시스템 정립

앱 기획도 다 나오지 않은 상태에서 디자인 방향도 정하지 않고 무작정 디자인 시스템을 정하겠다고 했던 부분이 미스였다고 생각한다. 초반에 디자인 작업 속도가 꽤 느렸던 부분 중 가장 큰 이유였기도 하고... 이후 정신 차리고 디자인 시스템은 빠르게 손절했다. 사실 데모데이가 끝났고 개강까지 얼마 남지 않은 지금이 재도전해볼 적기인가 싶기도 했다. 그래도 일단 런칭이 남았고 시스템을 정립하면 디자인이 수정될 부분이 좀 있어서 아마 런칭 이후에 유지보수를 진행하며 만들던지 해볼 것 같다! 생각할 때마다 아쉬운 부분이지만 그래도 시도를 했다는 것 자체에 의미를 두고 싶다 🥹

그래도 성장했던 부분 1: 로고 작업

프로젝트에서 가장 힘든 부분이었다. 다른 사람들의 경우를 보면 프로젝트 마지막에 로고를 만들던데 나는 항상 맨 처음 하는 작업이 로고 작업이라 앱 이름도 한번 바뀐 상황에서 디자인 시스템 구상한다고 시간을 좀 잡아먹어서 로고 작업을 빨리 해야한다는 압박감이 좀 있었다. 그래서 진짜 생각나는대로 만들고 다음날 보면 별로여서 옆으로 밀어놓고 또 작업하고를 며칠 반복했다.

내가 마치 송 영감이 된 것 같은 기분... 로고 뚜왕뚜왕하면서 디자인 괜히 했다는 후회를 많이 했다. 주변 사람들한테 한탄도 엄청 했는데 받아준 지인들에게 감사를 표한다 ^^ 그래도 결국 꽤 마음에 드는 로고가 나와서 행복한 결말을 맞았다는 이야기! 역시 시간을 오래 쏟으면 예쁜 그림이 나온다... 는 걸 깨달았던 경험이었다. 오래 걸린 작업인데도 옆에서 계속 예쁘다 잘한다 용기를 불어넣어준 우리 피엠 언니에게도 고맙다는 말을 전하고 싶다 💙

그래도 성장했던 부분 2: 앱 내 포인트 잡기

혼잡다는 이미 비슷한 앱이 많이 올라와 있다는 부분에서 고민을 많이 했던 프로젝트였다. 홈 화면이 지도로 구성되어 있는 부분도 이미 시중에 있는 지도 앱과 유사해서 대신 우리 프로젝트만의 포인트인 혼잡도를 최대한 살려보려고 노력했는데 잘됐는지는 모르겠다. 홈 화면에 나타나는 카페 정보를 카드 뷰로 보여주려고 한 것도 뭔가 지도 앱이랑 차별성을 주려고 했던 것 같은데 ... 나름 SwiftUI에서의 구현 가능성도 염두에 두고 작업했으나 어려웠던 것 같아서 디자인 컨펌할 때 좀 미안했다 ㅎㅎ

그래도 성장했던 부분 3: 사용자 친화적 UX/UI

| | ---|---|---| 우리 프로젝트는 혼잡도 정보 제공이 주된 기능이었기 때문에 카페 상세 화면에서 이런 점이 사용자에게 잘 나타났으면 좋겠다는 바람이 있었다. UI 측면에서 가장 오랜 시간이 걸렸던 부분도 이 부분이었다고 생각한다.

유저의 도움 정보라고 유저들이 카페에 가서 느낀 내용을 주어진 양식에 맞게 작성해주면 상세 화면에 띄워주는 기능(첫 번째 사진)이 있었는데, 유저가 작성한 내용을 문자 그대로 띄워줘야 하다보니 유저에 따라서 양식에 맞게 작성하지 않을 수도 있고 ... 상세 화면에서 어색하게 띄워질 수도 있는 상황이라 고민을 꽤 많이 했다. 결론적으로 정보를 작성하는 화면에서 양식에 맞게 작성할 수 있도록 유도하는 방법(두 번째 사진)을 썼다. 저렇게 예시를 쓰라고 누가 추천해줬었는데 사실 처음에는 뭔가 예뻐보이지 않아서 이게 맞나 싶었는데 사용자 친화적인 디자인 관점에서는 이게 맞았던 것 같다! 누가 말해줬는지 기억이 안나서 문제지만 ㅎㅎ 감사합니다

혼잡도를 유저에게 보여주는 것도 고민했던 부분 중 하나였다. 가장 주가 된 기능이니만큼 여러 종류의 혼잡도가 있었는데 무려 요일별, 평균, 실시간까지 3가지나 됐다. 처음에 듣고 이걸 다 어떻게 넣지... 하고 눈앞이 진짜 캄캄했는데 뒤돌아보니 진짜 어떻게 했지? 하는 생각밖에 안 든다. 실시간 혼잡도는 회의 중에 라이브 디자인을 하면서 정말 실시간으로 추가했던 것 같은데 그런 것 치고는 꽤 잘 보이게 나오지 않았나 싶어서 뿌듯! 한 마음도 있었다. 물론 다시는 그런 식으로 작업하고 싶지 않다... 꽤 식은땀나는 경험이었다. 그래도 이때 했던 경험은 이 뒤에 해커톤에서 디자인할 때 꽤 많은 도움이 됐다 으하하

사실 사용자 친화적인 UX나 UI가 제대로 구현됐는가? 라는 질문에는 자신 있게 답하기가 어렵긴 하다. 공부를 해야지 해야지 했지만 여러가지 핑계들로 제대로 하지 못한 것도 사실이고 한 달 동안 같은 디자인을 보다보면 점점 갈수록 괜찮아보이기 때문에 ... 나중에 QA 진행하면서 디자인 평가도 같이 받아보려고 한다. 그래도 이런 고민들을 오랫동안 직접 해보고 적용해볼 수 있었다는 게 큰 의미가 되었던 것 같다!

그리고 여담이지만 저 디자인 예시로 쓴 카페에는 내 사심이 좀 들어갔다 🥹 비록 자주 가진 못하지만 ... 죽전에 온다면 추천하는 카페 1순위!

전체적인 프로젝트 회고

프로젝트 시작 전에는 팀 내 디자이너가 한 명이라는 소식을 듣고 많이 좋아했었다. 내가 하고 싶은 디자인을 마음껏 할 수 있겠다는 생각에 신이 많이 났던 것 같은데 지금 생각해보면 디자이너가 한 명 더 있었다면 조금 더 나은 디자인을 나왔을 수도 있다는 생각이 들었다. 같이 공동의 목표를 잡고 이야기할 수 있는 사람들이 얼마나 소중한지 깨달을 수 있었던 시간이었다. 대충 좀 외로웠다는 이야기... 물론 별개로 우리 팀원들은 참 좋았다.

내 주된 진로는 iOS 개발이지만 디자인으로 프로젝트에 참여해 본 경험이 시간 낭비라고 생각하진 않는다. 물론 작업 중간중간 이게 맞나 싶을 때도 있긴 했는데... 지금은 꽤 많은 걸 배워서 이 경험이 소중한 것 같다. 가장 크게 배웠던 건 디자이너와 개발자로서의 관점 차이였다.

가장 간과했던 부분은 내가 iOS 개발을 좀 해봤지~ 라는 생각이었다. 디자인 할 때도 이런 부분을 많이 반영했다고 생각했고 그래서 처음 디자인 컨펌했을 때 이렇게까지 에러가 많다고? 하는 생각이 들어서 충격을 좀 먹기도 했다. 일단 사용하는 기술 스택이 달랐던 점이랑 피그마 상에서 구현되는 글자 크기와 코드로 구현하는 글자 크기가 좀 다르다는 점을 인지하지 못했던 게 가장 큰 충격 요인이었다. 내가 쓰는 기술 스택에서는 웬만하면 글자 크기를 같게 해도 똑같이 구현됐기 때문에... 사실 아직도 뭐가 문제인지 잘 모르고 있다. 이 부분은 직접 구현하고 비교해보면서 좀 더 원인을 살펴봐야 할 것 같다. 그밖에도 열심히 찾아보고 조사했음에도 구현이 어려운 부분이 있었다는 점, 개발 난이도 조절에 실패했다는 점... 개발자 출신 디자이너라는 타이틀이 되게 자랑스러운 시절이 있었는데 이것도 쉬운 일이 아니라는 생각이 들었다.

개발자로서 프로젝트에 참여할 때는 주로 이건 구현이 안돼요, 못해요를 외치는 쪽이었다. 미용실에 사진 들고 가면 손님... 이건 고데기예요 하는 느낌? 물론 내가 미용사 쪽이었다. 이런 식으로 의견을 내면 디자이너 분들은 주로 이런 의견을 냈을 때 바로바로 잘 들어주시고 수용해주시는 쪽이었지만 내가 직접 디자인을 해보니까 생각보다 그런 말을 들었을 때 마음이 좀 아팠다. 이런 기분이셨겠구나 생각이 들어서 앞으로 조금 더 디자이너 분들의 의견도 많이 수용하고 노력해야겠다는 생각을 했다.

그래서 이런 경험들을 바탕으로 조금 더 성장하기 위해서 혼잡다 iOS로 합류하게 됐다. 사실 진짜 이렇게 될 줄 몰랐는데 ... 팀원들이 많이 붙잡아주셔서 좋은 기회를 얻을 수 있었던 것 같다. 아예 처음부터 프로젝트를 재시작하는거라 많이 떨리기도 한다. 디자인 추가될 부분도 있고 다른 프로젝트도 있어서 엄청 바빠질 것 같기도 하지만... 내가 디자인한 결과물을 직접 구현해본 게 처음은 아니더라도 런칭 목적으로 큰 프로젝트에서 해보는 건 또 처음이니까 많은 걸 배울 수 있으리라고 믿는다.

런칭 후에 또 회고록 들고 돌아올 수 있기를 기원하면서 ㅎㅎ 이만 마치겠다!