brunch

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 이준원 Nov 17. 2016

앱이 빠르다고 느끼게 하는 법 (feat. fb)

내용은 UX 관련한 얘기인데요. iOS 개발시 유용할것 같아 공유 드립니다.

얼마전 아는 디자이너 분과 함께 로딩 표시에 대한 소소한 의견을 나누어 본적이 있습니다.

앱을 구현하다보면, 컨텐츠 로딩시 다양한 형태로 로딩 애니메이션 표시하여 사용자에게 인지 시켜주곤 합니다.

사람들은 이 로딩 애니메이션을 보고 “아 로딩중이구나” 라는 것을 인지 하게됩니다.

그런데 문제는 여기서 부터 입니다. 로딩이 길어진다고 생각이 들면 사용자의 불만이 생깁니다.

2006년, 마리사메이어(현 야후 사장)가 구글에 있을당시 아래와 같은 얘기를 했습니다.

“구글 검색 페이지에서 0.5 초의 지연이 트래픽을 20%까지 떨어트린다”

로딩이 빨리 되도록 엔지니어링 해야하는것은 당연합니다.

하지만, 항상 네트웍 상황은 우리의 마음처럼 원할하지 않을때가 있습니다.

이럴때 사용자들은 느림을 느끼고 앱을 떠나게 됩니다.

따라서, 실제로 빠르게 로딩 되는것 못지 않게 사용자들이 빠르다고 느끼게 인지 시켜주는것 또한 중요한 역할을 하고 있습니다.

실제로 기다림을 주는것이 사용자에게 얼마나 나쁜지에 대한 NYT 아티클도 있습니다.

페이스북 디자인원칙 중 하나가 Fast 입니다.

이를 위해 페이스북은 다양한 A/B 테스트를 통해 사용성을 개선을 합니다.

실험들을 통해 개선한 한가지가 Dummy Placeholder 사용입니다. Dummy placeholder 사용은 다음과 같은 이점을 준다고 합니다.

로딩 인디케이터 사용보다 boune rate을 감소 시킴 (* bounce rate: 사용자가 그냥 해당 페이지를 나가 버리수)

사용자가 인지적으로 덜 기다리는 느낌을 줌

또 한가지 실험이, 로딩스피너 사용시, 커스텀 스피너(좌) vs. 시스템 스피너(우)를 사용할때 사용자들의 반응을 보는 것이 였습니다.

결론부터 말씀드리면, 시스템 스피너(우)를 사용할 때 사용자들이 앱 탓 보단 시스템 탓을 많이 한다고 합니다.

로딩 인디케이터 보다 플레이스홀더 이미지를 쓰자!

로딩 인디케이터를 써야한다면 시스템것을 이용하자

추가말씀: 페이스북의 실험들을 보면, 사람의 인지라는 부분이 추상적일수 있으나, 어떻게든 계측해내도록 설계를 하면 그것을 가지고 엔지니어링 할수 있는 것으로 보입니다. :)

참고)

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari