brunch

You can make anything
by writing

C.S.Lewis

by 김정재 Nov 23. 2020

무박 2일 단기간 해커톤,
SOPTKATHON 회고

Server개발자로 참여한 첫 해커톤

"기획자"를 목표로 일해온 지난 2년 동안, 

프로젝트에 참여할 때 내가 맡은 역할은 Product Manager(혹은 기획자)였다. 


그러다 얼마 전 SOPT에서 진행한 단기간 해커톤 SOPTKATHON에 참여했는데, 

현재 서버 파트로 활동 중에 있어 그동안 익숙해진 기획자가 아닌 서버 개발자로 프로젝트에 참여했다. 


총 15시간이라는 짧은 시간 동안 8명의 팀원들과 함께 진행한

단기간 해커톤 SOPTKATHON을 진행한 후기와 회고를 이 글에 담으려고 한다.


SOPKATHON 포스터





밈에 미친 당신을 위한 밈 추천 앱 서비스, 

밈친(MEMECHIN) 


이번 해커톤의 주제는 "중독" 이였다. 

과거 술이나 도박, 마약 등 부정적인 의미로 중독이라는 단어가 많이 사용되었지만, 

최근 일, 사랑, 코딩 등 긍정적인 단어들도 이 단어를 많이 사용되고 인식의 변화도 많이 되고 있다. 


이러한 중독이라는 문제를 "해결" 또는 "강화"될 수 있는 아이디어를 가지고 어플리케이션을 만드는 게 이번 해커톤의 과제였다. 


그래서 우리는 "중독"이라는 키워드로 아이디어를 내기 시작한다. 


포스트잇을 이용한 아이제이션


각자 중독이라는 것에 대해 가지고 있는 생각을 공유하고, 

이를 통해 어떤 서비스를 만들고 싶은지 각자 포스트잇에 적어 공유했다.

아이디어를 분산시키고 모으는 과정을 통해 4가지 정도의 아이디어로 추려졌는데


"일 중독을 도와주는 서비스", "중독을 벗어나는 서비스"등이 다양한 아이디어들 중

우리는 "밈(Meme) 중독자들을 위한 밈 저장소"를 만들기로 했다.


밈(Meme)이란 대개 모방의 형태로, 인터넷을 통해 사람에서 사람 사이에 전파되는 어떤 생각, 스타일, 행동 따위를 말한다. 우리가 일상에서 쓰는 "짤"들이 밈의 대표적인 예시이다. 


대표적인 퇴사 짤

우리가 흔히 사용하는 카카오톡에서 이런 짤들을 많이 사용하는데, 

이미지 혹은 gif하나로 내가 표현하고 싶은 감정을 쉽게 표현할 수 있고 텍스트보다 효과적으로 내 감정을 표현할 수 있다는 장점이 있어 많은 사람들이 밈을 사용하고 있다. 


여기서, 우리는 사용자들이 밈을 조금 더 쉽게 사용할 수 있도록 도와주는 서비스를 만들었다.

해쉬태그(hashtag)를 사용해 상황에 맞는 짤을 쉽게 찾을 수 있게 도와주며 인기 짤들을 모아 보여주는 기능을 가진 서비스이다. 


이렇게, 밈에 미친 당신을 위한 밈 추천 앱 서비스, 밈친(MEMECHIN) 서비스 기획을 끝나고 디자인, 개발을 시작한다. 





밈친(MEMECHIN) 

서비스를 디자인하다.




"핑크'를 메인 컬러로 사용한 밈친은

짧은 시간 동안 완성도 있는 디자인을 만들기 위해 노력했는데 하나씩 살펴보자.


홈 화면 (좌) / 밈을 선택했을 경우 보이는 화면 (우)


밈 서비스가 나온 이유가 "쉽게 짤을 찾는다"라는 목적성이 크기 때문에 

검색 기능을 최상단에 배치시켜 쉽게 사용자들이 검색 기능을 사용할 수 있도록 만들었다.


하단의 "오늘의 밈"은 우리 서비스가 추천하는 밈을 사용자들에게 노출시켜 특정 키워드를 검색하거나 찾는 것이 아닌, 좋은 밈들을 자연스럽게 얻을 수 있게 배너 형식을 사용해 디자인하였으며, 

하단에 상황별 / 키워드 별 밈을 좌우 스크롤을 통해 손쉽게 접근할 수 있는 UX를 만들어냈다. 


원하는 밈을 클릭하면 오른쪽 화면과 같이 좋아요 수 / 뷰 개수 / 다운로드 개수들을 배치하였고 하단에 선택한 밈과 관련된 추천 밈들을 나열시켜 사용자들이 관심 있는 밈들이 노출되도록 디자인을 완성했다.



온보딩 화면 (좌) / 검색 결과 화면 (우)


또한 온보딩 화면을 만들어 사용자들의 관심사에 맞는 테마를 선택해 추천을 받을 수 있게 설계했다. 

수많은 테마들 속 "나의 관심사"를 추천해줘 사용자의 관심사에 맞는 정보들을 많이 노출시켜 "그저 많은 짤들" 이 아닌, "나에게 유용한 짤들"이라는 경험을 제공했다.


특히, 아까 언급한 "쉽게 짤을 찾는다"의 목적에 맞게 홈 화면 최상단에 배치한 검색하고 이를 검색하면 위 그림에서 오른쪽에 위치한 검색 결과 화면이 나온다. 최대한 여러 이미지들이 구분되어 보기 편하게 디자인을 진행했다. 


이렇게 그려낸 디자인을 토대로 서비스를 구현하는 작업에 들어간다.



Node js를 사용한

서버(Server) 구축하기


사실 해커톤의 특성상 서비스를 완벽히 구현하기에는 시간과 인원이 제한적이다. 

그렇기에 밈 서비스의 기능인 추천, 검색 기능은 100% 구현하기 어렵다고 판단하여

추천은 내부 DB에 미리 데이터를 넣어나 이를 보내주는 형식으로, 

검색은 100% 일치하는 단어만 검색하는 기능으로 수정했다.


기능적으로 봤을 때, 복잡한 구조가 아닌 간단한 ERD구조를 가진 서비스이고 Post 기능도 없어

Get으로 코드를 간단히 구성할 수 있어 생각보다 빠르게 개발이 진행되었다. 


다만, 처음 하는 서버 개발이었기에 Git repo를 만들고 이를 다른 개발자와 merge 하는 과정에서 약간의 어려움은 겪었으나 생각보다 수월하게 개발을 할 수 있었다. 


memechin의 git repository


아쉽게도 서버 구현 후 클라이언트와 통신까지 이뤄지진 못했는데, 

Query params를 한글로 받아서 이러한 문제가 발생했지만, 솝커톤이 끝나기 직전 알아챈 문제라 수정을 하진 못했다.


어쨌든 이렇게 완성된 서버로 클라이언트와 통신을 붙여 서비스를 완성한다.








짧은 시간 동안,

많은 것들을 배운 해커톤



짧은 기간 동안(무박 2일) 진행한 해커톤은 이번이 두 번째였는데, 

항상 느끼는 거지만 많은 것을 배웠다는 생각이 많이 든다.


특히, 이번 프로젝트는 기획자가 아닌 서버로 참여한 첫 번째 프로젝트였는데, 

기획자로 참여했을 때 본 시각과는 많이 달랐다.


물론 다 같이 아이디어를 내고 발전시키는 과정이 솝커톤이지만

이외에 팀을 운영하고 관리하는 입장은 기획자가 가진 역할이기에 오히려 부담감 없이 해야 할 일만 하면 되는 작업이라 약간은 편하게 작업할 수 있었다.


팀원들의 이슈를 관리하고, 정답이 없는 의사결정들을 담당하는 기획자가 아닌, 

구현할 범위를 설정하고 이에 맞춰 코드를 작성하는 작업이기에 이러한 느낌을 많이 받았던 거 같다.



짧은 시간이었지만 좋은 사람들과 함께할 수 있던 점. 

처음으로 서버로써 진행한 프로젝트였던 점. 등

많은 것을 느끼고 경험할 수 있었다.



긴 글 읽어주셔서 감사합니다.












브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari