프로덕트 매니지먼트

[코드스테이츠 PMB 9기] 타투쉐어 UX/UI 개선

콰르릉쾅쾅 2021. 12. 15. 12:03

타투쉐어의 UX/UI 개선


이번에는 타투쉐어를 분석하며 아쉬웠던 UX 부분을 서비스 이용자 관점에서 정의하고 분석하여 개선해 보도록 하겠다.

 

타투쉐어 UX가 개선해야 되는 이유는 무엇인가?


타투는 이제 더는 특정 계층의 전유물이 아니다. 전 세계에서 타투가 불법인 국가는 대한민국밖에 없다.

타투는 사회에서 예술로서 받아들여지고 있는 단계이다.

2018년도 문신염료 제조사 '더 스탠더드'가 발표현 자료에 따르면 우리나라 국민 중 눈썹 문신 등 반영구 화장은 1천만 명, 타투는 300만 명이 실술 받은 경험이 있는 것으로 추정된다.

반영구 화장과 타투를 합치면 국민 4명 중 1명은 타투를 받은 경험이 있다.

시장 규모도 거대하다 한국타투협회에 따르면 2019년 국내 타투 시장규모는 약 1조 2천억 원에 달한다.

대한문신사중앙회에 따르면 타투뿐 아니라 반영구 화장 업계에도 2만 명 이상이 전업자 종사하고 있다. 피부관리실, 미용실 등에서 행해지는 시술까지 반영하면 최대 20만여 명이 반영구화장 업계에 종사한다는 추정도 있다.

타투에 대한 사회적 인식이 긍정적으로 바뀌고 있는 요즈음 타투쉐어는 타투에 대해 트렌드를 반영하지 못하고 있는 것으로 보인다.

그래서 이러한 타투쉐어의 문제점들을 정의하고 개선해 보는 시간을 가져보도록 하겠다.

 

타투쉐어의 UX 개선점 정의


타투쉐어는 명실상부 대한민국 최대 타투 커뮤니티이다

타투쉐어는 "어떤 타투를, 어떤 아티스트에게 받아야 하지?"라는 타투 피플들의 페인 포인트를 해결해준다.

그러나 타투쉐어를 사용할 때면 여러 가지 문제점들을 느낄 수 있다.

첫 번째 문제는 타투쉐어 앱 실행 속도가 느리다는 것이다. 두 번째는 타투 사진을 둘러볼 때 가격하고 사진이 잘리는 문제가 있다. 여기서 의문이 드는 점은 타투는 한번 새기면 지울 수 없다 그래서 중요하다 근데 가격 할인 요소가 꼭 UI에 들어가야 했을까? 타투 가격 할인 요소가 들어가 있는 것도 개선 사항 중 하나일 것이라 생각한다.

그리고 마지막으로 한 페이지 안에 너무 많은 옵션이 들어가 있어 보기 좋지 않다. 아마도 그것 때문에 속도가 느린 걸 수도 있겠다는 생각이 든다.

아래의 왼쪽 사진 정보구조(IA)를 보면 한 화면 안에 얼마나 많은 정보들이 들어가는지 볼 수 있다. 게다가 중복되는 정보들도 있다. 

마지막으로 뒤로 가기 스와이프 제스처를 사용할 수 없었다

타투쉐어는 분명 국내 최대 커뮤니티 사이트는 맞다 그러나 그 명성에 비해 타투쉐어 앱은 소비자가 사용하기에 불편한 부분이 존재한다.

너무 많은 타투 옵션

 

 

타투쉐어 페이퍼 프로토타입 제작


앞서 정의한 개선점을 구현하기 위해 프로토타입을 제작하도록 하겠다.

프로토타입을 정의하는 이유는 단순히 대화로만 의사를 전달하는 것은 한계 가다 프로토타입을 만듬으로 개발 전 리소스를 최소화할 수 있기 때문이다.

페어퍼 프로토타입은 최소한의 리소스로 개선하고자 하는 내용을 빠르게 제작하고 팀과 소통하고자 하는 목적이 있다. 그렇기에 Lo-Fi Prototype로 제작하고 타투쉐어의 UI를 개선해 보도록 하자

 

Lo-Fi Prototype는 핸드 스케치와 같이, 실제 출시될 서비스와 거리가 먼 초기 단계의 프로토타입이다. 이 방법은 시간 및 리소스가 절약되고, 복잡한 수정 절차가 없기 때문에 새로운 의견을 바로 적용하는 것이 가능하다. 따라서, 아이디어 회의와 같은 기획 단계에서 자주 작성한다. 그러나 팀 간 소통을 위한 정식 업무 산출물은 아니고, 유용한 임시방편 정도로 생각해주시면 좋다.

 

 

타투쉐어는 타투피플들이 서로의 타투사진을 공유하는 타투이스트 정보를 나누는 커뮤니티이다.

기존의 타투 셰어는 정보를 나누는 커뮤니티 보다는 광고를 통해 돈을 벌 목적으로 타투쉐어를 운영하는 느낌이 들었다

기존의 타투쉐어는 타투 정보를 제공할 때 타투 사진과 타투 도안 제목 가격 할인율과 할인율이 적용된 가격을 보여주었다.

한번 받으면 지워지지도 않는 타투인데 굳이 가격 할인율이 중요할까?라는 생각이 들었다. 그리고 할인율이 들어간 것이

일반 타투 커뮤니티보다는 상업적 목적을 달성하기 위한 타투 커뮤니티로 보였다 나는 사진과 타투 리스트 프로필 사진 도안 제목 타투 리스트 정보 만을 넣어서 기존의 정보가 많아 타투 사진과 글이 잘리는 문제를 개선했다. 

 

타투 커뮤니티는 사람들이 타투 사진을 올리며 사람들과 대화를 주고 받는등 활발해야한다. 그러기 위해서 타투리스트만 타투사진을 올리는것이 아닌 일반사람들도 타투사진을 올릴수 있어야 한다고 생각한다. 그래서 뉴스피드라는 기능을 만들어서 다양한 사람들이 타투사진을 올리고 토론할 수 있게 개선하였다.

 

기존의 탭 바에서는 너무 많은 메뉴들이 존재하였다. 정말 중요한 3개의 메뉴(관심, 뉴스피드, 필터)만을 남기고 나머지는 오른쪽 상단의 설정 메뉴에 들어가게끔 개선했다.

 

기존에 있던 검색창은 불필요했다 왜냐하면 같은 내비게이션 바 에 있는 장르 주제 부위 지역에 있는 탭들이 검색창 역할을 대체할 수 있기 때문이다 그래서 필요 없는 검색창을 없애 깔끔하게 UI를 개선하였다.

 

마지막으로 화면들을 스와이프 제스처가 연결이 가능하도록 개선하였다.

 

 

정보구조(IA)를 작성하여 개선점을 나타내 보자


타투쉐어 UX/UI 개선안

정보구조도는 서비스가 어떻게 구성되는지, 어떤 기능이 어떤 화면으로 보이는지를 나타내는 도구이다

기존하고 타투쉐어 UI와 달라진 점은 

내비게이션 바에 필터와 검색창이 사라졌다

그리고 탭 바의 리뷰, 맞춤 견적, 더보기 기능이 사라지고 뉴스피드 기능을 추가했다.

타투쉐어는 커뮤니티를 추구한다 그러나 기존의 타투쉐어 앱은 할인율 요소가 들어가는 등 상업적인 요소가 강하였다.

뉴스피드 기능과 타투 가격, 타투가격 할인율을 없애므로 타투 커뮤니티 기능 그 자체에 충실하게 개선하였다.