이런 동아리, 처음이야! (2)
사이드 프로젝트 일기
들어가기 전에
1편에선 기획과 1차 디자인 및 개발, 그리고 이를 바탕으로 한 User Test에 관한 글을 썼어요. 이번에는 이어서 UT때 받았던 피드백을 기반으로 수정했던 사항들과 찍어낸 페이지 디자인과 기능들, 그리고 누추하지만 대충 했던 브랜딩을 간략하게 이야기해보려고 합니다. 그러면 본론으로 바로 들어갈게요.
1. 피드백
우리 팀은 최소 기능과 최소 디자인을 우선 구현한 사이트를 통해 UT를 하면 더 효과적일 거라 판단했어요. 그렇기 때문에 디테일한 디자인 요소, 그리고 큰 단위의 기능은 구현에서 배제한 뒤 개발 일정을 우선 설정했죠. UT 하는 당일, 세션이 열리는 직전까지 구현을 위해 노력해준 우리 프론트엔드/백엔드 팀원들에게 너무 고마웠어요.
결국 우리 팀은 디자인 툴을 활용한 프로토타이핑이 아니라, 사이트를 통해 UT를 진행할 수 있었답니다. 다만, 인터랙션을 비롯한 기능들이 완전히 구현되지 않았기 때문에 UT 전 사용자들에게 간략한 페이지와 기능을 설명하고 진행했어요.
피드백 자료구글 폼으로 받았던 피드백들의 내용을 추려 기획적인 원초적 질문들, 개발 구현 상에서 당장 반영할 수 있는 내용들, 그리고 브랜딩을 위한 기초 설문 조사의 결과를 정리해보자면 위의 사진과 같았어요.
우리가 알고 싶었던 인사이트를 대변해주는 답변들이 생각보다 많았고 이를 이후 일정에 반영하는 것에 집중할 수 있었어요. UT는 동아리에서 간단하게 하든, 회사에서 각 잡고(?) 하든 언제나 힘든 방법이지만, 얻는 결과물은 항상 도움이 많이 되었습니다.
2. 서비스
구글 폼으로 받았던 피드백들의 내용을 추려 기획적인 원초적 질문들, 개발 구현 상에서 당장 반영할 수 있는 내용들, 그리고 브랜딩을 위한 기초 설문 조사의 결과를 정리해보자면 위의 사진과 같았어요.
저희들이 서비스를 통해 기대하는 부분은 한국식 번역체가 아닌, 자연스러운 영문 교정이 필요한 유저들의 니즈를 만족시켜주는 것이었어요. 해외 서비스를 이용하면서 문의 사항이 생겼지만 한글이 지원이 안 되는 상황이나, Resume/CV/논문 작성 등의 상황에서 자연스럽고 매끄러운 영어를 사용하고 싶은 상황 등에서 말이죠.
다만 기존 서비스들이 잘되어있기 때문에 이들과의 차별점을 가지고 가야 했는데 우리는 실시간 피드백과 결과물에 대한 이유를 물어볼 수 있는 기능을 꼽았어요.
서비스의 기본 Flow는 유저가 원본 텍스트를 작성하면 이를 에디터가 교정하고 유저는 교정된 텍스트를 받는다는 간단한 Flow입니다. 다만 여기서의 핵심 기능은 유저의 데이터 관리와 실시간 채팅을 중점적으로 개발하고 기획했습니다.
3. 디자인
서비스의 기본 Flow는 유저가 원본 텍스트를 작성하면 이를 에디터가 교정하고 유저는 교정된 텍스트를 받는다는 간단한 Flow입니다. 다만 여기서의 핵심 기능은 유저의 데이터 관리와 실시간 채팅을 중점적으로 개발하고 기획했습니다.
홈 화면에서는 서비스를 한눈에 알아볼 수 있도록 영상과 큰 텍스트를 배치했습니다. 이후 스크롤을 통해 컨텐츠를 확인할 수 있는 페이지 형태로 구성했어요. 또한 번역가는 영어, 요청자는 다국어를 사용한다고 가정했기에 사이트의 디폴트 언어 값은 영어로 지정했습니다.
1) Editor View Page
에디터 페이지에서는 원본 글을 읽고 이를 수정하고 업로드하면 실시간 채팅방이 열리면서 요청자와 작업자가 소통을 할 수 있게 디자인하였습니다. 또한 수정본에 대한 시각 효과를 주기 위하여 Primary 컬러를 활용했으며 CTA 버튼은 크고 계층 구조에서 1순위에 배치하기 위해 신경 썼어요.
2) Client View Page
클라이언트 페이지에서는 소통을 할 수 있다는 것을 알려주는 채팅, 컨텐츠를 입력할 수 있는 Input Area와 수정본을 받고 확정할 수 있는 페이지로 구성했어요.
3) Another View Page
그 이외에 저희는 웹 기반 서비스이기 때문에 모바일로 들어온 케이스, 에러 페이지, 회원가입과 로그인 등의 페이지는 받아와야 하는 정보를 최소한으로 하여 가입에 대한 허들을 낮추고, 쉽에 사용할 수 있도록 구성하였습니다.
4. 브랜딩
브랜딩이 많이 부족했기 때문에 대부분은 생략하고, 제가 브랜드를 잡는 과정에서 풀어내는 과정들을 간략하게 알려드리려고 해요. 우리 팀의 서비스 이름은 프루퍼입니다. 한글로 적으면 게임 캐릭터 이름 같지만, 영어로 적으면 "Proofor"이죠.
Proofor은 Proof reading와 ~for을 합친 말입니다. 교정이란 뜻을 가진 Proof reading와 ~를 위한이란 뜻을 가진 for, 그리고 사람 접미사 or을 합친 단어예요. 그러니까 Proofor이라는 뜻은 교정을 해주는 사람, 그리고 누군가를 위해 교정을 해주는 사람이라고 해석할 수 있죠.
저는 교정자와 요청자 둘을 연결하고자 하는 서비스라서 함축적인 의미를 조금 넣어보고자 했어요. Proofor은 그렇게 탄생하게 된 이름이에요.
브랜드 컨셉은 위 사진들로 유추할 수 있으면 좋겠지만, 아쉽게도 그렇지 않을 수 있으니 설명을 해야 할 것 같아요. 저희는 번역과 교정이라는 것이 "아날로그" 시대에 "종이"를 활용해서 행해졌다고 생각했어요. 하지만 요즘 "디지털" 시대에는 "키보드"로 번역을 하고 있죠.
저는 이러한 교차를 녹여서 표현해보고 싶었어요. 그렇게 종이와 키보드의 연결점을 찾아보다가 원고지가 떠올랐고, 원고지의 형태가 현재 키보드와 유사하게 어울린다고 생각이 들었죠. 그렇게 두 개의 형태를 연결해보니 격자 형태가 나오더라고요.
그래서 격자 형태를 포인트로 잡고 교정부호를 컨셉 그래픽으로 표현했고, 이들을 활용해서 스티커, 띠배너, 포스터 등을 디자인했습니다.
5. 마무리
짧으면 짧고, 길면 긴 프로젝트가 끝이 났어요. 기획부터 UX/UI 디자인, 그리고 브랜딩까지 꽤 빡빡한 일정이었지만 팀 간 업무를 잘 분배했고, 열정이 넘치는 팀원들을 만나서 아주 재미있고 알차게 프로젝트를 진행할 수 있었어요.
올해 말이나 내년 초에 다시 동아리가 오픈이 되는데 그때 다시 한번 도전해서 멋진 사람들과 교류도 하고, 소통도 하고, 다시 멋진 작업을 해보고 싶네요.
부족한 글 읽어주셔서 감사합니다. 다음에 또 다른 글로 돌아올게요! :)
