Motiiv 서비스의 기획부터 브랜딩, UX/UI
동기영상 플랫폼 Motiiv의 기획부터 디자인의 과정들.
Motiiv 소개 화면작년에 진행했던 프로젝트 중 가장 기억에 남는 프로젝트가 무엇이냐고 물어본다면, 지금 소개하는 동기부여 영상 플랫폼 Motiiv라는 서비스이다. 위 프로젝트가 기억에 남은 이유는 브랜딩을 통한 UX/UI의 통일성의 중요성과 무엇보다 짧은 기간동안 어떤 조직보다 빠르고 민첩하게 서비스 출시까지 진행한 프로젝트이기 때문이다.
Motiiv 서비스의 기획부터 브랜딩 그리고 UX/UI를 통해 사용자에게 어떤 경험을 제공해 주는지 살펴보자.
우리가 동기부여 영상 플랫폼을
선택한 이유
현재 Youtube, Facebook 등 SNS을 통해 수많은 영상들이 나오고 있다.
그 영상들 중 동기 부여 관련 영상의 경우 상당한 구독자를 가진 채널들이 존재하며 많은 사람들이 이를 시청하고 있다. 대표적인 예시로 세바시(구독자 110만명), EO(34만명), 스노우볼(20만명)가 있다.
이러한 수많은 구독자를 보유한 채널들이 영상을 공유하는 곳은 Youtube, Facebook 등이다. 그러나 이러한 채널은 사용자들의 대부분이 예능 영상, 드라마 클립 영상 등 가벼운 영상들을 소비하기 위해 사용하는 채널이며 각기 다른 분류의 영상들이 섞여있다.
우리는 수 많은 영상들 속 나에게 자극을 주는 영상들을 따로 모아주는 서비스를 생각했고,
실제 가설을 실험해보기 위해 Grows-up이라는 "자기계발 유튜브 큐레이션 서비스" 구독 서비스를 MVP로 돌렸다.
Grows-up을 통한 MVP TEST
Motiiv 기획자가 실험한 Grows-up 사이트 소개 페이지Motiiv 기획자이자 코로나맵을 기획하고 개발한 이동훈씨가 해당 가설을 검증하기 위해 실험한 동기부여 영상 큐레이션 서비스 "그로스업"은 2일이라는 짧은 기간 만에 150명의 구독자를 모았다.
해당 서비스는 사용자들에게 다음의 가치를 제공했다.
1. 매주 2개의 엄선된 포스트 제공
2. 글이 아닌 영상을 통한 자기계발
3. 영상과 함께 제공되는 큐레이터 코멘트
그로스업은 동기부여의 목적에서 벗어나고 같은 동기부여 영상이어도 관심에 없는 영상들이 추천되는 기존 서비스와는 다르게, 기존 수많은 플랫폼에서 나오는 동기부여 영상들 중 가장 유의미한 영상들을 2개씩 엄선해 양질의 영상을 제공했다. 또한 단순한 영상 제공에 그치지 않고 엄선된 큐레이터가 작성한 코멘트를 제공하여 영상을 텍스트로 빠르게 소비하고 싶다는 사용자들의 니즈를 충족시켰다.
(그로스업 사이트 주소: https://www.growsup.site/)
MVP를 통한 빠른 실행과 검증을 바탕으로
Motiiv 서비스의 핵심 기능을 도출해냈다.
MVP를 통해 도출한
Motiiv의 핵심 기능
이러한 MVP 테스트를 바탕으로 Motiiv는
다음의 핵심 기능을 서비스에 녹여냈다.
1. 관심사/사용자맞춤 영상 큐레이션(Curation)
모티브는 상단의 배너와 top10 영상들을 배치시킴으로서
사용자들이 가장 많이 보는 영상들을 제공했다.
또한 하단의 영상들을 주제별 섹션을 나눠 제공하였는데,
최상단 영상의 경우 회원가입시 사용자가 선택한 직군을 기반으로 관련된 영상들을 추천해줬다.
직군 기반 영상 영역 바로 아래의 영상의 경우 사용자가 시청한 영상을 바탕으로 추천 알고리즘을 도입하여 영상을 추천하였는데, 영상 속 존재하는 태그를 기반으로 맞춤 큐레이션을 제공했다.
나머지 영역의 경우 Motiiv서비스에서 특정 주제와 관련된 영상들을 모아 유의미한 영상들을 제공했다.
2. 영상에 대한 정확한 태그 분류 및 자세한 설명 제공
영상에 대한 카테고리를 부여하여
수많은 영상들 속 사용자가 찾고자 하는 영상을 손쉽게 찾아 볼 수 있다.
해당 영상에 대한 긴 소개글이 아닌 짧고 명확한 텍스트로 영상을 소개하였으며
시청하고 있는 영상과 유사한 영상들을 우측 "추천 모티브"를 통해 제공했다.
3. 일할 수 있는 공간으로 바로 이동할 수 있는 My Workspace
Motiiv의 기획 의도인 "동기부여 영상을 보고 일을 시작하는" 컨셉을 살린 해당 기능은 모티브의 핵심 기능 중 하나이다. my motiiv탭에 들어가 나만의 워크스페이스를 추가하면, 플로팅 버튼(floating botton)을 통해 언제 어디서든 내가 일하는 공간으로 이동할 수 있다.
반응형부터 다크모드까지,
Motiiv의 UX/UI
1. 다양한 디바이스 환경을 고려한 반응형 디자인(Responsive)
Motiiv는 다양한 환경과 디바이스에서 사용하는 웹 어플리케이션의 특징에 맞춰 PC. Tablet. Mobile에 모두 최적화된 디자인을 완성했다.
2. 눈의 피로도를 줄이기 위한 다크모드 (Dark Mode)
눈의 피로도를 최소화 하기 위해 Motiiv는 모든 화면에 대한 다크 모드를 제공했다.
3. GUI Component
Motiiv의 GUI Component 구성Motiiv 서비스의
컨셉(Concept)
일을 시작하기 전, 동기부여 영상을 보고 이를 통해 자극받고자 하는 사람들을 위해 만든 서비스 Motiiv는
영상을 통해 동기를 부여하는 Motivation,
동기부여를 통해 일하는 공간으로 손 쉽게 넘어가는 Work Mode
의 가치를 제공하는 서비스이다.
영상을 통해 동기를 부여하는 Motivation이라는 핵심 가치를 브랜드에 녹여내기 위해
우리는 평소 전등을 켜기 위해 스위치를 On/Off하는 것 처럼
모티브라는 서비스를 통해 자극 받고 "Work Mode". 영상을 통해 일을 시작한다는 컨셉을 브랜드에 적용하여 "Toggle"버튼을 서비스 로고에 담아냈다.
On/Off 컨셉을 살린 Motiiv의 로고끝으로
Motiiv 디자인 팀은 약 3주라는 짧은 기간 동안 아주 빠르고 민첩하게 서비스가 주는 가치를 화면으로 녹여냈다. 짧은 기간임에도 매일 밤을 새며 진행한 프로젝트인 만큼 너무나도 만족스러운 결과물을 보여준 서비스이다. 단순히 UX/UI작업을 통해 디자인 작업을 하는 서비스가 아닌, 서비스의 브랜딩을 통해 다양한 Concept을 도출했으며 특히 On/Off라는 컨셉을 통해 모티브의 전체적인 디자인을 완성시켰다.
Covid-19로 인해 100%온라인으로 진행했지만 너무나도 멋진 디자인을 완성시킨 디자인 팀에게 존경을 표하며 빠르고 민첩하게 기획하고 운영을 진행한 기획 팀에게도 감사의 인사를 전합니다.
(개발 팀은 다음 포스팅에서 :) )
모티브 사이트 주소:
다음 포스팅에서는 100% 리모트로 진행한 우리가 어떤 문화를 만들었는지에 대한 포스팅을 진행할 예정입니다.
