무한스크롤 vs 페이지네이션, 언제 써야 할까

출처: indiehackers

대량의 콘텐츠를 이용자에게 보여줄 수 있는 가장 흔한 방법에는 무한스크롤과 페이지네이션이 있습니다. 오늘은 각 UX 기법의 장단점을 살펴보고 어떤 상황에 어떤 기법을 사용해야 하는지에 대해서 알아보려고 합니다. 

무한스크롤(Infinite Scroll)

무한스크롤이란, 스크롤이 페이지의 끝에 도달했을 때 자동으로 다음 데이터를 요청하여 받아오는 UX를 말합니다.  별도의 페이지 이동 없이 데이터를 계속해서 불러오기 때문에 직관적이고 편리하죠. 유튜브, 페이스북, 인스타그램 등 많은 서비스들이 모바일과 웹에서 콘텐츠를 제시하는 방식이기도 합니다. 이용자는 하나의 페이지에서 끊임 없이 콘텐츠를 탐색하는 경험을 하게 됩니다.

장점

모바일에서도 빠르고 쉽고 직관적이다

하나의 페이지 안에서 계속해서 새로운 콘텐츠를 탐색할 수 있다

단점

콘텐츠의 시작과 끝 지점, 전체 볼륨을 알 수 없기 때문에 이용자는 압도되는 느낌을 받는다

이용자가 페이지를 이동하면 다시 스크롤의 특정 지점으로 돌아가기가 어렵다

콘텐츠의 종류에 따라서 로딩할 때 시간이 많이 소요된다

무한스크롤은 시각 자료 중심의 콘텐츠를 대량으로 탐색한 후에 목적에 맞는 콘텐츠를 선별할 때 유용합니다. 이용자들은 가볍게 스크롤을 내리는 행동을 반복하면서 새로운 시각 자료들을 끊임 없이 탐색할 수 있습니다. 실제로 핀터레스트, 인스타그램, 유튜브 등의 시각 자료 중심의 서비스에서 이용자가 많은 시간을 보내게 하는 목적으로 사용되고 있습니다.

페이지네이션 (Pagination)

페이지네이션이란, 특정 기준으로 정렬된 콘텐츠를 여러 페이지로 나누어서 페이지별로 제공하는 UX를 말합니다. 전체 콘텐츠가 적절한 분량으로 나누어 제시되기 때문에 이용자는 콘텐츠의 전체 볼륨을 파악하면서 체계적으로 정보를 처리할 수 있습니다. 구글, 아마존, 네이버 등에서 검색 결과를 보여줄 때 자주 볼 수 있는 방식입니다. 이용자는 자신의 목적에 따라 체계적으로 콘텐츠를 탐색하는 경험을 하게 됩니다.

장점

단순히 콘텐츠를 훑어보는 것이 아니라 목적에 맞게 정렬된 상태로 접근할 수 있다

콘텐츠의 전체 볼륨을 파악한 상태로 통제감을 느끼며 탐색할 수 있다

콘텐츠는 특정 규칙에 의해 정렬되기 때문에 콘텐츠의 정확한 위치를 파악할 수 있다

페이지마다 적절한 콘텐츠의 양을 제공할 경우 빠른 로딩 속도를 제공할 수 있다

단점

이용자가 직접 페이지를 이동해야 하기 때문에 불편할 수 있다

모바일 환경에서 페이지 이동 버튼을 누르는 것이 불편할 수 있다

페이지네이션은 이용자가 처음부터 목적을 가지고 콘텐츠를 탐색할 때 유용합니다. 이용자들은 특정 기준(최신순, 적합한순 등)에 따라서 콘텐츠를 정렬할 수 있고, 언제든지 원하는 위치로 돌아갈 수 있기 때문에 특정 콘텐츠를 다시 찾도록 하기 위해서 적합한 UX 방식입니다. 모바일 환경에서 페이지네이션을 기획할 때는 각 페이지마다 적절한 콘텐츠의 양은 얼마만큼인지, 이용자에게 보여줄 페이지의 숫자는 어느정도로 할 것인지, 페이지 이동 방식(버튼, 스와프 등) 등을 추가적으로 고려해야 하지만 목적 중심의 탐색을 할 때에 반드시 필요한 방식입니다.