–

오늘 소개할 서비스 ‘Waveguide’는 플랫폼에 따라 제공되는 여러 서비스 내 눈에 띄는 UX/UI 사례를 정리해주는 곳입니다. 기본적으로 iOS, Android, 기타로 구분되어 있으며, 리스트 내 썸네일 하단 아이콘으로 구분할 수 있습니다. 하나의 서비스 전체에 대한 분석이 아닌, 특정 기능에 초점이 맞춰져 있어요. 카테고리를 통해 서비스 성격에 따라 사례 리스트를 확인할 수 있습니다.

확인하고 싶은 사례를 클릭하면 바로 상세화면으로 이동합니다. 저는 이케아 웹사이트의 페이지네이션에 대해 분석한 글을 먼저 살펴봤어요. 상세 화면에서 가장 먼저 확인할 수 있는 내용은 사례에 해당하는 ‘이미지’입니다.

이미지 아래로 어떤 기능인지(상황인지), 어떻게 작동하는지, 어떤 의미가 있는지 등 운영자가 작성한 상세 내용을 살펴볼 수 있습니다. 이케아 사례를 조금 더 살펴보자면, 이케아는 검색 결과를 모두 보여주지 않고 일부를 먼저 보여주는데요. 더보기 버튼을 통해 처음 본 수만큼 리스트를 추가로 불러올 수 있으며 전체 검색 결과 중 몇 개를 보고 있는지 사용자에게 안내해줍니다. 숫자뿐만 아니라 ‘바’를 함께 제공해 어느 정도 확인하고 있는 단계인지 함께 안내하고 있어요.

이처럼 우리가 서비스를 이용하며 한번쯤 자세히 들여다봐야 할 내용을 유사한 형식에 따라 정리해줍니다. 미처 확인하지 못하고 넘겼던 기능을 기획하고 디자인하는 관점에서 살펴볼 수 있다는 점이 가장 큰 장점입니다.

이어서 본 사례는 넷플릭스입니다. 넷플릭스에서 유용하게 사용하는 기는 중 하나는 오프라인에서 영상을 볼 수 있도록 ‘저장’하는 기능인데요. 오프라인에 저장된 영상을 하나 보고 나면 끝무렵, 본 영상을 삭제하고 다음 편을 볼 수 있는 버튼이 등장합니다. (오른쪽 아래 DELETE & PALY NEXT)

오프라인에 저장된 내용은 사용자 디바이스 저장 공간에 영향을 미치기에 재생 후 바로 삭제할 수 있는 기능을 제공하는 것인데요. 이는 보고 난 뒤 사용자가 직접 리스트 내 본 영상을 삭제하는 것보다 훨씬 자연스러운 맥락을 제공할 수 있습니다.

단순히 특정 상황에 맞는 UI를 모아두는 것이 아니라, 어떻게 작동하고 왜 의미가 있는지 함께 정리되어 있어 각자의 생각을 더해 살펴보는 즐거움이 있습니다. 이메일을 등록하면, 새로운 사례가 등록될 때 바로 확인할 수 있으니 이 방법을 활용하시는 것도 좋을 것 같네요! ‘Waveguide’는 이곳을 통해 더 자세히 살펴보실 수 있습니다. 제가 작성중인 ‘서비스 뜯어보기’도 함께 보시면 도움이 될거라 생각합니다.

–

함께 활용해보세요!

–

Post Views: 51

RELATED ARTICLESMORE FROM AUTHOR