MARKETING

[타니/마케팅] 공지 사항 UX 개선하다가 팀 노션을 만들었다는데요?

햄부기딱스 2024. 6. 29. 01:22

노션 잘 모르는데,, 공지사항 UX 개선 프로젝트가 팀 노션 프로젝트로 확장되어 울며겨자먹기로 팀 페이지까지 만들어버린 마케팅팀의 우당탕탕 일기 𝓛𝓮𝓽'𝓼 𝓰𝓸


수정 전 트리브 노션

제가 들어오기 전부터 있었던 노션으로 아마 서비스 오픈 시 만들고 이후 업데이트마다 수정이 있었던것으로 압니다.

저도 트리브에 들어오기 전에 이 노션을 보고 트리브 쩐다.. 나도 들어가고 싶다..라고 생각한적 있을 정도로 정말 잘 만들었습니다.

☞트리브 수정 전 노션 구경가기☜

 

해당 노션의 목적은 보시는 것처럼 프로덕트에 집중이 되어 있어 프로덕트의 기능 소개가 위주입니다.

이 노션에서도 지금 저희의 공지사항의 전신과 같은 형태의 "새로워진 트리브, 알아보기"라는 탭인 있긴 하나, 해당 업데이트에서 새로 추가된 기능을 보여주는 페이지로 자잘한 오류 수정 및 가벼운 내용의 공지사항을 담기엔 좀 헤비한 콘텐츠였습니다.

 

또한 앱내 공지사항은 별도의 editor가 없고 이미지를 삽입할 수 없어서 업데이트 내용을 텍스트로 빽빽하게 들어갔어야 한다는 단점이 있었습니다.

 

 당시의 문제점

1. 별도의 editor가 없어 소녀들의 감성적인 영혼을 표출할 수 없다는 점
2. 앱이다보니까 이미지가 들어가서 요모조모 소개하면 좋은데 온리 텍스트로만 소통할 수 있다는 점

 

그래서 노션의 편리한 퍼블리싱과 에디터를 이용해서 쉽게 이 두 문제점을 해결하면서 우리도 나름 사이드프로젝트인데 우리를 소개하는 페이지가 하나 있으면 좋을 것 같다는 욕망 한스푼 얹어 기존에 프로덕트에 초점 맞췄던 노션을 확장하여 팀 노션으로 수정하게 되었습니다.

 

팀 노션 수정 과정

다양한 스타트업 레퍼런스를 참고한 결과 팀 노션의 주된 내용은 해당 팀이 어떤 프로덕트를 만들고, 그 프로덕트는 왜 만드는지를 보여주기 위해 미션, 비전, 컬처를 작성한다는 것을 확인하였습니다. 이런 영단어들 너무 있어보이잖아요? 그래서 저희도 Mission, Vision, Culture를 작성해봤는데 팀 자체적으로 정해진 사항 없이 적다보니 모호한 말들만 늘어놓고 있다는 생각에 좀 더 쉽고 직관적으로 보여주되 재미있게 보여주자!라는 쪽으로 수정 방향을 정하게 되었습니다. 

 

당시에 아마 chat GPT가 있었으면 좀 나았을수도 있지도 모르지만 AI도움 없이 사람 셋이서 쓰려니까 너무 어려웠습니다.😫

 

수정 전략


수정 후 트리브 노션

♨팀트리브 노션 구경하기☎

해당 기획안을 기반으로 저희가 직접 제작한 저희의 노션을 공개합니다! 각 파트에 대해서 어떤 부분을 중점적으로 수정했는지에 대해서 하나씩 소개해보도록 하겠습니다.

 

배너

1. 동물 캐릭터를 활용하지 않음

저희는 동물로 성향검사를 해서 항상 동물 캐릭터를 썼었는데, 캐릭터 원작자분이 팀을 나가셔서 새로운 캐릭터 양산이 불가능했습니다.. 또한 앱 자체는 깔끔한 이미지를 추구하는쪽으로 리브랜딩을 했는데 동물 이미지는 너무 귀여워서 앱 이미지랑 충돌한다는 의견도 있어서 자연스럽게 동물 이미지를 뺐습니다.

 

2. 백그라운드

노션의 배너가 창 크기에 따라 확대되는 형태로 창크기에 따라 동물 캐릭터와 배경에 변화가 생겼습니다. 이에 어떤 창 크기에 상관없이 똑같은 무드를 전달할 수 있도록 동물 캐릭터를 제거하고 그라데이션이 아닌 솔리드한 백그라운드를 활용하였습니다.

 

3. 로고 크기

마지막으로 창을 크게 확대 해도 로고가 너무 크지 않도록 로고의 크기를 조절하였습니다.

 

슬로건과 키비주얼

1. 슬로건 수정

앞서 말한 것처럼 새로운 브랜딩을 진행하면서 나온 새로운 슬로건이 나와서 교체하였습니다. 맞춰가는 것과 마음이 통하는 것이 비슷한 것 같으면서도 투닥되면서 맞춰가는 느낌이 아니라 트리브를 통해 여행을 계획하고 출발하면 이미 마음이 맞춰진 상태에서 여행을 할 수 있다는 것을 강조하고자 해당 슬로건을 수정하였습니다.

 

2. 목표

프로덕트 노션과 달리 가장 상단 부분은 우리 팀이 결성된 목표를 통해 팀에 초점을 맞췄습니다. 목표의 경우는 Mission에 적었던 부분을 쉽고 직관적으로 표현하려고 하였고, 당시 앱내에서 3D 아이콘을 많이 사용했어서 당시 상황에 맞춰 이미지를 제작하였습니다.

 

트리브의 미션

 

친구와의 여행에서 공감했을 내용에 대해서 적고, 밑에는 저희 기능을 연결하여 해당 문제점을 어떻게 해결하고 있는지를 보여주었습니다.왜 트리브라는 프로덕트를 만들었는지, 우리는 어떤 문제를 해결해나가고 있는지를 직관적으로 보여주고 있다고 생각합니다.

 

아카이빙

 

많은 팀 노션을 찾아봤을 때 좌측과 같은 팀의 성과를 아카이빙하는 부분이 있었고, 이부분은 꼭 호록하고 싶어 저희 나름의 성과를 찾아봤습니다. 상업적인 서비스가 아니다보니 투자액, 누적 가입자 이런 계산적인 부분보다는 저희 앱에서 보여줄 수 있는 특장점을 살려 아카이빙을 해보았습니다. 국내 여행만 다루고 있었는데도 이렇게 많은 기록을 가질 수 있어서 정말 행복했습니다!

 

팀 트리브 소개

 

드디어 팀 소개 부분이네요!! 팀 소개 부분의 경우는 우리의 귀여움을 표현하기 위해 캐릭터를 사용했습니다. 저희 막내가 그때 20살이었을 때였거든요.. 그래서 귀엽게 표현해보았습니다. 또한 하단에는 저희가 Vision에 썼던 부분을 모두에게 공감이 갈 수 있도록 풀어서 작성하였습니다.

저희 팀의 독특하고 쌍큼한 문화도 소개하고 싶어서 TEAM&CULTURE 페이지도 작성하였으니 궁금하시면 들어가서 구경해보세요!

 

그래서 공지사항은 어떻게 수정했냐면요

노션을 공지사항으로 활용한 이유

당시 저희팀 상황을 말씀드리자면 웹 개발자가 없었어서 어떻게 하면 공지사항에서 웹을 활용하되 가성비 있게 개발할 수 있을까가 저희의 고민이었습니다. 그래서 개별적인 리소스 투입 없이 빠르고, 간편하게 공지사항을 개편하기 위해 노션을 활용하였습니다.

노션의 웹뷰 활용

기존의 텍스트만 입력됐던 저희 자체의 editor와 달리 이모티콘, 정렬 기능, 이미지 등 다양한 기능을 제공하는 노션의 editor덕에 좀 더 풍부한 공지사항을 전달할 수 있었습니다.

 

그렇다보니 기존에 업데이트를 줄글로만 소개했던것과 달리 (마케팅팀이 약간 번거로워졌지만) 이미지도 만들 수 있고 강조도 할 수 있어서 공지사항을 꾸미는 재미도 있었습니다. 

 

 


나가며..

기존의 문제 해결은 공지사항의 UX 개선이었는데, 하다보니 팀 노션을 개편하는 프로젝트로 커져서 팀 노션을 모두 수정하였습니다. 그만큼 어떻게 내용을 채울지, 레이아웃을 어떻게 가져갈지 정말 고민을 많이 했었는데요..

자유도가 높은 만큼 창작의 고통이..

그래도 해당 프로젝트를 통해 서비스 개선도 하면서, 팀 페이지도 만드는 두마리 토끼를 다 잡는 프로젝트를 진행할 수 있었습니다. 덕분에 2배 성장하기도 했구요 당시 저는 노션을 잘 활용하지 못하는 사람이었는데, 이 경험을 통해서 노션을 정말 잘 다루게 되었고, 어떻게 팀페이지를 만들어야하는지도 알게 됐기 때문입니다. 그 덕분에 다른 팀에서도 노션으로 팀 페이지를 만들었고, 노션을 다룰 일이 있을 땐 항상 제가 도맡아서 하곤 합니다.

님아 그런 말 없는데요 ㅋ

 

노션의 웹뷰를 활용하는 공지사항 개선과, 팀 페이지를 노션으로 만드는 법에 대해서 간단히 소개를 해드렸습니다.

이글을 보시고, 이런 천방지축 팀원을 관리했던 PM의 존재에 대해서 궁금하실 것 같다는 생각이 들어 저희 팀의 PM이었던 유 언니가 작성한 글을 추천하고 싶습니다. 이 천방지축이들을 관리하기 위해 어떤 툴을 어떻게 활용했는지에 대한 PM 언니의 고민을 확인하실 수 있습니다. 

[유] -슬랙으로 사이드 프로젝트 관리하기 - 공지, 이슈 트래킹 스크럼 출석 관리까지 한 번에

 

 

저는 트리브에서 마케팅 팀에서 최장 시간을 보낸 유일한 인물로 어떻게 트리브 마케팅이 변화했는지를 담은 글로 다시 찾아오겠습니다. 감사합니다.