대부분의 웹사이트,앱에서 사용자가 기다려야 할 때는 애니메이션 로딩 아이콘을 보여주고 있다. 하지만 모든 기다림의 순간에 항상 로딩 표시를 해줄 필요는 없다. 때로는 로딩 아이콘을 아예 보여주지 않는 것이 더 나은 경우도 있다.
1. 베스트 해결 방법
최고의 방법은 당연히 기다림 자체를 없애는 것이다. 사용자가 기다리는 시간을 1초 미만정도로 짧게 만드는 것이다.
1초 미만일 때는 로딩 아이콘을 아예 보여주지 않는 것이 좋다. 이 경우, 로딩 아이콘을 보여주면 오히려 사용자가 '에고, 더 기다려야 하는구나..' 하는 생각을 하게 만들 수있기 때문이다.
로딩 시간을 1초 미만으로 만드는 것은 기술적 이슈이기 때문에 이 글에서는 건너뛰기로 하고, 이 글에서는 UX 디자이너 입장에서 생각해낼 수 있는 방법들 위주로 정리해보았다.
2. 차선의 해결방법들
2-1. 로딩 시간이 1~3초 정도 걸릴 경우
2-1-1. ▲ 로딩 표시 방법1 : 스피너.
2-1-2. ▲ 로딩 표시 방법2 : 스켈리톤 로딩 (skeleton loading). 이 방법은 기다림을 좀 더 '덜' 지루하게 만드는 심리적 효과가 있다고 한다.
2-2. 로딩 시간이 3초 이상 걸릴 경우
2-2-1. ▲ 로딩 표시 방법1 : 프로그레 바 또는 좀 더 시선을 끄는 애니메이션. (사용자가 기다리면서 느낄 지루함을 조금이라도 달래기 위해)
2-2-2. ▲ 로딩 표시 방법2 : 스켈리톤 로딩
3. 문제
그럼 페이지 로드 타임은 어떻게 측정할 수 있을까? 다행히 그런 서비스를 제공해주는 웹사이트가 많이 있다. 여기 소개하는 웹사이트들은 그것들 중 한 사례일 뿐이다. 구글링 해보면 이것저것 많이 나온다.
▼ Web 페이지 로드 타임 확인해볼 수 있는 사이트
▼ 모바일 App 페이지 로드 타임 확인해볼 수 있는 사이트
https://logrocket.com/pricing/
로드 타임 예측 어려울 때
로드 타임을 어느정도 측정해볼 수 있으면 다행이다. 그런데 남은 대기시간 예측 불가한 경우도 꽤 많다. 대략 얼마가 걸리는지를 알아야 어떤 로딩 UI를 쓸지, 남은 시간을 보여줄 때 %를 사용할지 시간을 사용할지를 정할 수 있는데 남은 대기시간을 예상조차 할 수 없으면 어떤 방법을 사용해야 할지 정하기 어렵다. 이 부분은 추후 아이디에이션이 필요하다.
남은 시간에 대한 표시방법은? % VS. 시간으로 표시해줄 것인가?
남은 대기시간을 표시해줄 때 3초 미만에면 %로 표시 (e.g. 90% 완료), 3초 이상이면 시간으로 표시해주는 것이 좋다고 하는 내용을 어디에선가 읽은 적이 있다. (e.g. 예상 남은 시간 1초) 그런데 그 연구 결과가 어떤 사람들을 대상으로 / 몇명에게 / 어떤 task에서 한 실험인지는 모르겠다. 이 기준은 케바케일 것 같다.