기자이너, 서비스 방향과 사용자 경험 맞물리기
디자이너 도전기 ② sqoop 웹 서비스 디자인
지난 몇 달간 스스로를 '기획하는 디자이너'라고 불렀다. 글 제목의 '기자이너' 또한 오타가 아니다. 단순히 직전 기수에서의 '기획자'라는 타이틀을 잃고 싶지 않았던 것만은 아니고, 기획 경험에서 얻게 된 시각, 사고방식을 디자인 과정과 작업에 녹여내고 싶었달까. '기자이너'라는 명칭은 그러한 나의 결심과 포부를 담은 것이었다.
감사하게도 이번 프로젝트에서는 기획자의 포괄적인 시각과 디자이너로서의 세부적인 관점 모두 경험할 수 있었다. SOPT 앱잼(AppJam)의 질문을 통해 돌아보는 대학생 경험 정리 가이드 – sqoop 팀에 디자이너로 합류하면서였다.
지난 STORM 팀에서 첫 아이디에이션에서부터 팀빌딩 전후까지 기획을 도맡았던 것과는 다르게, 이번에는 초기 기획안이 이미 설정되어 있는 팀에 디자이너로 합류하게 되었다. 이때 내가 할 수 있는 일은 이미 정해져 있는 것들에 계속해서 물음표를 던지는 일이라고 생각했다. 서비스의 가치와 지향점, 혹은 각각의 디자인 요소를 다룰 때 당장 눈에 보여지는 것들도 중요하지만, 우선 스스로 '왜'를 꾸준히 물었다. 자칭 '기자이너'로서 놓치고 싶지 않았던 것 역시 바로 '근거 있는 디자인'이었다.
1. 서비스 방향과 'Why'
팀에 막 합류했을 당시에는 서비스의 배경이 되는 문제의식, 서비스의 기능 등 핵심적인 골격만 세워져 있었고, 명확한 정체성은 아직 수립되어 있지 않은 상황이었다. PM 혜원이가 열심히 준비한 서비스 소개글을 읽어보았을 때, 가장 먼저 서비스의 방향성과 이를 잘 드러낼 수 있는 서비스명을 고민해봐야겠다는 생각이 들었다.
팀빌딩 직후, 서비스 소개글을 재차 정독하며 개인적으로 고민이 되는 부분들을 정리한 노트sqoop의 초기의 서비스명은 '포포리(popoli)'였다. '커리어 활동 정리'와 '포트폴리오 내용 구성'이라는 기능에 초점을 맞춘 직관적인 서비스명이었으나, 그만큼 기능 외의 의미는 담고 있지 않은 이름이기도 했다.
그렇다면 서비스명 이전에 먼저 이루어져야 하는 것은 '커리어 활동 정리'와 '포트폴리오 구성'이라는 핵심 기능 중 무엇이 더 중요한지, 우선순위는 무엇인지, 또 방점을 어디에 찍어야 하는지 등 정의를 내리는 일이었다. PM 혼자 준비하던 팀에 기획자와 디자이너가 들어오게 되면서 위와 관련해 팀원들이 함께 고민하는 회의를 몇 차례 가졌고, 활동 내용을 포트폴리오로 정리해주기보다 사용자가 직접 활동을 정리할 수 있게끔 질문을 제시하는 것이 더 중요한 가치이자 기능이라고 확정 짓게 되었다. 다시 말해, 서비스의 핵심적인 역할로 '커리어 활동 정리'에 더 중점을 맞추기로 하였다.
scoop, dig 등의 단어로 도출한 서비스명 아이디어들 중 일부이를 바탕으로 서비스가 사용자에게 어떤 역할을 해줄지, 어떤 경험을 제공해줄지를 고려해 새 서비스명을 정하게 되었다. 서비스의 타겟인 '발등에 불 떨어진 취준생', '질문을 통한', '차곡차곡 쌓아 올린다', '가이드/코치' 등의 키워드로 시작해 다양한 아이디어를 제시하며 이를 점차 확장시켰고, 마지막에는 '질문'(기능)을 통해 '사용자의 경험을 깊이 퍼올려주어'(역할) '기억을 떠올리게 해 준다'(USP)는 의미를 담아 'scoop', 'dig' 등의 단어로 추리게 되었다. 이후 '숟가락', '뜨다/파내다' 등의 의미를 가진 단어인 'scoop'에서 'c'를 '질문(question)'과 '돌아본다'는 의미로서의 '거울' 형태이자 'p'를 뒤집은 형태의 'q'로 대체해 'sqoop'이라는 서비스명으로 최종 확정 짓게 되었다.
서비스명을 확정 짓는 과정에서 흥미로웠던 점은 처음 제시한 '쌓아 올린다'는 키워드에서 정반대의 의미인 '깊게 파낸다'는 키워드로 방향이 구체화되었다는 것이다. 기존의 '활동 정리'라는 기능만을 고려했을 때에는 위를 향하는 '쌓아 올린다'는 의미가 적절하겠지만, '질문을 통한다'는 점이나 '사용자의 경험에 깊이 관여한다'는 점 등 '활동 정리'의 의미를 구체화시키고 나니 사용자의 내면, 즉 아래/안쪽을 향한다는 의미의 '깊이 파낸다'가 더 적합하다고 판단되었다. 서비스명을 바꾸기 전에 서비스의 가치와 방향성을 먼저 점검하고 팀원들과 함께 깊이 고민해본 덕에 더욱 깊은 의미의 서비스명을 도출해낼 수 있었다.
새 서비스명이 정해지자마자 sqoop의 로고 및 브랜딩 작업에 돌입하였다. 작업 내내 스스로 상기시켜야 했던 것이 있었는데, 바로 sqoop 서비스는 사용자에게 방대한 액션, 즉 많은 양의 writing을 요구한다는 것이었다. 활동과 관련된 질문을 열 개씩이나 제시하고, 각 질문마다 사용자는 깊이 고민하고 정성스레 답변을 작성해야 한다. 자기만족적 성격의 다른 기록 서비스들과 달리, sqoop은 '취업'이라는 무겁고 명확한 사용 목적이 존재한다. 이러한 서비스의 성격과 일후에 작업하게 될 화면 UI 구성을 고려해 서비스의 브랜딩을 진행해야만 했다.
기존 'scoop'이라는 단어가 제공하는 '아이스크림 스쿱' 이미지에 동의해, 로고는 sqoop의 'q'와 'p'를 활용해 아이스크림을 퍼올린 스쿱 형태로 제작하였다. 아이스크림 스쿱이나 서비스 sqoop 둘 다 '깊이 떠올린다'는 의미로 같은 선상에 있기 때문이다. 또 'q'와 'p'의 의미를 강조하기 위해 첫 글자인 's'도 대문자가 아닌 소문자로 설정하였다.
색상 선정에는 조금 신중하도록 하였다. 우선 '아이스크림'하면 일반적으로 파스텔 톤이 연상된다는 점을 우려해 이는 최대한 기피하고자 했다. 오히려 역으로 sqoop이 흐릿한 기억을 끄집어내 준다는 의미를 담아 비비드한 파란 톤으로 key color를 선정했고, 자칫 이러한 컬러가 너무 무거운 이미지만 주진 않을까 하는 우려에 point color로 형광 연두색을 사용하기로 했다. 또 위에서 언급했듯 사용자에게 많은 양의 작성을 요구한다는 점을 염두해둬야 했는데, 시각적인 피로도를 줄이기 위해 너무 많은 색 사용은 피하기로 하였고, key color 한 가지 색상만을 주로 사용해 (one-point color) 전체적으로 심플한 컨셉을 가져가기로 하였다.
sqoop의 Brand Identity사실 이러한 디자인은 나의 개인적인 디자인 성향과는 많이 다르다. 큼직하고 눈에 확확 꽂히는 스타일을 선호하는 나로서 간결하고 심플한 디자인 작업을 하며 심리적인 갈등을 겪을 수밖에 없었다. 이에 다른 디자이너 친구들과 의견을 맞추며, 또 스스로 작업물을 여럿 만들어보며 '나'를 위한 디자인이 아닌 '서비스'의 정체성을 담아내고자 했다.
2. 사용자 경험과 'Why'
sqoop 서비스의 핵심 가치(core value)는 easy, motivative, detail이다. 본격적으로 화면 뷰를 구성하면서는 이 세 가지 핵심 가치를 염두에 두었다.
서비스 소개글 중 일부먼저, 'easy'는 sqoop의 쉽고 편리한 기록과 사용성을 드러낸다. 실제로 sqoop은 S.T.A.R.(Situation-Task-Action-Result) 기법을 기반으로 한 열 가지 질문을 핵심 기능으로 제공해 사용자가 편리하게 자신의 이전 활동 내용을 돌아볼 수 있게 한다. 이렇듯 sqoop 서비스의 기능 자체가 편리성을 내포하고 있어, 디자인적으로는 '기록'이라는 핵심 기능 외의 부가적인 기능들의 편리성을 위주로 고민하였다.
이러한 디자인적 고민은 홈과 모아보기 뷰에서 드러난다. sqoop에서는 그동안 기록한 활동들을 한눈에 모아볼 수 있는 기능 또한 중요한데, 이에 따라 로그인 직후에 진입되는 홈 화면에서는 모든 활동들을 시작 및 진행 날짜를 기준으로 모아 볼 수 있게 하였다. 홈에서 활동이 분류되는 기준은 학기나 분기가 아닌 '년/월'인데, 이는 짧은 기간 동안 이루어진 활동을 더 세부적으로 분류하기 위함이다. sqoop이 동아리나 인턴십 등의 활동뿐만 아니라 학교 팀 프로젝트 등 취업 경험에 도움이 되는 활동이라면 종류나 기간에 상관없이 기록하기를 장려한다는 점을 반영한다.
홈에서 '활동 기간'을 기준으로 활동들을 분류했다면, 모아보기 탭에서는 '전체/즐겨찾기/작성 중인 활동' 세 가지 방식으로 활동 리스트를 확인할 수 있다. 우측 상단의 필터링 버튼을 클릭하면 '활동 기간'과 자신이 사용한 '직무 태그' 및 '역량 태그'를 세부적으로 지정해 원하는 활동만 모아볼 수 있다. 새 활동을 추가할 때 사용자는 직접 직무와 역량 태그를 입력해 추가할 수 있는데, '취업'이라는 사용 목표가 뚜렷한 서비스인 만큼 태그 추가와 그에 따른 분류만은 사용자에게 높은 자유도를 허락하고 싶었다.
타겟을 구체화한 페르소나와 팀원들과 의견 교류한 내용 중 일부 - 이를 통해 '분류'의 기능을 추가하게 되었다.활동 분류의 필요성은 타겟 페르소나를 통해 파악할 수 있었다. 기획자 친구들이 '발등에 불 떨어진 취준생'이라는 타겟을 가시화해 서너 개의 페르소나로 정리해주었고, 각각의 페르소나에서 유독 눈에 띄는 특징들을 바탕으로 팀원들과 자유롭게 의견을 나누며 '태그 필터링', '활동 즐겨찾기' 등의 기능으로 구체화할 수 있었다.
sqoop의 두 번째 핵심 가치인 'motivative'는 동기부여와 재미를 의미한다. 많은 생각과 글쓰기를 요하는 서비스인 만큼, 어떻게 하면 사용자가 흥미를 잃지 않고 기록할 수 있을지에 대한 고민을 주로 했다.
바로 위에서 언급했듯, sqoop은 정식적인 대외활동뿐만 아니라 사용자의 취업 목표와 상통되는 활동이라면 사소하더라도 기록하기를 장려한다. 이에 홈 화면에 잊고 있던 기억을 끄집어내 생각을 솎아주는 질문(triggering question)이 랜덤으로 띄워지도록 설계하였다. "2019년 여름 방학에는 무슨 활동을 했나요?", "수상하지 못한 공모전도 의미 있는 소재가 될 수 있어요!" 등의 시기별/활동별 질문들을 홈 화면에서 보여주며 사용자들의 생각을 끊임없이 자극한다.
활동을 기록하는 뷰에서는 좌우로 넘기며 각각의 질문을 확인할 수 있는 카드 뷰 형태를 채택했다. 일반적인 상하 스크롤의 줄글 형태로 10개의 질문을 한 페이지에 모두 보여준다면 사용자가 쉽게 부담을 느끼거나 흥미를 잃을 수 있기 때문이다.
또한 많은 양의 writing을 요구하는 서비스인 만큼 사용자가 기록하던 중에 이탈을 막는 것 역시 중요한 사안이었다. 이를 위해 상단 헤더에는 최소한의 탭만 남겨두고 하단 푸터는 아예 제거하였다. 또, 기록 중에 다른 버튼을 클릭하거나 기록한 카드를 저장하지 않은 채로 이동하는 행동을 방지하기 위해 "스쿱을 저장한 후, 이동해주세요!"라는 팝업 안내 창을 띄워 화면 이탈을 재차 확인해 막고자 하였다.
각각의 청크(S., T., A., R.)에 해당하는 질문들에 답변을 마치면, 화면 우측 하단에 로고를 활용한 애니메이션과 함께 응원의 메세지가 보여지도록 구성했다. 스쿱 형태의 로고에 아이스크림 청크가 하나씩 얹어지는 가벼운 애니메이션으로, 사용이 다소 지루하고 딱딱하게 느껴질 수 있는 서비스에 '글쓰기'라는 사용성을 방해하지 않는 선에서 귀여운 요소를 추가한 것이다. 중간중간 "경험을 한 스쿱씩 꺼내보자!", "이번 스쿱은 무슨 맛일까?" 등의 문구를 보여주며 사용자가 기분 좋게 작성을 마무리할 수 있도록 화면을 설계했다.
초기 버전의 서비스인 만큼 동기부여를 위한 부수적인 기능은 우선 이 정도만 추가하였다. 추후 사용자 피드백과 유저 테스트(UT) 등을 거쳐 중간 이탈을 극소화시킬 수 있는 다른 방안이나 임시 저장된 글을 마무리 지을 수 있도록 사용자를 유도하는 등의 더 나은 UX 장치를 고민할 예정이다.
마지막 핵심 가치는 'detail', 즉 자세하고 상세한 기록이다. 이미 sqoop이 열 가지 질문으로 활동에 대한 구체적인 회고를 유도한다면, 디자인적으로는 기록 단계에서의 UX를 깊이 고민해야 했다.
위에서 기록 단계를 카드 뷰 형태로 구성한 것과 관련해 짧게 소개했었는데, 여기에 'detail'이라는 가치 역시 녹아있다. sqoop이 제시하는 열 개의 질문들은 각각 분리되어 있기보다, 직전 질문에 꼬리를 물고 이어지는 등 서로 유기적으로 이어져있다. 기록의 부담을 줄이기 위해 한 개의 카드 당 질문 하나씩만을 배치했지만, 이전 카드를 넘겨보며 답변 내용을 다시 확인하고 필요시 바로 수정할 수 있도록 구성했다. 반면, 아직 답변하지 않은 질문 카드는 미리 볼 수 없게끔 잠가두었는데, 이는 이전 카드 답변들을 바탕으로 현재 작성 중인 질문 카드에 집중할 수 있게 하기 위함이다.
모든 카드에 답변을 마치면, 지금까지 작성한 내용들을 최종적으로 검토할 수 있는 뷰가 보여진다. 그동안은 카드를 넘나들며 답변 내용을 바로바로 수정할 수 있었다면, 검토하기 뷰에서는 활동의 기본 정보와 답변 내용이 한 페이지에 정리되어 전체 답변 내용을 한눈에 확인할 수 있다. 최종 검토 뷰에서 저장 버튼을 누르고 나서야 기록을 마칠 수 있다.
서비스와 사용자가 맞물리는 영역. 그 영역을 만들어내 극대화하는 일.
서비스 초창기 단계에 있는 sqoop의 디자이너로서 서비스의 방향을 정립해가는 기획의 과정과 사용자 경험을 창조해가는 디자인의 과정 모두 참여할 수 있었다. 우리 서비스가 사용자들에게 어떠한 가치와 기능을 제공할 수 있을지, 반대로 사용자들은 우리 서비스를 이용함으로써 어떠한 경험을 할 수 있을지 여러 방면으로 그려보며 서비스를 디자인했다. 그런 의미로 sqoop의 디자이너로서 서로 다른 방향의 가치가 맞물리는 영역을 고민했다고 하고 싶다.
그리고 그 과정에는 항상 'Why'가 존재했다. 서비스의 정체성을 드러내는 로고와 그래픽 컨셉은 물론, 화면 내 UI/UX 구성까지, 각각의 요소마다 그에 뒤따르는 근거인 '서비스 방향'과 '사용자 경험'이 명확하게 녹아날 수 있도록 많은 고민과 회의를 거쳤다.
앱잼 데모데이가 끝나고부터 어느덧 꽤 긴 시간이 흘렀고, 바로 며칠 전에는 배포를 위한 디자인 마지막 작업까지 마쳤다. 막바지 개발 작업만 남은 상황에서 여운이 많이 남는다. 실컷 스스로를 '기자이너'라고 불러놓고선, 이제 와서 부끄럽기도 하다. 아직도 기획적으로나 디자인적으로나 여러모로 부족하기 때문이다.
많은 것들을 배우고 경험할 수 있어 굉장히 귀중한 시간이었다. 이런 생각과 동시에 내가 익혀야 할 다음 스텝과 관련해 머리가 복잡하다. 서비스와 사용자가 맞물리는 영역이 있다면, 맞물리지 않는 영역들도 있을 것이다. 그 영역은 무엇이고 어떻게 익혀나가야 할지 아직 명확하게 그려지지는 않지만, 조만간 이런 부분들도 다루어보고 싶다.
지난 두 달간 고생했다, 기자이너 현지야!
스스로를 '기자이너'라 부르며 우쭐거릴 때마다 함께 웃어준 기획자 & 디자이너 친구들에게 고마운 마음이 크다. 그리고 그런 나의 디자인을 멋지게 구현시켜주고 있는 개발자 친구들에게도! 부족한 나에게 많은 기회와 경험을 허락해주고, 또 열린 마음으로 나를 수용해준 팀과 팀원들에게 정말 고맙다. WAO AT YE~
