구글 모바일 UX팀 리더가 본 UX 트렌드

목차

1. 첫인상이 중요하다.
2. 더 줄여라.
3. 속도는 좋은 디자인을 부각한다.
4. 사용자와 대화하자.
5. 데이터를 사용해서 디자인 정당화시키자.
6. 재발(Relapse)은 현실이다.
7. 새로운 기술을 낙관적으로 대하자.
8. 교차 기능 구매가 핵심이다.
9. 모바일 트렌드를 주시하자.

지난 2년 동안 150개가 넘는 웹 개발 팀과 같이 일하면서 배운 것이다.

난 2016년에 구글의 모바일 변화 팀(Mobile Transformation Team)에 합류했다. 우리 팀은 모두에게 더 나은 모바일 웹을 만들겠다는 간단하지만 야심 찬 목표가 있었다. 우린 중소기업이 더 나은 모바일 웹 경험을 할 수 있도록 돕는 것에 중점을 두었다. 더 구체적으로 말하자면, 우리는 웹 개발자 팀과 함께 일하면서 성능, 유용성, 접근성을 어떻게 더 잘 최적화할 수 있을지 권고하는 UX 컨설턴트였다.

우린 최종 사용자(end user)를 위해 일했다.

수백 개의 웹사이트를 보면서 모은 학습과 관찰, 함정은 다음과 같다.
 

1. 첫인상이 중요하다.

모바일 사용자들은 매우 목표 지향적이고 아주 성급하다. 사용자의 목표를 혼란스럽게 하지 말자. 홈페이지와 랜딩페이지를 심플하게 유지하자. 명료한 방식 / 시각적인 컴포넌트로 유저의 행동을 유도하고 가장 중요한 가치에 대해서 제일 상단에서 이야기하자. 사용자가 잠깐 동안 사이트에 머물러야 하는 이유와 방법을 알고 있어야 한다.  

2. 더 줄여라.
“더 줄여라”는건 끊임없이 강조했다. 더 적은 이미지, 양식 필드, 복잡한 탐색 패턴, 플러그 인, 서드파티 픽셀, 텍스트 덩어리들, 전체 화면 오버레이, 렌더링, 클릭.. 더 줄이면 사용자가 목표에서 이탈하는 것도 준다.

3. 속도는 좋은 디자인을 부각한다.
더 빠른 모바일 사이트가 사용자 참여를 향상하는 것은 놀랄 일이 아니다. 수많은 사례 연구, 사용성 테스트, 개인적 경험을 통해 스피드가 지표(전환율 등)를 가져온다는 것은 매우 명확하다. 사용자 경험을 정확하게 반영하는 세 가지 성능 지표는 FCP (First Contentful Paint), Speed Index 및 TTI (Time to Interactive)이다. 디자인을 멋지게 해 놓고 이미지를 2MB로 압축하는 걸 잊어서 사용자가 떠나게 된 것은 부끄럽게 생각해야 한다. 등대 역할을 하는 아래 툴을 사용해서 측정 항목을 모니터링 하자.

추천 벤치마크:

< 2s First Content Paint (FCP)

< 3 Speed Index (SI)

< 5 Time to Interactive (TTI)

4. 사용자와 대화하자.
누구나 아는 사실이지만, “사용자와 마지막으로 이야기한 게 언제인가?” 하고 물었을 때 멍한 시선을 말할 수 없이 많이 봤다. 모바일 UX리더로서 목표는 그저 추천해주는 것이 아니라, 사용자의 목소리를 듣고 대변하는 것이다. 사용자의 입장에서 가장 일반적인 작업을 끝내려고 시도하자 (완료할 때까지 얼마나 클릭하는지와 시간은 얼마나 걸리는지 추적해보기)

5. 데이터를 사용해서 디자인 정당화시키자.
“데이터 기반 디자인”은 새로운 게 아니다. 모바일 프로젝트 우선순위를 정한 후 모바일 KPI를 추적하는 건 중요하다. 판매점 (retailers)의 경우, 평균 주문 금액 (Average Order Value:AOR)과 결제 유입 경로가 시작되는 페이지의 이탈률을 모니터링한다. 고객 선도 기업의 경우 기본 Call-To-Action (웹사이트 내 목표를 달성하기 위해 고객에게 '행동'을 유도하는 버튼이나 배너)의 CTR(Click through rate)와 닫히는 비율(판매 성공 / 리드 수 *100) 에 초점을 맞춘다. 만약 여행 사이트를 운영한다면, 시즌이 돌아오는 것에 집중하고 (고객 유지) 채널별 트랙픽(예: 소셜 공유 증가 중) 에 중점을 줘야 한다. 이메일 뉴스레터 가입, 기사에 대한 의견, 사용자 리뷰, 비디오 뷰, 소셜 미디어에서 공유하는 것 같은 미세한 전환을 모니터링하는 것도 고려하라.

Pro tip : 동업자 중 한 명 (Damla Cakirca)이 당신의 사이트에서 사용자 참여를 모니터링하기 위해 만든 훌륭한 Datastudio 대시보드를 강력 추천한다.

6. 재발(Relapse)은 현실이다.
우리가 일했던 대부분의 회사에서 사이트 속도나 사용자 참여가 크게 향상되었다. 하지만 30~60일 만에  (그들의 속 마음을 보고 싶어 하지 않았을 때) 나쁜 버릇이 재발되는 것을 볼 수 있었다. 이 위험을 피하려면 performance budget(성과별 측정/예산)를 사용해라. 크롬 개발 도구를 사용해서 쓰지 않는 CSS와 JS코드를  Coverage tab에서 찾아보길 추천한다. 페이지를 로드하거나 실행하면, 사용된 코드와 로드된 양이 탭에 표시된다. 필요한 코드만 가져오면 페이지 크기를 줄일 수 있다. 기본적으로 모바일 사이트를 지속적으로 모니터링하고 검사하는 건 중요하다.

7. 새로운 기술을 낙관적으로 대하자.
만약 현대적인 모바일 경험을 변화시키고 싶다면 PWA를 구축해라. 유료 트래픽을 최적화하려면 AMP를 사용해서 최상위 랜딩 페이지 구축하는 것을 알아봐라. 만약 판매자라면, 필드 줄이기, 자동 입력 사용, 구글 페이 사용 처럼 결제를 빨리 하기 위한 방법을 모색해라. 성공의 열쇠는 사용자 경험을 향상하는데 중점을 두고 기술을 더하는 것이다. 사용자에게 가치를 부여하지 않으면 투자하지 마라.

8. 교차 기능 구매가 핵심이다.
모든 핵심 이해관계자들이 같은 이해를 하고 있는 것은 매우 당연하고 중요한 요소이다. 유저의 모바일 경험을 발전시키는 것은 팀 차원에서의 노력이 필요하다. 모든 팀은 모바일 경험 모니터링에 책임이 있다.  마케팅 팀은 서드파티 트레킹 픽셀 (3rd party tracking pixels)사용을 주시해야 한다. 엔지니어링 팀은 렌더링 경로 최적화에 집중해야 한다. (렌더 차단 제거하기) UX팀은 이미지 최적화와 사용성 Pain point(예: 자동 슬라이더 (automatic sliders)) 를 줄이는 것에 초점을 맞춰야 한다. 상호 수평, 기능적인 목표를 설정하고 모든 팀이 책임을 가지는 것이 중요하다.

9. 모바일 트렌드를 주시하자.
마지막으로는 2018년 동안 긍정적인 결과를 보여준 최고의 UX 트렌드에 대해 알아보자.

• 하단 드로어 네비게이션(navigation drawer) 도입

• (필요하다면) 푸쉬 알림 활성화

• ‘홈에 추가’ 스크린 버튼 추가 (app manifest)

• 웹 구성 요소에  Material Design 사용

• Advanced scroll triggered animations

• 뷰포트 하단에 고정 CTA (특히 제품 상세 페이지에서)

• 사용자가 게스트 계정으로도 구매 가능하게 하기

• AMP 우선

모든 UX 문제를 해결하는 마법의 총알은 없다는 걸 기억하자. 모바일 사이트를 개선시키는 것은 인내심과 분석, 여러 직군의 사람들의 노력이 필요한 일이다.